feat(ui): make components more coherent + docs
This commit is contained in:
+72
@@ -0,0 +1,72 @@
|
||||
// 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_ui_components.dart';
|
||||
import 'package:wyatt_ui_kit/src/components/cards/widgets/card_text.dart';
|
||||
|
||||
const _titlesLineSpacing = 5.0;
|
||||
|
||||
class PortfolioCardTitles extends StatelessWidget {
|
||||
const PortfolioCardTitles({
|
||||
this.axis,
|
||||
this.title,
|
||||
this.subtitle,
|
||||
this.titleStyle,
|
||||
this.subtitleStyle,
|
||||
super.key,
|
||||
});
|
||||
|
||||
/// The axis of the card header.
|
||||
final Axis? axis;
|
||||
|
||||
/// The title of the card.
|
||||
final TextWrapper? title;
|
||||
|
||||
/// The subtitle of the card.
|
||||
final TextWrapper? subtitle;
|
||||
|
||||
/// Styles the title of the card.
|
||||
final TextStyle? titleStyle;
|
||||
|
||||
/// Styles the subtitle of the card.
|
||||
final TextStyle? subtitleStyle;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) => Column(
|
||||
crossAxisAlignment: axis == Axis.horizontal
|
||||
? CrossAxisAlignment.start
|
||||
: CrossAxisAlignment.center,
|
||||
children: [
|
||||
if (title != null) ...[
|
||||
CardText.fromWrapper(
|
||||
title!,
|
||||
style: titleStyle,
|
||||
textType: TextType.title,
|
||||
),
|
||||
],
|
||||
if (subtitle != null) ...[
|
||||
const Gap(_titlesLineSpacing),
|
||||
CardText.fromWrapper(
|
||||
subtitle!,
|
||||
style: subtitleStyle,
|
||||
textType: TextType.subtitle,
|
||||
),
|
||||
],
|
||||
],
|
||||
);
|
||||
}
|
||||
+71
@@ -0,0 +1,71 @@
|
||||
// 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_ui_components.dart';
|
||||
import 'package:wyatt_ui_kit/src/components/cards/skill_card/widgets/skill_card_titles.dart';
|
||||
|
||||
const _avatarAndTitlesSpacing = 25.0;
|
||||
|
||||
class SkillCardHorizontalHeader extends StatelessWidget {
|
||||
const SkillCardHorizontalHeader({
|
||||
this.icons,
|
||||
this.axis,
|
||||
this.title,
|
||||
this.subtitle,
|
||||
this.titleStyle,
|
||||
this.subtitleStyle,
|
||||
super.key,
|
||||
});
|
||||
|
||||
/// The icons of the card header.
|
||||
final List<Widget>? icons;
|
||||
|
||||
/// The axis of the card header.
|
||||
final Axis? axis;
|
||||
|
||||
/// The title of the card.
|
||||
final TextWrapper? title;
|
||||
|
||||
/// The subtitle of the card.
|
||||
final TextWrapper? subtitle;
|
||||
|
||||
/// Styles the title of the card.
|
||||
final TextStyle? titleStyle;
|
||||
|
||||
/// Styles the subtitle of the card.
|
||||
final TextStyle? subtitleStyle;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) => Row(
|
||||
children: [
|
||||
if (icons?.first != null) ...[
|
||||
icons!.first,
|
||||
const Gap(_avatarAndTitlesSpacing),
|
||||
],
|
||||
Expanded(
|
||||
child: SkillCardTitles(
|
||||
axis: axis,
|
||||
title: title,
|
||||
subtitle: subtitle,
|
||||
titleStyle: titleStyle,
|
||||
subtitleStyle: subtitleStyle,
|
||||
),
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
||||
+43
@@ -0,0 +1,43 @@
|
||||
// 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';
|
||||
|
||||
const _iconSpacing = 25.0;
|
||||
|
||||
class SkillCardIcons extends StatelessWidget {
|
||||
const SkillCardIcons({
|
||||
super.key,
|
||||
this.icons,
|
||||
});
|
||||
|
||||
/// The icons of the card header.
|
||||
final List<Widget>? icons;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final result = <Widget>[];
|
||||
for (final widget in icons ?? List<Widget>.empty()) {
|
||||
result.addAll([widget, const Gap(_iconSpacing)]);
|
||||
}
|
||||
result.removeLast();
|
||||
return Row(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: result,
|
||||
);
|
||||
}
|
||||
}
|
||||
+72
@@ -0,0 +1,72 @@
|
||||
// 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_ui_components.dart';
|
||||
import 'package:wyatt_ui_kit/src/components/cards/widgets/card_text.dart';
|
||||
|
||||
const _titlesLineSpacing = 5.0;
|
||||
|
||||
class SkillCardTitles extends StatelessWidget {
|
||||
const SkillCardTitles({
|
||||
this.axis,
|
||||
this.title,
|
||||
this.subtitle,
|
||||
this.titleStyle,
|
||||
this.subtitleStyle,
|
||||
super.key,
|
||||
});
|
||||
|
||||
/// The axis of the card header.
|
||||
final Axis? axis;
|
||||
|
||||
/// The title of the card.
|
||||
final TextWrapper? title;
|
||||
|
||||
/// The subtitle of the card.
|
||||
final TextWrapper? subtitle;
|
||||
|
||||
/// Styles the title of the card.
|
||||
final TextStyle? titleStyle;
|
||||
|
||||
/// Styles the subtitle of the card.
|
||||
final TextStyle? subtitleStyle;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) => Column(
|
||||
crossAxisAlignment: axis == Axis.horizontal
|
||||
? CrossAxisAlignment.start
|
||||
: CrossAxisAlignment.center,
|
||||
children: [
|
||||
if (title != null) ...[
|
||||
CardText.fromWrapper(
|
||||
title!,
|
||||
style: titleStyle,
|
||||
textType: TextType.title,
|
||||
),
|
||||
],
|
||||
if (subtitle != null) ...[
|
||||
const Gap(_titlesLineSpacing),
|
||||
CardText.fromWrapper(
|
||||
subtitle!,
|
||||
style: subtitleStyle,
|
||||
textType: TextType.subtitle,
|
||||
),
|
||||
],
|
||||
],
|
||||
);
|
||||
}
|
||||
+72
@@ -0,0 +1,72 @@
|
||||
// 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_ui_components.dart';
|
||||
import 'package:wyatt_ui_kit/src/components/cards/skill_card/widgets/skill_card_icons.dart';
|
||||
import 'package:wyatt_ui_kit/src/components/cards/skill_card/widgets/skill_card_titles.dart';
|
||||
|
||||
const _avatarAndTitlesSpacing = 25.0;
|
||||
|
||||
class SkillCardVerticalHeader extends StatelessWidget {
|
||||
const SkillCardVerticalHeader({
|
||||
this.icons,
|
||||
this.axis,
|
||||
this.title,
|
||||
this.subtitle,
|
||||
this.titleStyle,
|
||||
this.subtitleStyle,
|
||||
super.key,
|
||||
});
|
||||
|
||||
/// The icons of the card header.
|
||||
final List<Widget>? icons;
|
||||
|
||||
/// The axis of the card header.
|
||||
final Axis? axis;
|
||||
|
||||
/// The title of the card.
|
||||
final TextWrapper? title;
|
||||
|
||||
/// The subtitle of the card.
|
||||
final TextWrapper? subtitle;
|
||||
|
||||
/// Styles the title of the card.
|
||||
final TextStyle? titleStyle;
|
||||
|
||||
/// Styles the subtitle of the card.
|
||||
final TextStyle? subtitleStyle;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) => Column(
|
||||
children: [
|
||||
if (icons != null && icons!.isNotEmpty) ...[
|
||||
SkillCardIcons(
|
||||
icons: icons,
|
||||
),
|
||||
const Gap(_avatarAndTitlesSpacing),
|
||||
],
|
||||
SkillCardTitles(
|
||||
axis: axis,
|
||||
title: title,
|
||||
subtitle: subtitle,
|
||||
titleStyle: titleStyle,
|
||||
subtitleStyle: subtitleStyle,
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user