feat: lavender theme refactor

frontend/appflowy_flutter/lib/plugins/database_view/calendar/presentation/layout/sizes.dart

@@ -3,7 +3,7 @@ import 'package:flutter/widgets.dart';
 class CalendarSize {
   static double scale = 1;
 
-  static double get scrollBarSize => 12 * scale;
+  static double get scrollBarSize => 8 * scale;
   static double get navigatorButtonWidth => 20 * scale;
   static double get navigatorButtonHeight => 25 * scale;
   static EdgeInsets get daysOfWeekInsets =>

frontend/appflowy_flutter/lib/plugins/database_view/grid/presentation/layout/sizes.dart

@@ -3,7 +3,7 @@ import 'package:flutter/widgets.dart';
 class GridSize {
   static double scale = 1;
 
-  static double get scrollBarSize => 12 * scale;
+  static double get scrollBarSize => 8 * scale;
   static double get headerHeight => 40 * scale;
   static double get footerHeight => 40 * scale;
   static double get leadingHeaderPadding => 50 * scale;

frontend/appflowy_flutter/lib/workspace/presentation/settings/widgets/settings_menu_element.dart

@@ -23,6 +23,7 @@ class SettingsMenuElement extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return FlowyHover(
+      resetHoverOnRebuild: false,
       style: HoverStyle(
         hoverColor: Theme.of(context).colorScheme.primary,
       ),

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

@@ -101,9 +101,9 @@ class DefaultColorScheme extends FlowyColorScheme {
           tint8: const Color(0xff00F0E2),
           tint9: const Color(0xff00BCF0),
           main1: _darkMain1,
-          main2: const Color(0xff00B7EA),
+          main2: _darkMain1,
           shadow: const Color(0xff0F131C),
-          sidebarBg: const Color(0xff232B38),
+          sidebarBg: const Color(0xff2D223B),
           divider: _darkShader3,
           topbarBg: _darkShader1,
           icon: _darkShader5,

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

@@ -5,15 +5,15 @@ import 'colorscheme.dart';
 const _black = Color(0xff000000);
 const _white = Color(0xFFFFFFFF);
 
-const _lightHover = Color(0xFFe0f8ff);
-const _lightSelector = Color(0xfff2fcff);
-const _lightBg1 = Color(0xfff7f8fc);
-const _lightBg2 = Color(0xffedeef2);
+const _lightHover = Color(0xffd8d6fc);
+const _lightSelector = Color(0xffe5e3f9);
+const _lightBg1 = Color(0xfff2f0f6);
+const _lightBg2 = Color(0xffd8d6fc);
 const _lightShader1 = Color(0xff333333);
 const _lightShader3 = Color(0xff828282);
 const _lightShader5 = Color(0xffe0e0e0);
-const _lightShader6 = Color(0xfff2f2f2);
-const _lightMain1 = Color(0xffA652FB);
+const _lightShader6 = Color(0xffd8d6fc);
+const _lightMain1 = Color(0xffaba9e7);
 const _lightTint9 = Color(0xffe1fbff);
 
 const _darkShader1 = Color(0xff131720);
@@ -21,15 +21,15 @@ const _darkShader2 = Color(0xff1A202C);
 const _darkShader3 = Color(0xff363D49);
 const _darkShader5 = Color(0xffBBC3CD);
 const _darkShader6 = Color(0xffF2F2F2);
-const _darkMain1 = Color(0xffA652FB);
+const _darkMain1 = Color(0xffab00ff);
 const _darkInput = Color(0xff282E3A);
 
 class LavenderColorScheme extends FlowyColorScheme {
   const LavenderColorScheme.light()
       : super(
           surface: Colors.white,
-          hover: const Color(0xFFe0f8ff),
-          selector: const Color(0xfff2fcff),
+          hover: _lightHover,
+          selector: _lightSelector,
           red: const Color(0xfffb006d),
           yellow: const Color(0xffffd667),
           green: const Color(0xff66cf80),
@@ -42,7 +42,7 @@ class LavenderColorScheme extends FlowyColorScheme {
           shader7: _black,
           bg1: const Color(0xffAC59FF),
           bg2: const Color(0xffedeef2),
-          bg3: const Color(0xffe2e4eb),
+          bg3: _lightHover,
           bg4: const Color(0xff2c144b),
           tint1: const Color(0xffe8e0ff),
           tint2: const Color(0xffffe7fd),
@@ -52,10 +52,10 @@ class LavenderColorScheme extends FlowyColorScheme {
           tint6: const Color(0xfff5ffdc),
           tint7: const Color(0xffddffd6),
           tint8: const Color(0xffdefff1),
-          tint9: _lightTint9,
+          tint9: _lightMain1,
           main1: _lightMain1,
-          main2: const Color(0xff9327FF),
-          shadow: _black,
+          main2: _lightMain1,
+          shadow: const Color.fromRGBO(0, 0, 0, 0.15),
           sidebarBg: _lightBg1,
           divider: _lightShader6,
           topbarBg: _white,
@@ -72,13 +72,13 @@ class LavenderColorScheme extends FlowyColorScheme {
           questionBubbleBG: _lightSelector,
           progressBarBGColor: _lightTint9,
           toolbarColor: _lightShader1,
-          toggleButtonBGColor: _lightShader5,
+          toggleButtonBGColor: _lightSelector,
         );
 
   const LavenderColorScheme.dark()
       : super(
           surface: const Color(0xFF1B1A1D),
-          hover: const Color(0xff1f1f1f),
+          hover: _darkMain1,
           selector: const Color(0xff333333),
           red: const Color(0xfffb006d),
           yellow: const Color(0xffffd667),
@@ -92,7 +92,7 @@ class LavenderColorScheme extends FlowyColorScheme {
           shader7: _white,
           bg1: const Color(0xff8C23F6),
           bg2: _black,
-          bg3: const Color(0xff4f4f4f),
+          bg3: _darkMain1,
           bg4: const Color(0xff2c144b),
           tint1: const Color(0xff8738F5),
           tint2: const Color(0xffE6336E),
@@ -111,7 +111,7 @@ class LavenderColorScheme extends FlowyColorScheme {
           topbarBg: _darkShader1,
           icon: _darkShader5,
           text: _darkShader5,
-          input: const Color(0xff282E3A),
+          input: _darkInput,
           hint: _darkShader5,
           primary: _darkMain1,
           onPrimary: _darkShader1,

frontend/appflowy_flutter/packages/flowy_infra_ui/lib/style_widget/hover.dart

@@ -1,6 +1,4 @@
 import 'package:flutter/material.dart';
-// ignore: unused_import
-import 'package:flowy_infra/time/duration.dart';
 
 typedef HoverBuilder = Widget Function(BuildContext context, bool onHover);
 
@@ -13,6 +11,10 @@ class FlowyHover extends StatefulWidget {
   final void Function(bool)? onHover;
   final MouseCursor? cursor;
 
+  /// Reset the hover state when the parent widget get rebuild.
+  /// Default to true.
+  final bool resetHoverOnRebuild;
+
   /// Determined whether the [builder] should get called when onEnter/onExit
   /// happened
   ///
@@ -29,6 +31,7 @@ class FlowyHover extends StatefulWidget {
     this.isSelected,
     this.onHover,
     this.cursor,
+    this.resetHoverOnRebuild = true,
     this.buildWhenOnHover,
   }) : super(key: key);
 
@@ -41,8 +44,10 @@ class _FlowyHoverState extends State<FlowyHover> {
 
   @override
   void didUpdateWidget(covariant FlowyHover oldWidget) {
-    // Reset the _onHover to false when the parent widget get rebuild.
-    _onHover = false;
+    if (widget.resetHoverOnRebuild == true) {
+      // Reset the _onHover to false when the parent widget get rebuild.
+      _onHover = false;
+    }
     super.didUpdateWidget(oldWidget);
   }
 

frontend/appflowy_flutter/packages/flowy_infra_ui/lib/style_widget/scrolling/styled_list.dart

@@ -66,7 +66,7 @@ class StyledListViewState extends State<StyledListView> {
       contentSize: contentSize,
       axis: widget.axis,
       controller: scrollController,
-      barSize: widget.barSize ?? 12,
+      barSize: widget.barSize ?? 8,
       scrollbarPadding: widget.scrollbarPadding,
       child: ListView.builder(
         padding: widget.padding,

frontend/appflowy_flutter/packages/flowy_infra_ui/lib/style_widget/scrolling/styled_scrollview.dart

@@ -23,7 +23,7 @@ class StyledSingleChildScrollView extends StatefulWidget {
     this.handleColor,
     this.controller,
     this.scrollbarPadding,
-    this.barSize = 12,
+    this.barSize = 8,
   }) : super(key: key);
 
   @override
@@ -90,7 +90,7 @@ class StyledCustomScrollView extends StatefulWidget {
     this.handleColor,
     this.verticalController,
     this.slivers = const <Widget>[],
-    this.barSize = 12,
+    this.barSize = 8,
   }) : super(key: key);
 
   @override