diff --git a/app/src/main/kotlin/cn/super12138/todo/ui/pages/main/ManagerFragment.kt b/app/src/main/kotlin/cn/super12138/todo/ui/pages/main/ManagerFragment.kt
index 6b26ea9..5c11219 100644
--- a/app/src/main/kotlin/cn/super12138/todo/ui/pages/main/ManagerFragment.kt
+++ b/app/src/main/kotlin/cn/super12138/todo/ui/pages/main/ManagerFragment.kt
@@ -1,5 +1,6 @@
 package cn.super12138.todo.ui.pages.main
 
+import androidx.compose.animation.core.FastOutSlowInEasing
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.PaddingValues
@@ -8,11 +9,13 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.lazy.LazyListState
 import androidx.compose.foundation.lazy.items
+import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.unit.dp
@@ -20,6 +23,11 @@ import cn.super12138.todo.R
 import cn.super12138.todo.logic.database.TodoEntity
 import cn.super12138.todo.logic.model.Subjects
 import cn.super12138.todo.ui.pages.main.components.TodoCard
+import my.nanihadesuka.compose.LazyColumnScrollbar
+import my.nanihadesuka.compose.ScrollbarLayoutSide
+import my.nanihadesuka.compose.ScrollbarSelectionActionable
+import my.nanihadesuka.compose.ScrollbarSelectionMode
+import my.nanihadesuka.compose.ScrollbarSettings
 
 @Composable
 fun ManagerFragment(
@@ -30,42 +38,50 @@ fun ManagerFragment(
     modifier: Modifier = Modifier
 ) {
     val context = LocalContext.current
-    LazyColumn(
-        modifier = modifier,
+    LazyColumnScrollbar(
         state = state,
-        contentPadding = PaddingValues(
-            start = 10.dp,
-            end = 10.dp,
-        )
+        settings = ScrollbarSettings(
+            thumbUnselectedColor = MaterialTheme.colorScheme.secondary,
+            thumbSelectedColor = MaterialTheme.colorScheme.primary
+        ),
+        modifier = modifier,
     ) {
-        if (list.isEmpty()) {
-            item {
-                Column(
-                    verticalArrangement = Arrangement.Center,
-                    horizontalAlignment = Alignment.CenterHorizontally,
-                    modifier = Modifier.fillMaxSize()
-                ) {
-                    Text(
-                        text = stringResource(R.string.tip_no_task),
-                        style = MaterialTheme.typography.titleMedium
+        LazyColumn(
+            state = state,
+            contentPadding = PaddingValues(
+                start = 10.dp,
+                end = 10.dp,
+            )
+        ) {
+            if (list.isEmpty()) {
+                item {
+                    Column(
+                        verticalArrangement = Arrangement.Center,
+                        horizontalAlignment = Alignment.CenterHorizontally,
+                        modifier = Modifier.fillMaxSize()
+                    ) {
+                        Text(
+                            text = stringResource(R.string.tip_no_task),
+                            style = MaterialTheme.typography.titleMedium
+                        )
+                    }
+                }
+            } else {
+                items(
+                    items = list,
+                    key = { it.id }
+                ) { item ->
+                    TodoCard(
+                        content = item.content,
+                        subject = Subjects.fromId(item.subject).getDisplayName(context),
+                        onCardClick = { onItemClick(item) },
+                        onChecked = { onItemChecked(item) },
+                        modifier = Modifier
+                            .padding(vertical = 5.dp)
+                            .animateItem()
                     )
                 }
             }
-        } else {
-            items(
-                items = list,
-                key = { it.id }
-            ) { item ->
-                TodoCard(
-                    content = item.content,
-                    subject = Subjects.fromId(item.subject).getDisplayName(context),
-                    onCardClick = { onItemClick(item) },
-                    onChecked = { onItemChecked(item) },
-                    modifier = Modifier
-                        .padding(vertical = 5.dp)
-                        .animateItem()
-                )
-            }
         }
     }
 }
\ No newline at end of file