feat: dandelion theme improvement (#3550)

frontend/appflowy_flutter/lib/workspace/presentation/home/menu/sidebar/sidebar_new_page_button.dart

@@ -36,9 +36,9 @@ class SidebarNewPageButton extends StatelessWidget {
           shape: BoxShape.circle,
           color: Theme.of(context).colorScheme.surface,
         ),
-        child: const FlowySvg(
+        child: FlowySvg(
           FlowySvgs.new_app_s,
-          blendMode: null,
+          color: Theme.of(context).colorScheme.primary,
         ),
       ),
       padding: const EdgeInsets.all(0),

frontend/appflowy_flutter/lib/workspace/presentation/settings/widgets/settings_appearance/color_scheme.dart

@@ -46,11 +46,14 @@ class ColorSchemeUploadOverlayButton extends StatelessWidget {
   Widget build(BuildContext context) {
     return FlowyIconButton(
       width: 24,
-      icon: const FlowySvg(
+      icon: FlowySvg(
         FlowySvgs.folder_m,
-        size: Size.square(16),
+        size: const Size.square(16),
+        color: Theme.of(context).iconTheme.color,
       ),
       iconColorOnHover: Theme.of(context).colorScheme.onPrimary,
+      hoverColor: Theme.of(context).colorScheme.secondaryContainer,
+      tooltipText: LocaleKeys.settings_appearance_themeUpload_uploadTheme.tr(),
       onPressed: () => Dialogs.show(
         context,
         child: BlocProvider<DynamicPluginBloc>.value(

frontend/appflowy_flutter/packages/flowy_infra/lib/colorscheme/dandelion.dart

@@ -4,15 +4,14 @@ import 'colorscheme.dart';
 
 const _black = Color(0xff000000);
 const _white = Color(0xFFFFFFFF);
-const _lightHover = Color(0xFFe0f8ff);
-const _lightSelector = Color(0xfff2fcff);
 const _lightBg1 = Color(0xFFFFD13E);
-const _lightBg2 = Color(0xffedeef2);
 const _lightShader1 = Color(0xff333333);
 const _lightShader3 = Color(0xff828282);
 const _lightShader5 = Color(0xffe0e0e0);
 const _lightShader6 = Color(0xfff2f2f2);
-const _lightMain1 = Color(0xffe21f74);
+const _lightDandelionYellow = Color(0xffffcb00);
+const _lightDandelionLightYellow = Color(0xffffdf66);
+const _lightDandelionGreen = Color(0xff9bc53d);
 const _lightTint9 = Color(0xffe1fbff);
 
 const _darkShader1 = Color(0xff131720);
@@ -20,7 +19,7 @@ const _darkShader2 = Color(0xff1A202C);
 const _darkShader3 = Color(0xff363D49);
 const _darkShader5 = Color(0xffBBC3CD);
 const _darkShader6 = Color(0xffF2F2F2);
-const _darkMain1 = Color(0xffe21f74);
+const _darkMain1 = Color(0xffffcb00);
 const _darkInput = Color(0xff282E3A);
 
 class DandelionColorScheme extends FlowyColorScheme {
@@ -28,20 +27,23 @@ class DandelionColorScheme extends FlowyColorScheme {
       : super(
           surface: Colors.white,
           hover: const Color(0xFFe0f8ff),
-          selector: const Color(0xfff2fcff),
+          // hover effect on setting value
+          selector: _lightDandelionLightYellow,
           red: const Color(0xfffb006d),
           yellow: const Color(0xffffd667),
           green: const Color(0xff66cf80),
           shader1: const Color(0xff333333),
           shader2: const Color(0xff4f4f4f),
           shader3: const Color(0xff828282),
+          // disable text color
           shader4: const Color(0xffbdbdbd),
           shader5: _lightShader5,
           shader6: const Color(0xfff2f2f2),
           shader7: _black,
           bg1: _lightBg1,
           bg2: const Color(0xffedeef2),
-          bg3: const Color(0xffe2e4eb),
+          // Hover color on trash button
+          bg3: _lightDandelionYellow,
           bg4: const Color(0xff2c144b),
           tint1: const Color(0xffe8e0ff),
           tint2: const Color(0xffffe7fd),
@@ -52,26 +54,29 @@ class DandelionColorScheme extends FlowyColorScheme {
           tint7: const Color(0xffddffd6),
           tint8: const Color(0xffdefff1),
           tint9: _lightTint9,
-          main1: _lightMain1,
-          main2: const Color(0xffe0196f),
+          main1: _lightDandelionYellow,
+          // cursor color
+          main2: _lightDandelionYellow,
           shadow: _black,
-          sidebarBg: _lightBg1,
+          sidebarBg: _lightDandelionGreen,
           divider: _lightShader6,
           topbarBg: _white,
           icon: _lightShader1,
           text: _lightShader1,
           input: _white,
           hint: _lightShader3,
-          primary: _lightMain1,
+          primary: _lightDandelionYellow,
           onPrimary: _white,
-          hoverBG1: _lightBg2,
-          hoverBG2: _lightHover,
+          // hover color in sidebar
+          hoverBG1: _lightDandelionYellow,
+          // tool bar hover color
+          hoverBG2: _lightDandelionLightYellow,
           hoverBG3: _lightShader6,
           hoverFG: _lightShader1,
-          questionBubbleBG: _lightSelector,
+          questionBubbleBG: _lightDandelionLightYellow,
           progressBarBGColor: _lightTint9,
           toolbarColor: _lightShader1,
-          toggleButtonBGColor: _lightShader5,
+          toggleButtonBGColor: _lightDandelionYellow,
           calendarWeekendBGColor: const Color(0xFFFBFBFC),
           gridRowCountColor: _black,
         );
@@ -93,7 +98,7 @@ class DandelionColorScheme extends FlowyColorScheme {
           shader7: _white,
           bg1: const Color(0xFFD5A200),
           bg2: _black,
-          bg3: const Color(0xff4f4f4f),
+          bg3: _darkMain1,
           bg4: const Color(0xff2c144b),
           tint1: const Color(0x4d9327FF),
           tint2: const Color(0x66FC0088),
@@ -105,7 +110,7 @@ class DandelionColorScheme extends FlowyColorScheme {
           tint8: const Color(0x80008890),
           tint9: const Color(0x4d0029FF),
           main1: _darkMain1,
-          main2: const Color(0xffe0196f),
+          main2: _darkMain1,
           shadow: _black,
           sidebarBg: const Color(0xff232B38),
           divider: _darkShader3,

frontend/resources/translations/en.json

@@ -279,6 +279,7 @@
       },
       "themeUpload": {
         "button": "Upload",
+        "uploadTheme": "Upload theme",
         "description": "Upload your own AppFlowy theme using the button below.",
         "failure": "The theme that was uploaded had an invalid format.",
         "loading": "Please wait while we validate and upload your theme...",