Crowmate/Nest
Archived
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: Update font styles and improve button sizing for better UI consistency

Browse Source
This commit is contained in:
Thibault Pouch
2026-02-18 12:38:18 +01:00
parent 0021787af7
commit c5b4b44bb8
1 changed files with 20 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
nest-front/client/src/index.css
View File

@@ -1,4 +1,4 @@
@import url('https://fonts.googleapis.com/css2?family=VT323&family=Press+Start+2P&family=Courier+Prime:wght@400;700&family=Share+Tech+Mono&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap');
@import "tailwindcss";
/* ── Design Tokens — White Theme ─────────────────── */
@@ -36,8 +36,8 @@
--color-amber: #d97706;
--color-amber-dim: #b45309;
--font-mono: 'Share Tech Mono', 'Courier Prime', monospace;
--font-heading: 'VT323', 'Press Start 2P', monospace;
--font-mono: 'JetBrains Mono', 'Courier New', monospace;
--font-heading: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
/* ── Base ──────────────────────────────────────────────── */
@@ -54,10 +54,13 @@ body {
background-color: var(--color-bg);
color: var(--color-text);
font-family: var(--font-mono);
font-size: 17px;
min-height: 100vh;
overflow-x: hidden;
line-height: 1.6;
line-height: 1.7;
display: block;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
#root {
@@ -73,8 +76,8 @@ body {
/* ── Typography ────────────────────────────────────────── */
h1, h2, h3, h4, h5 {
font-family: var(--font-heading);
letter-spacing: 0.04em;
text-transform: uppercase;
font-weight: 600;
letter-spacing: -0.02em;
margin: 0;
}
@@ -138,17 +141,18 @@ a:hover { color: var(--color-yellow-dim); }
background: var(--color-bg);
border: 2px solid var(--color-yellow);
color: var(--color-yellow);
padding: 0.4rem 1.1rem;
padding: 0.6rem 1.3rem;
text-transform: uppercase;
letter-spacing: 0.08em;
cursor: pointer;
transition: background 0.15s, color 0.15s;
display: inline-flex;
align-items: center;
gap: 0.4rem;
font-size: 0.85rem;
gap: 0.5rem;
font-size: 1rem;
border-radius: 6px;
text-decoration: none;
font-weight: 500;
}
.btn-terminal::before { display: none; }
.btn-terminal:hover {
@@ -181,8 +185,8 @@ a:hover { color: var(--color-yellow-dim); }
border-radius: 6px;
color: var(--color-text);
font-family: var(--font-mono);
font-size: 0.9rem;
padding: 0.4rem 0.7rem;
font-size: 1.05rem;
padding: 0.6rem 0.9rem;
width: 100%;
transition: border-color 0.15s, box-shadow 0.15s;
outline: none;
@@ -203,10 +207,11 @@ a:hover { color: var(--color-yellow-dim); }
/* ── Section label ─────────────────────────────────────── */
.section-label {
font-family: var(--font-mono);
font-size: 0.72rem;
font-size: 0.85rem;
font-weight: 500;
color: var(--color-text-dim);
text-transform: uppercase;
letter-spacing: 0.2em;
letter-spacing: 0.15em;
margin-bottom: 0.5rem;
}
@@ -222,8 +227,8 @@ a:hover { color: var(--color-yellow-dim); }
/* ── Status badges — clean style ──────────────────────── */
.badge {
font-family: var(--font-mono);
font-size: 0.65rem;
padding: 0.1rem 0.45rem;
font-size: 0.75rem;
padding: 0.2rem 0.5rem;
text-transform: uppercase;
letter-spacing: 0.08em;
border-radius: 4px;