mate_fluency 1.0.2

MateFluency — The EcoWestern Naturalism design system for Flutter. Organic surfaces, soft textures, and weighted motion.

example/main.dart

import 'package:flutter/material.dart';
import 'package:mate_fluency/mate_fluency.dart';

void main() {
  runApp(const MateFluencyExample());
}

class MateFluencyExample extends StatelessWidget {
  const MateFluencyExample({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'MateFluency Example',
      theme: MateFluencyTheme.light(),
      debugShowCheckedModeBanner: false,
      home: const ExamplePage(),
    );
  }
}

class ExamplePage extends StatelessWidget {
  const ExamplePage({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: [
          // Navbar
          MateNavbar(
            brandName: 'EcoWestern',
            items: const [
              MateNavItem(label: 'About', route: '/about'),
              MateNavItem(label: 'Press', route: '/press', active: true),
            ],
          ),

          Expanded(
            child: SingleChildScrollView(
              padding: const EdgeInsets.all(24),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  // Hero section
                  MateAnimateIn(
                    child: Biodegradable(
                      padding: const EdgeInsets.all(64),
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Text('EcoWestern', style: MateTypography.eyebrow),
                          const SizedBox(height: 16),
                          Text(
                            'Everyday technology\nthat feels calm.',
                            style: MateTypography.h1,
                          ),
                          const SizedBox(height: 24),
                          Text(
                            'Built on naturalism. Designed for the modern era.',
                            style: MateTypography.bodyLarge,
                          ),
                          const SizedBox(height: 40),
                          Row(
                            children: [
                              MateButton(
                                label: 'Get Started',
                                variant: MateButtonVariant.primary,
                                onPressed: () {},
                              ),
                              const SizedBox(width: 12),
                              MateButton(
                                label: 'Learn More',
                                variant: MateButtonVariant.secondary,
                                onPressed: () {},
                              ),
                            ],
                          ),
                        ],
                      ),
                    ),
                  ),

                  const SizedBox(height: 24),

                  // Card grid
                  Row(
                    children: [
                      Expanded(
                        child: MateCard(
                          eyebrow: 'Platform',
                          title: 'MatePC',
                          body: 'A desktop OS built for the EcoWestern ecosystem.',
                          footer: Row(
                            mainAxisAlignment: MainAxisAlignment.spaceBetween,
                            children: [
                              Text('matepc.ecowestern.net', style: MateTypography.meta),
                              const Text('→'),
                            ],
                          ),
                        ),
                      ),
                      const SizedBox(width: 16),
                      Expanded(
                        child: MateCard(
                          eyebrow: 'Mobile',
                          title: 'MateOS',
                          body: 'The mobile companion to MatePC.',
                          level: NaturalismLevel.deep,
                          footer: Row(
                            mainAxisAlignment: MainAxisAlignment.spaceBetween,
                            children: [
                              Text('mateos.ecowestern.net', style: MateTypography.meta),
                              const Text('→'),
                            ],
                          ),
                        ),
                      ),
                    ],
                  ),

                  const SizedBox(height: 24),

                  // Dark surface example
                  Biodegradable(
                    dark: true,
                    padding: const EdgeInsets.all(40),
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        Text(
                          'Economic ID',
                          style: MateTypography.h3.copyWith(color: Colors.white),
                        ),
                        MateButton(
                          label: 'Sign In',
                          variant: MateButtonVariant.primary,
                          onPressed: () {},
                        ),
                      ],
                    ),
                  ),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }
}