@teseor/css 1.15.3 → 1.15.6

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 (37) hide show
  1. package/dist/compiled.css +1 -1
  2. package/dist/index.css +16 -16
  3. package/package.json +1 -1
  4. package/src/components/actions/button/index.scss +6 -6
  5. package/src/components/content/spacer/docs.html +6 -6
  6. package/src/components/data-display/card/index.scss +2 -2
  7. package/src/components/data-display/icon/docs.html +8 -8
  8. package/src/components/data-display/status/docs.html +1 -1
  9. package/src/components/feedback/progress/docs.html +3 -3
  10. package/src/components/feedback/progress/index.scss +3 -3
  11. package/src/components/forms/field/index.scss +3 -3
  12. package/src/components/forms/number-input/index.scss +2 -2
  13. package/src/components/forms/password-input/index.scss +2 -2
  14. package/src/components/forms/search-input/index.scss +2 -2
  15. package/src/components/forms/toggle/index.scss +1 -1
  16. package/src/components/navigation/dropdown-menu/index.scss +2 -2
  17. package/src/components/navigation/menu/index.scss +2 -2
  18. package/src/components/typography/link/index.scss +2 -2
  19. package/src/components/typography/list/docs.html +1 -1
  20. package/src/config/tokens/_variables.scss +14 -0
  21. package/src/config/tokens/colors/docs.html +2 -2
  22. package/src/config/tokens/docs.html +7 -7
  23. package/src/config/tokens/spacing/docs.html +6 -6
  24. package/src/debug/docs.html +3 -3
  25. package/src/layout/aspect-ratio/docs.html +6 -6
  26. package/src/layout/column/docs.html +11 -11
  27. package/src/layout/container/docs.html +7 -7
  28. package/src/layout/content/docs.html +3 -3
  29. package/src/layout/grid/docs.html +31 -31
  30. package/src/layout/grid/index.scss +4 -2
  31. package/src/layout/main/docs.html +3 -3
  32. package/src/layout/nav-rail/docs.html +1 -1
  33. package/src/layout/row/docs.html +22 -22
  34. package/src/layout/sidebar-nav/index.scss +2 -2
  35. package/src/utilities/container/docs.html +2 -2
  36. package/src/utilities/display/docs.html +5 -5
  37. package/src/utilities/spacing/docs.html +11 -11
package/src/utilities/display/docs.html CHANGED
@@ -4,24 +4,24 @@ description: Flexbox and display utilities.
4
4
  ---
5
5
 
6
6
  <!-- @flex_layout -->
7
- <div class="ui-flex ui-justify-between ui-items-center ui-gap-2 ui-p-2" style="background: var(--ui-color-bg-muted)">
7
+ <div class="ui-flex ui-justify-between ui-items-center ui-gap-2 ui-p-2 ui-bg-muted">
8
8
  <span>{{ t('start', 'Start') }}</span>
9
9
  <span>{{ t('center_items_center', 'Center (items-center)') }}</span>
10
10
  <span>{{ t('end', 'End') }}</span>
11
11
  </div>
12
12
 
13
13
  <!-- @flex_direction | row -->
14
- <div class="ui-flex ui-flex-col ui-gap-1 ui-p-2" style="background: var(--ui-color-bg-muted)">
14
+ <div class="ui-flex ui-flex-col ui-gap-1 ui-p-2 ui-bg-muted">
15
15
  <span>{{ t('column_1', 'Column 1') }}</span>
16
16
  <span>{{ t('column_2', 'Column 2') }}</span>
17
17
  <span>{{ t('column_3', 'Column 3') }}</span>
18
18
  </div>
19
- <div class="ui-flex ui-flex-row ui-gap-1 ui-p-2" style="background: var(--ui-color-bg-muted)">
19
+ <div class="ui-flex ui-flex-row ui-gap-1 ui-p-2 ui-bg-muted">
20
20
  <span>{{ t('row_1', 'Row 1') }}</span>
21
21
  <span>{{ t('row_2', 'Row 2') }}</span>
22
22
  <span>{{ t('row_3', 'Row 3') }}</span>
23
23
  </div>
24
24
 
25
25
  <!-- @visibility | row -->
26
- <span class="ui-visible ui-p-1" style="background: var(--ui-color-bg-muted)">{{ t('visible', 'Visible') }}</span>
27
- <span class="ui-invisible ui-p-1" style="background: var(--ui-color-bg-muted)">{{ t('invisible_hidden_but_occupies_space', 'Invisible (hidden but occupies space)') }}</span>
26
+ <span class="ui-visible ui-p-1 ui-bg-muted">{{ t('visible', 'Visible') }}</span>
27
+ <span class="ui-invisible ui-p-1 ui-bg-muted">{{ t('invisible_hidden_but_occupies_space', 'Invisible (hidden but occupies space)') }}</span>
package/src/utilities/spacing/docs.html CHANGED
@@ -4,23 +4,23 @@ description: Margin and padding utilities aligned to 8px grid.
4
4
  ---
