fix: scrolbars color

xsoulspace · Oct 25, 2021 · ab33429 · ab33429
1 parent 4b1cd55
commit ab33429
Show file tree

Hide file tree

Showing 2 changed files with 59 additions and 43 deletions.
diff --git a/lib/library/theme/material_theme.dart b/lib/library/theme/material_theme.dart
@@ -17,6 +17,13 @@ final lightThemeData = _lightBase.copyWith(
     ),
   ),
 
+  scrollbarTheme: _lightBase.scrollbarTheme.copyWith(
+    showTrackOnHover: true,
+    thumbColor: MaterialStateProperty.all(AppColors.grey1.withOpacity(0.4)),
+    trackBorderColor:
+        MaterialStateProperty.all(AppColors.grey4.withOpacity(0.2)),
+    interactive: true,
+  ),
   // splashColor: AppColors.primary2.withOpacity(0.4),
   inputDecorationTheme: _lightBase.inputDecorationTheme.copyWith(
     isDense: true,
@@ -39,6 +46,13 @@ final darkThemeData = _darkBase.copyWith(
       statusBarIconBrightness: Brightness.light,
     ),
   ),
+  scrollbarTheme: _darkBase.scrollbarTheme.copyWith(
+    interactive: true,
+    showTrackOnHover: true,
+    thumbColor: MaterialStateProperty.all(AppColors.grey4.withOpacity(0.4)),
+    trackBorderColor: MaterialStateProperty.all(AppColors.cleanBlack),
+    trackColor: MaterialStateProperty.all(AppColors.grey1.withOpacity(0.1)),
+  ),
   // TODO(arenukvern): for transparent background
   // scaffoldBackgroundColor:
   //     Platform.isMacOS ? Colors.transparent : _darkBase.scaffoldBackgroundColor,

diff --git a/lib/screens/home/small_home_screen.dart b/lib/screens/home/small_home_screen.dart
@@ -81,49 +81,52 @@ class _SmallHomeScreenState extends State<SmallHomeScreen> {
                     ),
                   );
                 }
-                return ListView.separated(
-                  padding: const EdgeInsets.all(5),
-                  reverse: true,
-                  shrinkWrap: true,
-                  restorationId: 'projects',
-                  itemBuilder: (final _, final i) {
-                    final project = projects[i];
-                    return ProjectTile(
-                      key: ValueKey(project.id),
-                      project: project,
-                      onSelected: changeProjectSelection,
-                      onTap: widget.onProjectTap,
-                      checkSelection: checkSelection,
-                      onRemove: (final _) async {
-                        if (project is IdeaProject) {
-                          await Future.forEach<IdeaProjectAnswer>(
-                            project.answers ?? [],
-                            (final answer) => answer.delete(),
+                return Scrollbar(
+                  isAlwaysShown: true,
+                  child: ListView.separated(
+                    padding: const EdgeInsets.all(5),
+                    reverse: true,
+                    shrinkWrap: true,
+                    restorationId: 'projects',
+                    itemBuilder: (final _, final i) {
+                      final project = projects[i];
+                      return ProjectTile(
+                        key: ValueKey(project.id),
+                        project: project,
+                        onSelected: changeProjectSelection,
+                        onTap: widget.onProjectTap,
+                        checkSelection: checkSelection,
+                        onRemove: (final _) async {
+                          if (project is IdeaProject) {
+                            await Future.forEach<IdeaProjectAnswer>(
+                              project.answers ?? [],
+                              (final answer) => answer.delete(),
+                            );
+                            ref
+                                .read(ideaProjectsProvider.notifier)
+                                .remove(key: project.id);
+                          } else if (project is NoteProject) {
+                            ref
+                                .read(noteProjectsProvider.notifier)
+                                .remove(key: project.id);
+                          } else if (project is StoryProject) {
+                            // TODO(arenukvern): implement StoryProject removal
+                          }
+                          await project.delete();
+                          widget.onGoHome();
+                        },
+                        onRemoveConfirm: (final _) async {
+                          return showRemoveProjectDialog(
+                            context: context,
+                            project: project,
                           );
-                          ref
-                              .read(ideaProjectsProvider.notifier)
-                              .remove(key: project.id);
-                        } else if (project is NoteProject) {
-                          ref
-                              .read(noteProjectsProvider.notifier)
-                              .remove(key: project.id);
-                        } else if (project is StoryProject) {
-                          // TODO(arenukvern): implement note project removal
-                        }
-                        await project.delete();
-                        widget.onGoHome();
-                      },
-                      onRemoveConfirm: (final _) async {
-                        return showRemoveProjectDialog(
-                          context: context,
-                          project: project,
-                        );
-                      },
-                    );
-                  },
-                  separatorBuilder: (final _, final __) =>
-                      const SizedBox(height: 3),
-                  itemCount: projects.length,
+                        },
+                      );
+                    },
+                    separatorBuilder: (final _, final __) =>
+                        const SizedBox(height: 3),
+                    itemCount: projects.length,
+                  ),
                 );
               },
             ),
@@ -158,7 +161,6 @@ class _SmallHomeScreenState extends State<SmallHomeScreen> {
           )
           .toList(),
     );
-    // TODO(arenukvern): make the welcome dependant from platform day time
     return Scaffold(
       appBar: appBar,
       body: Row(