Files
TtrpgPlayerLanding/src/components/layout/Header.module.css
T
Ivan Fontosh b0ab6cc729 Add TTRPG Player marketing landing site.
React/Vite landing with RU/EN i18n, live USD pricing, download links to updates.mailib.ru, and donate.stream checkout.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-06-28 11:58:31 +08:00

75 lines
1.0 KiB
CSS

.header {
position: sticky;
top: 0;
z-index: 100;
height: var(--header-height);
border-bottom: 1px solid var(--color-border);
background: rgba(8, 6, 14, 0.82);
backdrop-filter: blur(12px);
}
.inner {
display: flex;
align-items: center;
justify-content: space-between;
gap: 24px;
max-width: var(--max-width);
height: 100%;
margin: 0 auto;
padding: 0 24px;
}
.brand {
display: flex;
align-items: center;
gap: 10px;
font-size: 17px;
font-weight: 700;
color: var(--color-text);
}
.logo {
border-radius: 10px;
}
.nav {
display: flex;
align-items: center;
gap: 28px;
}
.navLink {
font-size: 14px;
font-weight: 500;
color: var(--color-text-muted);
transition: color 0.15s ease;
}
.navLink:hover {
color: var(--color-text);
}
.actions {
display: flex;
align-items: center;
gap: 10px;
flex-shrink: 0;
}
.actionBtn {
padding: 9px 16px;
font-size: 14px;
}
@media (max-width: 900px) {
.nav {
display: none;
}
}
@media (max-width: 480px) {
.actionBtn:first-child {
display: none;
}
}