5
5
 
6
6
  <!-- @padding | column -->
7
- <div class="ui-p-1" style="background: var(--ui-color-bg-muted)">{{ t('p_1_8px_padding', 'p-1 (8px padding)') }}</div>
8
- <div class="ui-p-2" style="background: var(--ui-color-bg-muted)">{{ t('p_2_16px_padding', 'p-2 (16px padding)') }}</div>
9
- <div class="ui-p-4" style="background: var(--ui-color-bg-muted)">{{ t('p_4_32px_padding', 'p-4 (32px padding)') }}</div>
7
+ <div class="ui-p-1 ui-bg-muted">{{ t('p_1_8px_padding', 'p-1 (8px padding)') }}</div>
8
+ <div class="ui-p-2 ui-bg-muted">{{ t('p_2_16px_padding', 'p-2 (16px padding)') }}</div>
9
+ <div class="ui-p-4 ui-bg-muted">{{ t('p_4_32px_padding', 'p-4 (32px padding)') }}</div>
10
10
 
11
11
  <!-- @directional_padding | column -->
12
- <div class="ui-px-4 ui-py-2" style="background: var(--ui-color-bg-muted)">{{ t('px_4_py_2_horizontal_32px_vertical_16px', 'px-4 py-2 (horizontal 32px, vertical 16px)') }}</div>
13
- <div class="ui-pt-4 ui-pb-1" style="background: var(--ui-color-bg-muted)">{{ t('pt_4_pb_1_top_32px_bottom_8px', 'pt-4 pb-1 (top 32px, bottom 8px)') }}</div>
14
- <div class="ui-ps-4 ui-pe-1" style="background: var(--ui-color-bg-muted)">{{ t('ps_4_pe_1_start_32px_end_8px', 'ps-4 pe-1 (start 32px, end 8px)') }}</div>
12
+ <div class="ui-px-4 ui-py-2 ui-bg-muted">{{ t('px_4_py_2_horizontal_32px_vertical_16px', 'px-4 py-2 (horizontal 32px, vertical 16px)') }}</div>
13
+ <div class="ui-pt-4 ui-pb-1 ui-bg-muted">{{ t('pt_4_pb_1_top_32px_bottom_8px', 'pt-4 pb-1 (top 32px, bottom 8px)') }}</div>
14
+ <div class="ui-ps-4 ui-pe-1 ui-bg-muted">{{ t('ps_4_pe_1_start_32px_end_8px', 'ps-4 pe-1 (start 32px, end 8px)') }}</div>
15
15
 
16
16
  <!-- @margin | column -->
17
- <div class="ui-mb-2" style="background: var(--ui-color-bg-muted)">{{ t('mb_2_16px_bottom_margin', 'mb-2 (16px bottom margin)') }}</div>
18
- <div class="ui-mt-4 ui-mb-2" style="background: var(--ui-color-bg-muted)">{{ t('mt_4_mb_2_top_32px_bottom_16px', 'mt-4 mb-2 (top 32px, bottom 16px)') }}</div>
17
+ <div class="ui-mb-2 ui-bg-muted">{{ t('mb_2_16px_bottom_margin', 'mb-2 (16px bottom margin)') }}</div>
18
+ <div class="ui-mt-4 ui-mb-2 ui-bg-muted">{{ t('mt_4_mb_2_top_32px_bottom_16px', 'mt-4 mb-2 (top 32px, bottom 16px)') }}</div>
19
19
  <div class="ui-mx-auto" style="background: var(--ui-color-bg-muted); max-inline-size: var(--ui-row-8)">{{ t('mx_auto_centered_with_auto_margins', 'mx-auto (centered with auto margins)') }}</div>
20
20
 
21
21
  <!-- @gap -->
22
22
  <div class="ui-flex ui-gap-2">
23
- <div class="ui-p-2" style="background: var(--ui-color-bg-muted)">{{ t('item', 'Item') }}</div>
24
- <div class="ui-p-2" style="background: var(--ui-color-bg-muted)">{{ t('item', 'Item') }}</div>
25
- <div class="ui-p-2" style="background: var(--ui-color-bg-muted)">{{ t('item', 'Item') }}</div>
23
+ <div class="ui-p-2 ui-bg-muted">{{ t('item', 'Item') }}</div>
24
+ <div class="ui-p-2 ui-bg-muted">{{ t('item', 'Item') }}</div>
25
+ <div class="ui-p-2 ui-bg-muted">{{ t('item', 'Item') }}</div>
26
26
  </div>