diff --git a/README.md b/README.md index d233b42..1a64e53 100644 --- a/README.md +++ b/README.md @@ -5,7 +5,7 @@ An ASP.NET Core MVC (.NET 8) website focused on explaining why complex organizat ## Stack - ASP.NET Core MVC + Razor Views - Plain CSS (design tokens + responsive layout) -- Vanilla JavaScript (theme/accent controls + restrained reveal motion) +- Vanilla JavaScript (theme control + restrained reveal motion) ## Sitemap - / @@ -28,7 +28,6 @@ dotnet run ## UI behavior - System color mode is respected by default (`prefers-color-scheme`). - Users can override light/dark mode in the header; preference is saved in `localStorage`. -- Users can switch among curated accent colors; preference is saved in `localStorage`. - Motion is subtle and respects `prefers-reduced-motion`. ## CI/CD diff --git a/Views/Shared/_Footer.cshtml b/Views/Shared/_Footer.cshtml index 4973ada..0c45bed 100644 --- a/Views/Shared/_Footer.cshtml +++ b/Views/Shared/_Footer.cshtml @@ -1,3 +1,3 @@ diff --git a/Views/Shared/_Header.cshtml b/Views/Shared/_Header.cshtml index 4b2d12e..89916a3 100644 --- a/Views/Shared/_Header.cshtml +++ b/Views/Shared/_Header.cshtml @@ -1,6 +1,9 @@ diff --git a/Views/Shared/_Hero.cshtml b/Views/Shared/_Hero.cshtml index 1210314..d6c1cda 100644 --- a/Views/Shared/_Hero.cshtml +++ b/Views/Shared/_Hero.cshtml @@ -1,7 +1,7 @@ @model HomePageViewModel
- +

manpreet singh

diff --git a/Views/Shared/_Layout.cshtml b/Views/Shared/_Layout.cshtml index 11349c9..db86be4 100644 --- a/Views/Shared/_Layout.cshtml +++ b/Views/Shared/_Layout.cshtml @@ -1,5 +1,5 @@ - + diff --git a/wwwroot/css/site.css b/wwwroot/css/site.css index b67c11b..af51eaa 100644 --- a/wwwroot/css/site.css +++ b/wwwroot/css/site.css @@ -5,7 +5,7 @@ --muted: #5b5b5b; --border: #16161633; --accent: #2b2b2b; - --accent-2: #4a4a4a; + --logo-filter: none; --space-1: clamp(0.6rem, 0.55rem + 0.2vw, 0.8rem); --space-2: clamp(1rem, 0.8rem + 0.5vw, 1.4rem); --space-3: clamp(1.8rem, 1.3rem + 1vw, 2.8rem); @@ -20,6 +20,7 @@ --text: #ececec; --muted: #a9a9a9; --border: #ffffff24; + --logo-filter: invert(1) brightness(1.1); } } @@ -29,6 +30,7 @@ html[data-theme='light'] { --text: #111111; --muted: #5b5b5b; --border: #16161633; + --logo-filter: none; } html[data-theme='dark'] { @@ -37,11 +39,9 @@ html[data-theme='dark'] { --text: #ececec; --muted: #a9a9a9; --border: #ffffff24; + --logo-filter: invert(1) brightness(1.1); } -html[data-accent='graphite'] { --accent: #2b2b2b; --accent-2: #4a4a4a; } -html[data-accent='indigo'] { --accent: #3f4fd6; --accent-2: #7a84e2; } -html[data-accent='oxide'] { --accent: #8f4f39; --accent-2: #c47e64; } * { box-sizing: border-box; } html, body { margin: 0; } @@ -93,6 +93,15 @@ body { font-size: 0.72rem; letter-spacing: 0.15em; text-transform: uppercase; + display: inline-flex; + align-items: center; + gap: 0.55rem; +} + +.brand-logo { + width: 1.3rem; + height: 1.3rem; + filter: var(--logo-filter); } .main-nav { @@ -163,18 +172,6 @@ body { padding: 0.35rem 0.5rem; } -.accent-switch { display: inline-flex; gap: 0.38rem; } -.accent-switch button { - width: 0.95rem; - height: 0.95rem; - border-radius: 999px; - border: 1px solid var(--border); - padding: 0; - background: var(--surface); -} -.accent-switch [data-accent-option='graphite'] { background: #3a3a3a; } -.accent-switch [data-accent-option='indigo'] { background: #5664d8; } -.accent-switch [data-accent-option='oxide'] { background: #a35d43; } .site-main { padding: var(--space-4) 0 var(--space-5); } section { padding: var(--space-4) 0; border-bottom: 1px solid var(--border); } @@ -188,10 +185,10 @@ section { padding: var(--space-4) 0; border-bottom: 1px solid var(--border); } } .identity-block { border-top: 1px solid var(--border); padding-top: var(--space-2); } -.ms-mark { - margin: 0; - font-size: clamp(2rem, 1.4rem + 2.4vw, 3.6rem); - letter-spacing: 0.06em; +.hero-logo { + width: clamp(3rem, 2.4rem + 1.7vw, 4.3rem); + height: auto; + filter: var(--logo-filter); } .identity-name { margin: 0.4rem 0 0; @@ -297,6 +294,19 @@ h2 { text-transform: uppercase; } +.site-footer p { + margin: 0; + display: inline-flex; + align-items: center; + gap: 0.45rem; +} + +.footer-logo { + width: 0.95rem; + height: 0.95rem; + filter: var(--logo-filter); +} + .section-reveal { opacity: 0; transform: translateY(12px); diff --git a/wwwroot/img/Logo-Out.svg b/wwwroot/img/Logo-Out.svg new file mode 100644 index 0000000..aa927ff --- /dev/null +++ b/wwwroot/img/Logo-Out.svg @@ -0,0 +1,4 @@ + + + + diff --git a/wwwroot/js/site.js b/wwwroot/js/site.js index 294dd3d..2712394 100644 --- a/wwwroot/js/site.js +++ b/wwwroot/js/site.js @@ -1,7 +1,6 @@ (() => { const root = document.documentElement; const themeKey = 'ms-theme'; - const accentKey = 'ms-accent'; const prefersReducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches; const storedTheme = localStorage.getItem(themeKey); @@ -11,11 +10,6 @@ root.setAttribute('data-theme', 'system'); } - const storedAccent = localStorage.getItem(accentKey); - if (storedAccent) { - root.setAttribute('data-accent', storedAccent); - } - const themeButton = document.querySelector('[data-theme-toggle]'); themeButton?.addEventListener('click', () => { const current = root.getAttribute('data-theme'); @@ -24,15 +18,6 @@ localStorage.setItem(themeKey, next); }); - document.querySelectorAll('[data-accent-option]').forEach((button) => { - button.addEventListener('click', () => { - const accent = button.getAttribute('data-accent-option'); - if (!accent) return; - root.setAttribute('data-accent', accent); - localStorage.setItem(accentKey, accent); - }); - }); - if (prefersReducedMotion) { document.querySelectorAll('.section-reveal').forEach((item) => item.classList.add('is-visible')); return;