Merge pull request #491 from pinkary-project/feat/modal-scroll-issue-…

…with-scrollbar Fixing Scroll Issue and style scrollbars
pinkary-project · Aug 6, 2024 · a6b6856 · a6b6856
2 parents ba9dc4d + 5e095c0
commit a6b6856
Show file tree

Hide file tree

Showing 3 changed files with 30 additions and 2 deletions.
diff --git a/resources/css/app.css b/resources/css/app.css
@@ -23,6 +23,34 @@ particleEffect {
     border-radius: 50%;
 }
 
+::-webkit-scrollbar {
+    height: 5px;
+    width: 5px
+}
+
+::-webkit-scrollbar-track {
+    @apply bg-gray-900;
+}
+
+::-webkit-scrollbar-thumb {
+    @apply bg-gray-700;
+}
+
+::-webkit-scrollbar-thumb:hover {
+    background: #c9cbcd
+}
+
+.dark ::-webkit-scrollbar-track {
+    @apply bg-gray-800;
+}
+
+.dark ::-webkit-scrollbar-thumb {
+    @apply bg-gray-600;
+}
+
+.dark ::-webkit-scrollbar-thumb:hover {
+    @apply bg-gray-600;
+}
 
 @tailwind base;
 @tailwind components;

diff --git a/resources/views/livewire/followers/index.blade.php b/resources/views/livewire/followers/index.blade.php
@@ -12,7 +12,7 @@
         </div>
 
         @if ($followers->count())
-            <section class="mt-10 max-w-2xl">
+            <section class="mt-10 max-w-2xl max-h-96 overflow-y-auto">
                 <ul class="flex flex-col gap-2">
                     @foreach ($followers as $follower)
                         <li>

diff --git a/resources/views/livewire/following/index.blade.php b/resources/views/livewire/following/index.blade.php
@@ -12,7 +12,7 @@
         </div>
 
         @if ($following->count())
-            <section class="mt-10 max-w-2xl">
+            <section class="mt-10 max-w-2xl max-h-96 overflow-y-auto">
                 <ul class="flex flex-col gap-2">
                     @foreach ($following as $followingUser)
                         <li>