@rolster/styles-foundations 1.1.9 → 1.1.11

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 (9) hide show
  1. package/dist/rolster-styles.css +239 -114
  2. package/dist/rolster-styles.min.css +1 -1
  3. package/dist/rolster-styles.rtl.css +239 -114
  4. package/dist/rolster-styles.rtl.min.css +1 -1
  5. package/package.json +1 -1
  6. package/scss/_rolster-components.scss +1 -0
  7. package/scss/components/_data-table.scss +10 -4
  8. package/scss/foundations/_colors-foundations.scss +143 -73
  9. package/scss/foundations/_themes-foundations.scss +14 -4
package/dist/rolster-styles.css CHANGED
@@ -24,95 +24,126 @@
24
24
  --border-light-500: rgba(255, 255, 255, 1);
25
25
  --border-light-300: rgba(185, 195, 231, 1);
26
26
  --border-light-100: rgba(128, 141, 190, 1);
27
- --color-base-900: rgba(21, 56, 101, 1);
28
- --color-base-700: rgba(17, 75, 147, 1);
29
- --color-base-500: rgba(33, 122, 214, 1);
30
- --color-base-300: rgba(136, 186, 241, 1);
31
- --color-base-100: rgba(227, 236, 251, 1);
32
- --skeleton-base-500: rgba(17, 75, 147, 0.5);
33
- --skeleton-base-300: rgba(17, 75, 147, 0.25);
34
- --skeleton-base-100: rgba(17, 75, 147, 0.1);
35
- --box-shadow-base-500: rgba(33, 122, 214, 0.24);
36
- --backdrop-base-500: rgba(18, 46, 79, 0.8);
37
- --gradient-base-500: linear-gradient(
27
+ --color-primary-900: rgba(21, 56, 101, 1);
28
+ --color-primary-700: rgba(17, 75, 147, 1);
29
+ --color-primary-500: rgba(33, 122, 214, 1);
30
+ --color-primary-300: rgba(136, 186, 241, 1);
31
+ --color-primary-100: rgba(227, 236, 251, 1);
32
+ --skeleton-primary-500: rgba(17, 75, 147, 0.5);
33
+ --skeleton-primary-300: rgba(17, 75, 147, 0.25);
34
+ --skeleton-primary-100: rgba(17, 75, 147, 0.1);
35
+ --box-shadow-primary-500: rgba(33, 122, 214, 0.24);
36
+ --backdrop-primary-500: rgba(21, 56, 101, 0.8);
37
+ --gradient-primary-500: linear-gradient(
38
38
  180deg,
39
39
  rgb(33, 122, 214) 0%,
40
40
  rgb(17, 75, 147) 100%
41
41
  );
42
- --color-success-900: rgba(16, 81, 70, 1);
43
- --color-success-700: rgba(10, 123, 104, 1);
44
- --color-success-500: rgba(12, 192, 157, 1);
45
- --color-success-300: rgba(87, 241, 204, 1);
46
- --color-success-100: rgba(202, 253, 238, 1);
47
- --skeleton-success-500: rgba(10, 123, 104, 0.5);
48
- --skeleton-success-300: rgba(10, 123, 104, 0.25);
49
- --skeleton-success-100: rgba(10, 123, 104, 0.1);
50
- --box-shadow-success-500: rgba(12, 192, 157, 0.24);
51
- --backdrop-success-500: rgba(14, 70, 60, 0.8);
42
+ --color-success-900: rgba(4, 80, 56, 1);
43
+ --color-success-700: rgba(0, 124, 82, 1);
44
+ --color-success-500: rgba(10, 191, 121, 1);
45
+ --color-success-300: rgba(106, 235, 177, 1);
46
+ --color-success-100: rgba(208, 251, 227, 1);
47
+ --skeleton-success-500: rgba(0, 124, 82, 0.5);
48
+ --skeleton-success-300: rgba(0, 124, 82, 0.25);
49
+ --skeleton-success-100: rgba(0, 124, 82, 0.1);
50
+ --box-shadow-success-500: rgba(10, 191, 121, 0.24);
51
+ --backdrop-success-500: rgba(4, 80, 56, 0.8);
52
52
  --gradient-success-500: linear-gradient(
53
53
  180deg,
54
- rgb(12, 192, 157) 0%,
55
- rgb(10, 123, 104) 100%
54
+ rgb(10, 191, 121) 0%,
55
+ rgb(0, 124, 82) 100%
56
56
  );
57
- --color-info-900: rgba(10, 77, 112, 1);
58
- --color-info-700: rgba(0, 110, 164, 1);
59
- --color-info-500: rgba(24, 182, 246, 1);
60
- --color-info-300: rgba(122, 215, 255, 1);
61
- --color-info-100: rgba(218, 243, 253, 1);
62
- --skeleton-info-500: rgba(0, 110, 164, 0.5);
63
- --skeleton-info-300: rgba(0, 110, 164, 0.25);
64
- --skeleton-info-100: rgba(0, 110, 164, 0.1);
65
- --box-shadow-info-500: rgba(24, 182, 246, 0.24);
66
- --backdrop-info-500: rgba(20, 77, 100, 0.8);
57
+ --color-info-900: rgba(7, 70, 115, 1);
58
+ --color-info-700: rgba(0, 100, 170, 1);
59
+ --color-info-500: rgba(2, 159, 245, 1);
60
+ --color-info-300: rgba(118, 207, 255, 1);
61
+ --color-info-100: rgba(222, 241, 255, 1);
62
+ --skeleton-info-500: rgba(0, 100, 170, 0.5);
63
+ --skeleton-info-300: rgba(0, 100, 170, 0.25);
64
+ --skeleton-info-100: rgba(0, 100, 170, 0.1);
65
+ --box-shadow-info-500: rgba(2, 159, 245, 0.24);
66
+ --backdrop-info-500: rgba(7, 70, 115, 0.8);
67
67
  --gradient-info-500: linear-gradient(
68
68
  180deg,
69
- rgb(24, 182, 246) 0%,
70
- rgb(0, 110, 164) 100%
69
+ rgb(2, 159, 245) 0%,
70
+ rgb(0, 100, 170) 100%
71
71
  );
72
- --color-happy-900: rgba(60, 22, 46, 1);
73
- --color-happy-700: rgba(114, 54, 93, 1);
74
- --color-happy-500: rgba(169, 80, 142, 1);
75
- --color-happy-300: rgba(218, 152, 200, 1);
76
- --color-happy-100: rgba(243, 219, 238, 1);
77
- --skeleton-happy-500: rgba(114, 54, 93, 0.5);
78
- --skeleton-happy-300: rgba(114, 54, 93, 0.25);
79
- --skeleton-happy-100: rgba(114, 54, 93, 0.1);
80
- --box-shadow-happy-500: rgba(169, 80, 142, 0.24);
81
- --backdrop-happy-500: rgba(64, 35, 55, 0.8);
72
+ --color-happy-900: rgb(63, 19, 63, 1);
73
+ --color-happy-700: rgb(142, 58, 145, 1);
74
+ --color-happy-500: rgba(170, 73, 176, 1);
75
+ --color-happy-300: rgba(217, 147, 223, 1);
76
+ --color-happy-100: rgba(240, 217, 245, 1);
77
+ --skeleton-happy-500: rgba(142, 58, 145, 0.5);
78
+ --skeleton-happy-300: rgba(142, 58, 145, 0.25);
79
+ --skeleton-happy-100: rgba(142, 58, 145, 0.1);
80
+ --box-shadow-happy-500: rgba(170, 73, 176, 0.24);
81
+ --backdrop-happy-500: rgba(63, 19, 63, 0.8);
82
82
  --gradient-happy-500: linear-gradient(
83
83
  180deg,
84
- rgb(169, 80, 142) 0%,
85
- rgb(114, 54, 93) 100%
84
+ rgb(170, 73, 176) 0%,
85
+ rgb(142, 58, 145) 100%
86
86
  );
87
- --color-warning-900: rgba(155, 60, 17, 1);
88
- --color-warning-700: rgba(235, 101, 11, 1);
89
- --color-warning-500: rgba(252, 165, 73, 1);
90
- --color-warning-300: rgba(254, 220, 170, 1);
91
- --color-warning-100: rgba(255, 248, 237, 1);
92
- --skeleton-warning-500: rgba(235, 101, 11, 0.5);
93
- --skeleton-warning-300: rgba(235, 101, 11, 0.25);
94
- --skeleton-warning-100: rgba(235, 101, 11, 0.1);
95
- --box-shadow-warning-500: rgba(252, 165, 73, 0.24);
96
- --backdrop-warning-500: rgba(102, 71, 38, 0.8);
87
+ --color-warning-900: rgb(116, 68, 15, 1);
88
+ --color-warning-700: rgba(166, 107, 2, 1);
89
+ --color-warning-500: rgb(255, 206, 0, 1);
90
+ --color-warning-300: rgba(255, 238, 65, 1);
91
+ --color-warning-100: rgba(255, 254, 193, 1);
92
+ --skeleton-warning-500: rgba(166, 107, 2, 0.5);
93
+ --skeleton-warning-300: rgba(166, 107, 2, 0.25);
94
+ --skeleton-warning-100: rgba(166, 107, 2, 0.1);
95
+ --box-shadow-warning-500: rgba(255, 206, 0, 0.24);
96
+ --backdrop-warning-500: rgba(116, 68, 15, 0.8);
97
97
  --gradient-warning-500: linear-gradient(
98
98
  180deg,
99
- rgb(252, 165, 73) 0%,
100
- rgb(235, 101, 11) 100%
99
+ rgb(255, 206, 0) 0%,
100
+ rgb(166, 107, 2) 100%
101
101
  );
102
- --color-danger-900: rgba(130, 26, 26, 1);
103
- --color-danger-700: rgba(190, 23, 23, 1);
104
- --color-danger-500: rgba(244, 60, 60, 1);
105
- --color-danger-300: rgba(255, 162, 162, 1);
106
- --color-danger-100: rgba(254, 242, 242, 1);
107
- --skeleton-danger-500: rgba(190, 23, 23, 0.5);
108
- --skeleton-danger-300: rgba(190, 23, 23, 0.25);
109
- --skeleton-danger-100: rgba(190, 23, 23, 0.1);
110
- --box-shadow-danger-500: rgba(244, 60, 60, 0.24);
111
- --backdrop-danger-500: rgba(99, 33, 33, 0.8);
102
+ color: #881414;
103
+ --color-danger-900: rgba(136, 20, 20, 1);
104
+ --color-danger-700: rgba(200, 13, 13, 1);
105
+ --color-danger-500: rgba(255, 44, 44, 1);
106
+ --color-danger-300: rgba(255, 157, 157, 1);
107
+ --color-danger-100: rgba(255, 223, 223, 1);
108
+ --skeleton-danger-500: rgba(200, 13, 13, 0.5);
109
+ --skeleton-danger-300: rgba(200, 13, 13, 0.25);
110
+ --skeleton-danger-100: rgba(200, 13, 13, 0.1);
111
+ --box-shadow-danger-500: rgba(255, 44, 44, 0.24);
112
+ --backdrop-danger-500: rgba(136, 20, 20, 0.8);
112
113
  --gradient-danger-500: linear-gradient(
113
114
  180deg,
114
- rgb(244, 60, 60) 0%,
115
- rgb(190, 23, 23) 100%
115
+ rgb(255, 44, 44) 0%,
116
+ rgb(200, 13, 13) 100%
117
+ );
118
+ --color-coffee-900: rgba(93, 57, 49, 1);
119
+ --color-coffee-700: rgba(140, 83, 66, 1);
120
+ --color-coffee-500: rgba(182, 121, 89, 1);
121
+ --color-coffee-300: rgba(219, 193, 172, 1);
122
+ --color-coffee-100: rgb(243, 234, 225, 1);
123
+ --skeleton-coffee-500: rgba(140, 83, 66, 0.5);
124
+ --skeleton-coffee-300: rgba(140, 83, 66, 0.25);
125
+ --skeleton-coffee-100: rgba(140, 83, 66, 0.1);
126
+ --box-shadow-coffee-500: rgba(182, 121, 89, 0.24);
127
+ --backdrop-coffee-500: rgba(93, 57, 49, 0.8);
128
+ --gradient-coffee-500: linear-gradient(
129
+ 180deg,
130
+ rgb(182, 121, 89) 0%,
131
+ rgb(140, 83, 66) 100%
132
+ );
133
+ --color-obsidian-900: rgba(58, 50, 45, 1);
134
+ --color-obsidian-700: rgba(97, 84, 71, 1);
135
+ --color-obsidian-500: rgba(141, 127, 101, 1);
136
+ --color-obsidian-300: rgb(178, 170, 146, 1);
137
+ --color-obsidian-100: rgb(230, 228, 219, 1);
138
+ --skeleton-obsidian-500: rgba(97, 84, 71, 0.5);
139
+ --skeleton-obsidian-300: rgba(97, 84, 71, 0.25);
140
+ --skeleton-obsidian-100: rgba(97, 84, 71, 0.1);
141
+ --box-shadow-obsidian-500: rgba(141, 127, 101, 0.24);
142
+ --backdrop-obsidian-500: rgba(58, 50, 45, 0.8);
143
+ --gradient-obsidian-500: linear-gradient(
144
+ 180deg,
145
+ rgb(141, 127, 101) 0%,
146
+ rgb(97, 84, 71) 100%
116
147
  );
117
148
  }
