diff --git a/docs/.vitepress/theme/custom.css b/docs/.vitepress/theme/custom.css index 9006095174..299b93cd42 100644 --- a/docs/.vitepress/theme/custom.css +++ b/docs/.vitepress/theme/custom.css @@ -7,7 +7,7 @@ /* Brand Colors - Modern developer aesthetic */ --vp-c-brand-1: #00d9ff; /* Bright cyan - primary brand */ --vp-c-brand-2: #00b8d9; /* Darker cyan - hover states */ - --vp-c-brand-3: #0097a7; /* Even darker - active states */ + --vp-c-brand-3: #00acc1; /* Even darker - active states */ --vp-c-brand-soft: rgba(0, 217, 255, 0.14); /* Accent Colors - Terminal-inspired green */ @@ -70,21 +70,21 @@ /* Light mode customizations */ :root:not(.dark) { - /* Light mode brand colors - more muted for better readability */ - --vp-c-brand-1: #0097a7; /* Darker cyan for light mode */ - --vp-c-brand-2: #00838f; /* Even darker on hover */ - --vp-c-brand-3: #006064; /* Active state */ - --vp-c-brand-soft: rgba(0, 151, 167, 0.08); + /* Light mode brand colors - brighter for better visibility */ + --vp-c-brand-1: #00acc1; /* Bright cyan for light mode */ + --vp-c-brand-2: #0097a7; /* Slightly darker on hover */ + --vp-c-brand-3: #00838f; /* Active state */ + --vp-c-brand-soft: rgba(0, 172, 193, 0.08); /* Adjusted success colors for light mode */ - --vp-c-success-1: #2e7d32; - --vp-c-success-2: #1b5e20; - --vp-c-success-soft: rgba(46, 125, 50, 0.08); + --vp-c-success-1: #4caf50; + --vp-c-success-2: #388e3c; + --vp-c-success-soft: rgba(76, 175, 80, 0.08); /* Adjusted warning colors */ - --vp-c-warning-1: #ef6c00; - --vp-c-warning-2: #e65100; - --vp-c-warning-soft: rgba(239, 108, 0, 0.08); + --vp-c-warning-1: #ff9800; + --vp-c-warning-2: #f57c00; + --vp-c-warning-soft: rgba(255, 152, 0, 0.08); /* Background colors with better contrast */ --vp-c-bg: #ffffff; @@ -104,7 +104,7 @@ /* Light mode code styling */ --vp-c-code-bg: #f1f3f5; - --vp-c-code-color: #006064; + --vp-c-code-color: #00838f; /* Code blocks in light mode */ --vp-code-block-bg: #f8f9fa; @@ -146,28 +146,31 @@ margin-left: 0.25rem; transition: all 0.3s ease; color: var(--vp-c-text-1); -} - -/* Gradient text on hover only */ -.VPNavBarTitle:hover .title { - background: linear-gradient(120deg, #00d9ff 0%, #52e892 50%, #ff9100 100%); + background-image: linear-gradient( + 120deg, + #00d9ff 0%, + #52e892 50%, + #ff9100 100% + ); background-size: 200% 100%; + background-position: 100% 0; -webkit-background-clip: text; background-clip: text; - -webkit-text-fill-color: transparent; } -/* Light mode hover gradient */ -:root:not(.dark) .VPNavBarTitle:hover .title { - background: linear-gradient(120deg, #0097a7 0%, #2e7d32 50%, #ef6c00 100%); - background-size: 200% 100%; - -webkit-background-clip: text; - background-clip: text; - -webkit-text-fill-color: transparent; +/* Light mode gradient */ +:root:not(.dark) .VPNavBarTitle .title { + background-image: linear-gradient( + 120deg, + #00acc1 0%, + #4caf50 50%, + #ff9800 100% + ); } -/* Add animation on hover */ +/* Gradient text on hover */ .VPNavBarTitle:hover .title { + -webkit-text-fill-color: transparent; animation: shimmer 2s ease-in-out infinite; filter: drop-shadow(0 0 8px rgba(0, 217, 255, 0.3)); } @@ -225,9 +228,9 @@ h1, line-height: 1.2; } -/* Site title specific adjustment */ +/* Site title specific adjustment - font sizing */ .VPNavBarTitle .title { - font-size: 1.3rem; + font-size: 1.3rem !important; letter-spacing: 0.05em; } @@ -237,12 +240,36 @@ h1, } .VPHero .name { - background: linear-gradient(135deg, #00d9ff 0%, #52e892 50%, #ff9100 100%); + background: linear-gradient( + 120deg, + #00d9ff 0%, + #52e892 50%, + #ff9100 100% + ); + background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; font-weight: 900; letter-spacing: -0.02em; + font-size: 5rem !important; + line-height: 1.1 !important; + animation: shimmer 3s ease-in-out infinite; + filter: drop-shadow(0 0 20px rgba(0, 217, 255, 0.3)); +} + +/* Light mode hero gradient */ +:root:not(.dark) .VPHero .name { + background: linear-gradient( + 120deg, + #00acc1 0%, + #4caf50 50%, + #ff9800 100% + ); + background-size: 200% 100%; + -webkit-background-clip: text; + background-clip: text; + -webkit-text-fill-color: transparent; } .VPHero .tagline { @@ -536,9 +563,15 @@ div[class*="language-"] .copy:hover { } /* Responsive improvements */ +@media (max-width: 1024px) { + .VPHero .name { + font-size: 4rem !important; + } +} + @media (max-width: 768px) { .VPHero .name { - font-size: 3rem !important; + font-size: 3.5rem !important; } .VPHero .tagline { diff --git a/docs/public/android-chrome-192x192.png b/docs/public/android-chrome-192x192.png index 5a62092b48..76690968ab 100755 Binary files a/docs/public/android-chrome-192x192.png and b/docs/public/android-chrome-192x192.png differ diff --git a/docs/public/android-chrome-512x512.png b/docs/public/android-chrome-512x512.png index ed95d3c8db..946f703547 100755 Binary files a/docs/public/android-chrome-512x512.png and b/docs/public/android-chrome-512x512.png differ diff --git a/docs/public/apple-touch-icon.png b/docs/public/apple-touch-icon.png index 10fac23687..b760a64b88 100755 Binary files a/docs/public/apple-touch-icon.png and b/docs/public/apple-touch-icon.png differ diff --git a/docs/public/favicon-16x16.png b/docs/public/favicon-16x16.png index bfe60ca6a3..016da93805 100755 Binary files a/docs/public/favicon-16x16.png and b/docs/public/favicon-16x16.png differ diff --git a/docs/public/favicon-32x32.png b/docs/public/favicon-32x32.png index 85139b1646..b169471e2c 100755 Binary files a/docs/public/favicon-32x32.png and b/docs/public/favicon-32x32.png differ diff --git a/docs/public/favicon.ico b/docs/public/favicon.ico index 643b1651ea..927ce8468e 100755 Binary files a/docs/public/favicon.ico and b/docs/public/favicon.ico differ diff --git a/docs/public/site.webmanifest b/docs/public/site.webmanifest index fa99de77db..a509c341e9 100755 --- a/docs/public/site.webmanifest +++ b/docs/public/site.webmanifest @@ -1,7 +1,14 @@ { - "name": "", - "short_name": "", + "name": "mise-en-place", + "short_name": "mise", + "description": "The front-end to your dev env", "icons": [ + { + "src": "/logo.svg", + "sizes": "any", + "type": "image/svg+xml", + "purpose": "any maskable" + }, { "src": "/android-chrome-192x192.png", "sizes": "192x192", @@ -13,7 +20,7 @@ "type": "image/png" } ], - "theme_color": "#ffffff", - "background_color": "#ffffff", + "theme_color": "#1a1a1a", + "background_color": "#1a1a1a", "display": "standalone" }