@asd20/ui 3.2.1034 → 3.2.1035

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.
package/package.json CHANGED
@@ -5,7 +5,7 @@
5
5
  "*.scss",
6
6
  "*.vue"
7
7
  ],
8
- "version": "3.2.1034",
8
+ "version": "3.2.1035",
9
9
  "private": false,
10
10
  "license": "MIT",
11
11
  "repository": {
@@ -48,7 +48,7 @@ $factoids-header-fg: var(--color__primary);
48
48
  font-size: 1.25rem;
49
49
  padding: space(0.5) space(1) space(0.5) space(1);
50
50
  z-index: -1;
51
- border-top: 2px solid var(--color__tertiary);
51
+ // border-top: 2px solid var(--color__tertiary);
52
52
  }
53
53
  }
54
54
 
@@ -56,8 +56,8 @@ $factoids-header-fg: var(--color__primary);
56
56
  .asd20-factoids-section {
57
57
  grid-column: 1 / -1;
58
58
  h2 {
59
- width: calc(100% - #{space(6)});
60
- margin-left: space(6);
59
+ width: calc(100% - #{space(3)});
60
+ margin-left: space(3);
61
61
  }
62
62
  }
63
63
  }
@@ -1,6 +1,6 @@
1
1
  <template>
2
2
  <component :is="tag" class="asd20-swiper-feed">
3
- <h2 aria-label="Feed title">
3
+ <h2 class="swiper-title" aria-label="Feed title">
4
4
  <asd20-icon v-if="icon" :name="icon" size="lg" /><span
5
5
  v-html="title"
6
6
  ></span>
@@ -142,9 +142,9 @@ export default {
142
142
  display: flex;
143
143
  flex-direction: column;
144
144
  position: relative;
145
- margin: 0;
146
- padding: space(2) space(2) space(2) 0;
147
- background: var(--website-page__alternate-background-color);
145
+ margin: space(2) 0 space(0.5) 0;
146
+ // padding: space(1) space(2) space(1) 0;
147
+ // background: var(--website-page__alternate-background-color);
148
148
 
149
149
  --color__fade-overlay-left: var(--website-page__background-color);
150
150
  --color__fade-overlay-right: var(--website-page__alternate-background-color);
@@ -157,17 +157,18 @@ export default {
157
157
  display: block;
158
158
  position: absolute;
159
159
  left: 0;
160
- right: space(1);
161
- top: space(1);
162
- bottom: space(0);
163
- background: var(--website-page__background-color);
164
- border-radius: var(--website-shape__radius-m);
165
- border-top-left-radius: 0;
166
- border-bottom-left-radius: 0;
160
+ right: 0;
161
+ top: 30%;
162
+ bottom: 30%;
163
+ background: var(--website-page__alternate-background-color);
164
+ border-radius: 0;
165
+ // border-radius: var(--website-shape__radius-m);
166
+ // border-top-left-radius: 0;
167
+ // border-bottom-left-radius: 0;
167
168
  z-index: 0;
168
169
  }
169
170
 
170
- h2 {
171
+ .swiper-title {
171
172
  display: flex;
172
173
  font-size: 1.5rem;
173
174
  line-height: 1;
@@ -175,6 +176,9 @@ export default {
175
176
  text-align: left;
176
177
  margin: 0 0 0 space(1);
177
178
  align-items: center;
179
+ border-bottom: 3px solid var(--color__accent);
180
+ padding-bottom: space(0.5);
181
+ width: 100%;
178
182
  }
179
183
 
180
184
  .asd20-icon {
@@ -197,6 +201,7 @@ export default {
197
201
  .feed-buttons {
198
202
  display: flex;
199
203
  flex-direction: column;
204
+ padding-bottom: space(0.5);
200
205
  }
201
206
 
202
207
  .asd20-button {
@@ -224,13 +229,14 @@ export default {
224
229
 
225
230
  @media (min-width: 1024px) {
226
231
  .asd20-swiper-feed {
227
- h2 {
228
- margin-left: space(3);
232
+ .swiper-title {
233
+ margin: 0 space(1) 0 space(3);
234
+ width: inherit;
229
235
  }
230
236
 
231
- &::after {
232
- right: space(3);
233
- }
237
+ // &::after {
238
+ // right: space(3);
239
+ // }
234
240
 
235
241
  .asd20-swiper {
236
242
  // margin-left: space(1);
@@ -256,23 +256,23 @@ export default {
256
256
  top: space(2.0375);
257
257
  }
258
258
 
259
- .asd20-feeds-section--top {
260
- // margin-top: space(1);
261
- .asd20-swiper-feed:first-child {
262
- padding-top: space(2);
263
- padding-bottom: space(1);
264
- &::after {
265
- top: space(1);
266
- }
267
- }
268
- .asd20-swiper-feed:last-child {
269
- // margin-top: space(-1);
270
- padding-bottom: space(2);
271
- &::after {
272
- bottom: space(1);
273
- }
274
- }
275
- }
259
+ // .asd20-feeds-section--top {
260
+ // // margin-top: space(1);
261
+ // .asd20-swiper-feed:first-child {
262
+ // padding-top: space(2);
263
+ // padding-bottom: space(1);
264
+ // &::after {
265
+ // top: space(1);
266
+ // }
267
+ // }
268
+ // .asd20-swiper-feed:last-child {
269
+ // // margin-top: space(-1);
270
+ // padding-bottom: space(2);
271
+ // &::after {
272
+ // bottom: space(1);
273
+ // }
274
+ // }
275
+ // }
276
276
  }
277
277
 
278
278
  @media (min-width: 1024px) {
@@ -227,23 +227,23 @@ export default {
227
227
  .asd20-notification-group--inline {
228
228
  margin-top: space(2) !important;
229
229
  }
230
- .asd20-feeds-section {
231
- margin-top: space(1);
232
- .asd20-swiper-feed:first-child {
233
- padding-top: space(2);
234
- padding-bottom: space(1);
235
- &::after {
236
- top: space(1);
237
- }
238
- }
239
- .asd20-swiper-feed:last-child {
240
- // margin-top: space(-1);
241
- padding-bottom: space(2);
242
- &::after {
243
- bottom: space(1);
244
- }
245
- }
246
- }
230
+ // .asd20-feeds-section {
231
+ // margin-top: space(1);
232
+ // .asd20-swiper-feed:first-child {
233
+ // padding-top: space(2);
234
+ // padding-bottom: space(1);
235
+ // &::after {
236
+ // top: space(1);
237
+ // }
238
+ // }
239
+ // .asd20-swiper-feed:last-child {
240
+ // // margin-top: space(-1);
241
+ // padding-bottom: space(2);
242
+ // &::after {
243
+ // bottom: space(1);
244
+ // }
245
+ // }
246
+ // }
247
247
  .intro-message {
248
248
  .primary-messaging-section {
249
249
  justify-content: center;
@@ -231,22 +231,22 @@ export default {
231
231
  .notification-group--inline {
232
232
  margin-bottom: space(1);
233
233
  }
234
- .asd20-feeds-section {
235
- margin-top: space(1);
236
- .asd20-swiper-feed:first-child {
237
- padding-top: space(2);
238
- padding-bottom: space(1);
239
- &::after {
240
- top: space(1);
241
- }
242
- }
243
- .asd20-swiper-feed:last-child {
244
- padding-bottom: space(2);
245
- &::after {
246
- bottom: space(1);
247
- }
248
- }
249
- }
234
+ // .asd20-feeds-section {
235
+ // margin-top: space(1);
236
+ // .asd20-swiper-feed:first-child {
237
+ // padding-top: space(2);
238
+ // padding-bottom: space(1);
239
+ // &::after {
240
+ // top: space(1);
241
+ // }
242
+ // }
243
+ // .asd20-swiper-feed:last-child {
244
+ // padding-bottom: space(2);
245
+ // &::after {
246
+ // bottom: space(1);
247
+ // }
248
+ // }
249
+ // }
250
250
  .asd20-page-content:not(.intro-message) .primary-messaging-section {
251
251
  padding: space(1) space(0);
252
252
  }