@asd20/ui 3.2.581 → 3.2.583

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 (4) hide show
  1. package/package.json +1 -1
  2. package/src/components/organisms/Asd20PageContent/index.vue +73 -23
  3. package/src/components/templates/Asd20DistrictVideoTemplate/index.vue +9 -52
  4. package/src/data/page-queries/landing-page-query-result.json +1 -1
package/package.json CHANGED
@@ -5,7 +5,7 @@
5
5
  "*.scss",
6
6
  "*.vue"
7
7
  ],
8
- "version": "3.2.581",
8
+ "version": "3.2.583",
9
9
  "private": false,
10
10
  "license": "MIT",
11
11
  "repository": {
package/src/components/organisms/Asd20PageContent/index.vue CHANGED
@@ -127,30 +127,30 @@ export default {
127
127
  background: var(--color__tertiary);
128
128
  }
129
129
 
130
- // .asd20-messaging:not(:last-child) {
131
- // margin-bottom: space(2);
132
- // }
133
-
134
- &--grid {
135
- .primary-messaging-section,
136
- .secondary-messaging-section {
137
- --minimum-column-width: 480px;
138
- --gutter: #{space(1)};
139
- display: flex;
140
- flex-wrap: wrap;
141
- margin: calc(var(--gutter) * -1);
142
-
143
- &::v-deep > * {
144
- flex: 0 1 var(--minimum-column-width);
145
- margin: var(--gutter) !important;
146
- // max-width: 60%;
147
- }
148
- }
149
- }
150
- &::v-deep .omitMessageTitle .asd20-messaging__heading,
151
- &::v-deep .omitMessageTitle .lead {
152
- display: none;
130
+ .asd20-messaging:not(:last-child) {
131
+ margin-bottom: space(2);
153
132
  }
133
+
134
+ // &--grid {
135
+ // .primary-messaging-section,
136
+ // .secondary-messaging-section {
137
+ // --minimum-column-width: 480px;
138
+ // --gutter: #{space(1)};
139
+ // display: flex;
140
+ // flex-wrap: wrap;
141
+ // margin: calc(var(--gutter) * -1);
142
+
143
+ // &::v-deep > * {
144
+ // flex: 0 1 var(--minimum-column-width);
145
+ // margin: var(--gutter) !important;
146
+ // // max-width: 60%;
147
+ // }
148
+ // }
149
+ // }
150
+ // &::v-deep .omitMessageTitle .asd20-messaging__heading,
151
+ // &::v-deep .omitMessageTitle .lead {
152
+ // display: none;
153
+ // }
154
154
  &--fullscreen {
155
155
  .primary-messaging-section,
156
156
  .secondary-messaging-section {
@@ -174,6 +174,7 @@ export default {
174
174
  }
175
175
  .primary-messaging-section,
176
176
  .secondary-messaging-section {
177
+ display: block;
177
178
  padding: space(2) space(1) space(2) space(2);
178
179
  &::v-deep > * {
179
180
  // flex: 1 1 var(--minimum-column-width);
@@ -193,4 +194,53 @@ export default {
193
194
  }
194
195
  }
195
196
  }
197
+
198
+ @media (min-width: 1257px) {
199
+ .asd20-page-content {
200
+ .primary-messaging-section,
201
+ .secondary-messaging-section {
202
+ padding: space(2) space(1) space(2) space(2);
203
+ &::v-deep > * {
204
+ // flex: 1 1 var(--minimum-column-width);
205
+ margin: space(1) !important;
206
+ }
207
+ }
208
+ &--grid {
209
+ .primary-messaging-section,
210
+ .secondary-messaging-section {
211
+ --minimum-column-width: 480px;
212
+ --gutter: #{space(1)};
213
+ display: flex;
214
+ flex-wrap: wrap;
215
+ margin: calc(var(--gutter) * -1);
216
+ padding: space(2) space(3);
217
+
218
+ &::v-deep > * {
219
+ flex: 1 1 var(--minimum-column-width);
220
+ margin: var(--gutter) !important;
221
+ max-width: 45%;
222
+ }
223
+ }
224
+ }
225
+ // &::v-deep .omitMessageTitle .asd20-messaging__heading,
226
+ // &::v-deep .omitMessageTitle .lead {
227
+ // display: none;
228
+ // }
229
+ &--fullscreen {
230
+ .primary-messaging-section,
231
+ .secondary-messaging-section {
232
+ // --minimum-column-width: 320px;
233
+ --gutter: #{space(1)};
234
+ display: block;
235
+ margin: calc(var(--gutter) * -1);
236
+ padding: space(2) space(3);
237
+
238
+ &::v-deep > * {
239
+ // flex: 1 1 var(--minimum-column-width);
240
+ // margin: var(--gutter) !important;
241
+ }
242
+ }
243
+ }
244
+ }
245
+ }
196
246
  </style>
package/src/components/templates/Asd20DistrictVideoTemplate/index.vue CHANGED
@@ -208,18 +208,24 @@ export default {
208
208
  margin-top: space(2.25);
209
209
 
210
210
  .asd20-video-header {
211
+ &__top {
212
+ position: absolute;
213
+ }
211
214
  .weather-status-and-translation-container {
212
215
  display: flex;
213
216
  flex-direction: row;
214
217
  align-items: center;
218
+ margin: space(0.25) 0;
219
+ justify-content: flex-end;
215
220
  }
216
221
  .asd20-language-translation {
217
- position: absolute;
222
+ // position: absolute;
218
223
  top: 3.5rem;
219
224
  right: 0.5rem;
220
225
  background: rgba(255, 255, 255, 0.9);
221
226
  border-radius: 3rem;
222
227
  border: 1px solid var(--website-page__alternate-background-color);
228
+ margin-left: 0.5rem;
223
229
  .asd20-select-input {
224
230
  padding: 0.25rem 0.25rem;
225
231
  color: currentColor;
@@ -238,12 +244,6 @@ export default {
238
244
  .asd20-language-loader {
239
245
  order: 1;
240
246
  }
241
-
242
- .translation-button-adjust {
243
- position: absolute;
244
- top: space(1);
245
- right: space(0.5);
246
- }
247
247
  .weather-link {
248
248
  text-decoration: none;
249
249
  border-radius: 3rem;
@@ -258,33 +258,10 @@ export default {
258
258
  }
259
259
  .double-notification-wrapper {
260
260
  display: flex;
261
- flex-direction: row;
262
- justify-content: flex-end;
263
- align-items: center;
264
- flex-wrap: wrap;
261
+ flex-direction: column;
265
262
  }
266
263
  }
267
- // .asd20-video-header-content {
268
- // position: absolute;
269
- // top: space(2);
270
- // }
271
264
  }
272
- // .asd20-notification-group--floating {
273
- // .bell {
274
- // box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.125) !important;
275
- // svg {
276
- // fill: var(--color__accent) !important;
277
- // }
278
- // span {
279
- // background: var(--color__accent) !important;
280
- // top: inherit !important;
281
- // right: inherit !important;
282
- // width: 1.2rem !important;
283
- // height: 1.2rem !important;
284
- // font-size: 0.75rem !important;
285
- // }
286
- // }
287
- // }
288
265
 
289
266
  @keyframes slide_left {
290
267
  from {
@@ -297,7 +274,7 @@ export default {
297
274
  }
298
275
  }
299
276
 
300
- @media (min-width: 667px) {
277
+ @media (min-width: 768px) {
301
278
  .asd20-district-video-template {
302
279
  .asd20-video-header {
303
280
  .asd20-language-translation {
@@ -312,17 +289,11 @@ export default {
312
289
  --fill-color: var(--color__accent) !important;
313
290
  }
314
291
  }
315
- .translation-button-adjust {
316
- position: absolute;
317
- top: space(1);
318
- right: space(0.5);
319
- }
320
292
  .double-notification-wrapper {
321
293
  justify-content: center;
322
294
  }
323
295
  }
324
296
  .asd20-video-header-content {
325
- // position: absolute;
326
297
  top: inherit;
327
298
  bottom: 0%;
328
299
  }
@@ -334,22 +305,8 @@ export default {
334
305
  display: block;
335
306
  margin-left: space(3);
336
307
  margin-top: 0;
337
- // .notification-group--floating {
338
- // .bell {
339
- // span {
340
- // background: var(--color__accent);
341
- // top: -0.6em !important;
342
- // right: -0.6em !important;
343
- // }
344
- // }
345
- // }
346
308
  }
347
309
  .asd20-video-header {
348
- .translation-button-adjust {
349
- position: absolute;
350
- top: space(-1) !important;
351
- right: space(0) !important;
352
- }
353
310
  .double-notification-wrapper {
354
311
  justify-content: flex-end !important;
355
312
  }
package/src/data/page-queries/landing-page-query-result.json CHANGED
@@ -186,7 +186,7 @@
186
186
  },
187
187
  {
188
188
  "name": "full",
189
- "url": "https://asd20websitestorage.blob.core.windows.net/website-files/message-images/all-students-learn-at-high-levels./full/PIES-choice-photo_1280x852.jpg"
189
+ "url": "https://asd20websitestorage.blob.core.windows.net/website-files/message-images/accredited-with-distinction/full/PES Accredidation Hero_1280x711_2023-08-29T21_16_58.jpg"
190
190
  }
191
191
  ],
192
192
  "metadata": {