@gjsify/adwaita-web 0.30.0 → 0.32.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/dist/adwaita-web.css +786 -272
- package/dist/adwaita-web.css.map +1 -1
- package/lib/types/adw-about-dialog.spec.d.ts +1 -0
- package/lib/types/adw-action-rows.spec.d.ts +1 -0
- package/lib/types/adw-avatar.spec.d.ts +1 -0
- package/lib/types/adw-banner.spec.d.ts +1 -0
- package/lib/types/adw-button-content.spec.d.ts +1 -0
- package/lib/types/adw-carousel.spec.d.ts +1 -0
- package/lib/types/adw-checks.spec.d.ts +1 -0
- package/lib/types/adw-header-bar.spec.d.ts +1 -0
- package/lib/types/adw-icon.spec.d.ts +1 -0
- package/lib/types/adw-progress-bar.spec.d.ts +1 -0
- package/lib/types/adw-sidebar.spec.d.ts +1 -0
- package/lib/types/adw-switch.spec.d.ts +1 -0
- package/lib/types/adw-wrap-box.spec.d.ts +1 -0
- package/lib/types/bottom-sheet.spec.d.ts +1 -0
- package/lib/types/breakpoints.d.ts +22 -0
- package/lib/types/breakpoints.spec.d.ts +1 -0
- package/lib/types/chrome.spec.d.ts +1 -0
- package/lib/types/elements/adw-about-dialog.d.ts +47 -8
- package/lib/types/elements/adw-action-row.d.ts +35 -0
- package/lib/types/elements/adw-avatar.d.ts +11 -0
- package/lib/types/elements/adw-bottom-sheet.d.ts +33 -4
- package/lib/types/elements/adw-button-content.d.ts +12 -0
- package/lib/types/elements/adw-button-row.d.ts +10 -1
- package/lib/types/elements/adw-carousel.d.ts +111 -8
- package/lib/types/elements/adw-checks.d.ts +57 -0
- package/lib/types/elements/adw-clamp.d.ts +4 -1
- package/lib/types/elements/adw-data-grid.d.ts +11 -31
- package/lib/types/elements/adw-drop-down.d.ts +17 -20
- package/lib/types/elements/adw-entry-row.d.ts +93 -3
- package/lib/types/elements/adw-expander-row.d.ts +7 -1
- package/lib/types/elements/adw-header-bar.d.ts +15 -0
- package/lib/types/elements/adw-icon.d.ts +25 -0
- package/lib/types/elements/adw-inline-view-switcher.d.ts +37 -11
- package/lib/types/elements/adw-menu-button.d.ts +6 -6
- package/lib/types/elements/adw-navigation-split-view.d.ts +6 -0
- package/lib/types/elements/adw-navigation-view.d.ts +63 -20
- package/lib/types/elements/adw-overlay-split-view.d.ts +38 -0
- package/lib/types/elements/adw-password-entry-row.d.ts +19 -10
- package/lib/types/elements/adw-popover.d.ts +58 -0
- package/lib/types/elements/adw-preferences-dialog.d.ts +57 -2
- package/lib/types/elements/adw-preferences-group.d.ts +31 -0
- package/lib/types/elements/adw-progress-bar.d.ts +38 -0
- package/lib/types/elements/adw-sidebar.d.ts +37 -5
- package/lib/types/elements/adw-split-button.d.ts +53 -7
- package/lib/types/elements/adw-switch-row.d.ts +11 -2
- package/lib/types/elements/adw-switch.d.ts +15 -0
- package/lib/types/elements/adw-tab-view.d.ts +129 -12
- package/lib/types/elements/adw-toolbar-view.d.ts +5 -0
- package/lib/types/elements/adw-view-stack.d.ts +27 -19
- package/lib/types/elements/adw-view-switcher-bar.d.ts +23 -7
- package/lib/types/elements/adw-view-switcher.d.ts +22 -11
- package/lib/types/elements/adw-window-title.d.ts +3 -1
- package/lib/types/elements/view-switcher-dom.d.ts +44 -0
- package/lib/types/entry-rows.spec.d.ts +1 -0
- package/lib/types/index.d.ts +7 -0
- package/lib/types/navigation-view.spec.d.ts +1 -0
- package/lib/types/preferences-search.d.ts +20 -0
- package/lib/types/preferences.spec.d.ts +1 -0
- package/lib/types/split-button.spec.d.ts +1 -0
- package/lib/types/split-views.spec.d.ts +1 -0
- package/lib/types/styles.generated.d.ts +1 -1
- package/lib/types/tab-view.spec.d.ts +1 -0
- package/lib/types/view-stack.spec.d.ts +1 -0
- package/lib/types/view-switcher.spec.d.ts +1 -0
- package/package.json +6 -6
- package/scss/_banner.scss +13 -0
- package/scss/_bottom_sheet.scss +5 -6
- package/scss/_button.scss +3 -26
- package/scss/_button_content.scss +28 -0
- package/scss/_checks.scss +228 -0
- package/scss/_clamp.scss +9 -3
- package/scss/_data_grid.scss +15 -7
- package/scss/_drop_down.scss +12 -55
- package/scss/_expander_row.scss +5 -50
- package/scss/_icon.scss +51 -0
- package/scss/_icons.generated.scss +6 -0
- package/scss/_inline_view_switcher.scss +34 -0
- package/scss/_labels.scss +135 -0
- package/scss/_menu_button.scss +10 -70
- package/scss/_popover.scss +186 -0
- package/scss/_preferences.scss +29 -0
- package/scss/_preferences_dialog.scss +17 -0
- package/scss/_progress_bar.scss +161 -0
- package/scss/_reset.scss +18 -7
- package/scss/_spinner.scss +7 -3
- package/scss/_split_button.scss +6 -50
- package/scss/_switch.scss +90 -0
- package/scss/_switch_row.scss +6 -52
- package/scss/_tab_view.scss +64 -0
- package/scss/_theme.scss +10 -0
- package/scss/_toolbar_view.scss +74 -0
- package/scss/_variables.scss +34 -0
- package/scss/_view_switcher.scss +40 -0
- package/scss/_view_switcher_bar.scss +37 -0
- package/scss/_wrap_box.scss +56 -6
- package/scss/adwaita-skin.scss +23 -0
- package/src/adw-about-dialog.spec.ts +350 -0
- package/src/adw-action-rows.spec.ts +342 -0
- package/src/adw-avatar.spec.ts +139 -0
- package/src/adw-banner.spec.ts +152 -0
- package/src/adw-button-content.spec.ts +183 -0
- package/src/adw-button-row.spec.ts +12 -6
- package/src/adw-carousel.spec.ts +389 -0
- package/src/adw-checks.spec.ts +368 -0
- package/src/adw-drop-down.spec.ts +123 -0
- package/src/adw-header-bar.spec.ts +83 -0
- package/src/adw-icon.spec.ts +167 -0
- package/src/adw-progress-bar.spec.ts +173 -0
- package/src/adw-sidebar.spec.ts +332 -0
- package/src/adw-switch.spec.ts +242 -0
- package/src/adw-tab-view.spec.ts +12 -3
- package/src/adw-view-switcher-bar.spec.ts +61 -13
- package/src/adw-wrap-box.spec.ts +194 -0
- package/src/bottom-sheet.spec.ts +325 -0
- package/src/breakpoints.spec.ts +147 -0
- package/src/breakpoints.ts +67 -0
- package/src/chrome.spec.ts +301 -0
- package/src/elements/adw-about-dialog.ts +223 -163
- package/src/elements/adw-action-row.ts +120 -10
- package/src/elements/adw-avatar.ts +48 -54
- package/src/elements/adw-banner.ts +46 -10
- package/src/elements/adw-bottom-sheet.ts +145 -60
- package/src/elements/adw-button-content.ts +107 -33
- package/src/elements/adw-button-row.ts +61 -37
- package/src/elements/adw-button.ts +5 -7
- package/src/elements/adw-carousel.ts +467 -105
- package/src/elements/adw-checks.ts +299 -0
- package/src/elements/adw-clamp.ts +80 -10
- package/src/elements/adw-combo-row.ts +15 -7
- package/src/elements/adw-data-grid.ts +43 -91
- package/src/elements/adw-drop-down.ts +117 -128
- package/src/elements/adw-entry-row.ts +404 -36
- package/src/elements/adw-expander-row.ts +61 -29
- package/src/elements/adw-header-bar.ts +31 -6
- package/src/elements/adw-icon.ts +148 -0
- package/src/elements/adw-inline-view-switcher.ts +240 -129
- package/src/elements/adw-menu-button.ts +93 -70
- package/src/elements/adw-navigation-split-view.ts +48 -7
- package/src/elements/adw-navigation-view.ts +286 -148
- package/src/elements/adw-overlay-split-view.ts +164 -14
- package/src/elements/adw-password-entry-row.ts +111 -89
- package/src/elements/adw-popover.ts +283 -0
- package/src/elements/adw-preferences-dialog.ts +120 -21
- package/src/elements/adw-preferences-group.ts +128 -22
- package/src/elements/adw-progress-bar.ts +189 -0
- package/src/elements/adw-sidebar.ts +301 -142
- package/src/elements/adw-spin-row.ts +11 -5
- package/src/elements/adw-spinner.ts +23 -8
- package/src/elements/adw-split-button.ts +371 -92
- package/src/elements/adw-status-page.ts +9 -9
- package/src/elements/adw-switch-row.ts +100 -30
- package/src/elements/adw-switch.ts +129 -0
- package/src/elements/adw-tab-view.ts +682 -129
- package/src/elements/adw-toggle-group.ts +5 -7
- package/src/elements/adw-toolbar-view.ts +84 -21
- package/src/elements/adw-view-stack.ts +162 -85
- package/src/elements/adw-view-switcher-bar.ts +163 -81
- package/src/elements/adw-view-switcher.ts +231 -112
- package/src/elements/adw-window-title.ts +44 -11
- package/src/elements/adw-wrap-box.ts +131 -35
- package/src/elements/view-switcher-dom.ts +108 -0
- package/src/entry-rows.spec.ts +391 -0
- package/src/index.ts +23 -0
- package/src/navigation-view.spec.ts +435 -0
- package/src/preferences-search.ts +135 -0
- package/src/preferences.spec.ts +250 -0
- package/src/source-view/adw-source-view.ts +2 -5
- package/src/split-button.spec.ts +470 -0
- package/src/split-views.spec.ts +309 -0
- package/src/styles.generated.ts +1 -1
- package/src/tab-view.spec.ts +451 -0
- package/src/test.browser.mts +49 -0
- package/src/view-stack.spec.ts +272 -0
- package/src/view-switcher.spec.ts +446 -0
|
@@ -38,6 +38,7 @@
|
|
|
38
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");
|
|
39
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");
|
|
40
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-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");
|
|
41
42
|
}
|
|
42
43
|
|
|
43
44
|
.adw-icon--edit-paste {
|
|
@@ -219,3 +220,8 @@
|
|
|
219
220
|
mask-image: var(--icon-application-x-executable);
|
|
220
221
|
-webkit-mask-image: var(--icon-application-x-executable);
|
|
221
222
|
}
|
|
223
|
+
|
|
224
|
+
.adw-icon--image-missing {
|
|
225
|
+
mask-image: var(--icon-image-missing);
|
|
226
|
+
-webkit-mask-image: var(--icon-image-missing);
|
|
227
|
+
}
|
|
@@ -107,6 +107,40 @@ adw-inline-view-switcher {
|
|
|
107
107
|
white-space: nowrap;
|
|
108
108
|
}
|
|
109
109
|
|
|
110
|
+
// AdwIndicatorBin's badge — the unread count, or a bare dot when only
|
|
111
|
+
// `needs-attention` is set.
|
|
112
|
+
// Reference: refs/libadwaita/src/adw-indicator-bin.c
|
|
113
|
+
.adw-inline-view-switcher-indicator {
|
|
114
|
+
display: inline-flex;
|
|
115
|
+
box-sizing: border-box;
|
|
116
|
+
align-items: center;
|
|
117
|
+
justify-content: center;
|
|
118
|
+
min-width: 16px;
|
|
119
|
+
height: 16px;
|
|
120
|
+
padding: 0 4px;
|
|
121
|
+
border-radius: 8px;
|
|
122
|
+
background-color: var(--accent-bg-color);
|
|
123
|
+
color: var(--accent-fg-color);
|
|
124
|
+
font-size: 0.625rem;
|
|
125
|
+
font-weight: 700;
|
|
126
|
+
line-height: 1;
|
|
127
|
+
|
|
128
|
+
// Author rule, not the UA one: the `display: inline-flex` above is also
|
|
129
|
+
// an author rule and would otherwise keep an empty badge on screen
|
|
130
|
+
// (cascade ORIGIN beats specificity — the same trap the bar hit).
|
|
131
|
+
&[hidden] {
|
|
132
|
+
display: none;
|
|
133
|
+
}
|
|
134
|
+
|
|
135
|
+
&.needs-attention {
|
|
136
|
+
min-width: 6px;
|
|
137
|
+
width: 6px;
|
|
138
|
+
height: 6px;
|
|
139
|
+
padding: 0;
|
|
140
|
+
border-radius: 3px;
|
|
141
|
+
}
|
|
142
|
+
}
|
|
143
|
+
|
|
110
144
|
// The stacked content area below the bar — exactly one page is visible.
|
|
111
145
|
.adw-inline-view-switcher-pages {
|
|
112
146
|
width: 100%;
|
|
@@ -0,0 +1,135 @@
|
|
|
1
|
+
// _labels.scss — libadwaita's typography + semantic-colour UTILITY CLASSES.
|
|
2
|
+
//
|
|
3
|
+
// NO ELEMENT. `refs/libadwaita/src/stylesheet/widgets/_labels.scss` is a widget
|
|
4
|
+
// partial in name only: `label { … }` is four lines of GtkLabel plumbing
|
|
5
|
+
// (`caret-color`, `.separator`, `:disabled`) and everything else in it is a
|
|
6
|
+
// CLASS a consumer puts on whatever node it already has. There is deliberately
|
|
7
|
+
// no `<adw-label>` here to go with them — it would wrap a `<span>` and add
|
|
8
|
+
// nothing a class does not, which is exactly ADR 0004's "a widget with
|
|
9
|
+
// genuinely trivial behaviour does not need a core class" applied one level up,
|
|
10
|
+
// and ADR 0010 already makes the token/class surface the public contract. An
|
|
11
|
+
// element would only add a tag to `$adw-components` for no behaviour.
|
|
12
|
+
//
|
|
13
|
+
// This is also where the in-tree duplication ends: `_data_grid.scss` declared
|
|
14
|
+
// `font-variant-numeric: tabular-nums` twice and inlined a whole monospace font
|
|
15
|
+
// stack — i.e. `.numeric` and `.monospace` — and dimmed its header row with a
|
|
16
|
+
// raw `opacity: var(--dim-opacity)` where `.dimmed` is the upstream spelling. It
|
|
17
|
+
// composes these now.
|
|
18
|
+
//
|
|
19
|
+
// WHAT DIFFERS FROM UPSTREAM, AND WHY
|
|
20
|
+
//
|
|
21
|
+
// - `font-size` percentages are upstream's (181% / 136% / 118% / 82%), which
|
|
22
|
+
// are relative to the INHERITED size. That is what libadwaita means by them
|
|
23
|
+
// and it composes with `--font-size-base`, so they are kept verbatim rather
|
|
24
|
+
// than resolved to pt values.
|
|
25
|
+
// - `.document` / `.monospace` read `--document-font-*` / `--monospace-font-*`.
|
|
26
|
+
// In GTK those four are written into `:root` at runtime by AdwStyleManager
|
|
27
|
+
// from the desktop's font settings (adw-style-manager.c:169-218), defaulting
|
|
28
|
+
// to `Sans 10` / `Monospace 10` (:50-56). There is no style manager in a
|
|
29
|
+
// browser, so `_variables.scss` supplies them as ordinary tokens — same
|
|
30
|
+
// names, so a consumer re-themes through the documented contract.
|
|
31
|
+
// - `refs/adwaita-web/adwaita-web/scss/_utility_classes.scss` carries its own
|
|
32
|
+
// version of this block (it puts these in `_utility_classes.scss`, NOT in
|
|
33
|
+
// `_label.scss`) and it disagrees with libadwaita on two points: it adds a
|
|
34
|
+
// `line-height` to every title/heading, and it dims `.caption` and
|
|
35
|
+
// `.caption-heading` by folding `--dim-opacity` into them. Neither is in
|
|
36
|
+
// libadwaita — a caption is small, not dim, and dimming is `.dimmed`'s job,
|
|
37
|
+
// composable onto anything. libadwaita is followed here.
|
|
38
|
+
//
|
|
39
|
+
// Reference: refs/libadwaita/src/stylesheet/widgets/_labels.scss:13-88 (every class below)
|
|
40
|
+
// Reference: refs/libadwaita/src/adw-style-manager.c:50-56,169-218 (the four font tokens)
|
|
41
|
+
// Reference: refs/adwaita-web/adwaita-web/scss/_utility_classes.scss (the vendored port's variant, NOT followed — see above)
|
|
42
|
+
// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.
|
|
43
|
+
// Copyright (c) 2025 csm (adwaita-web). MIT License.
|
|
44
|
+
// Modifications: Adapted for @gjsify/adwaita-web; the `label {}` element rules
|
|
45
|
+
// are GtkLabel plumbing with no DOM counterpart and are not ported.
|
|
46
|
+
|
|
47
|
+
// _labels.scss:13-15
|
|
48
|
+
.dimmed {
|
|
49
|
+
opacity: var(--dim-opacity);
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
// _labels.scss:17-19
|
|
53
|
+
.accent {
|
|
54
|
+
color: var(--accent-color);
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
// _labels.scss:21-29 — a semantic class does not just recolour the text, it
|
|
58
|
+
// REBINDS the three accent tokens, so a button or switch inside it turns the
|
|
59
|
+
// same colour without knowing which state it is in.
|
|
60
|
+
@each $e_type in error, warning, success {
|
|
61
|
+
.#{$e_type} {
|
|
62
|
+
color: var(--accent-color);
|
|
63
|
+
|
|
64
|
+
--accent-bg-color: var(--#{$e_type}-bg-color);
|
|
65
|
+
--accent-fg-color: var(--#{$e_type}-fg-color);
|
|
66
|
+
--accent-color: var(--#{$e_type}-color);
|
|
67
|
+
}
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
/**********************
|
|
71
|
+
* General Typography *
|
|
72
|
+
**********************/
|
|
73
|
+
|
|
74
|
+
// _labels.scss:35-53
|
|
75
|
+
.title-1 {
|
|
76
|
+
font-weight: 800;
|
|
77
|
+
font-size: 181%;
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
.title-2 {
|
|
81
|
+
font-weight: 800;
|
|
82
|
+
font-size: 136%;
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
.title-3 {
|
|
86
|
+
font-weight: 700;
|
|
87
|
+
font-size: 136%;
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
.title-4 {
|
|
91
|
+
font-weight: 700;
|
|
92
|
+
font-size: 118%;
|
|
93
|
+
}
|
|
94
|
+
|
|
95
|
+
// _labels.scss:55-57
|
|
96
|
+
.heading {
|
|
97
|
+
font-weight: 700;
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
// _labels.scss:59-62
|
|
101
|
+
.body {
|
|
102
|
+
font-weight: 400;
|
|
103
|
+
line-height: 140%;
|
|
104
|
+
}
|
|
105
|
+
|
|
106
|
+
// _labels.scss:64-67
|
|
107
|
+
.caption-heading {
|
|
108
|
+
font-weight: 700;
|
|
109
|
+
font-size: 82%;
|
|
110
|
+
}
|
|
111
|
+
|
|
112
|
+
// _labels.scss:69-73
|
|
113
|
+
.caption {
|
|
114
|
+
font-weight: 400;
|
|
115
|
+
font-size: 82%;
|
|
116
|
+
line-height: 140%;
|
|
117
|
+
}
|
|
118
|
+
|
|
119
|
+
// _labels.scss:75-79
|
|
120
|
+
.document {
|
|
121
|
+
font-family: var(--document-font-family);
|
|
122
|
+
font-size: var(--document-font-size);
|
|
123
|
+
line-height: 140%;
|
|
124
|
+
}
|
|
125
|
+
|
|
126
|
+
// _labels.scss:81-84
|
|
127
|
+
.monospace {
|
|
128
|
+
font-family: var(--monospace-font-family);
|
|
129
|
+
font-size: var(--monospace-font-size);
|
|
130
|
+
}
|
|
131
|
+
|
|
132
|
+
// _labels.scss:86-88
|
|
133
|
+
.numeric {
|
|
134
|
+
font-variant-numeric: tabular-nums;
|
|
135
|
+
}
|
package/scss/_menu_button.scss
CHANGED
|
@@ -77,75 +77,15 @@
|
|
|
77
77
|
}
|
|
78
78
|
}
|
|
79
79
|
|
|
80
|
-
//
|
|
81
|
-
//
|
|
82
|
-
//
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
flex
|
|
90
|
-
min-width: 200px;
|
|
91
|
-
padding: var(--spacing-xs);
|
|
92
|
-
border-radius: var(--card-radius);
|
|
93
|
-
background-color: var(--popover-bg-color, var(--window-bg-color, #fff));
|
|
94
|
-
color: var(--popover-fg-color, var(--window-fg-color));
|
|
95
|
-
box-shadow:
|
|
96
|
-
0 0 0 1px rgba(0, 0, 0, 0.05),
|
|
97
|
-
0 1px 5px 1px rgba(0, 0, 0, 0.09),
|
|
98
|
-
0 2px 14px 3px rgba(0, 0, 0, 0.05);
|
|
99
|
-
|
|
100
|
-
&[hidden] {
|
|
101
|
-
display: none;
|
|
102
|
-
}
|
|
103
|
-
}
|
|
104
|
-
|
|
105
|
-
// Optional section heading atop the menu (libadwaita label.title).
|
|
106
|
-
.adw-menu-button-title {
|
|
107
|
-
padding: 4px var(--spacing-s) 6px;
|
|
108
|
-
font-weight: 700;
|
|
109
|
-
opacity: var(--dim-opacity);
|
|
110
|
-
}
|
|
111
|
-
|
|
112
|
-
// A menu item row — a flat rounded row that fills on hover/active.
|
|
113
|
-
.adw-menu-button-item {
|
|
114
|
-
box-sizing: border-box;
|
|
115
|
-
display: flex;
|
|
116
|
-
align-items: center;
|
|
117
|
-
gap: var(--spacing-xs);
|
|
118
|
-
width: 100%;
|
|
119
|
-
min-height: 32px;
|
|
120
|
-
margin: 0;
|
|
121
|
-
padding: var(--spacing-xs) var(--spacing-s);
|
|
122
|
-
border: none;
|
|
123
|
-
border-radius: calc(var(--button-radius) - 2px);
|
|
124
|
-
background-color: transparent;
|
|
125
|
-
color: inherit;
|
|
126
|
-
font-family: var(--font-family);
|
|
127
|
-
font-size: var(--font-size-base);
|
|
128
|
-
text-align: start;
|
|
129
|
-
cursor: pointer;
|
|
130
|
-
transition: background-color 0.1s ease;
|
|
131
|
-
|
|
132
|
-
.adw-menu-button-item-icon {
|
|
133
|
-
width: 16px;
|
|
134
|
-
height: 16px;
|
|
135
|
-
flex: none;
|
|
136
|
-
}
|
|
137
|
-
|
|
138
|
-
&:hover {
|
|
139
|
-
background-color: var(--button-hover-color);
|
|
140
|
-
}
|
|
141
|
-
|
|
142
|
-
&:active {
|
|
143
|
-
background-color: var(--button-active-color);
|
|
144
|
-
}
|
|
145
|
-
|
|
146
|
-
&:focus-visible {
|
|
147
|
-
outline: 2px solid var(--accent-color);
|
|
148
|
-
outline-offset: -2px;
|
|
149
|
-
}
|
|
80
|
+
// The surface, the heading and the item row are `<adw-popover>`'s —
|
|
81
|
+
// `_popover.scss` (`adw-popover`, `.adw-popover-title`, `.adw-popover-item`).
|
|
82
|
+
// What used to be here was one of three hand-rolled copies: a
|
|
83
|
+
// `--card-radius` (12px) surface where libadwaita's is 15px, and a
|
|
84
|
+
// `calc(var(--button-radius) - 2px)` (7px) row where `modelbutton` is 9px.
|
|
85
|
+
// Only the icon slot is a menu-button fact.
|
|
86
|
+
.adw-menu-button-item-icon {
|
|
87
|
+
width: 16px;
|
|
88
|
+
height: 16px;
|
|
89
|
+
flex: none;
|
|
150
90
|
}
|
|
151
91
|
}
|
|
@@ -0,0 +1,186 @@
|
|
|
1
|
+
// _popover.scss — <adw-popover>, the one popover surface in this package.
|
|
2
|
+
//
|
|
3
|
+
// It replaces three hand-rolled copies (`.adw-menu-button-popover`,
|
|
4
|
+
// `.adw-drop-down-popover`, `.adw-split-button-menu`) that disagreed with
|
|
5
|
+
// libadwaita AND with each other: 12px / 12px / 9px radius against libadwaita's
|
|
6
|
+
// 15px, two correct three-layer shadows and one invented two-layer one. Nothing
|
|
7
|
+
// compared any of them to the vendored stylesheet, so all three shipped.
|
|
8
|
+
//
|
|
9
|
+
// GROUND TRUTH, AND THE SELECTOR THAT WINS THE CASCADE
|
|
10
|
+
//
|
|
11
|
+
// `popover > contents` is `padding: 8px; border-radius: $popover_radius` plus a
|
|
12
|
+
// three-layer shadow (_popovers.scss:13-21), with a `prefers-contrast: more`
|
|
13
|
+
// variant that swaps the innermost layer for a hairline border (:23-27).
|
|
14
|
+
// `$popover_radius` is `$menu_radius + 6` = 15px (_common.scss:10,13) — not
|
|
15
|
+
// `$card_radius` (12px) and not `$button_radius` (9px), the two tokens the
|
|
16
|
+
// copies reached for.
|
|
17
|
+
//
|
|
18
|
+
// The PADDING has a second, more specific rule: `popover.menu > contents`
|
|
19
|
+
// re-declares `padding: 0` and moves the inset onto the item box as
|
|
20
|
+
// `$menu_margin` (6px) at _menus.scss:58-66. Two element selectors plus a class
|
|
21
|
+
// beats one element selector plus a child, so a MENU popover renders a 6px inset
|
|
22
|
+
// and a plain one an 8px inset. The three copies all used 6px — they were right
|
|
23
|
+
// about the inset for the menus they drew, and wrong only about the radius.
|
|
24
|
+
//
|
|
25
|
+
// We reproduce the menu inset with ONE node instead of GTK's contents+box pair:
|
|
26
|
+
// `[menu]` puts the 6px directly on the surface. Same rendered geometry, and
|
|
27
|
+
// there is no separate box element to hang it on in the DOM.
|
|
28
|
+
//
|
|
29
|
+
// Reference: refs/libadwaita/src/stylesheet/widgets/_popovers.scss:7-28
|
|
30
|
+
// Reference: refs/libadwaita/src/stylesheet/widgets/_menus.scss:58-66, :134-156
|
|
31
|
+
// Reference: refs/libadwaita/src/stylesheet/_common.scss:10-13 ($menu_radius, $menu_margin, $popover_radius)
|
|
32
|
+
// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.
|
|
33
|
+
// Modifications: Adapted for the @gjsify/adwaita-web light-DOM custom elements.
|
|
34
|
+
|
|
35
|
+
// Distance between the anchor and the surface. GTK gets this gap from the
|
|
36
|
+
// popover's arrow, which this port does not draw (`has-arrow` is not modelled —
|
|
37
|
+
// GtkPopover's C is not vendored here). 6px is what the menu button and the
|
|
38
|
+
// drop-down already used; the split button's 4px was the odd one out.
|
|
39
|
+
$popover-gap: 6px;
|
|
40
|
+
|
|
41
|
+
adw-popover {
|
|
42
|
+
// $popover_radius = $menu_radius + 6 (_common.scss:10,13). Exposed as a token
|
|
43
|
+
// so consumers re-theme it the same way as the rest (ADR 0010), with the
|
|
44
|
+
// libadwaita value as the fallback.
|
|
45
|
+
--popover-radius: 15px;
|
|
46
|
+
|
|
47
|
+
position: absolute;
|
|
48
|
+
z-index: 10;
|
|
49
|
+
display: flex;
|
|
50
|
+
flex-direction: column;
|
|
51
|
+
box-sizing: border-box;
|
|
52
|
+
min-width: 120px; // popover.menu > contents (_menus.scss:2-4)
|
|
53
|
+
padding: 8px; // popover > contents (_popovers.scss:14)
|
|
54
|
+
border-radius: var(--popover-radius);
|
|
55
|
+
background-color: var(--popover-bg-color, var(--window-bg-color, #fff));
|
|
56
|
+
color: var(--popover-fg-color, var(--window-fg-color));
|
|
57
|
+
|
|
58
|
+
// The exact three layers of _popovers.scss:18-20. The COUNT is load-bearing:
|
|
59
|
+
// the split button shipped two.
|
|
60
|
+
box-shadow:
|
|
61
|
+
0 0 0 1px rgba(0, 0, 0, 0.05),
|
|
62
|
+
0 1px 5px 1px rgba(0, 0, 0, 0.09),
|
|
63
|
+
0 2px 14px 3px rgba(0, 0, 0, 0.05);
|
|
64
|
+
|
|
65
|
+
// _popovers.scss:23-27 — the innermost layer becomes a real hairline so the
|
|
66
|
+
// surface has a visible edge when the shadow alone is not enough. Missing
|
|
67
|
+
// from all three copies.
|
|
68
|
+
@media (prefers-contrast: more) {
|
|
69
|
+
box-shadow:
|
|
70
|
+
0 0 0 1px var(--separator-color),
|
|
71
|
+
0 1px 5px 1px rgba(0, 0, 0, 0.09),
|
|
72
|
+
0 2px 14px 3px rgba(0, 0, 0, 0.05);
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
// `popover.menu > contents { padding: 0 }` + `$menu_margin` on the item box
|
|
76
|
+
// (_menus.scss:58-66), flattened onto the single surface node.
|
|
77
|
+
&[menu] {
|
|
78
|
+
padding: 6px;
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
// --- Placement. Pure CSS, as it always was: nothing measures a rect and
|
|
82
|
+
// --- nothing flips on overflow, in either the element or the core.
|
|
83
|
+
&[data-position='bottom'] {
|
|
84
|
+
top: calc(100% + #{$popover-gap});
|
|
85
|
+
}
|
|
86
|
+
|
|
87
|
+
&[data-position='top'] {
|
|
88
|
+
bottom: calc(100% + #{$popover-gap});
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
&[data-position='start'] {
|
|
92
|
+
top: 0;
|
|
93
|
+
right: calc(100% + #{$popover-gap});
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
&[data-position='end'] {
|
|
97
|
+
top: 0;
|
|
98
|
+
left: calc(100% + #{$popover-gap});
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
// `align` picks the edge the surface lines up with, and only applies on the
|
|
102
|
+
// vertical axis — a start/end popover is already pinned horizontally.
|
|
103
|
+
&[data-position='bottom'],
|
|
104
|
+
&[data-position='top'] {
|
|
105
|
+
&[data-align='start'] {
|
|
106
|
+
left: 0;
|
|
107
|
+
}
|
|
108
|
+
|
|
109
|
+
&[data-align='end'] {
|
|
110
|
+
right: 0;
|
|
111
|
+
}
|
|
112
|
+
}
|
|
113
|
+
}
|
|
114
|
+
|
|
115
|
+
// A popover row — libadwaita's `modelbutton` (_menus.scss:134-156).
|
|
116
|
+
.adw-popover-item {
|
|
117
|
+
box-sizing: border-box;
|
|
118
|
+
display: flex;
|
|
119
|
+
align-items: center;
|
|
120
|
+
gap: var(--spacing-xs);
|
|
121
|
+
width: 100%;
|
|
122
|
+
min-height: 32px; // :135
|
|
123
|
+
min-width: 40px; // :136
|
|
124
|
+
margin: 0;
|
|
125
|
+
// `padding: 0 $menu_padding` (:137) — $menu_padding is 12px (_common.scss:12),
|
|
126
|
+
// and the vertical inset comes from min-height, not from padding. No 12px
|
|
127
|
+
// spacing token exists in this port, so the value is literal like the radius.
|
|
128
|
+
padding: 0 12px;
|
|
129
|
+
border: none;
|
|
130
|
+
border-radius: 9px; // $menu_radius (:138) — NOT calc(--button-radius - 2px), which two copies invented
|
|
131
|
+
background-color: transparent; // :139
|
|
132
|
+
color: inherit;
|
|
133
|
+
font-family: var(--font-family);
|
|
134
|
+
font-size: var(--font-size-base);
|
|
135
|
+
text-align: start;
|
|
136
|
+
cursor: pointer;
|
|
137
|
+
transition: background-color 0.1s ease;
|
|
138
|
+
|
|
139
|
+
// `&:hover, &:selected { background-color: $selected_color }` (:141-144).
|
|
140
|
+
// `:selected` is GTK's keyboard-highlight pseudo-class; in the DOM that state
|
|
141
|
+
// is focus, so `.selected` (the drop-down's chosen row) and `:focus` share it.
|
|
142
|
+
&:hover,
|
|
143
|
+
&:focus,
|
|
144
|
+
&.selected {
|
|
145
|
+
background-color: var(--button-hover-color);
|
|
146
|
+
}
|
|
147
|
+
|
|
148
|
+
&:active {
|
|
149
|
+
background-color: var(--button-active-color); // $selected_active_color (:146-148)
|
|
150
|
+
}
|
|
151
|
+
|
|
152
|
+
// :150-156 — a contrast-mode ring on the same three states.
|
|
153
|
+
@media (prefers-contrast: more) {
|
|
154
|
+
&:hover,
|
|
155
|
+
&:focus,
|
|
156
|
+
&.selected,
|
|
157
|
+
&:active {
|
|
158
|
+
box-shadow: inset 0 0 0 1px var(--separator-color);
|
|
159
|
+
}
|
|
160
|
+
}
|
|
161
|
+
|
|
162
|
+
&:focus-visible {
|
|
163
|
+
outline: 2px solid var(--accent-color);
|
|
164
|
+
outline-offset: -2px;
|
|
165
|
+
}
|
|
166
|
+
|
|
167
|
+
&[disabled] {
|
|
168
|
+
// `--disabled-opacity` is libadwaita's own variable (_colors.scss:320,
|
|
169
|
+
// 50%); this port does not define it yet, so the fallback carries the value.
|
|
170
|
+
opacity: var(--disabled-opacity, 0.5);
|
|
171
|
+
pointer-events: none;
|
|
172
|
+
}
|
|
173
|
+
}
|
|
174
|
+
|
|
175
|
+
// Optional heading atop a menu. libadwaita's `label.title` is `font-weight: bold`
|
|
176
|
+
// + `padding: 4px ($menu_padding + 20px)` (_menus.scss:180-183) — 32px of
|
|
177
|
+
// horizontal padding to centre the title over icon-indented rows, which
|
|
178
|
+
// libadwaita's own comment calls out as fragile. This port keeps the tighter
|
|
179
|
+
// inset `.adw-menu-button-title` already shipped rather than changing how the
|
|
180
|
+
// existing menus look; only the class name moved here. A DELIBERATE deviation,
|
|
181
|
+
// not a reading of :180-183.
|
|
182
|
+
.adw-popover-title {
|
|
183
|
+
padding: 4px var(--spacing-s) 6px;
|
|
184
|
+
font-weight: 700;
|
|
185
|
+
opacity: var(--dim-opacity);
|
|
186
|
+
}
|
package/scss/_preferences.scss
CHANGED
|
@@ -8,6 +8,14 @@
|
|
|
8
8
|
adw-preferences-group {
|
|
9
9
|
display: block;
|
|
10
10
|
|
|
11
|
+
// An author `display` beats the UA `[hidden] { display: none }` regardless of
|
|
12
|
+
// specificity, so without this a group hidden through the DOM `hidden`
|
|
13
|
+
// property would keep rendering — the search treats it as invisible
|
|
14
|
+
// (`is_visible_group`), and the two must agree.
|
|
15
|
+
&[hidden] {
|
|
16
|
+
display: none;
|
|
17
|
+
}
|
|
18
|
+
|
|
11
19
|
// The header is a flex row: a title/description label column on the left
|
|
12
20
|
// (stretches to fill) and the optional header-suffix on the trailing edge.
|
|
13
21
|
.adw-preferences-group-header {
|
|
@@ -15,6 +23,27 @@ adw-preferences-group {
|
|
|
15
23
|
align-items: center;
|
|
16
24
|
gap: var(--spacing-s);
|
|
17
25
|
padding: var(--spacing-xs) 2px;
|
|
26
|
+
|
|
27
|
+
// An author `display` beats the UA `[hidden] { display: none }` no matter
|
|
28
|
+
// the specificity, so `headerEl.hidden = true` did NOTHING here: an empty
|
|
29
|
+
// group kept its header box and its padding.
|
|
30
|
+
&[hidden] {
|
|
31
|
+
display: none;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
// libadwaita's own metrics, keyed off `is_single_line`:
|
|
35
|
+
// `> box.header:not(.single-line) { margin-bottom: 6px }` and
|
|
36
|
+
// `> box.single-line { min-height: 34px }`
|
|
37
|
+
// (refs/libadwaita/src/stylesheet/widgets/_preferences.scss:6-13). A
|
|
38
|
+
// title-only or suffix-only header is one line tall and needs the height
|
|
39
|
+
// floor instead of the gap below it.
|
|
40
|
+
&:not(.single-line) {
|
|
41
|
+
margin-bottom: 6px;
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
&.single-line {
|
|
45
|
+
min-height: 34px;
|
|
46
|
+
}
|
|
18
47
|
}
|
|
19
48
|
|
|
20
49
|
.adw-preferences-group-labels {
|
|
@@ -150,5 +150,22 @@ adw-preferences-dialog {
|
|
|
150
150
|
max-width: 600px;
|
|
151
151
|
margin: 0 auto;
|
|
152
152
|
padding: var(--spacing-xl) var(--spacing-m);
|
|
153
|
+
|
|
154
|
+
// The dialog keeps the <adw-preferences-page> ELEMENTS rather than hoisting
|
|
155
|
+
// their children out — the page's title / name / icon-name are what a
|
|
156
|
+
// search-result subtitle and a view switcher read. The page therefore has
|
|
157
|
+
// to be layout-transparent so its groups stay flex items of this column;
|
|
158
|
+
// a custom element's default `display: inline` would collapse it.
|
|
159
|
+
> adw-preferences-page {
|
|
160
|
+
display: contents;
|
|
161
|
+
|
|
162
|
+
// `display: contents` above beats the UA `[hidden] { display: none }`, so
|
|
163
|
+
// a page hidden through the DOM `hidden` property would keep rendering
|
|
164
|
+
// its groups while the search (which reads the same flag) had already
|
|
165
|
+
// dropped it from the corpus.
|
|
166
|
+
&[hidden] {
|
|
167
|
+
display: none;
|
|
168
|
+
}
|
|
169
|
+
}
|
|
153
170
|
}
|
|
154
171
|
}
|