@scattered-light/loomiere-mojave 0.22.0 → 0.22.2
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.
|
@@ -34,7 +34,7 @@ Not a Base UI part, so there is no base-ui.com page for it.
|
|
|
34
34
|
| `DatePickerTrigger` | |
|
|
35
35
|
| `DatePickerValue` | `data-placeholder` |
|
|
36
36
|
| `DatePickerClear` | |
|
|
37
|
-
| `DatePickerPopup` | `data-months`: `3` |
|
|
37
|
+
| `DatePickerPopup` | `data-months`: `3`, `1`; `data-layout`: `column` |
|
|
38
38
|
| `DatePickerFooter` | |
|
|
39
39
|
| `DatePickerSummary` | |
|
|
40
40
|
| `DatePickerActions` | |
|
|
@@ -6733,7 +6733,7 @@
|
|
|
6733
6733
|
}
|
|
6734
6734
|
|
|
6735
6735
|
|
|
6736
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
6736
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
6737
6737
|
/* Loomiere for Base UI: component styles. Brand-free: every value is a --sl- variable from a
|
|
6738
6738
|
Loomiere theme. Load the theme first:
|
|
6739
6739
|
@import '<your theme>/tokens.css';
|
|
@@ -6743,7 +6743,7 @@
|
|
|
6743
6743
|
/* Document defaults, in the reset layer so any unlayered rule wins over them, and so layered
|
|
6744
6744
|
frameworks (Chakra's recipes, Tailwind's utilities) are not undone by them. */
|
|
6745
6745
|
@layer reset {
|
|
6746
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
6746
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
6747
6747
|
/* CSS Reset - Mojave Theme */
|
|
6748
6748
|
|
|
6749
6749
|
/* ============================================
|
|
@@ -7187,7 +7187,7 @@ hr {
|
|
|
7187
7187
|
}
|
|
7188
7188
|
}
|
|
7189
7189
|
@layer reset {
|
|
7190
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
7190
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
7191
7191
|
/* Accessibility — base rules (no theme color dependencies). Theme-specific focus/invalid: accessibility-theme.css */
|
|
7192
7192
|
|
|
7193
7193
|
/* Remove default focus; keyboard focus styled in accessibility-theme.css */
|
|
@@ -7300,7 +7300,7 @@ main:focus {
|
|
|
7300
7300
|
|
|
7301
7301
|
}
|
|
7302
7302
|
@layer reset {
|
|
7303
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
7303
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
7304
7304
|
/* Focus, invalid, contrast — requires theme tokens (after theme-accessibility.css). */
|
|
7305
7305
|
|
|
7306
7306
|
:focus-visible {
|
|
@@ -7368,7 +7368,7 @@ button,
|
|
|
7368
7368
|
|
|
7369
7369
|
}
|
|
7370
7370
|
/* Component styles */
|
|
7371
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
7371
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
7372
7372
|
/* Accordion - Mojave Theme
|
|
7373
7373
|
*
|
|
7374
7374
|
* No component tokens. Hover, press, chevron, divider and motion are the disclosure
|
|
@@ -7489,7 +7489,7 @@ button,
|
|
|
7489
7489
|
overflow: hidden;
|
|
7490
7490
|
}
|
|
7491
7491
|
|
|
7492
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
7492
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
7493
7493
|
/* Alert Dialog - Mojave Theme
|
|
7494
7494
|
*
|
|
7495
7495
|
* No component tokens and no rules of its own. An alert dialog looks exactly like a
|
|
@@ -7498,7 +7498,7 @@ button,
|
|
|
7498
7498
|
* cancel quiet, and a destructive one bold with data-color="error".
|
|
7499
7499
|
*/
|
|
7500
7500
|
|
|
7501
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
7501
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
7502
7502
|
/* Autocomplete - Mojave Theme
|
|
7503
7503
|
*
|
|
7504
7504
|
* No component tokens. The input is Input (Input.css), the clear button is an icon
|
|
@@ -7700,7 +7700,7 @@ button,
|
|
|
7700
7700
|
(reset-accessibility.css).
|
|
7701
7701
|
============================================ */
|
|
7702
7702
|
|
|
7703
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
7703
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
7704
7704
|
/* Avatar - Mojave Theme
|
|
7705
7705
|
*
|
|
7706
7706
|
* A round picture with a ring in the page color, so avatars in a group cut out of each other in
|
|
@@ -7808,7 +7808,7 @@ button,
|
|
|
7808
7808
|
}
|
|
7809
7809
|
}
|
|
7810
7810
|
|
|
7811
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
7811
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
7812
7812
|
/* Button - Mojave Theme
|
|
7813
7813
|
*
|
|
7814
7814
|
* Colors are the brand's emphasis levels, sizes are control.*, text is the trigger
|
|
@@ -7958,7 +7958,7 @@ button,
|
|
|
7958
7958
|
font-size: var(--sl-icon-size-maximize);
|
|
7959
7959
|
}
|
|
7960
7960
|
|
|
7961
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
7961
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
7962
7962
|
/* Checkbox - Mojave Theme
|
|
7963
7963
|
* Sizes follow the label: the box is the icon size one tier above the label's text
|
|
7964
7964
|
* tier (like a button's icon) and the check mark one tier below it.
|
|
@@ -8115,7 +8115,7 @@ button,
|
|
|
8115
8115
|
border-radius: var(--sl-radius-pill);
|
|
8116
8116
|
}
|
|
8117
8117
|
|
|
8118
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
8118
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
8119
8119
|
/* Checkbox Group - Mojave Theme */
|
|
8120
8120
|
|
|
8121
8121
|
/* Each checkbox row is already a full tap target tall, so the rows sit close. */
|
|
@@ -8131,7 +8131,7 @@ button,
|
|
|
8131
8131
|
pointer-events: none;
|
|
8132
8132
|
}
|
|
8133
8133
|
|
|
8134
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
8134
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
8135
8135
|
/* Collapsible - Mojave Theme
|
|
8136
8136
|
*
|
|
8137
8137
|
* No component tokens. Hover, press, chevron and motion are the disclosure concept
|
|
@@ -8247,7 +8247,7 @@ button,
|
|
|
8247
8247
|
background: var(--sl-surface-raised);
|
|
8248
8248
|
}
|
|
8249
8249
|
|
|
8250
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
8250
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
8251
8251
|
/* Combobox - Mojave Theme
|
|
8252
8252
|
*
|
|
8253
8253
|
* No component tokens. The input is Input (Input.css); the chips box is a field; the
|
|
@@ -8732,7 +8732,7 @@ button,
|
|
|
8732
8732
|
color: var(--sl-text-tertiary);
|
|
8733
8733
|
}
|
|
8734
8734
|
|
|
8735
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
8735
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
8736
8736
|
/* Context Menu - Mojave Theme
|
|
8737
8737
|
*
|
|
8738
8738
|
* No component tokens. Opens on right-click; the trigger area only sets the cursor. The popup is the popup concept, rows are item rows at the
|
|
@@ -8901,7 +8901,7 @@ button,
|
|
|
8901
8901
|
stroke-width: var(--sl-stroke-default);
|
|
8902
8902
|
}
|
|
8903
8903
|
|
|
8904
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
8904
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
8905
8905
|
/* Dialog and Alert dialog - Mojave Theme
|
|
8906
8906
|
*
|
|
8907
8907
|
* Both are centered modals built from the modal concept (tokens/semantic/modal.json):
|
|
@@ -9047,7 +9047,7 @@ button,
|
|
|
9047
9047
|
margin-top: var(--sl-modal-actions-spacing);
|
|
9048
9048
|
}
|
|
9049
9049
|
|
|
9050
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
9050
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
9051
9051
|
/* Drawer - a panel that slides in from an edge and can be swiped away.
|
|
9052
9052
|
The surface, scrim, heading and motion are the modal concept's (--sl-modal-*), so a
|
|
9053
9053
|
drawer reads as a dialog's sibling; only its size and grab bar are its own
|
|
@@ -9180,7 +9180,7 @@ button,
|
|
|
9180
9180
|
color: var(--sl-modal-description-color);
|
|
9181
9181
|
}
|
|
9182
9182
|
|
|
9183
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
9183
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
9184
9184
|
/* Field - Mojave Theme
|
|
9185
9185
|
*
|
|
9186
9186
|
* Label, control, description and error. No component tokens: spacing is the field
|
|
@@ -9241,7 +9241,7 @@ textarea.FieldControl {
|
|
|
9241
9241
|
height: auto;
|
|
9242
9242
|
}
|
|
9243
9243
|
|
|
9244
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
9244
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
9245
9245
|
/* Fieldset - Mojave Theme
|
|
9246
9246
|
*
|
|
9247
9247
|
* No component tokens: a titled group of fields, spaced by the stack gaps, with
|
|
@@ -9283,7 +9283,7 @@ textarea.FieldControl {
|
|
|
9283
9283
|
color: var(--sl-text-secondary);
|
|
9284
9284
|
}
|
|
9285
9285
|
|
|
9286
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
9286
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
9287
9287
|
/* Form - Mojave Theme
|
|
9288
9288
|
*
|
|
9289
9289
|
* No component tokens: fields stack with the large block space, and the action
|
|
@@ -9303,7 +9303,7 @@ textarea.FieldControl {
|
|
|
9303
9303
|
margin-top: var(--sl-space-block-md);
|
|
9304
9304
|
}
|
|
9305
9305
|
|
|
9306
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
9306
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
9307
9307
|
/* Input - Mojave Theme
|
|
9308
9308
|
*
|
|
9309
9309
|
* No component tokens: the look is the field concept (tokens/semantic/field.json),
|
|
@@ -9450,7 +9450,7 @@ textarea.FieldControl {
|
|
|
9450
9450
|
padding-inline: var(--sl-control-padding-inline-lg);
|
|
9451
9451
|
}
|
|
9452
9452
|
|
|
9453
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
9453
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
9454
9454
|
/* Menu - Mojave Theme
|
|
9455
9455
|
*
|
|
9456
9456
|
* No component tokens. The trigger is a Button. The popup is the popup concept, rows are item rows at the
|
|
@@ -9599,7 +9599,7 @@ textarea.FieldControl {
|
|
|
9599
9599
|
color: var(--sl-text-tertiary);
|
|
9600
9600
|
}
|
|
9601
9601
|
|
|
9602
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
9602
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
9603
9603
|
/* Menubar - Mojave Theme
|
|
9604
9604
|
*
|
|
9605
9605
|
* No component tokens. A row of quiet triggers, each opening a menu. The popup is the popup concept, rows are item rows at the
|
|
@@ -9792,7 +9792,7 @@ textarea.FieldControl {
|
|
|
9792
9792
|
color: var(--sl-text-tertiary);
|
|
9793
9793
|
}
|
|
9794
9794
|
|
|
9795
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
9795
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
9796
9796
|
/* Meter - Mojave Theme
|
|
9797
9797
|
*
|
|
9798
9798
|
* A gauge (tokens/semantic/gauge.json). The fill is the solid color of the scope around it:
|
|
@@ -9855,7 +9855,7 @@ textarea.FieldControl {
|
|
|
9855
9855
|
height: var(--sl-gauge-height-lg);
|
|
9856
9856
|
}
|
|
9857
9857
|
|
|
9858
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
9858
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
9859
9859
|
/* Navigation Menu - Mojave Theme
|
|
9860
9860
|
*
|
|
9861
9861
|
* The strip is the bar concept, the panel is the popup concept and each link is an item
|
|
@@ -10275,7 +10275,7 @@ textarea.FieldControl {
|
|
|
10275
10275
|
width: 100%;
|
|
10276
10276
|
}
|
|
10277
10277
|
|
|
10278
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
10278
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
10279
10279
|
/* Number Field - Mojave Theme
|
|
10280
10280
|
*
|
|
10281
10281
|
* No component tokens. The input is Input (Input.css) and the label, description and
|
|
@@ -10366,7 +10366,7 @@ textarea.FieldControl {
|
|
|
10366
10366
|
user-select: none;
|
|
10367
10367
|
}
|
|
10368
10368
|
|
|
10369
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
10369
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
10370
10370
|
/* OTP Field - Mojave Theme
|
|
10371
10371
|
*
|
|
10372
10372
|
* One-time code entry: a row of single-character inputs. Each slot is the same control as Input
|
|
@@ -10429,7 +10429,7 @@ textarea.FieldControl {
|
|
|
10429
10429
|
letter-spacing: var(--sl-font-body-magnify-letter-spacing);
|
|
10430
10430
|
}
|
|
10431
10431
|
|
|
10432
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
10432
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
10433
10433
|
/* Popover - Mojave Theme */
|
|
10434
10434
|
|
|
10435
10435
|
/* ============================================
|
|
@@ -10594,7 +10594,7 @@ textarea.FieldControl {
|
|
|
10594
10594
|
fill: var(--sl-popup-arrow-stroke);
|
|
10595
10595
|
}
|
|
10596
10596
|
|
|
10597
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
10597
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
10598
10598
|
/* Preview Card - Mojave Theme
|
|
10599
10599
|
*
|
|
10600
10600
|
* The popup concept (surface, arrow, motion) with a title-magnify title and condense
|
|
@@ -10711,7 +10711,7 @@ textarea.FieldControl {
|
|
|
10711
10711
|
fill: var(--sl-popup-arrow-stroke);
|
|
10712
10712
|
}
|
|
10713
10713
|
|
|
10714
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
10714
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
10715
10715
|
/* Progress - Mojave Theme
|
|
10716
10716
|
*
|
|
10717
10717
|
* A gauge (tokens/semantic/gauge.json), the same bar as Meter. The fill is the solid color of
|
|
@@ -10788,7 +10788,7 @@ textarea.FieldControl {
|
|
|
10788
10788
|
height: var(--sl-gauge-height-lg);
|
|
10789
10789
|
}
|
|
10790
10790
|
|
|
10791
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
10791
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
10792
10792
|
/* Radio - Mojave Theme
|
|
10793
10793
|
* Same box as Checkbox, always round. Sizes follow the label the same way, and the
|
|
10794
10794
|
* dot is a share of the circle (check.dot-scale).
|
|
@@ -10940,7 +10940,7 @@ textarea.FieldControl {
|
|
|
10940
10940
|
gap: var(--sl-gap-stack-sm);
|
|
10941
10941
|
}
|
|
10942
10942
|
|
|
10943
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
10943
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
10944
10944
|
/* Scroll Area - Mojave Theme
|
|
10945
10945
|
*
|
|
10946
10946
|
* The scrollbar is the content scrollbar (content.scrollbar-*): a track that stays clear until
|
|
@@ -11022,7 +11022,7 @@ textarea.FieldControl {
|
|
|
11022
11022
|
background: transparent;
|
|
11023
11023
|
}
|
|
11024
11024
|
|
|
11025
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
11025
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
11026
11026
|
/* Select - Mojave Theme
|
|
11027
11027
|
*
|
|
11028
11028
|
* The trigger is a field (the field pattern, control sizes, the base text style); the
|
|
@@ -11307,7 +11307,7 @@ textarea.FieldControl {
|
|
|
11307
11307
|
stroke-width: var(--sl-stroke-default);
|
|
11308
11308
|
}
|
|
11309
11309
|
|
|
11310
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
11310
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
11311
11311
|
/* Separator - Mojave Theme
|
|
11312
11312
|
*
|
|
11313
11313
|
* A hairline in the everyday divider color (border.default), one stroke thick, with a step of
|
|
@@ -11335,7 +11335,7 @@ textarea.FieldControl {
|
|
|
11335
11335
|
margin-inline: var(--sl-space-4);
|
|
11336
11336
|
}
|
|
11337
11337
|
|
|
11338
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
11338
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
11339
11339
|
/* Slider - Mojave Theme
|
|
11340
11340
|
*
|
|
11341
11341
|
* A slider is a gauge you can drag: the track, fill and label row are gauge.* (the same bar as
|
|
@@ -11501,7 +11501,7 @@ textarea.FieldControl {
|
|
|
11501
11501
|
transform: translate(-50%, 50%);
|
|
11502
11502
|
}
|
|
11503
11503
|
|
|
11504
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
11504
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
11505
11505
|
/* Switch - Mojave Theme
|
|
11506
11506
|
* Switch keeps its track sizes. The thumb, its travel and the ON/OFF text are
|
|
11507
11507
|
* worked out from them: the thumb fills the track's height inside the padding,
|
|
@@ -11667,7 +11667,7 @@ textarea.FieldControl {
|
|
|
11667
11667
|
color: var(--sl-text-disabled);
|
|
11668
11668
|
}
|
|
11669
11669
|
|
|
11670
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
11670
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
11671
11671
|
/* Tabs - Mojave Theme
|
|
11672
11672
|
*
|
|
11673
11673
|
* No component tokens. The divider, the selected line and color, hover and the disabled
|
|
@@ -11803,7 +11803,7 @@ textarea.FieldControl {
|
|
|
11803
11803
|
padding: var(--sl-space-6);
|
|
11804
11804
|
}
|
|
11805
11805
|
|
|
11806
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
11806
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
11807
11807
|
/* Toast - Mojave Theme
|
|
11808
11808
|
*
|
|
11809
11809
|
* A toast is a notice (tokens/semantic/notice.json) on the popup surface. A toast whose type
|
|
@@ -12039,7 +12039,7 @@ textarea.FieldControl {
|
|
|
12039
12039
|
flex-shrink: 0;
|
|
12040
12040
|
}
|
|
12041
12041
|
|
|
12042
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
12042
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
12043
12043
|
/* Toggle - Mojave Theme
|
|
12044
12044
|
* A toggle is a button that stays pressed: the same heights, padding, gap and
|
|
12045
12045
|
* trigger text style as a button of the same size. Pressed, it takes its emphasis level's
|
|
@@ -12151,7 +12151,7 @@ textarea.FieldControl {
|
|
|
12151
12151
|
height: var(--sl-icon-size-maximize);
|
|
12152
12152
|
}
|
|
12153
12153
|
|
|
12154
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
12154
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
12155
12155
|
/* Toggle Group - Mojave Theme
|
|
12156
12156
|
*
|
|
12157
12157
|
* No component tokens. The strip is the bar concept (tokens/semantic/bar.json); the
|
|
@@ -12213,7 +12213,7 @@ textarea.FieldControl {
|
|
|
12213
12213
|
outline-offset: var(--sl-focus-outline-offset-inset);
|
|
12214
12214
|
}
|
|
12215
12215
|
|
|
12216
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
12216
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
12217
12217
|
/* Toolbar - Mojave Theme
|
|
12218
12218
|
*
|
|
12219
12219
|
* The strip is the bar concept (tokens/semantic/bar.json). Buttons, toggles, selects
|
|
@@ -12275,7 +12275,7 @@ textarea.FieldControl {
|
|
|
12275
12275
|
max-width: var(--sl-toolbar-input-max-width);
|
|
12276
12276
|
}
|
|
12277
12277
|
|
|
12278
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
12278
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
12279
12279
|
/* Tooltip - Mojave Theme
|
|
12280
12280
|
*
|
|
12281
12281
|
* The inverse surface (surface.inverse, text.on-inverse-surface) with condense text, so a tooltip
|
|
@@ -12336,7 +12336,7 @@ textarea.FieldControl {
|
|
|
12336
12336
|
}
|
|
12337
12337
|
|
|
12338
12338
|
/* Custom components: not Base UI parts. Built from existing concepts and tokens. */
|
|
12339
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
12339
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
12340
12340
|
/* Badge
|
|
12341
12341
|
*
|
|
12342
12342
|
* A status or count label. Not a Base UI part, and not interactive: no hover or focus.
|
|
@@ -12441,7 +12441,7 @@ textarea.FieldControl {
|
|
|
12441
12441
|
height: var(--sl-badge-dot-base);
|
|
12442
12442
|
}
|
|
12443
12443
|
|
|
12444
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
12444
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
12445
12445
|
/*
|
|
12446
12446
|
* DatePicker: a field that opens a calendar for one date or a period.
|
|
12447
12447
|
* Not a Base UI part. The popup is Popover on a wide viewport and Drawer
|
|
@@ -12925,6 +12925,23 @@ textarea.FieldControl {
|
|
|
12925
12925
|
inline-size: min(var(--available-width, 100vw), 64rem);
|
|
12926
12926
|
}
|
|
12927
12927
|
|
|
12928
|
+
/* One month: the popup is as wide as its calendar (seven day cells and the panel padding), plus the preset column
|
|
12929
|
+
when the presets sit beside it. Before, a single date opened a 52rem popup, the width for two months, with one
|
|
12930
|
+
month in it and the rest blank. */
|
|
12931
|
+
.DatePickerPopup[data-months='1'] {
|
|
12932
|
+
--sl-date-picker-columns: calc(7 * var(--sl-calendar-day-size));
|
|
12933
|
+
inline-size: min(var(--available-width, 100vw), calc(var(--sl-date-picker-columns) + 2 * var(--sl-calendar-panel-padding)));
|
|
12934
|
+
max-inline-size: var(--available-width, 100vw);
|
|
12935
|
+
}
|
|
12936
|
+
|
|
12937
|
+
.DatePickerPopup[data-months='1']:has(.CalendarWeekNumber) {
|
|
12938
|
+
--sl-date-picker-columns: calc(8 * var(--sl-calendar-day-size));
|
|
12939
|
+
}
|
|
12940
|
+
|
|
12941
|
+
.DatePickerPopup[data-months='1']:has(.DatePickerPanel[data-layout='column'] .DatePickerPresets) {
|
|
12942
|
+
inline-size: min(var(--available-width, 100vw), calc(var(--sl-date-picker-columns) + 11rem + var(--sl-calendar-month-gap) + 2 * var(--sl-calendar-panel-padding)));
|
|
12943
|
+
}
|
|
12944
|
+
|
|
12928
12945
|
.DatePickerPanel {
|
|
12929
12946
|
display: grid;
|
|
12930
12947
|
/* 11rem is the preset column. Layout, not a brand size: wide enough for "Year to date" and a hint. */
|
|
@@ -13014,7 +13031,7 @@ textarea.FieldControl {
|
|
|
13014
13031
|
flex-basis: 100%;
|
|
13015
13032
|
}
|
|
13016
13033
|
|
|
13017
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
13034
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
13018
13035
|
/* Money field
|
|
13019
13036
|
*
|
|
13020
13037
|
* An amount of money, built on Number field. The value is an integer in minor units
|
|
@@ -13359,7 +13376,7 @@ textarea.FieldControl {
|
|
|
13359
13376
|
letter-spacing: var(--sl-font-body-base-letter-spacing);
|
|
13360
13377
|
}
|
|
13361
13378
|
|
|
13362
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
13379
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
13363
13380
|
/* ListDetail
|
|
13364
13381
|
*
|
|
13365
13382
|
* The detail of one item, next to its list. Not a Base UI part. It is a Splitter
|
|
@@ -13486,7 +13503,7 @@ textarea.FieldControl {
|
|
|
13486
13503
|
background: transparent;
|
|
13487
13504
|
}
|
|
13488
13505
|
|
|
13489
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
13506
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
13490
13507
|
/* Splitter
|
|
13491
13508
|
*
|
|
13492
13509
|
* Two or more panels and a handle between them. Not a Base UI part. It follows the
|
|
@@ -13694,7 +13711,7 @@ textarea.FieldControl {
|
|
|
13694
13711
|
background: var(--sl-border-default);
|
|
13695
13712
|
}
|
|
13696
13713
|
|
|
13697
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
13714
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
13698
13715
|
/* EmptyState
|
|
13699
13716
|
*
|
|
13700
13717
|
* The block a page, pane, table, list or popup shows when it has nothing to show.
|
|
@@ -13950,7 +13967,7 @@ textarea.FieldControl {
|
|
|
13950
13967
|
color: inherit;
|
|
13951
13968
|
}
|
|
13952
13969
|
|
|
13953
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
13970
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
13954
13971
|
/* Table - Mojave Theme
|
|
13955
13972
|
*
|
|
13956
13973
|
* Base UI has no table, so this styles the native <table class="Table"> elements with the
|
|
@@ -14231,7 +14248,7 @@ textarea.FieldControl {
|
|
|
14231
14248
|
color: inherit;
|
|
14232
14249
|
}
|
|
14233
14250
|
|
|
14234
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
14251
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
14235
14252
|
/* Collection
|
|
14236
14253
|
*
|
|
14237
14254
|
* DataTable, DataList, the toolbar and the pagination, in one place so the two views
|
|
@@ -14242,7 +14259,7 @@ textarea.FieldControl {
|
|
|
14242
14259
|
* the tabs and the search where they are, so selecting rows does not grow the toolbar.
|
|
14243
14260
|
*/
|
|
14244
14261
|
|
|
14245
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
14262
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
14246
14263
|
/* Collection toolbar
|
|
14247
14264
|
*
|
|
14248
14265
|
* The wrap follows the toolbar's own width, not the window: a table in a narrow pane wraps
|
|
@@ -14454,7 +14471,7 @@ textarea.FieldControl {
|
|
|
14454
14471
|
margin-inline-start: auto;
|
|
14455
14472
|
}
|
|
14456
14473
|
|
|
14457
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
14474
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
14458
14475
|
/* DataTable additions on top of .Table.
|
|
14459
14476
|
*
|
|
14460
14477
|
* Sort buttons fill the header cell and inherit its hover, so old aria-sort markup keeps
|
|
@@ -14653,7 +14670,7 @@ textarea.FieldControl {
|
|
|
14653
14670
|
}
|
|
14654
14671
|
}
|
|
14655
14672
|
|
|
14656
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
14673
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
14657
14674
|
/* DataList
|
|
14658
14675
|
*
|
|
14659
14676
|
* The same rows as the table, in one container with the table's borders, hover, selected
|
|
@@ -14795,7 +14812,7 @@ textarea.FieldControl {
|
|
|
14795
14812
|
transition: opacity var(--sl-duration-fast) var(--sl-easing-default);
|
|
14796
14813
|
}
|
|
14797
14814
|
|
|
14798
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
14815
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
14799
14816
|
/* Collection cards
|
|
14800
14817
|
*
|
|
14801
14818
|
* The page of a collection as a grid. Columns fill the width, none narrower than
|
|
@@ -14820,7 +14837,7 @@ textarea.FieldControl {
|
|
|
14820
14837
|
flex: 1 1 auto;
|
|
14821
14838
|
}
|
|
14822
14839
|
|
|
14823
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
14840
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
14824
14841
|
/* Pagination
|
|
14825
14842
|
*
|
|
14826
14843
|
* Not tied to a collection. Anything with a page, a page count and a total can use it.
|
|
@@ -14845,7 +14862,7 @@ textarea.FieldControl {
|
|
|
14845
14862
|
margin: 0;
|
|
14846
14863
|
}
|
|
14847
14864
|
|
|
14848
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
14865
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
14849
14866
|
/* EditableList
|
|
14850
14867
|
*
|
|
14851
14868
|
* One table at every width, so a field is not submitted twice. Under the stack width each
|
|
@@ -14944,7 +14961,7 @@ textarea.FieldControl {
|
|
|
14944
14961
|
}
|
|
14945
14962
|
}
|
|
14946
14963
|
|
|
14947
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
14964
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
14948
14965
|
/* Sheet
|
|
14949
14966
|
*
|
|
14950
14967
|
* A working-paper surface: the raised surface with a heavier rule across its top
|
|
@@ -15062,7 +15079,7 @@ textarea.FieldControl {
|
|
|
15062
15079
|
border-top: 0;
|
|
15063
15080
|
}
|
|
15064
15081
|
|
|
15065
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
15082
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
15066
15083
|
/* StatFigure
|
|
15067
15084
|
*
|
|
15068
15085
|
* One large figure with a caps label above and a caption under it. The label is
|
|
@@ -15123,7 +15140,7 @@ textarea.FieldControl {
|
|
|
15123
15140
|
color: var(--sl-stat-figure-caption-color);
|
|
15124
15141
|
}
|
|
15125
15142
|
|
|
15126
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
15143
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
15127
15144
|
/* StatCard
|
|
15128
15145
|
*
|
|
15129
15146
|
* A card for one thing a page lists: a name (the heading), a caption, and a row of StatFigures
|
|
@@ -15285,7 +15302,7 @@ textarea.FieldControl {
|
|
|
15285
15302
|
white-space: nowrap;
|
|
15286
15303
|
}
|
|
15287
15304
|
|
|
15288
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
15305
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
15289
15306
|
/* DescriptionList
|
|
15290
15307
|
*
|
|
15291
15308
|
* Label and value pairs in a native dl, one DescriptionItem (a div holding a dt and a dd)
|
|
@@ -15363,7 +15380,7 @@ textarea.FieldControl {
|
|
|
15363
15380
|
text-align: end;
|
|
15364
15381
|
}
|
|
15365
15382
|
|
|
15366
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
15383
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
15367
15384
|
/* AppBar
|
|
15368
15385
|
*
|
|
15369
15386
|
* The bar across the top of an app window, one row on a line in the rule color. The line is
|
|
@@ -15397,7 +15414,7 @@ textarea.FieldControl {
|
|
|
15397
15414
|
background: var(--sl-app-bar-divider-color);
|
|
15398
15415
|
}
|
|
15399
15416
|
|
|
15400
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
15417
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
15401
15418
|
/* PickerButton
|
|
15402
15419
|
*
|
|
15403
15420
|
* A trigger with a caps label before the current choice: CLIENT Alpha Services. The field
|
|
@@ -15497,7 +15514,7 @@ textarea.FieldControl {
|
|
|
15497
15514
|
transform: rotate(180deg);
|
|
15498
15515
|
}
|
|
15499
15516
|
|
|
15500
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
15517
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
15501
15518
|
/* MultiSelect
|
|
15502
15519
|
*
|
|
15503
15520
|
* A PickerButton trigger that opens a popover of checkbox rows (label, count at the end) and a
|
|
@@ -15519,6 +15536,7 @@ textarea.FieldControl {
|
|
|
15519
15536
|
|
|
15520
15537
|
.MultiSelectOption {
|
|
15521
15538
|
display: flex;
|
|
15539
|
+
flex-direction: row; /* an app's global label rule may stack children */
|
|
15522
15540
|
align-items: center;
|
|
15523
15541
|
gap: var(--sl-gap-control);
|
|
15524
15542
|
padding-inline: var(--sl-control-padding-inline);
|
|
@@ -15550,7 +15568,7 @@ textarea.FieldControl {
|
|
|
15550
15568
|
border-top: 1px solid var(--sl-popup-separator-color);
|
|
15551
15569
|
}
|
|
15552
15570
|
|
|
15553
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
15571
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
15554
15572
|
/* PickerSplit
|
|
15555
15573
|
*
|
|
15556
15574
|
* A PickerButton whose choice is itself a control: the main part (CLIENT Alpha Services) acts,
|
|
@@ -15648,7 +15666,7 @@ textarea.FieldControl {
|
|
|
15648
15666
|
transform: rotate(180deg);
|
|
15649
15667
|
}
|
|
15650
15668
|
|
|
15651
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
15669
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
15652
15670
|
/* SplitButton
|
|
15653
15671
|
*
|
|
15654
15672
|
* A Button and a square Menu trigger side by side, joined into one outline: the inner corners
|
|
@@ -15672,7 +15690,7 @@ textarea.FieldControl {
|
|
|
15672
15690
|
margin-inline-start: -1px;
|
|
15673
15691
|
}
|
|
15674
15692
|
|
|
15675
|
-
/* @scattered-light/loomiere-base-ui 0.22.
|
|
15693
|
+
/* @scattered-light/loomiere-base-ui 0.22.2 · styles for @base-ui/react 1.9.0 */
|
|
15676
15694
|
/* SideNav
|
|
15677
15695
|
*
|
|
15678
15696
|
* The column of links down the side of a workspace. Rows are ruled apart with a hairline; the
|