fix fonts · atpota.to/flushes.app@e882e0b

+8

app/src/app/globals.css

··· 143 143 box-sizing: border-box; 144 144 margin: 0; 145 145 padding: 0; 146 + font-family: 'decoy', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, 147 + Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif; 146 148 } 147 149 148 150 /* Font definitions */ ··· 203 205 text-decoration: underline; 204 206 } 205 207 208 + button, input, select, textarea { 209 + font-family: 'decoy', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, 210 + Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif; 211 + } 212 + 206 213 button { 207 214 cursor: pointer; 208 215 background-color: var(--primary-color); ··· 211 218 border-radius: 4px; 212 219 padding: 0.5rem 1rem; 213 220 font-size: 1rem; 221 + font-weight: 500; 214 222 transition: background-color 0.2s; 215 223 } 216 224

+5 -6

app/src/components/NavigationBar.module.css

··· 75 75 } 76 76 77 77 .navLink.active { 78 - font-weight: 600; 78 + font-weight: 700; 79 79 color: var(--link-color); 80 80 } 81 81 ··· 83 83 background-color: var(--primary-color); 84 84 color: white; 85 85 border: none; 86 - padding: .3rem .8rem; 86 + padding: 0.5rem 0.8rem; 87 87 border-radius: 0.5rem; 88 88 cursor: pointer; 89 89 font-size: 1rem; ··· 92 92 text-decoration: none; 93 93 display: inline-block; 94 94 white-space: nowrap; 95 + height: 36px; 96 + display: flex; 97 + align-items: center; 95 98 } 96 99 97 100 .authButton:hover { ··· 100 103 101 104 @media (max-width: 600px) { 102 105 .authButton { 103 - padding: 0.4rem 0.75rem; 104 106 font-size: 0.9rem; 105 - height: 36px; 106 - display: flex; 107 - align-items: center; 108 107 } 109 108 } 110 109

+7 -7

app/src/components/NavigationBar.tsx

··· 29 29 </Link> 30 30 31 31 <div className={styles.navLinks}> 32 - <Link href="/" className={`${styles.navLink} ${isActive('/') ? styles.active : ''}`}> 32 + <Link href="/" className={`${styles.navLink} font-medium ${isActive('/') ? styles.active : ''}`}> 33 33 Feed 34 34 </Link> 35 - <Link href="/stats" className={`${styles.navLink} ${isActive('/stats') ? styles.active : ''}`}> 35 + <Link href="/stats" className={`${styles.navLink} font-medium ${isActive('/stats') ? styles.active : ''}`}> 36 36 Stats 37 37 </Link> 38 - <Link href="/shortcut" className={`${styles.navLink} ${isActive('/shortcut') ? styles.active : ''}`}> 38 + <Link href="/shortcut" className={`${styles.navLink} font-medium ${isActive('/shortcut') ? styles.active : ''}`}> 39 39 Shortcut 40 40 </Link> 41 - <Link href="/about" className={`${styles.navLink} ${isActive('/about') ? styles.active : ''}`}> 41 + <Link href="/about" className={`${styles.navLink} font-medium ${isActive('/about') ? styles.active : ''}`}> 42 42 About 43 43 </Link> 44 44 {isAuthenticated && handle && ( 45 45 <Link 46 46 href={`/profile/${handle}`} 47 - className={`${styles.navLink} ${pathname.startsWith('/profile/') ? styles.active : ''}`} 47 + className={`${styles.navLink} font-medium ${pathname.startsWith('/profile/') ? styles.active : ''}`} 48 48 > 49 49 Profile 50 50 </Link> ··· 61 61 <ThemeToggle /> 62 62 63 63 {isAuthenticated ? ( 64 - <button onClick={handleLogout} className={styles.authButton}> 64 + <button onClick={handleLogout} className={`${styles.authButton} font-medium`}> 65 65 Logout 66 66 </button> 67 67 ) : ( 68 - <Link href="/auth/login" className={styles.authButton}> 68 + <Link href="/auth/login" className={`${styles.authButton} font-medium`}> 69 69 Login 70 70 </Link> 71 71 )}

+2 -2

app/src/components/ProfileSearch.tsx

··· 81 81 value={query} 82 82 onChange={(e) => setQuery(e.target.value)} 83 83 placeholder="Search user @handle" 84 - className={styles.searchInput} 84 + className={`${styles.searchInput} font-regular`} 85 85 aria-label="Search for a user profile" 86 86 /> 87 - <button type="submit" className={styles.searchButton}> 87 + <button type="submit" className={`${styles.searchButton} font-medium`}> 88 88 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="18" height="18" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"> 89 89 <circle cx="11" cy="11" r="8"></circle> 90 90 <line x1="21" y1="21" x2="16.65" y2="16.65"></line>

+4 -4

app/src/components/ThemeToggle.tsx

··· 89 89 // During SSR or before mounting, render a placeholder that won't try to use the context 90 90 if (!mounted) { 91 91 return ( 92 - <button className={styles.themeToggle} aria-label="Theme toggle"> 92 + <button className={`${styles.themeToggle} font-medium`} aria-label="Theme toggle"> 93 93 <LightIcon /> 94 - <span className={styles.themeLabel}>Lights On</span> 94 + <span className={`${styles.themeLabel} font-medium`}>Lights On</span> 95 95 </button> 96 96 ); 97 97 } 98 98 99 99 return ( 100 100 <button 101 - className={styles.themeToggle} 101 + className={`${styles.themeToggle} font-medium`} 102 102 onClick={toggleTheme} 103 103 aria-label={`Switch to ${themeState === 'light' ? 'dark' : themeState === 'dark' ? 'system' : 'light'} theme`} 104 104 > 105 105 {getIcon()} 106 - <span className={styles.themeLabel}>{getLabel()}</span> 106 + <span className={`${styles.themeLabel} font-medium`}>{getLabel()}</span> 107 107 </button> 108 108 ); 109 109 }

Configure Feed

Configure Feed