+6

Components/Header.razor

reviewed

··· 40 40 41 41 <span id="file-counter" class="my-auto" _="@_scriptForIdFileCounter" /> 42 42 </div> 43 43 + <hr/> 44 44 + <div id="message" class="text-center items-center text-3xl flex flex-row gap-3"> 45 45 + <div>🚧</div> 46 46 + <marquee scrollamount="10" class="text-sm">Hello alpha tester! I am testing out a rewrite of this file browser, sorry if anything breaks! If you need anything, please don't hesitate to contact me on Twitter.</marquee> 47 47 + <div>🚧</div> 48 48 + </div> 43 49 </header> 44 50 45 51 @code {

+18

public/style.css

reviewed

··· 32 32 --color-white: #fff; 33 33 --spacing: 0.25rem; 34 34 --container-6xl: 72rem; 35 35 + --text-sm: 0.875rem; 36 36 + --text-sm--line-height: calc(1.25 / 0.875); 37 37 + --text-3xl: 1.875rem; 38 38 + --text-3xl--line-height: calc(2.25 / 1.875); 35 39 --text-4xl: 2.25rem; 36 40 --text-4xl--line-height: calc(2.5 / 2.25); 37 41 --text-6xl: 3.75rem; ··· 253 257 .flex-row { 254 258 flex-direction: row; 255 259 } 260 260 + .items-center { 261 261 + align-items: center; 262 262 + } 256 263 .gap-2 { 257 264 gap: calc(var(--spacing) * 2); 265 265 + } 266 266 + .gap-3 { 267 267 + gap: calc(var(--spacing) * 3); 258 268 } 259 269 .border-black { 260 270 border-color: var(--color-black); ··· 279 289 .font-mono { 280 290 font-family: var(--font-mono); 281 291 } 292 292 + .text-3xl { 293 293 + font-size: var(--text-3xl); 294 294 + line-height: var(--tw-leading, var(--text-3xl--line-height)); 295 295 + } 282 296 .text-4xl { 283 297 font-size: var(--text-4xl); 284 298 line-height: var(--tw-leading, var(--text-4xl--line-height)); ··· 286 300 .text-6xl { 287 301 font-size: var(--text-6xl); 288 302 line-height: var(--tw-leading, var(--text-6xl--line-height)); 303 303 + } 304 304 + .text-sm { 305 305 + font-size: var(--text-sm); 306 306 + line-height: var(--tw-leading, var(--text-sm--line-height)); 289 307 } 290 308 .text-stone-500 { 291 309 color: var(--color-stone-500);