118
149
 
@@ -985,21 +1016,21 @@
985
1016
  --shadow-center-theme-16: var(--shadow-center-light-16);
986
1017
  --shadow-center-theme-24: var(--shadow-center-light-24);
987
1018
  --shadow-center-theme-32: var(--shadow-center-light-32);
988
- --border-1-base-100: var(--border-1) solid var(--color-base-100);
989
- --border-2-base-100: var(--border-2) solid var(--color-base-100);
990
- --border-4-base-100: var(--border-4) solid var(--color-base-100);
991
- --border-1-base-300: var(--border-1) solid var(--color-base-300);
992
- --border-2-base-300: var(--border-2) solid var(--color-base-300);
993
- --border-4-base-300: var(--border-4) solid var(--color-base-300);
994
- --border-1-base-500: var(--border-1) solid var(--color-base-500);
995
- --border-2-base-500: var(--border-2) solid var(--color-base-500);
996
- --border-4-base-500: var(--border-4) solid var(--color-base-500);
997
- --border-1-base-700: var(--border-1) solid var(--color-base-700);
998
- --border-2-base-700: var(--border-2) solid var(--color-base-700);
999
- --border-4-base-700: var(--border-4) solid var(--color-base-700);
1000
- --border-1-base-900: var(--border-1) solid var(--color-base-900);
1001
- --border-2-base-900: var(--border-2) solid var(--color-base-900);
1002
- --border-4-base-900: var(--border-4) solid var(--color-base-900);
1019
+ --border-1-primary-100: var(--border-1) solid var(--color-primary-100);
1020
+ --border-2-primary-100: var(--border-2) solid var(--color-primary-100);
1021
+ --border-4-primary-100: var(--border-4) solid var(--color-primary-100);
1022
+ --border-1-primary-300: var(--border-1) solid var(--color-primary-300);
1023
+ --border-2-primary-300: var(--border-2) solid var(--color-primary-300);
1024
+ --border-4-primary-300: var(--border-4) solid var(--color-primary-300);
1025
+ --border-1-primary-500: var(--border-1) solid var(--color-primary-500);
1026
+ --border-2-primary-500: var(--border-2) solid var(--color-primary-500);
1027
+ --border-4-primary-500: var(--border-4) solid var(--color-primary-500);
1028
+ --border-1-primary-700: var(--border-1) solid var(--color-primary-700);
1029
+ --border-2-primary-700: var(--border-2) solid var(--color-primary-700);
1030
+ --border-4-primary-700: var(--border-4) solid var(--color-primary-700);
1031
+ --border-1-primary-900: var(--border-1) solid var(--color-primary-900);
1032
+ --border-2-primary-900: var(--border-2) solid var(--color-primary-900);
1033
+ --border-4-primary-900: var(--border-4) solid var(--color-primary-900);
1003
1034
  --border-1-success-100: var(--border-1) solid var(--color-success-100);
