@gjsify/adwaita-web 0.40.0 → 0.42.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.
Files changed (113) hide show
  1. package/README.md +98 -3
  2. package/dist/adwaita-web.css +142 -63
  3. package/dist/adwaita-web.css.map +1 -1
  4. package/lib/types/adw-fonts.spec.d.ts +2 -0
  5. package/lib/types/breakpoints.d.ts +10 -1
  6. package/lib/types/connect-lifecycle.spec.d.ts +1 -0
  7. package/lib/types/elements/adw-about-dialog.d.ts +1 -0
  8. package/lib/types/elements/adw-action-row.d.ts +2 -0
  9. package/lib/types/elements/adw-alert-dialog.d.ts +14 -2
  10. package/lib/types/elements/adw-carousel.d.ts +48 -0
  11. package/lib/types/elements/adw-dialog.d.ts +2 -7
  12. package/lib/types/elements/adw-icon.d.ts +17 -1
  13. package/lib/types/elements/adw-navigation-split-view.d.ts +7 -0
  14. package/lib/types/elements/adw-overlay-split-view.d.ts +6 -0
  15. package/lib/types/elements/adw-popover.d.ts +1 -0
  16. package/lib/types/elements/adw-preferences-dialog.d.ts +1 -0
  17. package/lib/types/elements/adw-switch.d.ts +10 -0
  18. package/lib/types/elements/adw-tab-view.d.ts +23 -0
  19. package/lib/types/elements/adw-toggle-group.d.ts +2 -0
  20. package/lib/types/elements/adw-toolbar-view.d.ts +8 -0
  21. package/lib/types/elements/modal-surface.d.ts +59 -0
  22. package/lib/types/elements/roving-focus.d.ts +26 -0
  23. package/lib/types/elements/row-activation.d.ts +26 -0
  24. package/lib/types/empty-sections.d.ts +15 -0
  25. package/lib/types/empty-sections.spec.d.ts +1 -0
  26. package/lib/types/fonts.d.ts +1 -0
  27. package/lib/types/icon-registry.d.ts +35 -0
  28. package/lib/types/icon-registry.spec.d.ts +18 -0
  29. package/lib/types/index.d.ts +3 -1
  30. package/lib/types/keyboard-operable.spec.d.ts +1 -0
  31. package/lib/types/scroll-shading.d.ts +56 -0
  32. package/lib/types/styles.generated.d.ts +1 -1
  33. package/package.json +10 -6
  34. package/scss/_banner.scss +1 -1
  35. package/scss/_carousel.scss +15 -1
  36. package/scss/_checks.scss +8 -8
  37. package/scss/_combo_row.scss +1 -1
  38. package/scss/_drop_down.scss +1 -1
  39. package/scss/_expander_row.scss +1 -1
  40. package/scss/_headerbar.scss +35 -6
  41. package/scss/_icon.scss +47 -0
  42. package/scss/_icons.generated.scss +36 -6
  43. package/scss/_password_entry_row.scss +1 -1
  44. package/scss/_preferences_dialog.scss +3 -2
  45. package/scss/_progress_bar.scss +1 -1
  46. package/scss/_row.scss +1 -1
  47. package/scss/_scrolling.scss +107 -0
  48. package/scss/_status_page.scss +1 -1
  49. package/scss/_style_classes.scss +21 -8
  50. package/scss/_tab_view.scss +1 -1
  51. package/scss/_theme.scss +1 -0
  52. package/scss/_toast.scss +6 -24
  53. package/scss/_toolbar_view.scss +52 -22
  54. package/scss/_variables.scss +30 -3
  55. package/scss/_view_switcher.scss +80 -20
  56. package/scss/adwaita-skin.scss +1 -0
  57. package/src/adw-action-rows.spec.ts +21 -9
  58. package/src/adw-button-content.spec.ts +11 -6
  59. package/src/adw-carousel.spec.ts +141 -1
  60. package/src/adw-fonts.spec.ts +188 -0
  61. package/src/adw-header-bar.spec.ts +92 -0
  62. package/src/adw-icon.spec.ts +17 -8
  63. package/src/adw-row-state.spec.ts +11 -1
  64. package/src/adw-tab-view.spec.ts +151 -0
  65. package/src/bottom-sheet.spec.ts +87 -0
  66. package/src/breakpoints.ts +18 -4
  67. package/src/chrome.spec.ts +233 -0
  68. package/src/connect-lifecycle.spec.ts +351 -0
  69. package/src/elements/adw-about-dialog.ts +24 -18
  70. package/src/elements/adw-action-row.ts +14 -2
  71. package/src/elements/adw-alert-dialog.ts +39 -20
  72. package/src/elements/adw-button-row.ts +3 -0
  73. package/src/elements/adw-carousel.ts +121 -4
  74. package/src/elements/adw-clamp.ts +3 -2
  75. package/src/elements/adw-data-grid.ts +5 -2
  76. package/src/elements/adw-dialog.ts +16 -63
  77. package/src/elements/adw-expander-row.ts +18 -4
  78. package/src/elements/adw-header-bar.ts +2 -0
  79. package/src/elements/adw-icon.ts +32 -6
  80. package/src/elements/adw-inline-view-switcher.ts +12 -0
  81. package/src/elements/adw-menu-button.ts +17 -10
  82. package/src/elements/adw-navigation-split-view.ts +30 -7
  83. package/src/elements/adw-overlay-split-view.ts +15 -3
  84. package/src/elements/adw-popover.ts +11 -0
  85. package/src/elements/adw-preferences-dialog.ts +18 -16
  86. package/src/elements/adw-preferences-group.ts +7 -0
  87. package/src/elements/adw-sidebar.ts +15 -0
  88. package/src/elements/adw-status-page.ts +12 -4
  89. package/src/elements/adw-switch-row.ts +7 -0
  90. package/src/elements/adw-switch.ts +19 -1
  91. package/src/elements/adw-tab-view.ts +70 -7
  92. package/src/elements/adw-toast-overlay.ts +8 -1
  93. package/src/elements/adw-toggle-group.ts +94 -2
  94. package/src/elements/adw-toolbar-view.ts +28 -2
  95. package/src/elements/adw-view-switcher-bar.ts +18 -0
  96. package/src/elements/adw-view-switcher.ts +14 -0
  97. package/src/elements/modal-surface.ts +180 -0
  98. package/src/elements/roving-focus.ts +154 -0
  99. package/src/elements/row-activation.ts +92 -0
  100. package/src/empty-sections.spec.ts +81 -0
  101. package/src/empty-sections.ts +54 -0
  102. package/src/fonts.ts +25 -0
  103. package/src/icon-registry.spec.ts +240 -0
  104. package/src/icon-registry.ts +157 -0
  105. package/src/index.ts +30 -1
  106. package/src/keyboard-operable.spec.ts +755 -0
  107. package/src/scroll-shading.ts +255 -0
  108. package/src/source-view/theme.ts +15 -3
  109. package/src/split-button.spec.ts +6 -2
  110. package/src/style-classes.spec.ts +6 -0
  111. package/src/styles.generated.ts +1 -1
  112. package/src/test.browser.mts +14 -0
  113. package/src/view-switcher.spec.ts +149 -0
package/README.md CHANGED
@@ -17,11 +17,23 @@ yarn add @gjsify/adwaita-web
17
17
  ## Usage
18
18
 
19
19
  ```typescript
20
- // Registers all custom elements, loads Adwaita fonts, and self-applies the
21
- // compiled stylesheet — this one import is all you need.
20
+ // Registers all custom elements and self-applies the compiled stylesheet.
22
21
  import '@gjsify/adwaita-web';
23
22
  ```
24
23
 
24
+ It does **not** register the Adwaita Sans `@font-face`, and that is a size
25
+ decision rather than an omission: the two faces inlined are 2.39 MB / 1.18 MB
26
+ gzip against a 190 KB / 26 KB stylesheet, and `gjsify build --app browser` has no
27
+ code splitting, so a lazy face costs the same bytes as an eager one. The
28
+ stylesheet names the family; on a GNOME host the system install resolves it.
29
+ Where that is not good enough — an app served to arbitrary browsers — opt in:
30
+
31
+ ```typescript
32
+ import { applyAdwaitaFonts } from '@gjsify/adwaita-web/fonts';
33
+
34
+ applyAdwaitaFonts(); // idempotent; injects both faces as `data:` URIs
35
+ ```
36
+
25
37
  > The stylesheet is injected on import, so a separate `import '@gjsify/adwaita-web/style.css'` is not required (and under a bundler with its own CSS pipeline it injects the same rules twice). The compiled CSS is still exported at `@gjsify/adwaita-web/style.css` if you prefer a static `<link>` with no JS injection.
26
38
 
