LobotomyLabs/classquiz-ai
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

removed scroll bar for large screens and customised it in the why class quiz

Browse Source
This commit is contained in:
Diganta Kr Banik
2022-10-01 01:17:39 +05:30
parent 375317c3c6
commit 20c8911214
2 changed files with 23 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/app.css
+21
View File
@@ -32,3 +32,24 @@
@apply px-4 py-2 leading-5 text-white transition-colors duration-200 transform bg-gray-700 rounded text-center hover:bg-gray-600 focus:outline-none disabled:cursor-not-allowed disabled:opacity-50;
}
}
#why-classquiz::-webkit-scrollbar {
height: 0.8rem;
margin-bottom: 5rem;
}
#why-classquiz::-webkit-scrollbar-track {
box-shadow: inset 0 0 10px 10px transparent;
border: solid 3px transparent;
}
#why-classquiz::-webkit-scrollbar-thumb {
box-shadow: inset 0 0 10px 10px #374151;
border: solid 3px transparent;
border-radius: 15px;
}
#why-classquiz::-webkit-scrollbar-thumb:hover {
box-shadow: inset 0 0 10px 10px #555;
border: solid 3px transparent;
}
frontend/src/routes/+page.svelte
+2 -1
View File
@@ -490,7 +490,8 @@
</div>
</div>
<div
class="lg:border-l lg:border-l-black lg:border-t-0 border-t border-t-black flex lg:flex-col flex-row stretch overflow-x-scroll"
id="why-classquiz"
class="lg:border-l lg:border-l-black lg:border-t-0 border-t border-t-black flex lg:flex-col flex-row stretch overflow-x-auto"
>
{#each classquiz_reasons as reason, index}
<div