TDvorak/ClubLogos
1
0
Fork 0
mirror of https://github.com/Dvorinka/ClubLogos.git synced 2026-07-29 13:43:49 +00:00
Code Issues Packages Projects Releases Wiki Activity

upload

Browse Source
This commit is contained in:
Tomas Dvorak
2025-12-02 13:52:21 +01:00
parent 025f5beef1
commit b27fe6fe0e
33 changed files with 5164 additions and 1043 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/style.css
+153 -1
View File
@@ -86,7 +86,7 @@ body {
/* Loading spinner */
.spinner {
border: 3px solid rgba(255, 255, 255, 0.1);
border: 3px solid rgba(148, 163, 184, 0.25);
border-radius: 50%;
border-top-color: #3b82f6;
width: 40px;
@@ -97,3 +97,155 @@ body {
@keyframes spin {
to { transform: rotate(360deg); }
}
/* Theme-aware tokens (light first, dark via .dark) */
.bg-dark-bg {
background-color: #f3f4f6;
}
.dark .bg-dark-bg {
background-color: #0a0e1a;
}
.bg-dark-card {
background-color: #ffffff;
}
.dark .bg-dark-card {
background-color: #131823;
}
.bg-dark-border {
background-color: #e5e7eb;
}
.dark .bg-dark-border {
background-color: #1f2937;
}
.border-dark-border {
border-color: #e5e7eb;
}
.dark .border-dark-border {
border-color: #1f2937;
}
body {
background-color: #f9fafb;
}
.dark body {
background-color: #020617;
}
.bg-dark-card .text-white,
.bg-dark-bg .text-white {
color: #020617;
}
.dark .bg-dark-card .text-white,
.dark .bg-dark-bg .text-white {
color: #f9fafb;
}
.nav-link {
font-size: 0.875rem;
font-weight: 500;
border-radius: 9999px;
padding-inline: 0.9rem;
padding-block: 0.5rem;
color: #6b7280;
}
.dark .nav-link {
color: #9ca3af;
}
.nav-link:hover {
background-color: rgba(15, 23, 42, 0.04);
color: #111827;
}
.dark .nav-link:hover {
background-color: rgba(148, 163, 184, 0.12);
color: #e5e7eb;
}
.nav-link--active {
background-color: rgba(59, 130, 246, 0.12);
color: #1d4ed8;
}
.dark .nav-link--active {
background-color: rgba(59, 130, 246, 0.18);
color: #bfdbfe;
}
.logo-card {
position: relative;
overflow: hidden;
}
.logo-card::before {
content: '';
position: absolute;
inset: 0;
border-radius: 0.75rem;
border: 1px solid transparent;
pointer-events: none;
transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}
.logo-card:hover::before {
border-color: rgba(59, 130, 246, 0.4);
box-shadow: 0 18px 45px rgba(15, 23, 42, 0.16);
}
.dark .logo-card:hover::before {
border-color: rgba(59, 130, 246, 0.6);
box-shadow: 0 22px 55px rgba(15, 23, 42, 0.9);
}
.logo-card:hover {
transform: translateY(-2px);
}
.logo-preview-surface {
position: relative;
overflow: hidden;
}
.logo-preview-surface::before {
content: '';
position: absolute;
inset: 0;
background-size: 20px 20px;
background-position: 0 0, 10px 10px;
opacity: 0.4;
}
.logo-preview-light {
background-color: #f9fafb;
}
.logo-preview-light::before {
background-image:
linear-gradient(45deg, #f3f4f6 25%, transparent 25%, transparent 75%, #f3f4f6 75%, #f3f4f6),
linear-gradient(45deg, #e5e7eb 25%, transparent 25%, transparent 75%, #e5e7eb 75%, #e5e7eb);
}
.logo-preview-dark {
background-color: #020617;
}
.logo-preview-dark::before {
background-image:
linear-gradient(45deg, #111827 25%, transparent 25%, transparent 75%, #111827 75%, #111827),
linear-gradient(45deg, #020617 25%, transparent 25%, transparent 75%, #020617 75%, #020617);
}
.logo-preview-inner {
position: relative;
z-index: 1;
}