feat: Added inline SVG logo mark (cyan arc + dot from favicon) to heade…

- "frontend/src/App.tsx"
- "frontend/src/App.css"

GSD-Task: S03/T02
This commit is contained in:
jlightner 2026-04-03 05:47:05 +00:00
parent 48e1bd163d
commit ee3cbb74f7
2 changed files with 22 additions and 0 deletions

View file

@ -975,6 +975,22 @@ a.app-footer__repo:hover {
.app-header__brand {
text-decoration: none;
color: inherit;
display: flex;
align-items: center;
gap: 0.5rem;
}
.app-header__logo {
display: inline-flex;
align-items: center;
width: 24px;
height: 24px;
flex-shrink: 0;
}
.app-header__logo svg {
width: 100%;
height: 100%;
}
.app-nav {

View file

@ -62,6 +62,12 @@ export default function App() {
<a href="#main-content" className="skip-link">Skip to content</a>
<header className="app-header" ref={headerRef}>
<Link to="/" className="app-header__brand">
<span className="app-header__logo" aria-hidden="true">
<svg viewBox="0 0 32 32" width="24" height="24" fill="none">
<path d="M22 10.5a6.5 6.5 0 0 0-6.5-6.5C11.36 4 8 7.36 8 11.5c0 4.14 3.36 7.5 7.5 7.5" stroke="#22d3ee" strokeWidth="3" strokeLinecap="round"/>
<circle cx="22" cy="22" r="3" fill="#22d3ee" opacity="0.5"/>
</svg>
</span>
<span>Chrysopedia</span>
</Link>
{showNavSearch && (