@trilogy-ds/styles 0.0.1-beta-93 → 0.0.1-beta-95

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 (7) hide show
  1. package/dist/default/trilogy-mangled.css +1 -1
  2. package/dist/default/trilogy-partials.css +1 -1
  3. package/dist/default/trilogy.css +1 -1
  4. package/framework/src/components/_autolayout.scss +105 -75
  5. package/framework/src/elements/_form.scss +0 -9
  6. package/framework/src/utilities/_mixins.scss +1 -1
  7. package/package.json +1 -1
package/framework/src/components/_autolayout.scss CHANGED
@@ -1,95 +1,101 @@
1
1
  body:not(.is-tight) {
2
- .accordions {
2
+ .accordions:not(:last-child) {
3
3
  margin-bottom: 24px;
4
4
  }
5
- .card {
5
+ .card:not(:last-child) {
6
6
  margin-bottom: 24px;
7
7
  }
8
- .box {
8
+ .box:not(:last-child) {
9
9
  margin-bottom: 24px;
10
10
  }
11
- .table {
11
+ .table:not(:last-child) {
12
12
  margin-bottom: 24px;
13
13
  }
14
- .list {
14
+ .list:not(:last-child) {
15
15
  margin-bottom: 24px;
16
16
  }
17
- .timeline {
17
+ .timeline:not(:last-child) {
18
18
  margin-bottom: 24px;
19
19
  }
20
- .stepper {
20
+ .stepper:not(:last-child) {
21
21
  margin-bottom: 24px;
22
22
  }
23
- .pagination {
23
+ .pagination:not(:last-child) {
24
24
  margin-bottom: 24px;
25
25
  }
26
- .segmented-control {
26
+ .segmented-control:not(:last-child) {
27
27
  margin-bottom: 24px;
28
28
  }
29
- .tabs {
29
+ .tabs:not(:last-child) {
30
30
  margin-bottom: 24px;
31
31
  }
32
- .range {
32
+ .range:not(:last-child) {
33
33
  margin-bottom: 24px;
34
34
  }
35
- .stepper {
35
+ .stepper:not(:last-child) {
36
36
  margin-bottom: 24px;
37
37
  }
38
- .price-container {
38
+ .price-container:not(:last-child) {
39
39
  margin-bottom: 12px;
40
40
  }
41
- .buttons {
41
+ .buttons:not(:last-child) {
42
42
  margin-bottom: 24px;
43
43
  }
44
- .countdown {
44
+ .countdown:not(:last-child) {
45
45
  margin-bottom: 16px;
46
46
  }
47
- .countdown.is-small {
47
+ .countdown.is-small:not(:last-child) {
48
48
  margin-bottom: 12px;
49
49
  }
50
- .chips-list {
50
+ .chips-list:not(:last-child) {
51
51
  margin-bottom: 12px;
52
52
  }
53
53
  p.text:not(:last-child) {
54
54
  margin-bottom: 12px;
55
55
  }
56
- .progress {
56
+ .progress:not(:last-child) {
57
57
  margin-bottom: 8px;
58
58
  }
59
- .progress-radial {
59
+ .progress-radial:not(:last-child) {
60
60
  margin-bottom: 8px;
61
61
  }
62
- .radio {
62
+ .radio:not(:last-child) {
63
63
  margin-bottom: 12px;
64
64
  }
65
- .checkbox {
65
+ .checkbox:not(:last-child) {
66
66
  margin-bottom: 12px;
67
67
  }
68
- .switch {
68
+ .switch:not(:last-child) {
69
69
  margin-bottom: 12px;
70
70
  }
71
- .radio-tile {
71
+ .radio-tile:not(:last-child) {
72
72
  margin-bottom: 24px;
73
73
  }
74
- .checkbox-tile {
74
+ .checkbox-tile:not(:last-child) {
75
75
  margin-bottom: 24px;
76
76
  }
77
- .input {
78
- margin-bottom: 16px;
77
+ .field:not(:last-child) {
78
+ margin-bottom: 24px;
79
+ }
80
+ .control:not(:last-child) {
81
+ margin-bottom: 4px;
82
+ }
83
+ .help:not(:last-child) {
84
+ margin-bottom: 4px;
79
85
  }
80
- .textarea {
86
+ .textarea:not(:last-child) {
81
87
  margin-bottom: 16px;
82
88
  }
83
- .select {
89
+ .select:not(:last-child) {
84
90
  margin-bottom: 16px;
85
91
  }
86
- .link {
92
+ .link:not(:last-child) {
87
93
  margin-bottom: 12px;
88
94
  }
89
- .sticker {
95
+ .sticker:not(:last-child) {
90
96
  margin-bottom: 8px;
91
97
  }
92
- .tag {
98
+ .tag:not(:last-child) {
93
99
  margin-bottom: 8px;
94
100
  }
95
101
  .title.is-level-1:not(:last-child) {
@@ -110,116 +116,131 @@ body:not(.is-tight) {
110
116
  .title.is-level-6:not(:last-child) {
111
117
  margin-bottom: 12px;
112
118
  }
113
- .overline {
119
+ .overline:not(:last-child) {
114
120
  margin-bottom: 0px;
115
121
  }
116
- .title.is-level-1 + .subtitle {
122
+ .title:has(+.subtitle):not(:last-child) {
117
123
  margin-bottom: 8px;
118
124
  }
119
- .title.is-level-2 + .subtitle {
120
- margin-bottom: 8px;
121
- }
122
- .subtitle + .title.is-level-1 {
125
+ .title.is-level-1 + .subtitle:not(:last-child) {
123
126
  margin-bottom: 32px;
124
127
  }
125
- .subtitle + .title.is-level-2 {
128
+ .title.is-level-2 + .subtitle:not(:last-child) {
126
129
  margin-bottom: 24px;
127
130
  }
131
+ .title.is-level-3 + .subtitle:not(:last-child) {
132
+ margin-bottom: 24px;
133
+ }
134
+ .title.is-level-4 + .subtitle:not(:last-child) {
135
+ margin-bottom: 12px;
136
+ }
137
+ .title.is-level-5 + .subtitle:not(:last-child) {
138
+ margin-bottom: 12px;
139
+ }
140
+ .title.is-level-6 + .subtitle:not(:last-child) {
141
+ margin-bottom: 12px;
142
+ }
128
143
  }
129
144
 
130
145
  @include mobile() {
131
146
  body:not(.is-tight) {
132
- .accordions {
147
+ .accordions:not(:last-child) {
133
148
  margin-bottom: 16px;
134
149
  }
135
- .card {
150
+ .card:not(:last-child) {
136
151
  margin-bottom: 16px;
137
152
  }
138
- .box {
153
+ .box:not(:last-child) {
139
154
  margin-bottom: 16px;
140
155
  }
141
- .table {
156
+ .table:not(:last-child) {
142
157
  margin-bottom: 16px;
143
158
  }
144
- .list {
159
+ .list:not(:last-child) {
145
160
  margin-bottom: 16px;
146
161
  }
147
- .timeline {
162
+ .timeline:not(:last-child) {
148
163
  margin-bottom: 16px;
149
164
  }
150
- .stepper {
165
+ .stepper:not(:last-child) {
151
166
  margin-bottom: 16px;
152
167
  }
153
- .pagination {
168
+ .pagination:not(:last-child) {
154
169
  margin-bottom: 16px;
155
170
  }
156
- .segmented-control {
171
+ .segmented-control:not(:last-child) {
157
172
  margin-bottom: 16px;
158
173
  }
159
- .tabs {
174
+ .tabs:not(:last-child) {
160
175
  margin-bottom: 16px;
161
176
  }
162
- .range {
177
+ .range:not(:last-child) {
163
178
  margin-bottom: 16px;
164
179
  }
165
- .stepper {
180
+ .stepper:not(:last-child) {
166
181
  margin-bottom: 16px;
167
182
  }
168
- .price-container {
183
+ .price-container:not(:last-child) {
169
184
  margin-bottom: 8px;
170
185
  }
171
- .buttons {
186
+ .buttons:not(:last-child) {
172
187
  margin-bottom: 16px;
173
188
  }
174
- .countdown {
189
+ .countdown:not(:last-child) {
175
190
  margin-bottom: 12px;
176
191
  }
177
- .countdown.is-small {
192
+ .countdown.is-small:not(:last-child) {
178
193
  margin-bottom: 12px;
179
194
  }
180
- .chips-list {
195
+ .chips-list:not(:last-child) {
181
196
  margin-bottom: 12px;
182
197
  }
183
198
  p.text:not(:last-child) {
184
199
  margin-bottom: 8px;
185
200
  }
186
- .progress {
201
+ .progress:not(:last-child) {
187
202
  margin-bottom: 8px;
188
203
  }
189
- .progress-radial {
204
+ .progress-radial:not(:last-child) {
190
205
  margin-bottom: 8px;
191
206
  }
192
- .radio {
207
+ .radio:not(:last-child) {
193
208
  margin-bottom: 12px;
194
209
  }
195
- .checkbox {
210
+ .checkbox:not(:last-child) {
196
211
  margin-bottom: 12px;
197
212
  }
198
- .switch {
213
+ .switch:not(:last-child) {
199
214
  margin-bottom: 12px;
200
215
  }
201
- .radio-tile {
216
+ .radio-tile:not(:last-child) {
202
217
  margin-bottom: 16px;
203
218
  }
204
- .checkbox-tile {
219
+ .checkbox-tile:not(:last-child) {
205
220
  margin-bottom: 16px;
206
221
  }
207
- .input {
222
+ .field:not(:last-child) {
208
223
  margin-bottom: 16px;
209
224
  }
210
- .textarea {
225
+ .control:not(:last-child) {
226
+ margin-bottom: 4px;
227
+ }
228
+ .help:not(:last-child) {
229
+ margin-bottom: 4px;
230
+ }
231
+ .textarea:not(:last-child) {
211
232
  margin-bottom: 16px;
212
233
  }
213
- .select {
234
+ .select:not(:last-child) {
214
235
  margin-bottom: 16px;
215
236
  }
216
- .link {
237
+ .link:not(:last-child) {
217
238
  margin-bottom: 8px;
218
239
  }
219
- .sticker {
240
+ .sticker:not(:last-child) {
220
241
  margin-bottom: 8px;
221
242
  }
222
- .tag {
243
+ .tag:not(:last-child) {
223
244
  margin-bottom: 8px;
224
245
  }
225
246
  .title.is-level-1:not(:last-child) {
@@ -240,21 +261,30 @@ body:not(.is-tight) {
240
261
  .title.is-level-6:not(:last-child) {
241
262
  margin-bottom: 8px;
242
263
  }
243
- .overline {
264
+ .overline:not(:last-child) {
244
265
  margin-bottom: 0px;
245
266
  }
246
- .title.is-level-1 + .subtitle {
267
+ .title:has(+.subtitle):not(:last-child) {
247
268
  margin-bottom: 8px;
248
269
  }
249
- .title.is-level-2 + .subtitle {
250
- margin-bottom: 8px;
251
- }
252
- .subtitle + .title.is-level-1 {
270
+ .title.is-level-1 + .subtitle:not(:last-child) {
253
271
  margin-bottom: 40px;
254
272
  }
255
- .subtitle + .title.is-level-2 {
273
+ .title.is-level-2 + .subtitle:not(:last-child) {
274
+ margin-bottom: 32px;
275
+ }
276
+ .title.is-level-3 + .subtitle:not(:last-child) {
256
277
  margin-bottom: 32px;
257
278
  }
279
+ .title.is-level-4 + .subtitle:not(:last-child) {
280
+ margin-bottom: 8px;
281
+ }
282
+ .title.is-level-5 + .subtitle:not(:last-child) {
283
+ margin-bottom: 8px;
284
+ }
285
+ .title.is-level-6 + .subtitle:not(:last-child) {
286
+ margin-bottom: 8px;
287
+ }
258
288
 
259
289
  }
260
290
  }
package/framework/src/elements/_form.scss CHANGED
@@ -5,14 +5,6 @@ $help-size: $size-small;
5
5
  $label-weight: $weight-bold;
6
6
 
7
7
  .field {
8
- &:not(:first-child) {
9
- margin-top: $field-margin;
10
- }
11
-
12
- &:not(:last-child) {
13
- margin-bottom: 7.5px;
14
- }
15
-
16
8
  &.is-fullwidth {
17
9
  div.control {
18
10
  flex: 1;
@@ -412,7 +404,6 @@ $label-weight: $weight-bold;
412
404
  }
413
405
 
414
406
  + .help {
415
- margin: 4px 0;
416
407
  font-size: $text-12;
417
408
  font-weight: $weight-medium;
418
409
  }
package/framework/src/utilities/_mixins.scss CHANGED
@@ -365,7 +365,7 @@
365
365
  @include control;
366
366
  height: 56px;
367
367
  background-color: getColor('background');
368
- border-color: getColor('main-fade');
368
+ border-color: getColor('neutral');
369
369
  color: getColor('font');
370
370
 
371
371
  @include placeholder {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@trilogy-ds/styles",
3
- "version": "0.0.1-beta-93",
3
+ "version": "0.0.1-beta-95",
4
4
  "author": "Bouygues Telecom",
5
5
  "license": "UNLICENSED",
6
6
  "files": [