caitlin/CRM_ENVR
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Update login page styling and sidebar collapse logo

Browse Source
This commit is contained in:
caitlin
2026-06-26 16:22:28 +02:00
parent 33a4f9dfa9
commit ec8207fca7
7 changed files with 139 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/globals.css
+65 -7
View File
@@ -1,4 +1,5 @@
@import url('https://fonts.googleapis.com/css2?family=Bangers&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@800&display=swap');
@tailwind base;
@tailwind components;
@@ -29,15 +30,16 @@
--border: 214.3 31.8% 91.4%;
--input: 214.3 31.8% 91.4%;
--ring: 221.2 83.2% 53.3%;
--sidebar: 222.2 84% 4.9%;
--sidebar-foreground: 210 40% 98%;
--sidebar-primary: 217.2 91.2% 59.8%;
--sidebar: 216 12% 92%;
--sidebar-foreground: 0 0% 20%;
--sidebar-primary: 0 91.2% 59.8%;
--sidebar-primary-foreground: 0 0% 100%;
--sidebar-accent: 217.2 32.6% 17.5%;
--sidebar-accent-foreground: 210 40% 98%;
--sidebar-border: 217.2 32.6% 17.5%;
--sidebar-ring: 224.3 76.3% 48%;
--sidebar-accent: 218 16% 87%;
--sidebar-accent-foreground: 0 0% 20%;
--sidebar-border: 220 11% 84%;
--sidebar-ring: 0 76.3% 48%;
--radius: 0.5rem;
--theme-primary: hsl(var(--primary));
}
.dark {
@@ -574,6 +576,62 @@
--sidebar-ring: 351 85% 52%;
}
.bc-logo {
font-family: 'Raleway', sans-serif;
font-weight: 800;
font-size: 18px;
letter-spacing: 0.12em;
text-transform: uppercase;
color: hsl(var(--sidebar-foreground));
padding: 8px 16px;
position: relative;
display: inline-block;
}
.bc-logo .accent {
color: var(--theme-primary, #3b91f7);
}
.bc-logo::before {
content: '';
position: absolute;
top: 0;
left: 0;
border-top: 1.5px solid var(--theme-primary, #3b91f7);
border-left: 1.5px solid var(--theme-primary, #3b91f7);
width: 0;
height: 0;
animation: drawTL 3s ease-in-out infinite;
}
.bc-logo::after {
content: '';
position: absolute;
bottom: 0;
right: 0;
border-bottom: 1.5px solid var(--theme-primary, #3b91f7);
border-right: 1.5px solid var(--theme-primary, #3b91f7);
width: 0;
height: 0;
animation: drawBR 3s ease-in-out infinite;
}
@keyframes drawTL {
0%, 5% { width: 0; height: 0; }
30% { width: 100%; height: 0; }
55% { width: 100%; height: 100%; }
85% { width: 100%; height: 100%; }
100% { width: 0; height: 0; }
}
@keyframes drawBR {
0%, 5% { width: 0; height: 0; }
30% { width: 100%; height: 0; }
55% { width: 100%; height: 100%; }
85% { width: 100%; height: 100%; }
100% { width: 0; height: 0; }
}
@layer base {
* {
@apply border-border;