@times-design-system/theme-scss 1.7.0 → 1.8.1-alpha.28

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 (41) hide show
  1. package/LICENSE +29 -0
  2. package/README.md +1 -1
  3. package/dist/palettes/_business-dark.scss +286 -272
  4. package/dist/palettes/_business-light.scss +286 -272
  5. package/dist/palettes/_channels-dark.scss +315 -315
  6. package/dist/palettes/_channels-light.scss +315 -315
  7. package/dist/palettes/_comment-dark.scss +286 -272
  8. package/dist/palettes/_comment-light.scss +286 -272
  9. package/dist/palettes/_core-dark.scss +286 -272
  10. package/dist/palettes/_core-light.scss +286 -272
  11. package/dist/palettes/_culture-dark.scss +286 -272
  12. package/dist/palettes/_culture-light.scss +286 -272
  13. package/dist/palettes/_home-dark.scss +286 -272
  14. package/dist/palettes/_home-light.scss +286 -272
  15. package/dist/palettes/_ireland-dark.scss +286 -272
  16. package/dist/palettes/_ireland-light.scss +286 -272
  17. package/dist/palettes/_lifeAndStyle-dark.scss +286 -272
  18. package/dist/palettes/_lifeAndStyle-light.scss +286 -272
  19. package/dist/palettes/_money-dark.scss +286 -272
  20. package/dist/palettes/_money-light.scss +286 -272
  21. package/dist/palettes/_obituaries-dark.scss +286 -272
  22. package/dist/palettes/_obituaries-light.scss +286 -272
  23. package/dist/palettes/_puzzles-dark.scss +286 -272
  24. package/dist/palettes/_puzzles-light.scss +286 -272
  25. package/dist/palettes/_sport-dark.scss +286 -272
  26. package/dist/palettes/_sport-light.scss +286 -272
  27. package/dist/palettes/_travel-dark.scss +286 -272
  28. package/dist/palettes/_travel-light.scss +286 -272
  29. package/dist/palettes/_uk-dark.scss +286 -272
  30. package/dist/palettes/_uk-light.scss +286 -272
  31. package/dist/palettes/_world-dark.scss +286 -272
  32. package/dist/palettes/_world-light.scss +286 -272
  33. package/dist/tds-layout.scss +100 -75
  34. package/dist/tds-typography.scss +218 -303
  35. package/package.json +2 -2
  36. package/dist/palettes/_brand-dark.scss +0 -140
  37. package/dist/palettes/_brand-light.scss +0 -140
  38. package/dist/palettes/_dataVisualisation-dark.scss +0 -196
  39. package/dist/palettes/_dataVisualisation-light.scss +0 -196
  40. package/dist/palettes/_marketing-dark.scss +0 -10
  41. package/dist/palettes/_marketing-light.scss +0 -10
