@masmarino/gabarit 1.2.2 → 1.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md
CHANGED
|
@@ -324,6 +324,29 @@ Other tokens live on `:root` without being colors — border radii
|
|
|
324
324
|
(`--site-border-radius*`), shadows (`--site-shadow-*`), transition
|
|
325
325
|
durations (`--site-transition-*`), the monospace stack `--gbt-font-mono` — overridable the same way.
|
|
326
326
|
|
|
327
|
+
### Theming hooks
|
|
328
|
+
|
|
329
|
+
A few more tokens are not set on `:root`: each component falls back to the
|
|
330
|
+
value in the last column, resolved where it is used, so an app that leaves
|
|
331
|
+
them alone looks the same. Set one to take that part of the look in hand.
|
|
332
|
+
|
|
333
|
+
| Token | Used by | Fallback |
|
|
334
|
+
| ----------------------------------------------- | ------------------------------------------------------------------------- | --------------------------------------- |
|
|
335
|
+
| `--gbt-focus-ring` | Every focus outline | `var(--primary)` |
|
|
336
|
+
| `--gbt-font-display` | Page titles, stat tile values, empty state, auth panel and modal headings | `inherit` |
|
|
337
|
+
| `--gbt-radius-badge` | Badges, card and tab counts | `999px` (a pill) |
|
|
338
|
+
| `--gbt-radius-chip` | Mono badges, inline code in a list row, search bar keys | `6px` |
|
|
339
|
+
| `--gbt-radius-menu` | Select and autocomplete panels, menu items, search results | `8px` |
|
|
340
|
+
| `--gbt-radius-tile` | Icon marker tiles, job graph nodes, avatar group overflow, TOTP QR code | `8px` (`12px` for the QR) |
|
|
341
|
+
| `--gbt-radius-search` | The search bar field | `16px` |
|
|
342
|
+
| `--gbt-nav-active-bg` / `--gbt-nav-active-text` | The current page in the app shell navigation | `--primary` / its text |
|
|
343
|
+
| `--gbt-nav-active-mark` | A 2px rule on the start edge of the current page link | `transparent` |
|
|
344
|
+
| `--gbt-shell-border` | The app shell's navigation and header edges | `var(--border-color)` |
|
|
345
|
+
| `--gbt-shell-header-bg` | The app shell's header | `transparent` |
|
|
346
|
+
| `--gbt-shell-content-padding` | The app shell's main content area | `1rem` |
|
|
347
|
+
| `--gbt-auth-panel-backdrop` | The page behind the auth panels (login, register…) | a soft `--primary` glow on `--bg-panel` |
|
|
348
|
+
| `--gbt-auth-panel-radius` | The auth panel card | `12px` |
|
|
349
|
+
|
|
327
350
|
Overriding a token after the import:
|
|
328
351
|
|
|
329
352
|
```scss
|