TDvorak/MyClub
1
0
Fork 0
mirror of https://github.com/Dvorinka/MyClubServer.git synced 2026-06-04 18:52:56 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

upload

Browse Source
This commit is contained in:
Tomáš Dvořák
2025-10-16 13:32:05 +02:00
commit 12cba639b9
663 changed files with 168914 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/styles/custom-scrollbar.css
+90
View File
@@ -0,0 +1,90 @@
/* Custom scrollbars based on club colors */
/* Main scrollbar styling */
::-webkit-scrollbar {
width: 12px;
height: 12px;
}
::-webkit-scrollbar-track {
background: var(--bg-soft, #f2f2f2);
border-radius: 10px;
}
::-webkit-scrollbar-thumb {
background: linear-gradient(
135deg,
var(--primary, #2d74da) 0%,
color-mix(in srgb, var(--primary, #2d74da) 85%, var(--secondary, #1a1a1a)) 100%
);
border-radius: 10px;
border: 2px solid var(--bg-soft, #f2f2f2);
transition: all 0.3s ease;
}
::-webkit-scrollbar-thumb:hover {
background: linear-gradient(
135deg,
color-mix(in srgb, var(--primary, #2d74da) 110%, white) 0%,
var(--primary, #2d74da) 100%
);
border-color: color-mix(in srgb, var(--primary, #2d74da) 20%, transparent);
box-shadow: 0 0 10px color-mix(in srgb, var(--primary, #2d74da) 30%, transparent);
}
::-webkit-scrollbar-thumb:active {
background: var(--primary, #2d74da);
}
/* Firefox scrollbar styling */
* {
scrollbar-width: thin;
scrollbar-color: var(--primary, #2d74da) var(--bg-soft, #f2f2f2);
}
/* Dark mode adjustments */
.chakra-ui-dark ::-webkit-scrollbar-track {
background: var(--bg-soft, #1a1f29);
}
.chakra-ui-dark ::-webkit-scrollbar-thumb {
border-color: var(--bg-soft, #1a1f29);
}
.chakra-ui-dark * {
scrollbar-color: var(--primary, #2d74da) var(--bg-soft, #1a1f29);
}
/* Thin scrollbars for specific contexts */
.thin-scrollbar::-webkit-scrollbar {
width: 8px;
height: 8px;
}
.thin-scrollbar::-webkit-scrollbar-thumb {
border-width: 1px;
}
/* Hide scrollbar but keep functionality (for carousels, sliders) */
.hide-scrollbar {
-ms-overflow-style: none; /* IE and Edge */
scrollbar-width: none; /* Firefox */
}
.hide-scrollbar::-webkit-scrollbar {
display: none; /* Chrome, Safari, Opera */
}
/* Accent scrollbar variant */
.accent-scrollbar::-webkit-scrollbar-thumb {
background: linear-gradient(
135deg,
var(--accent, #ffb703) 0%,
color-mix(in srgb, var(--accent, #ffb703) 85%, var(--primary, #2d74da)) 100%
);
}
.accent-scrollbar::-webkit-scrollbar-thumb:hover {
background: var(--accent, #ffb703);
box-shadow: 0 0 10px color-mix(in srgb, var(--accent, #ffb703) 40%, transparent);
}