package/dist/tds-layout.scss CHANGED
@@ -1,88 +1,113 @@
1
1
  :root {
2
- --tds-spacing-10: 18px;
3
- --tds-spacing-11: 20px;
4
- --tds-spacing-12: 23px;
5
- --tds-spacing-13: 24px;
6
- --tds-spacing-14: 28px;
7
- --tds-spacing-15: 32px;
8
- --tds-spacing-16: 36px;
9
- --tds-spacing-17: 40px;
10
- --tds-spacing-18: 48px;
11
- --tds-spacing-19: 56px;
12
- --tds-spacing-20: 64px;
13
- --tds-spacing-21: 80px;
14
- --tds-spacing-01: 2px;
15
- --tds-spacing-02: 3px;
16
- --tds-spacing-03: 4px;
17
- --tds-spacing-04: 6px;
18
- --tds-spacing-05: 8px;
19
- --tds-spacing-06: 10px;
20
- --tds-spacing-07: 12px;
21
- --tds-spacing-08: 14px;
22
- --tds-spacing-09: 16px;
23
- --tds-grid-columns: 4;
24
- --tds-grid-gutter: 24px;
25
- --tds-grid-margin: 20px;
26
- --tds-grid-viewport: 433px;
27
- --tds-grid-max-width: 767px;
28
- --tds-grid-content-area: 393px;
2
+ --spacing-10: 18px;
3
+ --spacing-11: 20px;
4
+ --spacing-12: 23px;
5
+ --spacing-13: 24px;
6
+ --spacing-14: 28px;
7
+ --spacing-15: 32px;
8
+ --spacing-16: 36px;
9
+ --spacing-17: 40px;
10
+ --spacing-18: 48px;
11
+ --spacing-19: 56px;
12
+ --spacing-20: 64px;
13
+ --spacing-21: 80px;
14
+ --spacing-01: 2px;
15
+ --spacing-02: 3px;
16
+ --spacing-03: 4px;
17
+ --spacing-04: 6px;
18
+ --spacing-05: 8px;
19
+ --spacing-06: 10px;
20
+ --spacing-07: 12px;
21
+ --spacing-08: 14px;
22
+ --spacing-09: 16px;
23
+ --shadow-elevation-down-level-2: 0px 4px 8px 0px rgba(#000000,0.08);
24
+ --shadow-elevation-down-level-3: 0px 16px 24px 0px rgba(#000000,0.08);
25
+ --shadow-elevation-down-level-4: 0px 20px 32px 0px rgba(#000000,0.08);
26
+ --shadow-elevation-up-level-2: 0px -4px 8px 0px rgba(#000000,0.08);
27
+ --shadow-elevation-up-level-3: 0px -16px 24px 0px rgba(#000000,0.08);
28
+ --shadow-elevation-up-level-4: 0px -20px 32px 0px rgba(#000000,0.08);
29
+ --border-radius-50: 2px;
30
+ --border-radius-100: 4px;
31
+ --border-radius-150: 6px;
32
+ --border-radius-200: 8px;
33
+ --border-radius-300: 12px;
34
+ --border-radius-400: 16px;
35
+ --border-radius-600: 24px;
36
+ --border-radius-full: 9999px;
37
+ --grid-columns: 4;
38
+ --grid-gutter: 24px;
39
+ --grid-margin: 20px;
40
+ --grid-viewport: 433px;
41
+ --grid-max-width: 767px;
42
+ --grid-content-area: 393px;
29
43
  }
30
44
  @media (min-width: 440px) {
31
45
  :root {
32
-
33
- --tds-grid-columns: 12;
34
- --tds-grid-gutter: 32px;
35
- --tds-grid-margin: 24px;
36
- --tds-grid-viewport: 816px;
37
- --tds-grid-max-width: 1023px;
38
- --tds-grid-content-area: 768px;
46
+ --grid-columns: 12;
47
+ --grid-gutter: 32px;
48
+ --grid-margin: 24px;
49
+ --grid-viewport: 816px;
50
+ --grid-max-width: 1023px;
51
+ --grid-content-area: 768px;
39
52
  }}
40
53
  @media (min-width: 1024px) {
41
54
  :root {
42
-
43
- --tds-grid-columns: 12;
44
- --tds-grid-gutter: 32px;
45
- --tds-grid-margin: 24px;
46
- --tds-grid-viewport: 1072px;
47
- --tds-grid-max-width: 1439px;
48
- --tds-grid-content-area: 1024px;
55
+ --grid-columns: 12;
56
+ --grid-gutter: 32px;
57
+ --grid-margin: 24px;
58
+ --grid-viewport: 1072px;
59
+ --grid-max-width: 1439px;
60
+ --grid-content-area: 1024px;
49
61
  }}
50
62
  @media (min-width: 1440px) {
51
63
  :root {
52
-
53
- --tds-grid-columns: 12;
54
- --tds-grid-gutter: 32px;
55
- --tds-grid-margin: 24px;
56
- --tds-grid-viewport: 1440px;
57
- --tds-grid-max-width: 1920px;
58
- --tds-grid-content-area: 1144px;
64
+ --grid-columns: 12;
65
+ --grid-gutter: 32px;
66
+ --grid-margin: 24px;
67
+ --grid-viewport: 1440px;
68
+ --grid-max-width: 1920px;
69
+ --grid-content-area: 1144px;
59
70
  }}
60
71
 
61
- $tds-spacing-10: var(--tds-spacing-10);
62
- $tds-spacing-11: var(--tds-spacing-11);
63
- $tds-spacing-12: var(--tds-spacing-12);
64
- $tds-spacing-13: var(--tds-spacing-13);
65
- $tds-spacing-14: var(--tds-spacing-14);
66
- $tds-spacing-15: var(--tds-spacing-15);
67
- $tds-spacing-16: var(--tds-spacing-16);
68
- $tds-spacing-17: var(--tds-spacing-17);
69
- $tds-spacing-18: var(--tds-spacing-18);
70
- $tds-spacing-19: var(--tds-spacing-19);
71
- $tds-spacing-20: var(--tds-spacing-20);
72
- $tds-spacing-21: var(--tds-spacing-21);
73
- $tds-spacing-01: var(--tds-spacing-01);
74
- $tds-spacing-02: var(--tds-spacing-02);
75
- $tds-spacing-03: var(--tds-spacing-03);
76
- $tds-spacing-04: var(--tds-spacing-04);
77
- $tds-spacing-05: var(--tds-spacing-05);
78
- $tds-spacing-06: var(--tds-spacing-06);
79
- $tds-spacing-07: var(--tds-spacing-07);
80
- $tds-spacing-08: var(--tds-spacing-08);
81
- $tds-spacing-09: var(--tds-spacing-09);
82
- $tds-grid-columns: var(--tds-grid-columns);
83
- $tds-grid-gutter: var(--tds-grid-gutter);
84
- $tds-grid-margin: var(--tds-grid-margin);
85
- $tds-grid-viewport: var(--tds-grid-viewport);
86
- $tds-grid-max-width: var(--tds-grid-max-width);
87
- $tds-grid-content-area: var(--tds-grid-content-area);
72
+ $spacing-10: var(--spacing-10);
73
+ $spacing-11: var(--spacing-11);
74
+ $spacing-12: var(--spacing-12);
75
+ $spacing-13: var(--spacing-13);
76
+ $spacing-14: var(--spacing-14);
77
+ $spacing-15: var(--spacing-15);
78
+ $spacing-16: var(--spacing-16);
79
+ $spacing-17: var(--spacing-17);
80
+ $spacing-18: var(--spacing-18);
81
+ $spacing-19: var(--spacing-19);
82
+ $spacing-20: var(--spacing-20);
83
+ $spacing-21: var(--spacing-21);
84
+ $spacing-01: var(--spacing-01);
85
+ $spacing-02: var(--spacing-02);
86
+ $spacing-03: var(--spacing-03);
87
+ $spacing-04: var(--spacing-04);
88
+ $spacing-05: var(--spacing-05);
89
+ $spacing-06: var(--spacing-06);
90
+ $spacing-07: var(--spacing-07);
91
+ $spacing-08: var(--spacing-08);
92
+ $spacing-09: var(--spacing-09);
93
+ $grid-columns: var(--grid-columns);
94
+ $grid-gutter: var(--grid-gutter);
95
+ $grid-margin: var(--grid-margin);
96
+ $grid-viewport: var(--grid-viewport);
97
+ $grid-max-width: var(--grid-max-width);
98
+ $grid-content-area: var(--grid-content-area);
99
+ $shadow-elevation-down-level-2: var(--shadow-elevation-down-level-2);
100
+ $shadow-elevation-down-level-3: var(--shadow-elevation-down-level-3);
101
+ $shadow-elevation-down-level-4: var(--shadow-elevation-down-level-4);
102
+ $shadow-elevation-up-level-2: var(--shadow-elevation-up-level-2);
103
+ $shadow-elevation-up-level-3: var(--shadow-elevation-up-level-3);
104
+ $shadow-elevation-up-level-4: var(--shadow-elevation-up-level-4);
105
+ $border-radius-50: var(--border-radius-50);
106
+ $border-radius-100: var(--border-radius-100);
107
+ $border-radius-150: var(--border-radius-150);
108
+ $border-radius-200: var(--border-radius-200);
109
+ $border-radius-300: var(--border-radius-300);
110
+ $border-radius-400: var(--border-radius-400);
111
+ $border-radius-600: var(--border-radius-600);
112
+ $border-radius-full: var(--border-radius-full);
88
113