feat(ui_kit): add quote / skill / portfolio cards (#126)
continuous-integration/drone/push Build is failing

This commit was merged in pull request #133.
This commit is contained in:
2023-02-10 16:01:07 +01:00
parent a563bd1fe3
commit 55822ad870
18 changed files with 1282 additions and 6 deletions
@@ -1,6 +1,9 @@
import 'package:flutter/material.dart';
import 'package:gap/gap.dart';
import 'package:wyatt_ui_kit_example/cards/information_card/information_cards.dart';
import 'package:wyatt_ui_kit_example/cards/portfolio_card/portfolio_cards.dart';
import 'package:wyatt_ui_kit_example/cards/quote_card/quote_cards.dart';
import 'package:wyatt_ui_kit_example/cards/skill_card/skill_cards.dart';
class Cards extends StatelessWidget {
const Cards({super.key});
@@ -17,6 +20,13 @@ class Cards extends StatelessWidget {
),
const Gap(20),
const InformationCards(),
const Gap(20),
const PortfolioCards(),
const Gap(20),
const QuoteCards(),
const Gap(20),
const SkillCards(),
const Gap(20),
],
);
}
@@ -0,0 +1,177 @@
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')
],
),
],
),
],
);
}
@@ -0,0 +1,66 @@
// Copyright (C) 2023 WYATT GROUP
// Please see the AUTHORS file for details.
//
// This program is free software: you can redistribute it and/or modify
// it under the terms of the GNU General Public License as published by
// the Free Software Foundation, either version 3 of the License, or
// any later version.
//
// This program is distributed in the hope that it will be useful,
// but WITHOUT ANY WARRANTY; without even the implied warranty of
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
// GNU General Public License for more details.
//
// You should have received a copy of the GNU General Public License
// along with this program. If not, see <https://www.gnu.org/licenses/>.
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 QuoteCards extends StatelessWidget {
const QuoteCards({super.key});
@override
Widget build(BuildContext context) => Column(
children: [
Text(
'Quote Cards',
style: Theme.of(context)
.textTheme
.titleMedium!
.copyWith(color: Colors.white),
),
const Gap(20),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
QuoteCard(
quote: 'Cupidatat reprehenderit aliqua eiusmod Lorem. '
'Qui ipsum id ea ea nulla labore aute ullamco aute '
'quis elit ut amet velit. Incididunt fugiat proident '
'proident deserunt tempor Lorem cillum qui do '
'ullamco Lorem magna ipsum. Ullamco cupidatat velit '
.wrap(),
),
const Gap(20),
QuoteCard(
quote: 'Cupidatat reprehenderit aliqua eiusmod Lorem. '
'Qui ipsum id ea ea nulla labore aute ullamco aute '
'quis elit ut amet velit. Incididunt fugiat proident '
'proident deserunt tempor Lorem cillum qui do '
'ullamco Lorem magna ipsum. Ullamco cupidatat velit '
.wrap(gradient: [Colors.red, Colors.orange]),
avatar: const FlutterLogo(
size: 40,
),
name: 'John Doe'.wrap(),
subtitle: 'Agence anonyme'.wrap(),
),
],
),
const Gap(20),
],
);
}
@@ -0,0 +1,85 @@
// Copyright (C) 2023 WYATT GROUP
// Please see the AUTHORS file for details.
//
// This program is free software: you can redistribute it and/or modify
// it under the terms of the GNU General Public License as published by
// the Free Software Foundation, either version 3 of the License, or
// any later version.
//
// This program is distributed in the hope that it will be useful,
// but WITHOUT ANY WARRANTY; without even the implied warranty of
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
// GNU General Public License for more details.
//
// You should have received a copy of the GNU General Public License
// along with this program. If not, see <https://www.gnu.org/licenses/>.
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 SkillCards extends StatelessWidget {
const SkillCards({super.key});
@override
Widget build(BuildContext context) => Column(
children: [
Text(
'Skill Cards',
style: Theme.of(context)
.textTheme
.titleMedium!
.copyWith(color: Colors.white),
),
const Gap(20),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
SkillCard(
gradient: const [Colors.red, Colors.orange],
icon: Icons.ac_unit_sharp,
title: 'Lorem Ipsum'.wrap(),
description: 'Cupidatat reprehenderit aliqua eiusmod Lorem. '
'Qui ipsum id ea ea nulla labore aute ullamco aute '
'quis elit ut amet velit. Incididunt fugiat proident '
'proident deserunt tempor Lorem cillum qui do '
'ullamco Lorem magna ipsum. Ullamco cupidatat velit '
.wrap(),
skills: [
TextWrapper.text('Firebase'),
TextWrapper.text(
'Qui ipsum id ea ea nulla labore aute ullamco aute ',
),
],
),
const Gap(20),
SkillCard(
gradient: const [Colors.blue, Colors.green],
icon: Icons.ac_unit_sharp,
title: 'Lorem Ipsum'.wrap(),
description: 'Cupidatat reprehenderit aliqua eiusmod Lorem. '
'Qui ipsum id ea ea nulla labore aute ullamco aute '
'quis elit ut amet velit. Incididunt fugiat proident '
'proident deserunt tempor Lorem cillum qui do '
'ullamco Lorem magna ipsum. Ullamco cupidatat velit '
.wrap(),
skills: [
TextWrapper.text('Firebase'),
const TextWrapper(
'Qui ipsum id ea ea nulla labore aute ullamco aute ',
gradient: [Colors.red, Colors.orange],
),
TextWrapper.text('Firebase'),
TextWrapper.text('Firebase'),
TextWrapper.text('Firebase'),
TextWrapper.text('Firebase'),
TextWrapper.text('Firebase'),
],
),
],
),
const Gap(20),
],
);
}