27
39
  ```html
@@ -110,13 +122,96 @@ surface + light/dark `color-scheme` by adding the `adw-root` class to `<body>`
110
122
  `--window-fg-color` + `color-scheme: light dark` to the page and changes nothing
111
123
  about the individual components.
112
124
 
125
+ ## Icons, and the ones the stylesheet does not ship
126
+
127
+ An `<adw-icon icon-name="go-next">` is a CSS mask: the box takes its colour from
128
+ `currentColor` and a generated `.adw-icon--<name>` class supplies the `mask-image`, so the
129
+ glyph re-themes with whatever contains it. The names that resolve are a **chosen subset** of
130
+ [`@gjsify/adwaita-icons`](../adwaita-icons) — a few dozen of them, plus one glyph drawn
131
+ locally — because inlining the whole set as data-URIs costs about 1.07 MB, roughly five
132
+ times the stylesheet it would sit in.
133
+
134
+ A name outside that subset draws **`image-missing`**, the broken-image glyph libadwaita
135
+ itself substitutes when it has no icon to draw. So does a name that could never be a mask
136
+ class at all — a space, a quote, a reverse-DNS application id — because
137
+ `gtk_icon_theme_lookup_icon` has no "found nothing" answer either. It is deliberately
138
+ visible: the icon has not silently disappeared, and nothing throws — an icon is decorative,
139
+ and neither of the other two Adwaita renderers takes an application down over a glyph. Only
140
+ an **absent or empty** name draws nothing, which is the host declining an icon.
141
+
142
+ ### Registering your own
143
+
144
+ ```typescript
145
+ import { registerIcon, isIconAvailable } from '@gjsify/adwaita-web';
146
+ import { dialogErrorSymbolic } from '@gjsify/adwaita-icons/status';
147
+
148
+ if (!isIconAvailable('dialog-error')) {
149
+ registerIcon('dialog-error-symbolic', dialogErrorSymbolic);
150
+ }
151
+ ```
152
+
153
+ ```html
154
+ <adw-icon icon-name="dialog-error"></adw-icon>
155
+ <!-- …or any widget attribute that takes an icon name -->
156
+ <adw-status-page icon="dialog-error" title="Could not connect"></adw-status-page>
157
+ ```
158
+
159
+ `registerIcon(name, svg)` takes the icon's **SVG source** — exactly what
160
+ `@gjsify/adwaita-icons` exports, and equally any symbolic SVG of your own drawn on the 16px
161
+ Adwaita grid with `fill="currentColor"`. It writes the same pair the build writes: a
162
+ `--icon-<name>` custom property on the document element and a `.adw-icon--<name>` mask rule,
163
+ so from then on the name is indistinguishable from a compiled one — in `<adw-icon>`, in a
164
+ widget attribute, in a hand-written `class="adw-icon adw-icon--dialog-error"`, and in your
165
+ own CSS as `var(--icon-dialog-error)`.
166
+
167
+ Notes worth having:
168
+
169
+ - **Register before you mount, where you can.** An icon already in the document shows the
170
+ fallback until the registration lands. The CSS is live, so it corrects itself on the next
171
+ style recalculation with no re-render — but there is a visible frame in between.
172
+ - **`registerIcon` needs a live document.** It writes to `document.documentElement` and
173
+ `document.head`, so calling it at module top level in an SSR/SSG build (an Astro component
174
+ module, for instance) throws a `ReferenceError` before any page renders. Call it from
175
+ client-side code — an `onMount`, a `client:load` boundary, a `DOMContentLoaded` handler.
176
+ - **The name is normalized the same way the attribute is**: one optional `-symbolic` suffix
177
+ comes off, and what is left has to be a single CSS token. `registerIcon` *throws* on a name
178
+ that is not (`org.gnome.Builder`, `a b`), because a call that silently registers nothing is
179
+ the failure this whole area exists to end — and because there is no mask class such a name
180
+ could be given. `<adw-icon>` stays lenient with the same input: the name came from markup,
181
+ so it draws `image-missing` rather than taking the page down.
182
+ - **Re-registering replaces the glyph** rather than adding a second rule, so a runtime theme
183
+ switch can call it as often as it likes.
184
+ - `isIconAvailable(name)` reads the live cascade, not a generated list, so it also answers
185
+ `true` for a glyph you supplied through your own stylesheet's `--icon-<name>`.
186
+
187
+ ### Why this is a web-only concern
188
+
189
+ The three Adwaita renderers resolve an icon name three different ways, and it is worth
190
+ knowing which one you are on:
191
+
192
+ | Renderer | How a name resolves | An unknown name |
193
+ | --- | --- | --- |
194
+ | GTK (`@gjsify/adwaita-app`) | `GtkIconTheme` looks it up in the **system** icon theme at runtime | draws the theme's `image-missing` |
195
+ | NativeScript (`@gjsify/adwaita-nativescript`) | `AdwIcon` is handed the **SVG source**, not a name | cannot happen — a missing icon is a missing import |
196
+ | Web (this package) | a **compile-time** subset, plus `registerIcon` | draws `image-missing` |
197
+
198
+ All three therefore end on ONE glyph for a name they cannot draw. The web reaches it by two
199
+ routes — no mask class for a known-shaped name, or no usable class for a name like
200
+ `org.gnome.Builder` — and a dotted name has no registration path, so that second route is
201
+ where it stays.
202
+
203
+ Only the web renderer has a set that can be missing something at runtime, which is why only
204
+ it needs a registration path. `scripts/check-adwaita-icon-masks.mjs` holds the compiled
205
+ subset against every name this repository's SHIPPING surfaces emit, in both directions, and
206
+ fails on a compiled glyph that did not come from `@gjsify/adwaita-icons`.
207
+
113
208
  ## Source-code editor (`adw-source-view`)
114
209
 
115
210
  An Adwaita-styled source editor — the web twin of GtkSourceView — is available as
116
211
  an **opt-in subpath** so its CodeMirror dependency never bloats the core bundle:
117
212
 
118
213
  ```typescript
119
- import '@gjsify/adwaita-web'; // app chrome (theme variables, fonts)
214
+ import '@gjsify/adwaita-web'; // app chrome (theme variables, components)
120
215
  import '@gjsify/adwaita-web/source-view'; // registers <adw-source-view>
