import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:gap/gap.dart';
import 'package:wyatt_ui_components/wyatt_wyatt_ui_components.dart';
import 'package:wyatt_ui_kit/wyatt_ui_kit.dart';

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

  @override
  Widget build(BuildContext context) => Column(
        children: [
          Text(
            'Portfolio Cards',
            style: Theme.of(context)
                .textTheme
                .titleMedium!
                .copyWith(color: Colors.white),
          ),
          const Gap(20),
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              PortfolioCard(
                logo: const FlutterLogo(
                  size: 50,
                ),
                projectName: const TextWrapper('Flutter Project.'),
                subtitle: const TextWrapper('Mobile / Web / Macos.'),
                description: const TextWrapper('Developpement de 8 mois.'),
                ctas: [
                  CupertinoButton(
                    color: Colors.grey.withOpacity(0.3),
                    padding: EdgeInsets.zero,
                    onPressed: () {},
                    child: const Icon(
                      Icons.settings,
                      color: Colors.grey,
                    ),
                  ),
                ],
                assets: [
                  Image.asset(
                    'assets/mockup_1.png',
                    alignment: Alignment.topCenter,
                    fit: BoxFit.cover,
                  )
                ],
                keyword: const [
                  TextWrapper('UI Design'),
                  TextWrapper('Developpement'),
                  TextWrapper('Deploiement')
                ],
              ),
              const Gap(20),
              PortfolioCard(
                showImagesOnTop: true,
                logo: const FlutterLogo(
                  size: 50,
                ),
                projectName: const TextWrapper('Flutter Project.'),
                subtitle: const TextWrapper('Mobile / Web / Macos.'),
                description: const TextWrapper('Developpement de 8 mois.'),
                ctas: [
                  CupertinoButton(
                    color: Colors.grey.withOpacity(0.3),
                    padding: EdgeInsets.zero,
                    onPressed: () {},
                    child: const Icon(
                      Icons.settings,
                      color: Colors.grey,
                    ),
                  ),
                ],
                assets: [
                  Image.asset(
                    'assets/mockup_1.png',
                    alignment: Alignment.topCenter,
                    fit: BoxFit.cover,
                  )
                ],
              )
            ],
          ),
          const Gap(20),
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              PortfolioCard(
                logo: const FlutterLogo(
                  size: 50,
                ),
                projectName: const TextWrapper('Flutter Project.'),
                subtitle: const TextWrapper('Mobile / Web / Macos.'),
                description: const TextWrapper('Developpement de 8 mois.'),
                ctas: [
                  CupertinoButton(
                    color: Colors.grey.withOpacity(0.3),
                    padding: EdgeInsets.zero,
                    onPressed: () {},
                    child: const Icon(
                      Icons.settings,
                      color: Colors.grey,
                    ),
                  ),
                ],
                assets: [
                  Image.asset(
                    'assets/mockup_1.png',
                    alignment: Alignment.topCenter,
                    fit: BoxFit.cover,
                  ),
                  Image.asset(
                    'assets/mockup_1.png',
                    alignment: Alignment.topCenter,
                    fit: BoxFit.cover,
                  )
                ],
                keyword: const [
                  TextWrapper('UI Design'),
                  TextWrapper('Developpement'),
                  TextWrapper('Deploiement')
                ],
              ),
              const Gap(20),
              PortfolioCard(
                logo: const FlutterLogo(
                  size: 50,
                ),
                projectName: const TextWrapper(
                  'Flutter Project.',
                  gradient: [
                    Colors.blue,
                    Colors.green,
                  ],
                ),
                subtitle: const TextWrapper('Mobile / Web / Macos.'),
                description: const TextWrapper('Developpement de 8 mois.'),
                ctas: [
                  CupertinoButton(
                    color: Colors.grey.withOpacity(0.3),
                    padding: EdgeInsets.zero,
                    onPressed: () {},
                    child: const Icon(
                      Icons.settings,
                      color: Colors.grey,
                    ),
                  ),
                ],
                assets: [
                  Image.asset(
                    'assets/mockup_1.png',
                    alignment: Alignment.topCenter,
                    fit: BoxFit.cover,
                  ),
                  Image.asset(
                    'assets/mockup_2.png',
                    alignment: Alignment.topCenter,
                    fit: BoxFit.cover,
                  ),
                  Image.asset(
                    'assets/mockup_1.png',
                    alignment: Alignment.topCenter,
                    fit: BoxFit.cover,
                  )
                ],
                keyword: const [
                  TextWrapper('UI Design'),
                  TextWrapper('Developpement'),
                  TextWrapper('Deploiement')
                ],
              ),
            ],
          ),
        ],
      );
}