1004
1035
  --border-2-success-100: var(--border-2) solid var(--color-success-100);
1005
1036
  --border-4-success-100: var(--border-4) solid var(--color-success-100);
@@ -1075,32 +1106,62 @@
1075
1106
  --border-1-danger-900: var(--border-1) solid var(--color-danger-900);
1076
1107
  --border-2-danger-900: var(--border-2) solid var(--color-danger-900);
1077
1108
  --border-4-danger-900: var(--border-4) solid var(--color-danger-900);
1078
- --color-rolster-900: var(--color-base-900);
1079
- --color-rolster-700: var(--color-base-700);
1080
- --color-rolster-500: var(--color-base-500);
1081
- --color-rolster-300: var(--color-base-300);
1082
- --color-rolster-100: var(--color-base-100);
1083
- --skeleton-rolster-500: var(--skeleton-base-500);
1084
- --skeleton-rolster-300: var(--skeleton-base-300);
1085
- --skeleton-rolster-100: var(--skeleton-base-100);
1086
- --box-shadow-rolster-500: var(--box-shadow-base-500);
1087
- --backdrop-rolster-500: var(--backdrop-base-500);
1088
- --gradient-rolster-500: var(--gradient-base-500);
1089
- --border-1-rolster-900: var(--border-1) solid var(--color-base-900);
1090
- --border-2-rolster-900: var(--border-2) solid var(--color-base-900);
1091
- --border-4-rolster-900: var(--border-4) solid var(--color-base-900);
1092
- --border-1-rolster-700: var(--border-1) solid var(--color-base-700);
1093
- --border-2-rolster-700: var(--border-2) solid var(--color-base-700);
1094
- --border-4-rolster-700: var(--border-4) solid var(--color-base-700);
1095
- --border-1-rolster-500: var(--border-1) solid var(--color-base-500);
1096
- --border-2-rolster-500: var(--border-2) solid var(--color-base-500);
1097
- --border-4-rolster-500: var(--border-4) solid var(--color-base-500);
1098
- --border-1-rolster-300: var(--border-1) solid var(--color-base-300);
1099
- --border-2-rolster-300: var(--border-2) solid var(--color-base-300);
1100
- --border-4-rolster-300: var(--border-4) solid var(--color-base-300);
1101
- --border-1-rolster-100: var(--border-1) solid var(--color-base-100);
1102
- --border-2-rolster-100: var(--border-2) solid var(--color-base-100);
1103
- --border-4-rolster-100: var(--border-4) solid var(--color-base-100);
1109
+ --border-1-coffee-100: var(--border-1) solid var(--color-coffee-100);
1110
+ --border-2-coffee-100: var(--border-2) solid var(--color-coffee-100);
1111
+ --border-4-coffee-100: var(--border-4) solid var(--color-coffee-100);
1112
+ --border-1-coffee-300: var(--border-1) solid var(--color-coffee-300);
1113
+ --border-2-coffee-300: var(--border-2) solid var(--color-coffee-300);
1114
+ --border-4-coffee-300: var(--border-4) solid var(--color-coffee-300);
1115
+ --border-1-coffee-500: var(--border-1) solid var(--color-coffee-500);
1116
+ --border-2-coffee-500: var(--border-2) solid var(--color-coffee-500);
1117
+ --border-4-coffee-500: var(--border-4) solid var(--color-coffee-500);
1118
+ --border-1-coffee-700: var(--border-1) solid var(--color-coffee-700);
1119
+ --border-2-coffee-700: var(--border-2) solid var(--color-coffee-700);
1120
+ --border-4-coffee-700: var(--border-4) solid var(--color-coffee-700);
1121
+ --border-1-coffee-900: var(--border-1) solid var(--color-coffee-900);
1122
+ --border-2-coffee-900: var(--border-2) solid var(--color-coffee-900);
1123
+ --border-4-coffee-900: var(--border-4) solid var(--color-coffee-900);
1124
+ --border-1-obsidian-100: var(--border-1) solid var(--color-obsidian-100);
1125
+ --border-2-obsidian-100: var(--border-2) solid var(--color-obsidian-100);
1126
+ --border-4-obsidian-100: var(--border-4) solid var(--color-obsidian-100);
1127
+ --border-1-obsidian-300: var(--border-1) solid var(--color-obsidian-300);
1128
+ --border-2-obsidian-300: var(--border-2) solid var(--color-obsidian-300);
1129
+ --border-4-obsidian-300: var(--border-4) solid var(--color-obsidian-300);
1130
+ --border-1-obsidian-500: var(--border-1) solid var(--color-obsidian-500);
1131
+ --border-2-obsidian-500: var(--border-2) solid var(--color-obsidian-500);
1132
+ --border-4-obsidian-500: var(--border-4) solid var(--color-obsidian-500);
1133
+ --border-1-obsidian-700: var(--border-1) solid var(--color-obsidian-700);
1134
+ --border-2-obsidian-700: var(--border-2) solid var(--color-obsidian-700);
1135
+ --border-4-obsidian-700: var(--border-4) solid var(--color-obsidian-700);
1136
+ --border-1-obsidian-900: var(--border-1) solid var(--color-obsidian-900);
1137
+ --border-2-obsidian-900: var(--border-2) solid var(--color-obsidian-900);
1138
+ --border-4-obsidian-900: var(--border-4) solid var(--color-obsidian-900);
1139
+ --color-rolster-900: var(--color-primary-900);
1140
+ --color-rolster-700: var(--color-primary-700);
1141
+ --color-rolster-500: var(--color-primary-500);
1142
+ --color-rolster-300: var(--color-primary-300);
1143
+ --color-rolster-100: var(--color-primary-100);
1144
+ --skeleton-rolster-500: var(--skeleton-primary-500);
1145
+ --skeleton-rolster-300: var(--skeleton-primary-300);
1146
+ --skeleton-rolster-100: var(--skeleton-primary-100);
1147
+ --box-shadow-rolster-500: var(--box-shadow-primary-500);
1148
+ --backdrop-rolster-500: var(--backdrop-primary-500);
1149
+ --gradient-rolster-500: var(--gradient-primary-500);
1150
+ --border-1-rolster-900: var(--border-1) solid var(--color-primary-900);
1151
+ --border-2-rolster-900: var(--border-2) solid var(--color-primary-900);
1152
+ --border-4-rolster-900: var(--border-4) solid var(--color-primary-900);
1153
+ --border-1-rolster-700: var(--border-1) solid var(--color-primary-700);
1154
+ --border-2-rolster-700: var(--border-2) solid var(--color-primary-700);
1155
+ --border-4-rolster-700: var(--border-4) solid var(--color-primary-700);
1156
+ --border-1-rolster-500: var(--border-1) solid var(--color-primary-500);
1157
+ --border-2-rolster-500: var(--border-2) solid var(--color-primary-500);
1158
+ --border-4-rolster-500: var(--border-4) solid var(--color-primary-500);
1159
+ --border-1-rolster-300: var(--border-1) solid var(--color-primary-300);
1160
+ --border-2-rolster-300: var(--border-2) solid var(--color-primary-300);
1161
+ --border-4-rolster-300: var(--border-4) solid var(--color-primary-300);
1162
+ --border-1-rolster-100: var(--border-1) solid var(--color-primary-100);
1163
+ --border-2-rolster-100: var(--border-2) solid var(--color-primary-100);
1164
+ --border-4-rolster-100: var(--border-4) solid var(--color-primary-100);
1104
1165
  }
