chore: style updates
a34502a7
2 file(s) · +58 −13
| 147 | 147 | ||
| 148 | 148 | {/* Toolbar */} |
|
| 149 | 149 | <div |
|
| 150 | + | className="ie-toolbar" |
|
| 150 | 151 | style={{ |
|
| 151 | 152 | display: "flex", |
|
| 152 | 153 | alignItems: "center", |
|
| 154 | 155 | padding: "3px 2px", |
|
| 155 | 156 | backgroundColor: "#ece9d8", |
|
| 156 | 157 | borderBottom: "1px solid #aca899", |
|
| 158 | + | overflow: "hidden", |
|
| 157 | 159 | }} |
|
| 158 | 160 | > |
|
| 159 | 161 | {/* Back button */} |
|
| 292 | 294 | </div> |
|
| 293 | 295 | ||
| 294 | 296 | <div |
|
| 297 | + | className="ie-secondary" |
|
| 295 | 298 | style={{ |
|
| 296 | 299 | width: "1px", |
|
| 297 | 300 | height: "22px", |
|
| 302 | 305 | ||
| 303 | 306 | {/* Mail */} |
|
| 304 | 307 | <div |
|
| 308 | + | className="ie-secondary" |
|
| 305 | 309 | style={{ |
|
| 306 | 310 | display: "flex", |
|
| 307 | 311 | alignItems: "center", |
|
| 319 | 323 | ||
| 320 | 324 | {/* Print */} |
|
| 321 | 325 | <div |
|
| 326 | + | className="ie-secondary" |
|
| 322 | 327 | style={{ |
|
| 323 | 328 | padding: "0 4px", |
|
| 324 | 329 | cursor: "pointer", |
|
| 396 | 401 | </div> |
|
| 397 | 402 | ||
| 398 | 403 | <div className="window-body" style={{ margin: 0, padding: "4px 6px" }}> |
|
| 399 | - | <div |
|
| 400 | - | style={{ |
|
| 401 | - | display: "flex", |
|
| 402 | - | gap: "4px", |
|
| 403 | - | marginBottom: "4px", |
|
| 404 | - | alignItems: "center", |
|
| 405 | - | fontSize: "11px", |
|
| 406 | - | }} |
|
| 407 | - | > |
|
| 408 | - | <span>{documents.length} documents loaded</span> |
|
| 409 | - | </div> |
|
| 410 | - | ||
| 411 | 404 | {loading && <p style={{ textAlign: "center" }}>Searching...</p>} |
|
| 412 | 405 | ||
| 413 | 406 | {error && ( |
|
| 431 | 424 | paddingRight: "5px", |
|
| 432 | 425 | }} |
|
| 433 | 426 | > |
|
| 427 | + | <div |
|
| 428 | + | style={{ |
|
| 429 | + | background: "#ffffff", |
|
| 430 | + | padding: 0, |
|
| 431 | + | margin: 0, |
|
| 432 | + | }} |
|
| 433 | + | > |
|
| 434 | + | <h3 style={{ padding: "1rem", margin: 0 }}> |
|
| 435 | + | Welcome to Docs.surf! 🏄 |
|
| 436 | + | </h3> |
|
| 437 | + | <details |
|
| 438 | + | style={{ |
|
| 439 | + | fontSize: "14px", |
|
| 440 | + | padding: "0 1rem 1rem 1rem", |
|
| 441 | + | }} |
|
| 442 | + | > |
|
| 443 | + | <summary style={{ cursor: "pointer" }}>What is this?</summary> |
|
| 444 | + | <div style={{ paddingTop: "0.5rem", fontSize: "14px" }}> |
|
| 445 | + | <p> |
|
| 446 | + | Docs.surf is a{" "} |
|
| 447 | + | <a |
|
| 448 | + | href="https://standard.site" |
|
| 449 | + | target="_blank" |
|
| 450 | + | rel="noreferrer" |
|
| 451 | + | > |
|
| 452 | + | Standard.site |
|
| 453 | + | </a>{" "} |
|
| 454 | + | aggregator, pulling all valid Publications and Documents |
|
| 455 | + | into a single chronological feed. You can think of it like |
|
| 456 | + | RSS, but there's no manual collection. It's all powered by{" "} |
|
| 457 | + | <a |
|
| 458 | + | href="https://atproto.com" |
|
| 459 | + | target="_blank" |
|
| 460 | + | rel="noreferrer" |
|
| 461 | + | > |
|
| 462 | + | ATProto |
|
| 463 | + | </a> |
|
| 464 | + | , a new protocol to power connections across the web. |
|
| 465 | + | </p> |
|
| 466 | + | </div> |
|
| 467 | + | </details> |
|
| 468 | + | </div> |
|
| 469 | + | ||
| 434 | 470 | {documents.map((doc, index) => ( |
|
| 435 | 471 | <div |
|
| 436 | 472 | key={doc.uri} |
|
| 585 | 621 | </div> |
|
| 586 | 622 | <div className="status-bar"> |
|
| 587 | 623 | <p className="status-bar-field">Done</p> |
|
| 588 | - | <p className="status-bar-field">Internet</p> |
|
| 589 | 624 | </div> |
|
| 590 | 625 | </div> |
|
| 591 | 626 | ); |
|
| 16 | 16 | display: flex; |
|
| 17 | 17 | justify-content: center; |
|
| 18 | 18 | } |
|
| 19 | + | ||
| 20 | + | /* Hide toolbar text labels and secondary icons on mobile */ |
|
| 21 | + | @media (max-width: 600px) { |
|
| 22 | + | .ie-toolbar span { |
|
| 23 | + | display: none !important; |
|
| 24 | + | } |
|
| 25 | + | .ie-toolbar .ie-secondary { |
|
| 26 | + | display: none !important; |
|
| 27 | + | } |
|
| 28 | + | } |