121
216
  ```
122
217
 
@@ -1,6 +1,5 @@
1
1
  @charset "UTF-8";
2
2
  :root {
3
- --icon-edit-paste: url("data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%207%200%20c%20-0.554688%200%20-1%200.445312%20-1%201%20h%20-2%20c%20-1.644531%200%20-3%201.355469%20-3%203%20v%209%20c%200%201.644531%201.355469%203%203%203%20h%208%20c%201.644531%200%203%20-1.355469%203%20-3%20v%20-9%20c%200%20-1.644531%20-1.355469%20-3%20-3%20-3%20h%20-2%20c%200%20-0.554688%20-0.445312%20-1%20-1%20-1%20z%20m%20-3%203%20h%201%20v%201%20c%200%200.554688%200.445312%201%201%201%20h%204%20c%200.554688%200%201%20-0.445312%201%20-1%20v%20-1%20h%201%20c%200.570312%200%201%200.429688%201%201%20v%209%20c%200%200.570312%20-0.429688%201%20-1%201%20h%20-8%20c%20-0.570312%200%20-1%20-0.429688%20-1%20-1%20v%20-9%20c%200%20-0.570312%200.429688%20-1%201%20-1%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E");
4
3
  --icon-go-down: url("data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%201%205%20c%200%20-0.265625%200.105469%20-0.519531%200.292969%20-0.707031%20c%200.390625%20-0.390625%201.023437%20-0.390625%201.414062%200%20l%205.292969%205.292969%20l%205.292969%20-5.292969%20c%200.390625%20-0.390625%201.023437%20-0.390625%201.414062%200%20c%200.1875%200.1875%200.292969%200.441406%200.292969%200.707031%20s%20-0.105469%200.519531%20-0.292969%200.707031%20l%20-6%206%20c%20-0.390625%200.390625%20-1.023437%200.390625%20-1.414062%200%20l%20-6%20-6%20c%20-0.1875%20-0.1875%20-0.292969%20-0.441406%20-0.292969%20-0.707031%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E");
5
4
  --icon-sidebar-show: url("data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cg%20fill%3D'currentColor'%3E%20%3Cpath%20d%3D'm%206%2013%20v%20-10%20h%20-3%20c%20-0.550781%200%20-1%200.449219%20-1%201%20v%208%20c%200%200.550781%200.449219%201%201%201%20z%20m%200%200'%20fill-opacity%3D'0.34902'%2F%3E%20%3Cpath%20d%3D'm%203%201%20c%20-1.644531%200%20-3%201.355469%20-3%203%20v%208%20c%200%201.644531%201.355469%203%203%203%20h%2010%20c%201.644531%200%203%20-1.355469%203%20-3%20v%20-8%20c%200%20-1.644531%20-1.355469%20-3%20-3%20-3%20z%20m%200%202%20h%203%20v%2010%20h%20-3%20c%20-0.570312%200%20-1%20-0.429688%20-1%20-1%20v%20-8%20c%200%20-0.570312%200.429688%20-1%201%20-1%20z%20m%204%200%20h%206%20c%200.570312%200%201%200.429688%201%201%20v%208%20c%200%200.570312%20-0.429688%201%20-1%201%20h%20-6%20z%20m%200%200'%2F%3E%20%3C%2Fg%3E%20%3C%2Fsvg%3E");
6
5
  --icon-go-previous: url("data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%2012%202%20c%200%20-0.265625%20-0.105469%20-0.519531%20-0.292969%20-0.707031%20c%20-0.390625%20-0.390625%20-1.023437%20-0.390625%20-1.414062%200%20l%20-6%206%20c%20-0.1875%200.1875%20-0.292969%200.441406%20-0.292969%200.707031%20s%200.105469%200.519531%200.292969%200.707031%20l%206%206%20c%200.390625%200.390625%201.023437%200.390625%201.414062%200%20c%200.1875%20-0.1875%200.292969%20-0.441406%200.292969%20-0.707031%20s%20-0.105469%20-0.519531%20-0.292969%20-0.707031%20l%20-5.292969%20-5.292969%20l%205.292969%20-5.292969%20c%200.1875%20-0.1875%200.292969%20-0.441406%200.292969%20-0.707031%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E");
@@ -25,9 +24,12 @@
25
24
  --icon-document-save: url("data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%200%20c%20-0.550781%200%20-1%200.449219%20-1%201%20v%208.585938%20l%20-1.292969%20-1.292969%20c%20-0.1875%20-0.1875%20-0.441406%20-0.292969%20-0.707031%20-0.292969%20s%20-0.519531%200.105469%20-0.707031%200.292969%20c%20-0.390625%200.390625%20-0.390625%201.023437%200%201.414062%20l%203%203%20c%200.390625%200.390625%201.023437%200.390625%201.414062%200%20l%203%20-3%20c%200.390625%20-0.390625%200.390625%20-1.023437%200%20-1.414062%20s%20-1.023437%20-0.390625%20-1.414062%200%20l%20-1.292969%201.292969%20v%20-8.585938%20c%200%20-0.550781%20-0.449219%20-1%20-1%20-1%20z%20m%20-7%2014%20v%202%20h%2014%20v%20-2%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E");
26
25
  --icon-mail-send: url("data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%200%20c%20-0.257812%200%20-0.511719%200.0976562%20-0.707031%200.292969%20l%20-1.25%201.25%20l%20-1.761719%201.730469%20c%20-0.191406%200.199218%20-0.28125%200.441406%20-0.28125%200.75%20c%200%200.976562%201%201%201%201%20c%200.257812%200%200.527344%20-0.128907%200.71875%20-0.3125%20l%201.28125%20-1.28125%20v%203.570312%20s%200%201%201%201%20s%201%20-1%201%20-1%20v%20-3.570312%20l%201.28125%201.28125%20c%200.191406%200.183593%200.410156%200.3125%200.71875%200.3125%20c%200%200%201%20-0.023438%201%20-1%20c%200%20-0.308594%20-0.089844%20-0.550782%20-0.28125%20-0.75%20l%20-1.761719%20-1.730469%20l%20-1.25%20-1.25%20c%20-0.195312%20-0.1953128%20-0.449219%20-0.292969%20-0.707031%20-0.292969%20z%20m%20-5%209%20c%20-1.644531%200%20-3%201.355469%20-3%203%20v%204%20h%202%20v%20-3.800781%20l%204.613281%203.078125%20c%200.835938%200.558594%201.9375%200.558594%202.773438%200%20l%204.613281%20-3.078125%20v%203.800781%20h%202%20v%20-4%20c%200%20-1.644531%20-1.355469%20-3%20-3%20-3%20z%20m%200.800781%202%20h%208.398438%20l%20-3.921875%202.613281%20c%20-0.171875%200.113281%20-0.382813%200.113281%20-0.554688%200%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E");
27
26
  --icon-mail-reply-sender: url("data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%205%202%20c%20-0.265625%200%20-0.519531%200.105469%20-0.707031%200.292969%20l%20-4%204%20c%20-0.3906252%200.390625%20-0.3906252%201.023437%200%201.414062%20l%204%204%20c%200.390625%200.390625%201.023437%200.390625%201.414062%200%20s%200.390625%20-1.023437%200%20-1.414062%20l%20-2.292969%20-2.292969%20h%208.585938%20c%201.117188%200%202%200.882812%202%202%20v%203%20c%200%200.550781%200.449219%201%201%201%20s%201%20-0.449219%201%20-1%20v%20-3%20c%200%20-0.023438%200%20-0.046875%20-0.003906%20-0.070312%20c%20-0.035156%20-2.164063%20-1.820313%20-3.929688%20-3.996094%20-3.929688%20h%20-8.585938%20l%202.292969%20-2.292969%20c%200.390625%20-0.390625%200.390625%20-1.023437%200%20-1.414062%20c%20-0.1875%20-0.1875%20-0.441406%20-0.292969%20-0.707031%20-0.292969%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E");
27
+ --icon-folder-documents: url("data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%204.96875%201.003906%20c%20-1.644531%200%20-3%201.355469%20-3%203%20v%209%20c%200%201.644532%201.355469%203%203%203%20h%206%20c%201.644531%200%203%20-1.355468%203%20-3%20v%20-7.5%20c%200%20-0.265625%20-0.105469%20-0.519531%20-0.292969%20-0.707031%20l%20-3.5%20-3.5%20c%20-0.1875%20-0.1875%20-0.441406%20-0.292969%20-0.707031%20-0.292969%20z%20m%200%202%20h%204%20v%201.5%20c%200%201%200.5%201.5%201.5%201.5%20h%201.5%20v%207%20c%200%200.570313%20-0.429688%201%20-1%201%20h%20-6%20c%20-0.570312%200%20-1%20-0.429687%20-1%20-1%20v%20-9%20c%200%20-0.570312%200.429688%20-1%201%20-1%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E");
28
28
  --icon-folder-download: url("data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%207.984375%200%20c%20-0.550781%200%20-1%200.449219%20-1%201%20v%208.585938%20l%20-2.292969%20-2.292969%20c%20-0.1875%20-0.1875%20-0.441406%20-0.292969%20-0.707031%20-0.292969%20s%20-0.519531%200.105469%20-0.707031%200.292969%20c%20-0.390625%200.390625%20-0.390625%201.023437%200%201.414062%20l%204%204%20c%200.390625%200.390625%201.023437%200.390625%201.414062%200%20l%204%20-4%20c%200.390625%20-0.390625%200.390625%20-1.023437%200%20-1.414062%20s%20-1.023437%20-0.390625%20-1.414062%200%20l%20-2.292969%202.292969%20v%20-8.585938%20c%200%20-0.550781%20-0.449219%20-1%20-1%20-1%20z%20m%20-6%2014%20v%202%20h%2012%20v%20-2%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E");
29
29
  --icon-view-grid: url("data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%202%201%20c%20-0.554688%200%20-1%200.445312%20-1%201%20v%204%20c%200%200.554688%200.445312%201%201%201%20h%204%20c%200.554688%200%201%20-0.445312%201%20-1%20v%20-4%20c%200%20-0.554688%20-0.445312%20-1%20-1%20-1%20z%20m%208%200%20c%20-0.554688%200%20-1%200.445312%20-1%201%20v%204%20c%200%200.554688%200.445312%201%201%201%20h%204%20c%200.554688%200%201%20-0.445312%201%20-1%20v%20-4%20c%200%20-0.554688%20-0.445312%20-1%20-1%20-1%20z%20m%20-8%208%20c%20-0.554688%200%20-1%200.445312%20-1%201%20v%204%20c%200%200.554688%200.445312%201%201%201%20h%204%20c%200.554688%200%201%20-0.445312%201%20-1%20v%20-4%20c%200%20-0.554688%20-0.445312%20-1%20-1%20-1%20z%20m%208%200%20c%20-0.554688%200%20-1%200.445312%20-1%201%20v%204%20c%200%200.554688%200.445312%201%201%201%20h%204%20c%200.554688%200%201%20-0.445312%201%20-1%20v%20-4%20c%200%20-0.554688%20-0.445312%20-1%20-1%20-1%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E");
30
30
  --icon-view-list: url("data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%202%201%20c%20-0.554688%200%20-1%200.445312%20-1%201%20v%202%20c%200%200.554688%200.445312%201%201%201%20h%202%20c%200.554688%200%201%20-0.445312%201%20-1%20v%20-2%20c%200%20-0.554688%20-0.445312%20-1%20-1%20-1%20z%20m%205%201%20v%202%20h%208%20v%20-2%20z%20m%20-5%204.015625%20c%20-0.554688%200%20-1%200.445313%20-1%201%20v%201.980469%20c%200%200.550781%200.445312%201%201%201%20h%202%20c%200.554688%200%201%20-0.449219%201%20-1%20v%20-1.980469%20c%200%20-0.554687%20-0.445312%20-1%20-1%20-1%20z%20m%205%200.984375%20v%202%20h%208%20v%20-2%20z%20m%20-5%204%20c%20-0.554688%200%20-1%200.445312%20-1%201%20v%201.980469%20c%200%200.550781%200.445312%201%201%201%20h%202%20c%200.554688%200%201%20-0.449219%201%20-1%20v%20-1.980469%20c%200%20-0.554688%20-0.445312%20-1%20-1%20-1%20z%20m%205%200.984375%20v%202%20h%208%20v%20-2%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E");
31
+ --icon-view-more: url("data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%207.996094%200%20c%20-1.105469%200%20-2%200.894531%20-2%202%20s%200.894531%202%202%202%20c%201.101562%200%202%20-0.894531%202%20-2%20s%20-0.898438%20-2%20-2%20-2%20z%20m%200%206%20c%20-1.105469%200%20-2%200.894531%20-2%202%20s%200.894531%202%202%202%20c%201.101562%200%202%20-0.894531%202%20-2%20s%20-0.898438%20-2%20-2%20-2%20z%20m%200%206%20c%20-1.105469%200%20-2%200.894531%20-2%202%20s%200.894531%202%202%202%20c%201.101562%200%202%20-0.894531%202%20-2%20s%20-0.898438%20-2%20-2%20-2%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E");
32
+ --icon-view-paged: url("data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cg%20fill%3D'currentColor'%3E%20%3Cpath%20d%3D'm%209%205.5%20v%20-1%20c%200%20-0.277344%20-0.222656%20-0.5%20-0.5%20-0.5%20h%20-3%20c%20-0.277344%200%20-0.5%200.222656%20-0.5%200.5%20v%201%20c%200%200.277344%200.222656%200.5%200.5%200.5%20h%203%20c%200.277344%200%200.5%20-0.222656%200.5%20-0.5%20z%20m%200%200'%20fill-opacity%3D'0.34902'%2F%3E%20%3Cpath%20d%3D'm%204%200%20c%20-1.644531%200%20-3%201.355469%20-3%203%20v%207%20c%200%201.644531%201.355469%203%203%203%20h%206%20c%201.644531%200%203%20-1.355469%203%20-3%20v%20-7%20c%200%20-1.644531%20-1.355469%20-3%20-3%20-3%20z%20m%200%202%20h%206%20c%200.570312%200%201%200.429688%201%201%20v%207%20c%200%200.570312%20-0.429688%201%20-1%201%20h%20-6%20c%20-0.570312%200%20-1%20-0.429688%20-1%20-1%20v%20-7%20c%200%20-0.570312%200.429688%20-1%201%20-1%20z%20m%2011%202%20c%20-0.550781%200%20-1%200.449219%20-1%201%20v%208%20c%200%200.550781%20-0.449219%201%20-1%201%20h%20-7%20c%20-0.550781%200%20-1%200.449219%20-1%201%20s%200.449219%201%201%201%20h%207%20c%201.65625%200%203%20-1.34375%203%20-3%20v%20-8%20c%200%20-0.550781%20-0.449219%20-1%20-1%20-1%20z%20m%200%200'%2F%3E%20%3Cpath%20d%3D'm%209%208.5%20v%20-1%20c%200%20-0.277344%20-0.222656%20-0.5%20-0.5%20-0.5%20h%20-3%20c%20-0.277344%200%20-0.5%200.222656%20-0.5%200.5%20v%201%20c%200%200.277344%200.222656%200.5%200.5%200.5%20h%203%20c%200.277344%200%200.5%20-0.222656%200.5%20-0.5%20z%20m%200%200'%20fill-opacity%3D'0.34902'%2F%3E%20%3C%2Fg%3E%20%3C%2Fsvg%3E");
31
33
  --icon-view-columns: url("data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%202%201%20c%20-0.554688%200%20-1%200.445312%20-1%201%20v%2012%20c%200%200.554688%200.445312%201%201%201%20h%202%20c%200.554688%200%201%20-0.445312%201%20-1%20v%20-12%20c%200%20-0.554688%20-0.445312%20-1%20-1%20-1%20z%20m%205%200%20c%20-0.554688%200%20-1%200.445312%20-1%201%20v%2012%20c%200%200.554688%200.445312%201%201%201%20h%202%20c%200.554688%200%201%20-0.445312%201%20-1%20v%20-12%20c%200%20-0.554688%20-0.445312%20-1%20-1%20-1%20z%20m%205%200%20c%20-0.554688%200%20-1%200.445312%20-1%201%20v%2012%20c%200%200.554688%200.445312%201%201%201%20h%202%20c%200.554688%200%201%20-0.445312%201%20-1%20v%20-12%20c%200%20-0.554688%20-0.445312%20-1%20-1%20-1%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E");
32
34
  --icon-list-remove: url("data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%201%207%20h%2014%20v%202%20h%20-14%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E");
33
35
  --icon-send-to: url("data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%200%20c%20-0.257812%200%20-0.511719%200.0976562%20-0.707031%200.292969%20l%20-1.246094%201.25%20l%20-1.765625%201.730469%20c%20-0.191406%200.199218%20-0.28125%200.441406%20-0.28125%200.75%20c%200%200.976562%201%201%201%201%20c%200.257812%200%200.527344%20-0.128907%200.71875%20-0.3125%20l%201.28125%20-1.28125%20v%207.570312%20s%200%201%201%201%20s%201%20-1%201%20-1%20v%20-7.570312%20l%201.28125%201.28125%20c%200.191406%200.183593%200.410156%200.3125%200.71875%200.3125%20c%200%200%201%20-0.023438%201%20-1%20c%200%20-0.308594%20-0.089844%20-0.550782%20-0.28125%20-0.75%20l%20-1.765625%20-1.730469%20l%20-1.246094%20-1.25%20c%20-0.195312%20-0.1953128%20-0.449219%20-0.292969%20-0.707031%20-0.292969%20z%20m%20-3.96875%206.964844%20c%20-1.660156%20-0.027344%20-3.03125%201.371094%20-3.03125%203.035156%20v%202.972656%20c%200%201.664063%201.371094%203.035156%203.03125%203.035156%20h%207.9375%20c%201.664062%200%203.03125%20-1.371093%203.03125%20-3.035156%20v%20-2.972656%20c%200%20-1.664062%20-1.367188%20-3.0625%20-3.03125%20-3.035156%20l%20-1.96875%200.035156%20v%202%20l%201.96875%20-0.035156%20c%200.589844%20-0.007813%201.03125%200.445312%201.03125%201.035156%20v%202.972656%20c%200%200.589844%20-0.441406%201.035156%20-1.03125%201.035156%20h%20-7.9375%20c%20-0.585938%200%20-1.03125%20-0.445312%20-1.03125%20-1.035156%20v%20-2.972656%20c%200%20-0.589844%200.445312%20-1.042969%201.03125%20-1.035156%20l%201.96875%200.035156%20v%20-2%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E");
@@ -36,14 +38,12 @@
36
38
  --icon-emblem-system: url("data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%200%20c%20-0.550781%200%20-1%200.449219%20-1%201%20v%200.238281%20c%200%200.464844%20-0.378906%200.902344%20-0.820312%201.046875%20c%20-0.023438%200.007813%20-0.042969%200.011719%20-0.0625%200.019532%20c%20-0.445313%200.148437%20-1.007813%200.015624%20-1.28125%20-0.359376%20l%20-0.140626%20-0.195312%20c%20-0.15625%20-0.214844%20-0.390624%20-0.359375%20-0.652343%20-0.398438%20c%20-0.261719%20-0.042968%20-0.53125%200.019532%20-0.742188%200.175782%20c%20-0.449219%200.324218%20-0.550781%200.949218%20-0.222656%201.398437%20l%200.140625%200.199219%20c%200.277344%200.375%200.226562%200.953125%20-0.050781%201.328125%20c%20-0.011719%200.015625%20-0.023438%200.035156%20-0.035157%200.050781%20c%20-0.273437%200.378906%20-0.804687%200.601563%20-1.25%200.457032%20l%20-0.230468%20-0.074219%20c%20-0.523438%20-0.171875%20-1.089844%200.117187%20-1.257813%200.640625%20c%20-0.171875%200.527344%200.113281%201.089844%200.640625%201.261718%20l%200.222656%200.074219%20c%200.445313%200.144531%200.738282%200.636719%200.75%201.101563%20v%200.070312%20c%200.015626%200.464844%20-0.304687%200.960938%20-0.746093%201.105469%20l%20-0.226563%200.070313%20c%20-0.527344%200.171874%20-0.8125%200.738281%20-0.640625%201.261718%20c%200.167969%200.523438%200.734375%200.8125%201.257813%200.640625%20l%200.230468%20-0.074219%20c%200.445313%20-0.144531%200.976563%200.078126%201.25%200.457032%20c%200.011719%200.015625%200.027344%200.035156%200.039063%200.050781%20c%200.277344%200.375%200.324219%200.953125%200.050781%201.328125%20l%20-0.144531%200.203125%20c%20-0.324219%200.445313%20-0.226563%201.070313%200.222656%201.394531%20c%200.445313%200.324219%201.070313%200.226563%201.394531%20-0.21875%20l%200.144532%20-0.199218%20c%200.273437%20-0.378907%200.835937%20-0.507813%201.277344%20-0.359376%20c%200.019531%200.007813%200.042968%200.011719%200.0625%200.019532%20c%200.445312%200.140625%200.820312%200.578125%200.820312%201.046875%20v%200.238281%20c%200%200.550781%200.449219%201%201%201%20s%201%20-0.449219%201%20-1%20v%20-0.238281%20c%200%20-0.46875%200.378906%20-0.90625%200.820312%20-1.046875%20c%200.023438%20-0.007813%200.042969%20-0.015625%200.066407%20-0.023438%20c%200.441406%20-0.144531%201.003906%20-0.015625%201.277343%200.363282%20l%200.144532%200.199218%20c%200.324218%200.445313%200.949218%200.542969%201.394531%200.21875%20c%200.445313%20-0.324218%200.546875%20-0.949218%200.222656%20-1.394531%20l%20-0.148437%20-0.203125%20c%20-0.273438%20-0.375%20-0.226563%20-0.953125%200.050781%20-1.328125%20c%200.015625%20-0.015625%200.027344%20-0.035156%200.039063%20-0.050781%20c%200.273437%20-0.378906%200.804687%20-0.601563%201.25%20-0.457032%20l%200.234374%200.078126%20c%200.523438%200.167968%201.085938%20-0.121094%201.257813%20-0.644532%20c%200.171875%20-0.523437%20-0.117187%20-1.089844%20-0.640625%20-1.257812%20l%20-0.230469%20-0.074219%20c%20-0.445312%20-0.144531%20-0.734375%20-0.640625%20-0.746093%20-1.105469%20c%200%20-0.023437%200%20-0.046875%200%20-0.070312%20c%20-0.015626%20-0.464844%200.300781%20-0.957032%200.746093%20-1.101563%20l%200.230469%20-0.074219%20c%200.523438%20-0.171874%200.8125%20-0.734374%200.640625%20-1.261718%20c%20-0.171875%20-0.523438%20-0.734375%20-0.8125%20-1.257813%20-0.640625%20l%20-0.230468%200.074219%20c%20-0.445313%200.144531%20-0.980469%20-0.078126%20-1.253906%20-0.457032%20c%20-0.011719%20-0.015625%20-0.023438%20-0.035156%20-0.035157%20-0.050781%20c%20-0.277343%20-0.375%20-0.324219%20-0.953125%20-0.050781%20-1.328125%20l%200.144531%20-0.199219%20c%200.324219%20-0.445312%200.226563%20-1.074219%20-0.222656%20-1.398437%20c%20-0.214844%20-0.15625%20-0.480469%20-0.21875%20-0.742187%20-0.179688%20c%20-0.265626%200.042969%20-0.5%200.1875%20-0.652344%200.402344%20l%20-0.144532%200.195312%20c%20-0.273437%200.378907%20-0.835937%200.507813%20-1.28125%200.363282%20c%20-0.019531%20-0.007813%20-0.039062%20-0.015625%20-0.0625%20-0.023438%20c%20-0.441406%20-0.140625%20-0.820312%20-0.578125%20-0.820312%20-1.046875%20v%20-0.238281%20c%200%20-0.550781%20-0.449219%20-1%20-1%20-1%20z%20m%200%204%20c%200.871094%200%201.675781%200.273438%202.332031%200.742188%20c%200.003907%200.007812%200.011719%200.015624%200.019531%200.023437%20c%200.011719%200.003906%200.019532%200.007813%200.03125%200.015625%20c%200.660157%200.484375%201.160157%201.171875%201.421876%201.976562%20v%200.007813%20s%200.003906%200.003906%200.003906%200.007813%20c%200.292968%200.851562%200.15625%201.65625%200%202.457031%20c%200%200%20-0.003906%200.003906%20-0.003906%200.007812%20v%200.003907%20c%20-0.261719%200.800781%20-0.757813%201.488281%20-1.414063%201.976562%20c%20-0.015625%200.003906%20-0.027344%200.011719%20-0.039063%200.019531%20c%20-0.007812%200.003907%20-0.015624%200.011719%20-0.019531%200.019531%20c%20-0.65625%200.46875%20-1.460937%200.742188%20-2.332031%200.742188%20c%20-0.855469%200%20-1.644531%20-0.265625%20-2.289062%20-0.714844%20c%20-0.019532%20-0.015625%20-0.042969%20-0.035156%20-0.0625%20-0.046875%20c%20-0.011719%20-0.007812%20-0.023438%20-0.015625%20-0.035157%20-0.019531%20c%20-0.652343%20-0.484375%20-1.148437%20-1.160156%20-1.40625%20-1.945312%20c%20-0.003906%20-0.015626%20-0.007812%20-0.023438%20-0.011719%20-0.035157%20c%20-0.003906%20-0.007812%20-0.007812%20-0.015625%20-0.011718%20-0.019531%20c%20-0.285156%20-0.847656%20-0.148438%20-1.644531%200%20-2.4375%20c%200.003906%20-0.007812%200.007812%20-0.011719%200.011718%20-0.019531%20c%200.003907%20-0.011719%200.007813%20-0.023438%200.011719%20-0.039063%20c%200.261719%20-0.785156%200.757813%20-1.460937%201.414063%20-1.945312%20c%200.007812%20-0.003906%200.019531%20-0.007813%200.027344%20-0.015625%20c%200.019531%20-0.011719%200.042968%20-0.03125%200.058593%20-0.046875%20c%200.648438%20-0.449219%201.4375%20-0.714844%202.292969%20-0.714844%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E");
37
39
  --icon-preferences-system: url("data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%2013.855469%200%20l%20-1.539063%201.4375%20c%20-0.453125%200.421875%20-0.53125%201.148438%20-0.269531%201.707031%20l%20-5.886719%205.996094%20c%20-0.011718%200%20-0.019531%200%20-0.03125%200%20c%20-0.257812%20-0.128906%20-0.550781%20-0.183594%20-0.839844%20-0.148437%20c%20-0.328124%200.046874%20-0.632812%200.199218%20-0.867187%200.441406%20l%20-3.945313%203.996094%20c%20-0.3906245%200.375%20-0.5468745%200.933593%20-0.4062495%201.457031%20c%200.1406255%200.523437%200.5546875%200.929687%201.0820315%201.058593%20c%200.527344%200.132813%201.082031%20-0.03125%201.453125%20-0.425781%20l%203.945312%20-3.996093%20c%200.472657%20-0.453126%200.59375%20-1.15625%200.296875%20-1.738282%20l%205.890625%20-5.964844%20c%200.558594%200.25%201.273438%200.148438%201.707031%20-0.289062%20l%201.414063%20-1.5625%20z%20m%20-10.308594%200.0898438%20c%20-0.398437%200%20-0.785156%200.0937502%20-1.140625%200.2187502%20l%201.882812%201.878906%20c%200.390626%200.382812%200.390626%201%200%201.386719%20l%20-0.710937%200.707031%20c%20-0.386719%200.386719%20-1%200.386719%20-1.390625%200%20l%20-1.882812%20-1.878906%20c%20-0.125%200.355468%20-0.2187505%200.742187%20-0.2187505%201.140625%20c%200%201.90625%201.5507815%203.453125%203.4609375%203.453125%20c%200.402344%200%200.789063%20-0.09375%201.144531%20-0.21875%20l%201.175782%201.171875%20h%200.058593%20l%202.070313%20-2.0625%20l%20-1.203125%20-1.203125%20c%200.125%20-0.359375%200.214843%20-0.742188%200.214843%20-1.140625%20c%200%20-1.90625%20-1.546874%20-3.4531252%20-3.460937%20-3.4531252%20z%20m%206.550781%207.8906252%20l%20-2.070312%202.066406%20c%200.011718%200.027344%200.023437%200.058594%200.03125%200.089844%20l%201.144531%201.140625%20c%20-0.125%200.355468%20-0.21875%200.742187%20-0.21875%201.140625%20c%200%201.902343%201.550781%203.449219%203.460937%203.449219%20c%200.433594%200%200.855469%20-0.101563%201.238282%20-0.246094%20l%20-2.007813%20-2%20c%20-0.386719%20-0.386719%20-0.386719%20-1.035156%200%20-1.417969%20l%200.679688%20-0.679687%20c%200.195312%20-0.191407%200.457031%20-0.308594%200.710937%20-0.308594%20s%200.515625%200.117187%200.710938%200.308594%20l%201.945312%201.941406%20c%200.105469%20-0.328125%200.183594%20-0.683594%200.183594%20-1.046875%20c%200%20-1.90625%20-1.546875%20-3.453125%20-3.460938%20-3.453125%20c%20-0.398437%200%20-0.785156%200.09375%20-1.140624%200.21875%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E");
38
40
  --icon-application-x-executable: url("data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208.015625%200.015625%20c%20-0.769531%200%20-1.539063%200.292969%20-2.121094%200.875%20l%20-5.003906%205.003906%20c%20-1.164063%201.164063%20-1.164063%203.078125%200%204.242188%20l%205.003906%205.003906%20c%201.164063%201.164063%203.078125%201.164063%204.242188%200%20l%205.007812%20-5.003906%20c%201.164063%20-1.164063%201.164063%20-3.078125%200%20-4.242188%20l%20-5.007812%20-5.003906%20c%20-0.582031%20-0.582031%20-1.351563%20-0.875%20-2.121094%20-0.875%20z%20m%200.101563%201.988281%20c%200.210937%200.023438%200.414062%200.117188%200.585937%200.28125%20l%20-0.339844%200.113282%20c%20-0.074219%20-0.136719%20-0.15625%20-0.269532%20-0.246093%20-0.394532%20z%20m%20-1.570313%201.058594%20c%200.300781%200.421875%200.464844%200.929688%200.46875%201.453125%20c%200%201.378906%20-1.121094%202.5%20-2.5%202.5%20c%20-0.523437%20-0.003906%20-1.03125%20-0.171875%20-1.449219%20-0.472656%20z%20m%203.441406%200.503906%20l%203.742188%203.742188%20c%200.402343%200.402344%200.402343%201.011718%200%201.414062%20l%20-0.253907%200.25%20c%20-0.039062%20-0.046875%20-0.074218%20-0.09375%20-0.117187%20-0.140625%20l%200.621094%20-0.855469%20l%20-0.808594%20-0.585937%20l%20-0.621094%200.851563%20c%20-0.167969%20-0.078126%20-0.347656%20-0.136719%20-0.535156%20-0.175782%20v%20-1.050781%20h%20-1%20v%201.050781%20c%20-0.183594%200.039063%20-0.363281%200.097656%20-0.53125%200.175782%20l%20-0.621094%20-0.851563%20l%20-0.804687%200.585937%20l%200.617187%200.855469%20c%20-0.125%200.136719%20-0.238281%200.289063%20-0.332031%200.453125%20l%20-1%20-0.324218%20l%20-0.308594%200.949218%20l%201%200.324219%20c%20-0.011718%200.09375%20-0.019531%200.1875%20-0.019531%200.28125%20s%200.007813%200.1875%200.019531%200.28125%20l%20-1%200.324219%20l%200.308594%200.949218%20l%201%20-0.324218%20c%200.09375%200.164062%200.207031%200.316406%200.332031%200.453125%20l%20-0.617187%200.855469%20l%200.195312%200.140624%20l%20-0.53125%200.53125%20c%20-0.402344%200.40625%20-1.011718%200.40625%20-1.414062%200%20l%20-4.902344%20-4.902343%20l%200.027344%20-0.039063%20l%200.210937%20-0.289062%20c%200.328125%200.152344%200.679688%200.269531%201.046875%200.339844%20v%201.179687%20h%201.648438%20v%20-1.179687%20c%200.363281%20-0.070313%200.714844%20-0.1875%201.046875%20-0.339844%20l%200.207031%200.289062%20l%200.484375%200.667969%20l%201.335937%20-0.972656%20l%20-0.484374%20-0.667969%20l%20-0.210938%20-0.289062%20c%200.25%20-0.269532%200.46875%20-0.566407%200.648438%20-0.890626%20l%200.339843%200.113282%20l%200.785157%200.253906%20l%200.507812%20-1.566406%20l%20-0.785156%20-0.257813%20l%20-0.335938%20-0.109375%20c%200.019532%20-0.179687%200.035156%20-0.363281%200.035156%20-0.550781%20s%20-0.015624%20-0.371094%20-0.035156%20-0.550781%20l%200.335938%20-0.109375%20l%200.785156%20-0.257813%20z%20m%201.527344%205.449219%20c%200.527344%200%200.984375%200.265625%201.25%200.667969%20l%20-2.078125%202.082031%20c%20-0.40625%20-0.269531%20-0.671875%20-0.722656%20-0.671875%20-1.25%20c%200%20-0.835937%200.667969%20-1.5%201.5%20-1.5%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3Cpath%20d%3D'm%204.039062%20-18.988281%20c%20-1.449218%200%20-2.679687%201.046875%20-2.964843%202.421875%20c%20-0.019531%200.097656%20-0.035157%200.199218%20-0.046875%200.300781%20c%20-0.007813%200.101563%20-0.015625%200.203125%20-0.015625%200.304687%20v%207.910157%20c%200%201.660156%201.367187%203.027343%203.027343%203.027343%20h%207.949219%20c%201.660157%200%203.027344%20-1.367187%203.027344%20-3.027343%20v%20-7.910157%20c%200%20-0.105468%20-0.003906%20-0.207031%20-0.015625%20-0.304687%20c%20-0.011719%20-0.101563%20-0.027344%20-0.203125%20-0.046875%20-0.300781%20c%20-0.285156%20-1.375%20-1.511719%20-2.421875%20-2.964844%20-2.421875%20z%20m%200%202.003906%20h%202.976563%20v%203%20h%20-2.976563%20c%20-0.585937%200%20-1.027343%20-0.441406%20-1.027343%20-1.027344%20v%20-0.949219%20c%200.003906%20-0.035156%200.003906%20-0.070312%200.007812%20-0.105468%20c%200.003907%20-0.035156%200.007813%20-0.070313%200.011719%20-0.105469%20c%200.007812%20-0.035156%200.019531%20-0.066406%200.027344%20-0.097656%20c%200.125%20-0.421875%200.503906%20-0.714844%200.980468%20-0.714844%20z%20m%204.976563%200%20h%202.972656%20c%200.585938%200%201.023438%200.4375%201.027344%201.023437%20v%200.949219%20c%200%200.585938%20-0.441406%201.027344%20-1.027344%201.027344%20h%20-2.972656%20z%20m%204%203.71875%20v%205.214844%20c%200%200.585937%20-0.441406%201.027343%20-1.027344%201.027343%20h%20-7.949219%20c%20-0.585937%200%20-1.027343%20-0.441406%20-1.027343%20-1.027343%20v%20-5.175781%20c%200.324219%200.148437%200.671875%200.246093%201.027343%200.246093%20h%202.976563%20v%203.035157%20l%202%200.992187%20v%20-4.027344%20h%202.972656%20c%200.34375%200%200.695313%20-0.113281%201.027344%20-0.285156%20z%20m%20-5%2033.28125%20c%20-0.851563%200%20-1.699219%200.328125%20-2.351563%200.976563%20l%20-4.671874%204.671874%20c%20-1.300782%201.300782%20-1.300782%203.402344%200%204.703126%20l%204.671874%204.671874%20c%201.300782%201.300782%203.402344%201.300782%204.699219%200%20l%204.675781%20-4.671874%20c%201.300782%20-1.300782%201.300782%20-3.402344%200%20-4.703126%20l%20-4.675781%20-4.671874%20c%20-0.648437%20-0.648438%20-1.496093%20-0.976563%20-2.347656%20-0.976563%20z%20m%200%201.984375%20c%200.335937%200%200.675781%200.132812%200.941406%200.402344%20l%203.03125%203.027344%20c%20-0.066406%200.039062%20-0.136719%200.070312%20-0.210937%200.09375%20c%20-0.019532%200.003906%20-0.039063%200.011718%20-0.0625%200.015624%20c%20-0.441406%200.148438%20-1.003906%200.019532%20-1.277344%20-0.359374%20l%20-0.140625%20-0.195313%20c%20-0.15625%20-0.210937%20-0.390625%20-0.355469%20-0.652344%20-0.398437%20c%20-0.066406%20-0.011719%20-0.132812%20-0.015626%20-0.199219%20-0.011719%20c%20-0.195312%200.007812%20-0.382812%200.074219%20-0.542968%200.191406%20c%20-0.449219%200.324219%20-0.550782%200.949219%20-0.226563%201.394531%20l%200.144531%200.199219%20c%200.273438%200.378906%200.226563%200.953125%20-0.050781%201.332031%20c%20-0.011719%200.015625%20-0.023437%200.03125%20-0.035156%200.050782%20c%20-0.273437%200.378906%20-0.808594%200.597656%20-1.253906%200.453124%20l%20-0.226563%20-0.074218%20c%20-0.523437%20-0.167969%20-1.089844%200.117187%20-1.257812%200.644531%20c%20-0.171875%200.523437%200.113281%201.089844%200.636718%201.261719%20l%200.226563%200.070312%20c%200.445313%200.144532%200.738281%200.640625%200.746094%201.105469%20c%200.003906%200.023437%200.003906%200.042969%200.003906%200.066406%20c%200.015625%200.464844%20-0.304687%200.960938%20-0.75%201.105469%20l%20-0.226563%200.074219%20c%20-0.179687%200.058593%20-0.332031%200.164062%20-0.445312%200.296875%20l%20-3.785156%20-3.785156%20c%20-0.535156%20-0.535157%20-0.535156%20-1.355469%200%20-1.890626%20l%204.667968%20-4.667968%20c%200.269532%20-0.269532%200.609376%20-0.402344%200.945313%20-0.402344%20z%20m%205.585937%205.234375%20c%200.058594%200%200.117188%200.003906%200.175782%200.007813%20c%200.382812%200.523437%200.335937%201.234374%20-0.144532%201.71875%20l%20-3.753906%203.75%20c%20-0.027344%20-0.066407%20-0.050781%20-0.136719%20-0.070312%20-0.203126%20c%20-0.003906%20-0.011718%20-0.007813%20-0.023437%20-0.011719%20-0.035156%20c%20-0.003906%20-0.007812%20-0.007813%20-0.011718%20-0.011719%20-0.019531%20c%20-0.285156%20-0.84375%20-0.152344%20-1.644531%200%20-2.4375%20c%200.003906%20-0.003906%200.007813%20-0.007813%200.011719%20-0.015625%20c%200.003906%20-0.011719%200.007813%20-0.027344%200.011719%20-0.039062%20c%200.261718%20-0.789063%200.757812%20-1.464844%201.410156%20-1.945313%20c%200.011719%20-0.003906%200.023438%20-0.011719%200.03125%20-0.015625%20c%200.019531%20-0.015625%200.042969%20-0.03125%200.058594%20-0.046875%20c%200.648437%20-0.453125%201.4375%20-0.71875%202.292968%20-0.71875%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E");
41
+ --icon-window-close: url("data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%204%204%20h%201%20h%200.03125%20c%200.253906%200.011719%200.511719%200.128906%200.6875%200.3125%20l%202.28125%202.28125%20l%202.3125%20-2.28125%20c%200.265625%20-0.230469%200.445312%20-0.304688%200.6875%20-0.3125%20h%201%20v%201%20c%200%200.285156%20-0.035156%200.550781%20-0.25%200.75%20l%20-2.28125%202.28125%20l%202.25%202.25%20c%200.1875%200.1875%200.28125%200.453125%200.28125%200.71875%20v%201%20h%20-1%20c%20-0.265625%200%20-0.53125%20-0.09375%20-0.71875%20-0.28125%20l%20-2.28125%20-2.28125%20l%20-2.28125%202.28125%20c%20-0.1875%200.1875%20-0.453125%200.28125%20-0.71875%200.28125%20h%20-1%20v%20-1%20c%200%20-0.265625%200.09375%20-0.53125%200.28125%20-0.71875%20l%202.28125%20-2.25%20l%20-2.28125%20-2.28125%20c%20-0.210938%20-0.195312%20-0.304688%20-0.46875%20-0.28125%20-0.75%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E");
42
+ --icon-window-minimize: url("data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%204%2010.007812%20h%208%20v%201.988282%20h%20-8%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E");
43
+ --icon-window-maximize: url("data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%203.988281%203.992188%20v%208.011718%20h%208.011719%20v%20-8.011718%20z%20m%202%202%20h%204.011719%20v%204.011718%20h%20-4.011719%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E");
39
44
  --icon-image-missing: url("data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%204.015625%201.03125%20c%20-1.644531%200%20-3%201.355469%20-3%203%20v%201%20h%201%20v%20-1%20c%200%20-1.109375%200.890625%20-2%202%20-2%20h%201%20v%20-1%20z%20m%202%200%20v%201%20h%204%20v%20-1%20z%20m%205%200%20v%201%20h%201%20c%201.109375%200%202%200.890625%202%202%20v%201%20h%201%20v%20-1%20c%200%20-1.644531%20-1.355469%20-3%20-3%20-3%20z%20m%20-5%204%20c%20-0.550781%200%20-1%200.449219%20-1%201%20s%200.449219%201%201%201%20s%201%20-0.449219%201%20-1%20s%20-0.449219%20-1%20-1%20-1%20z%20m%20-5%201%20v%204%20h%201%20v%20-4%20z%20m%2013%200%20v%204%20h%201%20v%20-4%20z%20m%20-4.5%202%20l%20-2%202%20l%20-1.5%20-1%20l%20-2%202%20v%200.5%20c%200%200.5%200.5%200.5%200.5%200.5%20h%207%20s%200.472656%20-0.035156%200.5%20-0.5%20v%20-1%20z%20m%20-8.5%203%20v%201%20c%200%201.644531%201.355469%203%203%203%20h%201%20v%20-1%20h%20-1%20c%20-1.109375%200%20-2%20-0.890625%20-2%20-2%20v%20-1%20z%20m%2013%200%20v%201%20c%200%201.109375%20-0.890625%202%20-2%202%20h%20-1%20v%201%20h%201%20c%201.644531%200%203%20-1.355469%203%20-3%20v%20-1%20z%20m%20-8%203%20v%201%20h%204%20v%20-1%20z%20m%200%200'%20fill%3D'currentColor'%20fill-opacity%3D'0.34902'%2F%3E%20%3C%2Fsvg%3E");
40
45
  }
41
46
 
42
- .adw-icon--edit-paste {
43
- mask-image: var(--icon-edit-paste);
44
- -webkit-mask-image: var(--icon-edit-paste);
45
- }
46
-
47
47
  .adw-icon--go-down {
48
48
  mask-image: var(--icon-go-down);
49
49
  -webkit-mask-image: var(--icon-go-down);
@@ -164,6 +164,11 @@
164
164
  -webkit-mask-image: var(--icon-mail-reply-sender);
165
165
  }
166
166
 
167
+ .adw-icon--folder-documents {
168
+ mask-image: var(--icon-folder-documents);
169
+ -webkit-mask-image: var(--icon-folder-documents);
170
+ }
171
+
167
172
  .adw-icon--folder-download {
168
173
  mask-image: var(--icon-folder-download);
169
174
  -webkit-mask-image: var(--icon-folder-download);
@@ -179,6 +184,16 @@
179
184
  -webkit-mask-image: var(--icon-view-list);
180
185
  }
181
186
 
187
+ .adw-icon--view-more {
188
+ mask-image: var(--icon-view-more);
189
+ -webkit-mask-image: var(--icon-view-more);
190
+ }
191
+
192
+ .adw-icon--view-paged {
193
+ mask-image: var(--icon-view-paged);
194
+ -webkit-mask-image: var(--icon-view-paged);
195
+ }
196
+
182
197
  .adw-icon--view-columns {
183
198
  mask-image: var(--icon-view-columns);
184
199
  -webkit-mask-image: var(--icon-view-columns);
@@ -219,6 +234,21 @@
219
234
  -webkit-mask-image: var(--icon-application-x-executable);
220
235
  }
221
236
 
237
+ .adw-icon--window-close {
238
+ mask-image: var(--icon-window-close);
239
+ -webkit-mask-image: var(--icon-window-close);
240
+ }
241
+
242
+ .adw-icon--window-minimize {
243
+ mask-image: var(--icon-window-minimize);
244
+ -webkit-mask-image: var(--icon-window-minimize);
245
+ }
246
+
247
+ .adw-icon--window-maximize {
248
+ mask-image: var(--icon-window-maximize);
249
+ -webkit-mask-image: var(--icon-window-maximize);
250
+ }
251
+
222
252
  .adw-icon--image-missing {
223
253
  mask-image: var(--icon-image-missing);
224
254
  -webkit-mask-image: var(--icon-image-missing);
@@ -233,6 +263,7 @@
233
263
  --headerbar-fg-color: rgba(0, 0, 6, 0.8);
234
264
  --headerbar-shade-color: rgba(0, 0, 6, 0.12);
235
265
  --separator-color: rgba(0, 0, 6, 0.1);
266
+ --shade-color: rgba(0, 0, 6, 0.07);
236
267
  --sidebar-bg-color: #ebebed;
237
268
  --sidebar-fg-color: rgba(0, 0, 6, 0.8);
238
269
  --sidebar-backdrop-color: #f2f2f4;
@@ -311,6 +342,7 @@
311
342
  --headerbar-fg-color: #ffffff;
312
343
  --headerbar-shade-color: rgba(0, 0, 6, 0.36);
313
344
  --separator-color: rgba(255, 255, 255, 0.08);
345
+ --shade-color: rgba(0, 0, 6, 0.25);
314
346
  --sidebar-bg-color: #2e2e32;
315
347
  --sidebar-fg-color: #ffffff;
316
348
  --sidebar-backdrop-color: #28282c;
@@ -357,6 +389,7 @@
357
389
  --headerbar-fg-color: #ffffff;
358
390
  --headerbar-shade-color: rgba(0, 0, 6, 0.36);
359
391
  --separator-color: rgba(255, 255, 255, 0.08);
392
+ --shade-color: rgba(0, 0, 6, 0.25);
360
393
  --sidebar-bg-color: #2e2e32;
361
394
  --sidebar-fg-color: #ffffff;
362
395
  --sidebar-backdrop-color: #28282c;
@@ -403,6 +436,7 @@
403
436
  --headerbar-fg-color: rgba(0, 0, 6, 0.8);
404
437
  --headerbar-shade-color: rgba(0, 0, 6, 0.12);
405
438
  --separator-color: rgba(0, 0, 6, 0.1);
439
+ --shade-color: rgba(0, 0, 6, 0.07);
406
440
  --sidebar-bg-color: #ebebed;
407
441
  --sidebar-fg-color: rgba(0, 0, 6, 0.8);
408
442
  --sidebar-backdrop-color: #f2f2f4;
@@ -897,6 +931,15 @@ adw-wrap-box *::after {
897
931
  display: none;
898
932
  }
899
933
 
934
+ :where(.adw-icon) {
935
+ mask-image: var(--icon-image-missing);
936
+ -webkit-mask-image: var(--icon-image-missing);
937
+ }
938
+
939
+ .adw-icon:not([class*=adw-icon--]) {
940
+ background-color: transparent;
941
+ }
942
+
900
943
  .dimmed, .adw-data-grid .adw-data-grid-row.header .adw-data-grid-cell, adw-progress-bar .adw-progress-bar-text {
901
944
  opacity: var(--dim-opacity);
902
945
  }
@@ -1226,25 +1269,25 @@ adw-card,
1226
1269
  /************************
1227
1270
  * Undershoot indicators *
1228
1271
  ************************/
1229
- .undershoot-top:not(adw-toolbar-view) {
1272
+ .undershoot-top:not(adw-toolbar-view):not(.adw-scroll-shaded) {
1230
1273
  box-shadow: inset 0 6px 6px -6px color-mix(in srgb, currentColor 6%, transparent);
1231
1274
  }
1232
1275
 
1233
- .undershoot-bottom:not(adw-toolbar-view) {
1276
+ .undershoot-bottom:not(adw-toolbar-view):not(.adw-scroll-shaded) {
1234
1277
  box-shadow: inset 0 -6px 6px -6px color-mix(in srgb, currentColor 6%, transparent);
1235
1278
  }
1236
1279
 
1237
- .undershoot-start:dir(ltr) {
1280
+ .undershoot-start:not(.adw-scroll-shaded):dir(ltr) {
1238
1281
  box-shadow: inset 6px 0 6px -6px color-mix(in srgb, currentColor 6%, transparent);
1239
1282
  }
1240
- .undershoot-start:dir(rtl) {
1283
+ .undershoot-start:not(.adw-scroll-shaded):dir(rtl) {
1241
1284
  box-shadow: inset -6px 0 6px -6px color-mix(in srgb, currentColor 6%, transparent);
1242
1285
  }
1243
1286
 
1244
- .undershoot-end:dir(ltr) {
1287
+ .undershoot-end:not(.adw-scroll-shaded):dir(ltr) {
1245
1288
  box-shadow: inset -6px 0 6px -6px color-mix(in srgb, currentColor 6%, transparent);
1246
1289
  }
1247
- .undershoot-end:dir(rtl) {
1290
+ .undershoot-end:not(.adw-scroll-shaded):dir(rtl) {
1248
1291
  box-shadow: inset 6px 0 6px -6px color-mix(in srgb, currentColor 6%, transparent);
1249
1292
  }
1250
1293
 
@@ -1263,7 +1306,8 @@ adw-window {
1263
1306
  }
1264
1307
 
1265
1308
  adw-header-bar {
1266
- display: flex;
1309
+ display: grid;
1310
+ grid-template-columns: 1fr minmax(0, auto) 1fr;
1267
1311
  align-items: center;
1268
1312
  min-height: 47px;
1269
1313
  padding: 0 6px;
@@ -1273,7 +1317,6 @@ adw-header-bar {
1273
1317
  flex-shrink: 0;
1274
1318
  }
1275
1319
  adw-header-bar .adw-header-bar-center {
1276
- flex: 1;
1277
1320
  display: flex;
1278
1321
  justify-content: center;
1279
1322
  min-width: 0;
@@ -1286,19 +1329,19 @@ adw-header-bar .adw-header-bar-title {
1286
1329
  text-overflow: ellipsis;
1287
1330
  }
1288
1331
  adw-header-bar .adw-header-bar-start {
1332
+ justify-self: start;
1289
1333
  display: flex;
1290
1334
  align-items: center;
1291
1335
  padding: 0 6px;
1292
1336
  gap: 4px;
1293
- flex-shrink: 0;
1294
1337
  }
1295
1338
  adw-header-bar .adw-header-bar-end {
1339
+ justify-self: end;
1296
1340
  display: flex;
1297
1341
  align-items: center;
1298
1342
  justify-content: flex-end;
1299
1343
  padding: 0 6px;
1300
1344
  gap: 4px;
1301
- flex-shrink: 0;
1302
1345
  }
1303
1346
  adw-header-bar .adw-header-btn {
1304
1347
  position: relative;
@@ -3154,7 +3197,9 @@ adw-toast-overlay .adw-toast-overlay-toasts {
3154
3197
  .adw-toast .adw-toast-close-button {
3155
3198
  box-sizing: border-box;
3156
3199
  flex-shrink: 0;
3157
- position: relative;
3200
+ display: flex;
3201
+ align-items: center;
3202
+ justify-content: center;
3158
3203
  width: 24px;
3159
3204
  height: 24px;
3160
3205
  margin: 0;
@@ -3175,22 +3220,6 @@ adw-toast-overlay .adw-toast-overlay-toasts {
3175
3220
  outline: 2px solid var(--accent-color);
3176
3221
  outline-offset: 1px;
3177
3222
  }
3178
- .adw-toast .adw-toast-close-button::before, .adw-toast .adw-toast-close-button::after {
3179
- content: "";
3180
- position: absolute;
3181
- top: 50%;
3182
- left: 50%;
3183
- width: 11px;
3184
- height: 1.5px;
3185
- background-color: currentColor;
3186
- border-radius: 1px;
3187
- }
3188
- .adw-toast .adw-toast-close-button::before {
3189
- transform: translate(-50%, -50%) rotate(45deg);
3190
- }
3191
- .adw-toast .adw-toast-close-button::after {
3192
- transform: translate(-50%, -50%) rotate(-45deg);
3193
- }
3194
3223
 
3195
3224
  adw-toolbar-view {
3196
3225
  display: flex;
@@ -3215,6 +3244,9 @@ adw-toolbar-view .adw-toolbar-view-content {
3215
3244
  flex-direction: column;
3216
3245
  background-color: var(--window-bg-color);
3217
3246
  }
3247
+ adw-toolbar-view .adw-toolbar-view-content > :only-child {
3248
+ flex: 1 1 auto;
3249
+ }
3218
3250
  adw-toolbar-view .adw-toolbar-view-top.raised,
3219
3251
  adw-toolbar-view .adw-toolbar-view-bottom.raised {
3220
3252
  background-color: var(--headerbar-bg-color);
@@ -3232,22 +3264,11 @@ adw-toolbar-view .adw-toolbar-view-bottom.raised {
3232
3264
  adw-toolbar-view .adw-toolbar-view-bottom.raised.border {
3233
3265
  box-shadow: 0 -1px var(--headerbar-shade-color);
3234
3266
  }
3235
- adw-toolbar-view.undershoot-top .adw-toolbar-view-content::before, adw-toolbar-view.undershoot-bottom .adw-toolbar-view-content::after {
3236
- content: "";
3237
- position: sticky;
3238
- height: 6px;
3239
- flex-shrink: 0;
3240
- pointer-events: none;
3241
- }
3242
- adw-toolbar-view.undershoot-top .adw-toolbar-view-content::before {
3243
- top: 0;
3244
- margin-bottom: -6px;
3245
- background: linear-gradient(to bottom, var(--headerbar-shade-color), transparent);
3246
- }
3247
- adw-toolbar-view.undershoot-bottom .adw-toolbar-view-content::after {
3248
- bottom: 0;
3249
- margin-top: -6px;
3250
- background: linear-gradient(to top, var(--headerbar-shade-color), transparent);
3267
+ adw-toolbar-view .adw-toolbar-view-top:not(.raised) adw-header-bar,
3268
+ adw-toolbar-view .adw-toolbar-view-bottom:not(.raised) adw-header-bar {
3269
+ background: none;
3270
+ color: inherit;
3271
+ box-shadow: none;
3251
3272
  }
3252
3273
 
3253
3274
  adw-toolbar-view[extend-content-to-top-edge] > .adw-toolbar-view-top,
@@ -3265,6 +3286,59 @@ adw-toolbar-view[extend-content-to-bottom-edge] > .adw-toolbar-view-bottom {
3265
3286
  bottom: 0;
3266
3287
  }
3267
3288
 
3289
+ .adw-scroll-shaded::before, .adw-scroll-shaded::after {
3290
+ content: "";
3291
+ display: block;
3292
+ position: sticky;
3293
+ z-index: 1;
3294
+ flex-shrink: 0;
3295
+ pointer-events: none;
3296
+ height: 0;
3297
+ background: none;
3298
+ box-shadow: none;
3299
+ }
3300
+ .adw-scroll-shaded::before {
3301
+ top: 0;
3302
+ }
3303
+ .adw-scroll-shaded::after {
3304
+ bottom: 0;
3305
+ }
3306
+ .adw-scroll-shaded.undershoot-top::before {
3307
+ height: 40px;
3308
+ margin-bottom: -40px;
3309
+ box-shadow: inset 0 1px color-mix(in srgb, var(--shade-color) 75%, transparent);
3310
+ background: linear-gradient(to bottom, color-mix(in srgb, var(--shade-color) 75%, transparent), transparent 4px);
3311
+ }
3312
+ .adw-scroll-shaded.undershoot-bottom::after {
3313
+ height: 40px;
3314
+ margin-top: -40px;
3315
+ box-shadow: inset 0 -1px color-mix(in srgb, var(--shade-color) 75%, transparent);
3316
+ background: linear-gradient(to top, color-mix(in srgb, var(--shade-color) 75%, transparent), transparent 4px);
3317
+ }
3318
+ .adw-scroll-shaded.overshoot-top::before, .adw-scroll-shaded.overshoot-bottom::after {
3319
+ height: var(--adw-overshoot, 0px);
3320
+ background-repeat: no-repeat;
3321
+ box-shadow: none;
3322
+ transition: height 200ms ease-out, opacity 200ms ease-out;
3323
+ }
3324
+ .adw-scroll-shaded.overshoot-top::before {
3325
+ margin-bottom: calc(var(--adw-overshoot, 0px) * -1);
3326
+ background-image: radial-gradient(farthest-side at top, color-mix(in srgb, currentColor 12%, transparent) 85%, transparent), radial-gradient(farthest-side at top, color-mix(in srgb, currentColor 5%, transparent), transparent);
3327
+ background-size: 100% 3%, 100% 50%;
3328
+ background-position: top;
3329
+ }
3330
+ .adw-scroll-shaded.overshoot-bottom::after {
3331
+ margin-top: calc(var(--adw-overshoot, 0px) * -1);
3332
+ background-image: radial-gradient(farthest-side at bottom, color-mix(in srgb, currentColor 12%, transparent) 85%, transparent), radial-gradient(farthest-side at bottom, color-mix(in srgb, currentColor 5%, transparent), transparent);
3333
+ background-size: 100% 3%, 100% 50%;
3334
+ background-position: bottom;
3335
+ }
3336
+ @media (prefers-reduced-motion: reduce) {
3337
+ .adw-scroll-shaded.overshoot-top::before, .adw-scroll-shaded.overshoot-bottom::after {
3338
+ transition: none;
3339
+ }
3340
+ }
3341
+
3268
3342
  adw-wrap-box {
3269
3343
  display: flex;
3270
3344
  flex-direction: row;
@@ -3486,11 +3560,12 @@ adw-carousel .adw-carousel-track::-webkit-scrollbar {
3486
3560
  }
3487
3561
  adw-carousel .adw-carousel-page {
3488
3562
  flex: 0 0 100%;
3563
+ min-width: 0;
3489
3564
  box-sizing: border-box;
3490
3565
  display: flex;
3491
3566
  align-items: center;
3492
3567
  justify-content: center;
3493
- scroll-snap-align: start;
3568
+ scroll-snap-align: center;
3494
3569
  scroll-snap-stop: always;
3495
3570
  }
3496
3571
 
@@ -3769,6 +3844,7 @@ adw-view-switcher .adw-view-switcher-button {
3769
3844
  box-sizing: border-box;
3770
3845
  display: inline-flex;
3771
3846
  flex: 1 1 0;
3847
+ min-width: 0;
3772
3848
  align-items: center;
3773
3849
  justify-content: center;
3774
3850
  margin: 0;
@@ -3795,6 +3871,7 @@ adw-view-switcher .adw-view-switcher-button .adw-icon {
3795
3871
  flex: none;
3796
3872
  }
3797
3873
  adw-view-switcher .adw-view-switcher-button .adw-view-switcher-label {
3874
+ min-width: 0;
3798
3875
  white-space: nowrap;
3799
3876
  overflow: hidden;
3800
3877
  text-overflow: ellipsis;
@@ -3825,21 +3902,23 @@ adw-view-switcher .adw-view-switcher-button .adw-view-switcher-indicator.needs-a
3825
3902
  border-radius: 3px;
3826
3903
  }
3827
3904
  adw-view-switcher .adw-view-switcher-button:hover {
3828
- background-color: var(--button-hover-color);
3905
+ background-color: color-mix(in srgb, currentColor 7%, transparent);
3829
3906
  }
3830
3907
  adw-view-switcher .adw-view-switcher-button:active {
3831
- background-color: var(--button-active-color);
3908
+ background-color: color-mix(in srgb, currentColor 16%, transparent);
3832
3909
  }
3833
3910
  adw-view-switcher .adw-view-switcher-button:focus-visible {
3834
3911
  outline: 2px solid var(--accent-color);
3835
3912
  outline-offset: -2px;
3836
3913
  }
3837
3914
  adw-view-switcher .adw-view-switcher-button.active {
3838
- background-color: var(--button-active-color);
3839
- color: var(--window-fg-color);
3915
+ background-color: color-mix(in srgb, currentColor 10%, transparent);
3840
3916
  }
3841
3917
  adw-view-switcher .adw-view-switcher-button.active:hover {
3842
- background-color: var(--button-active-color);
3918
+ background-color: color-mix(in srgb, currentColor 13%, transparent);
3919
+ }
3920
+ adw-view-switcher .adw-view-switcher-button.active:active {
3921
+ background-color: color-mix(in srgb, currentColor 19%, transparent);
3843
3922
  }
3844
3923
  adw-view-switcher.wide .adw-view-switcher-button {
3845
3924
  flex-direction: row;
@@ -3851,8 +3930,7 @@ adw-view-switcher.narrow .adw-view-switcher-bar {
3851
3930
  adw-view-switcher.narrow .adw-view-switcher-button {
3852
3931
  flex-direction: column;
3853
3932
  gap: 1px;
3854
- padding-top: 4px;
3855
- padding-bottom: 2px;
3933
+ padding: 4px 3px 2px;
3856
3934
  font-size: 0.75rem;
3857
3935
  }
3858
3936
  adw-view-switcher.narrow .adw-view-switcher-button .adw-view-switcher-label {
@@ -3860,18 +3938,19 @@ adw-view-switcher.narrow .adw-view-switcher-button .adw-view-switcher-label {
3860
3938
  line-height: 18px;
3861
3939
  }
3862
3940
  adw-view-switcher .adw-view-switcher-content {
3941
+ display: flex;
3942
+ flex-direction: column;
3863
3943
  flex: 1 1 auto;
3864
- margin-top: var(--spacing-s);
3865
- padding: var(--spacing-m);
3866
- background-color: var(--view-bg-color);
3867
- border: 1px solid var(--separator-color);
3868
- border-radius: var(--card-radius);
3944
+ min-height: 0;
3869
3945
  }
3870
3946
  adw-view-switcher .adw-view-switcher-page {
3871
3947
  display: none;
3872
3948
  }
3873
3949
  adw-view-switcher .adw-view-switcher-page.active-view {
3874
- display: block;
3950
+ display: flex;
3951
+ flex-direction: column;
3952
+ flex: 1 1 auto;
3953
+ min-height: 0;
3875
3954
  }
3876
3955
 
3877
3956
  adw-inline-view-switcher {