1105
1166
 
1106
1167
  *[rls-theme='success'] {
@@ -1248,6 +1309,64 @@
1248
1309
  --border-4-rolster-100: var(--border-4) solid var(--color-danger-100);
1249
1310
  }
1250
1311
 
1312
+ *[rls-theme='coffee'] {
1313
+ --color-rolster-900: var(--color-coffee-900);
1314
+ --color-rolster-700: var(--color-coffee-700);
1315
+ --color-rolster-500: var(--color-coffee-500);
1316
+ --color-rolster-300: var(--color-coffee-300);
1317
+ --color-rolster-100: var(--color-coffee-100);
1318
+ --skeleton-rolster-500: var(--skeleton-coffee-500);
1319
+ --skeleton-rolster-300: var(--skeleton-coffee-300);
1320
+ --skeleton-rolster-100: var(--skeleton-coffee-100);
1321
+ --box-shadow-rolster-500: var(--box-shadow-coffee-500);
1322
+ --backdrop-rolster-500: var(--backdrop-coffee-500);
1323
+ --gradient-rolster-500: var(--gradient-coffee-500);
1324
+ --border-1-rolster-900: var(--border-1) solid var(--color-coffee-900);
1325
+ --border-2-rolster-900: var(--border-2) solid var(--color-coffee-900);
1326
+ --border-4-rolster-900: var(--border-4) solid var(--color-coffee-900);
1327
+ --border-1-rolster-700: var(--border-1) solid var(--color-coffee-700);
1328
+ --border-2-rolster-700: var(--border-2) solid var(--color-coffee-700);
1329
+ --border-4-rolster-700: var(--border-4) solid var(--color-coffee-700);
1330
+ --border-1-rolster-500: var(--border-1) solid var(--color-coffee-500);
1331
+ --border-2-rolster-500: var(--border-2) solid var(--color-coffee-500);
1332
+ --border-4-rolster-500: var(--border-4) solid var(--color-coffee-500);
1333
+ --border-1-rolster-300: var(--border-1) solid var(--color-coffee-300);
1334
+ --border-2-rolster-300: var(--border-2) solid var(--color-coffee-300);
1335
+ --border-4-rolster-300: var(--border-4) solid var(--color-coffee-300);
1336
+ --border-1-rolster-100: var(--border-1) solid var(--color-coffee-100);
1337
+ --border-2-rolster-100: var(--border-2) solid var(--color-coffee-100);
1338
+ --border-4-rolster-100: var(--border-4) solid var(--color-coffee-100);
1339
+ }
1340
+
1341
+ *[rls-theme='obsidian'] {
1342
+ --color-rolster-900: var(--color-obsidian-900);
1343
+ --color-rolster-700: var(--color-obsidian-700);
1344
+ --color-rolster-500: var(--color-obsidian-500);
1345
+ --color-rolster-300: var(--color-obsidian-300);
1346
+ --color-rolster-100: var(--color-obsidian-100);
1347
+ --skeleton-rolster-500: var(--skeleton-obsidian-500);
1348
+ --skeleton-rolster-300: var(--skeleton-obsidian-300);
1349
+ --skeleton-rolster-100: var(--skeleton-obsidian-100);
1350
+ --box-shadow-rolster-500: var(--box-shadow-obsidian-500);
1351
+ --backdrop-rolster-500: var(--backdrop-obsidian-500);
1352
+ --gradient-rolster-500: var(--gradient-obsidian-500);
1353
+ --border-1-rolster-900: var(--border-1) solid var(--color-obsidian-900);
1354
+ --border-2-rolster-900: var(--border-2) solid var(--color-obsidian-900);
1355
+ --border-4-rolster-900: var(--border-4) solid var(--color-obsidian-900);
1356
+ --border-1-rolster-700: var(--border-1) solid var(--color-obsidian-700);
1357
+ --border-2-rolster-700: var(--border-2) solid var(--color-obsidian-700);
1358
+ --border-4-rolster-700: var(--border-4) solid var(--color-obsidian-700);
1359
+ --border-1-rolster-500: var(--border-1) solid var(--color-obsidian-500);
1360
+ --border-2-rolster-500: var(--border-2) solid var(--color-obsidian-500);
1361
+ --border-4-rolster-500: var(--border-4) solid var(--color-obsidian-500);
1362
+ --border-1-rolster-300: var(--border-1) solid var(--color-obsidian-300);
1363
+ --border-2-rolster-300: var(--border-2) solid var(--color-obsidian-300);
1364
+ --border-4-rolster-300: var(--border-4) solid var(--color-obsidian-300);
1365
+ --border-1-rolster-100: var(--border-1) solid var(--color-obsidian-100);
1366
+ --border-2-rolster-100: var(--border-2) solid var(--color-obsidian-100);
1367
+ --border-4-rolster-100: var(--border-4) solid var(--color-obsidian-100);
1368
+ }
1369
+
1251
1370
  :root {
1252
1371
  --font-weight-thin: 100;
1253
1372
  --font-weight-extra-light: 200;
@@ -3604,6 +3723,7 @@ button {
3604
3723
  --rls-card-content-padding: var(--sizing-x8);
3605
3724
  --rls-datatable-letter-spacing: 0.0625em;
3606
3725
  --rls-datatable-font-size: 7rem;
3726
+ --rls-datatable-width-scroll: var(--sizing-x12);
3607
3727
  --rls-form-footer-justify-content: end;
3608
3728
  --rls-icon-font-size: var(--sizing-x12);
3609
3729
  --rls-icon-width: var(--sizing-x12);
@@ -3795,11 +3915,15 @@ button {
3795
3915
  .rls-datatable {
3796
3916
  --rls-input-font-size: var(--rls-datatable-font-size);
3797
3917
  --rls-input-letter-spacing: var(--rls-datatable-letter-spacing);
3918
+ --pvt-header-padding-right: var(--sizing-x6);
3798
3919
  position: relative;
3799
3920
  width: 100%;
3800
3921
  border-radius: var(--sizing-x4);
3801
3922
  box-sizing: border-box;
3802
3923
  }
3924
+ .rls-datatable--scrolleable {
3925
+ --pvt-header-padding-right: var(--sizing-x12);
3926
+ }
3803
3927
  .rls-datatable > table {
3804
3928
  display: flex;
3805
3929
  flex-direction: column;
@@ -3813,7 +3937,8 @@ button {
3813
3937
  .rls-datatable__header {
3814
3938
  display: flex;
3815
3939
  column-gap: var(--sizing-x4);
3816
- padding: 0rem var(--sizing-x6);
3940
+ padding-left: var(--sizing-x6);
3941
+ padding-right: var(--pvt-header-padding-right);
3817
3942
  box-sizing: border-box;
3818
3943
  }
3819
3944
  .rls-datatable__title {
@@ -3966,7 +4091,7 @@ button {
3966
4091
  display: flex;
3967
4092
  width: calc(100% - var(--sizing-x2));
3968
4093
  height: 100%;
3969
- margin: var(--sizing-x3) 0rem;
4094
+ margin: var(--sizing-x3) var(--sizing-x2);
3970
4095
  justify-content: center;
3971
4096
  align-items: center;
3972
4097
  overflow: hidden;