feat(ui): update default extension implementation

2023-04-28 16:08:10 +02:00 · 2023-04-28 16:08:10 +02:00 · 01a5619dc5
commit 01a5619dc5
parent 4ebb679a29
8 changed files with 59 additions and 57 deletions
--- a/packages/wyatt_ui_components/lib/src/data/theme_extensions/button_theme_extension/file_selection_button_theme_extension_default.dart
+++ b/packages/wyatt_ui_components/lib/src/data/theme_extensions/button_theme_extension/file_selection_button_theme_extension_default.dart
@ -55,11 +55,11 @@ class FileSelectionButtonThemeExtensionDefault
      focusedStyle: style,
      hoveredStyle: style.copyWith(
        backgroundColors:
-            MultiColor.single(theme.colorScheme.primary.withOpacity(0.92)),
+            MultiColor.single(theme.colorScheme.primary.withOpacity(0.80)),
      ),
      tappedStyle: style.copyWith(
        backgroundColors:
-            MultiColor.single(theme.colorScheme.primary.withOpacity(0.92)),
+            MultiColor.single(theme.colorScheme.primary.withOpacity(0.75)),
      ),
      selectedStyle: style,
      disabledStyle: style.copyWith(
--- a/packages/wyatt_ui_components/lib/src/data/theme_extensions/button_theme_extension/simple_icon_button_theme_extension_default.dart
+++ b/packages/wyatt_ui_components/lib/src/data/theme_extensions/button_theme_extension/simple_icon_button_theme_extension_default.dart
@ -43,7 +43,7 @@ class SimpleIconButtonThemeExtensionDefault
      radius: (theme.buttonTheme.shape is RoundedRectangleBorder)
          ? (theme.buttonTheme.shape as RoundedRectangleBorder).borderRadius
          : null,
-      padding: theme.buttonTheme.padding,
+      padding: const EdgeInsets.all(5),
      foregroundColors: foregroundColor,
      backgroundColors: backgroundColor,
      animationDuration: Duration.zero,
@ -54,11 +54,11 @@ class SimpleIconButtonThemeExtensionDefault
      focusedStyle: style,
      hoveredStyle: style.copyWith(
        backgroundColors:
-            MultiColor.single(theme.colorScheme.primary.withOpacity(0.92)),
+            MultiColor.single(theme.colorScheme.primary.withOpacity(0.80)),
      ),
      tappedStyle: style.copyWith(
        backgroundColors:
-            MultiColor.single(theme.colorScheme.primary.withOpacity(0.92)),
+            MultiColor.single(theme.colorScheme.primary.withOpacity(0.75)),
      ),
      disabledStyle: style.copyWith(
        foregroundColors:
--- a/packages/wyatt_ui_components/lib/src/data/theme_extensions/button_theme_extension/symbol_button_theme_extension_default.dart
+++ b/packages/wyatt_ui_components/lib/src/data/theme_extensions/button_theme_extension/symbol_button_theme_extension_default.dart
@ -37,10 +37,11 @@ class SymbolButtonThemeExtensionDefault extends SymbolButtonThemeExtension {
  factory SymbolButtonThemeExtensionDefault.from(ThemeData theme) {
    final backgroundColor = MultiColor.single(theme.colorScheme.primary);
    final foregroundColor = MultiColor.single(theme.colorScheme.onPrimary);
+    final textColor = MultiColor.single(theme.textTheme.bodyMedium?.color);

    final style = SymbolButtonStyle(
      labelStyle:
-          theme.textTheme.labelLarge?.copyWith(color: foregroundColor.color),
+          theme.textTheme.labelLarge?.copyWith(color: textColor.color),
      dimension: theme.buttonTheme.height * 1.5,
      radius: (theme.buttonTheme.shape is RoundedRectangleBorder)
          ? (theme.buttonTheme.shape as RoundedRectangleBorder).borderRadius
@ -56,11 +57,11 @@ class SymbolButtonThemeExtensionDefault extends SymbolButtonThemeExtension {
      focusedStyle: style,
      hoveredStyle: style.copyWith(
        backgroundColors:
-            MultiColor.single(theme.colorScheme.primary.withOpacity(0.92)),
+            MultiColor.single(theme.colorScheme.primary.withOpacity(0.80)),
      ),
      tappedStyle: style.copyWith(
        backgroundColors:
-            MultiColor.single(theme.colorScheme.primary.withOpacity(0.92)),
+            MultiColor.single(theme.colorScheme.primary.withOpacity(0.75)),
      ),
      disabledStyle: style.copyWith(
        foregroundColors:
@ -71,6 +72,8 @@ class SymbolButtonThemeExtensionDefault extends SymbolButtonThemeExtension {
      selectedStyle: style.copyWith(
        backgroundColors:
            MultiColor.single(theme.colorScheme.primary.withOpacity(0.92)),
+        borderColors: textColor,
+        stroke: 3,
      ),
    );
  }
--- a/packages/wyatt_ui_components/lib/src/data/theme_extensions/card_theme_extension_default.dart
+++ b/packages/wyatt_ui_components/lib/src/data/theme_extensions/card_theme_extension_default.dart
@ -45,15 +45,15 @@ class CardThemeExtensionDefault extends CardThemeExtension {
  factory CardThemeExtensionDefault.from(ThemeData theme) =>
      CardThemeExtensionDefault(
        radius: const BorderRadius.all(Radius.circular(12)),
-        padding: theme.cardTheme.margin ?? const EdgeInsets.all(4),
-        backgroundColors: MultiColor.single(theme.cardTheme.color),
-        borderColors: MultiColor.single(theme.cardTheme.color),
+        padding: theme.cardTheme.margin ?? const EdgeInsets.all(15),
+        backgroundColors: MultiColor.single(theme.cardColor),
+        borderColors: MultiColor.single(theme.canvasColor),
        minSize: const Size(330, 0),
        maxSize: const Size(390, double.infinity),
        titleStyle: theme.textTheme.titleLarge,
        subtitleStyle: theme.textTheme.titleMedium,
        bodyStyle: theme.textTheme.bodyMedium,
-        stroke: 1,
+        stroke: 0,
        shadow: null,
      );

--- a/packages/wyatt_ui_kit/example/lib/rich_text_builders/rich_text_builders.dart
+++ b/packages/wyatt_ui_kit/example/lib/rich_text_builders/rich_text_builders.dart
@ -26,38 +26,40 @@ class RichTextBuilders extends DemoPage {
  String get title => 'RichTextBuilders';

  @override
-  Widget build(BuildContext context) => ListView(
-        cacheExtent: 1000,
-        children: [
-          const Gap(20),
-          Align(
-            child: Text(
-              title,
-              style: Theme.of(context).textTheme.titleLarge,
+  Widget build(BuildContext context) => SelectionArea(
+    child: ListView(
+          cacheExtent: 1000,
+          children: [
+            const Gap(20),
+            Align(
+              child: Text(
+                title,
+                style: Theme.of(context).textTheme.titleLarge,
+              ),
            ),
-          ),
-          const Gap(20),
-          const Padding(
-            padding: EdgeInsets.all(8),
-            child: RichTextBuilder(
-              text: '''
-Innovation, Expertise et Accompagnement...
-Notre agence de développement Wyatt Studio met tout en oeuvre pour vous aider à <gradient-blue>concrétiser vos idées</gradient-blue> de solutions informatiques et mobiles.
-
-Vous aussi, comme beaucoup d’autres <gradient-blue>agences ou startups</gradient-blue>, faites nous confiance pour la réalisation de votre projet dès maintenant !
-            ''',
+            const Gap(20),
+            const Padding(
+              padding: EdgeInsets.all(8),
+              child: RichTextBuilder(
+                text: '''
+  Innovation, Expertise et Accompagnement...
+  Notre agence de développement Wyatt Studio met tout en oeuvre pour vous aider à <gradient-blue>concrétiser vos idées</gradient-blue> de solutions informatiques et mobiles.
+  
+  Vous aussi, comme beaucoup d’autres <gradient-blue>agences ou startups</gradient-blue>, faites nous confiance pour la réalisation de votre projet dès maintenant !
+              ''',
+              ),
            ),
-          ),
-          const Gap(20),
-          const Padding(
-            padding: EdgeInsets.all(8),
-            child: RichTextBuilder(
-              text: '''
-Je peux être <blue>bleu</blue>, ou même <gradient-red>rouge en dégradé</gradient-red>. À vrai dire <green>je peux</green> être <gradient-blue>un peu</gradient-blue> n'importe quelle couleur.
-            ''',
+            const Gap(20),
+            const Padding(
+              padding: EdgeInsets.all(8),
+              child: RichTextBuilder(
+                text: '''
+  Je peux être <blue>bleu</blue>, ou même <gradient-red>rouge en dégradé</gradient-red>. À vrai dire <green>je peux</green> être <gradient-blue>un peu</gradient-blue> n'importe quelle couleur.
+              ''',
+              ),
            ),
-          ),
-          const Gap(20),
-        ],
-      );
+            const Gap(20),
+          ],
+        ),
+  );
 }
--- a/packages/wyatt_ui_kit/lib/src/data/theme_extensions/card_theme_extension_impl.dart
+++ b/packages/wyatt_ui_kit/lib/src/data/theme_extensions/card_theme_extension_impl.dart
@ -52,7 +52,9 @@ class CardThemeExtensionImpl extends CardThemeExtension {
      borderColors: WyattColors.lightGradient,
      titleStyle: theme.textTheme.titleLarge,
      subtitleStyle: theme.textTheme.titleMedium,
-      bodyStyle: theme.textTheme.bodyMedium,
+      bodyStyle: theme.textTheme.bodyMedium?.copyWith(
+        height: 1.5,
+      ),
      minSize: const Size(330, 0),
      maxSize: const Size(390, double.infinity),
      shadow: BoxShadow(
@ -76,7 +78,9 @@ class CardThemeExtensionImpl extends CardThemeExtension {
      borderColors: WyattColors.grayGradient,
      titleStyle: theme.textTheme.titleLarge,
      subtitleStyle: theme.textTheme.titleMedium,
-      bodyStyle: theme.textTheme.bodyMedium,
+      bodyStyle: theme.textTheme.bodyMedium?.copyWith(
+        height: 1.5,
+      ),
      minSize: const Size(330, 0),
      maxSize: const Size(390, double.infinity),
      shadow: BoxShadow(
--- a/packages/wyatt_ui_kit/lib/src/data/theme_extensions/loader_theme_extension_impl.dart
+++ b/packages/wyatt_ui_kit/lib/src/data/theme_extensions/loader_theme_extension_impl.dart
@ -16,6 +16,7 @@

 import 'package:flutter/material.dart';
 import 'package:wyatt_ui_components/wyatt_ui_components.dart';
+import 'package:wyatt_ui_kit/src/core/design_system/colors.dart';

 class LoaderThemeExtensionImpl extends LoaderThemeExtension {
  const LoaderThemeExtensionImpl({
@ -27,9 +28,8 @@ class LoaderThemeExtensionImpl extends LoaderThemeExtension {
    theme ??= ThemeData.light();
    return const LoaderThemeExtensionImpl(
      colors: MultiColor([
-        Color(0xFF436EF4),
-        Color(0xFF3C97FB),
-        Colors.transparent,
+        WyattColors.blue1,
+        WyattColors.light,
      ]),
      stroke: 15,
    );
@ -37,10 +37,9 @@ class LoaderThemeExtensionImpl extends LoaderThemeExtension {

  factory LoaderThemeExtensionImpl.dark({ThemeData? theme}) {
    theme ??= ThemeData.dark();
-    return const LoaderThemeExtensionImpl(
+    return LoaderThemeExtensionImpl(
      colors: MultiColor([
-        Color(0xFF3C97FB),
-        Color(0xFF436EF4),
+        ...WyattColors.blueBtnGradient.colors,
        Colors.transparent,
      ]),
      stroke: 15,
--- a/packages/wyatt_ui_kit/lib/src/data/theme_extensions/rich_text_builder_theme_extension_impl.dart
+++ b/packages/wyatt_ui_kit/lib/src/data/theme_extensions/rich_text_builder_theme_extension_impl.dart
@ -49,7 +49,6 @@ class RichTextBuilderThemeExtensionImpl extends RichTextBuilderThemeExtension {
  static Map<String, TextStyle> stylesFor(ThemeData theme) => {
        'gradient-blue': GradientTextStyle.from(
          theme.textTheme.bodyMedium?.copyWith(
-            fontSize: 20,
            fontWeight: FontWeight.w600,
            height: 1.8,
          ),
@ -60,7 +59,6 @@ class RichTextBuilderThemeExtensionImpl extends RichTextBuilderThemeExtension {
        ),
        'gradient-red': GradientTextStyle.from(
          theme.textTheme.bodyMedium?.copyWith(
-            fontSize: 20,
            fontWeight: FontWeight.w600,
            height: 1.8,
          ),
@ -71,7 +69,6 @@ class RichTextBuilderThemeExtensionImpl extends RichTextBuilderThemeExtension {
        ),
        'gradient-green': GradientTextStyle.from(
          theme.textTheme.bodyMedium?.copyWith(
-            fontSize: 20,
            fontWeight: FontWeight.w600,
            height: 1.8,
          ),
@ -81,7 +78,6 @@ class RichTextBuilderThemeExtensionImpl extends RichTextBuilderThemeExtension {
          ]),
        ),
        'blue': theme.textTheme.bodyMedium?.copyWith(
-              fontSize: 20,
              fontWeight: FontWeight.w600,
              color: const Color(0xFF3C97FB),
              height: 1.8,
@ -90,7 +86,6 @@ class RichTextBuilderThemeExtensionImpl extends RichTextBuilderThemeExtension {
              color: Color(0xFF3C97FB),
            ),
        'red': theme.textTheme.bodyMedium?.copyWith(
-              fontSize: 20,
              fontWeight: FontWeight.w600,
              color: const Color(0xFFF44464),
              height: 1.8,
@ -99,7 +94,6 @@ class RichTextBuilderThemeExtensionImpl extends RichTextBuilderThemeExtension {
              color: Color(0xFFF44464),
            ),
        'green': theme.textTheme.bodyMedium?.copyWith(
-              fontSize: 20,
              fontWeight: FontWeight.w600,
              color: const Color(0xFF00D16C),
              height: 1.8,