slow-steps 0.3.2 → 0.4.3
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.
- checksums.yaml +4 -4
- data/README.md +1 -1
- data/_config.yml +3 -3
- data/_includes/contact-form.html +1 -1
- data/_includes/cookie-consent.html +21 -0
- data/_includes/footer/footer.html +64 -7
- data/_includes/footer/footer_redesign.html +139 -0
- data/_includes/forms/mc-register.html +124 -110
- data/_includes/functions/calc-svg-coord.html +2 -0
- data/_includes/functions/reposition-svg-labels.html +44 -0
- data/_includes/head/descriptors/og-meta.html +1 -2
- data/_includes/head/descriptors/structured-data.html +3 -3
- data/_includes/head/descriptors/twitter-meta.html +1 -1
- data/_includes/{google-analytics.html → head/google-analytics.html} +9 -2
- data/_includes/head/head.html +6 -4
- data/_includes/head/stylesheets.html +3 -0
- data/_includes/image-post.html +3 -1
- data/_includes/image.html +1 -1
- data/_includes/navigation/global.html +20 -4
- data/_includes/scripts.html +3 -1
- data/_layouts/about.html +1 -1
- data/_layouts/careers.html +1 -1
- data/_layouts/contact.html +1 -1
- data/_layouts/default.html +4 -1
- data/_layouts/env/clinician.html +8 -8
- data/_layouts/env/landing.html +6 -6
- data/_layouts/env/pwp.html +4 -4
- data/_layouts/error-page.html +1 -1
- data/_layouts/faq.html +4 -1
- data/_layouts/feed.html +3 -3
- data/_layouts/full-width.html +1 -1
- data/_layouts/post.html +3 -3
- data/_layouts/register.html +1 -1
- data/_sass/_colors/_variables.sass +2 -0
- data/_sass/_functions.sass +9 -0
- data/_sass/_mixins.sass +6 -3
- data/_sass/about.sass +3 -1
- data/_sass/breakpoints/about.sass +11 -2
- data/_sass/collage.sass +1 -1
- data/_sass/contact.sass +2 -2
- data/_sass/env/breakpoints/768.sass +16 -11
- data/_sass/env/clinician.sass +12 -8
- data/_sass/env/landing.sass +18 -3
- data/_sass/env/pwp.sass +11 -3
- data/_sass/faq.sass +9 -1
- data/_sass/feed.sass +2 -2
- data/_sass/footer.sass +174 -14
- data/_sass/footer_redesign.sass +353 -0
- data/_sass/forms/mc-forms.sass +9 -0
- data/_sass/global.sass +89 -8
- data/_sass/navigation/_variables.sass +3 -3
- data/_sass/navigation/base.sass +14 -4
- data/_sass/navigation/breakpoints/1024.sass +48 -9
- data/_sass/navigation/burger.sass +1 -1
- data/_sass/post.sass +7 -1
- data/_sass/typography/_variables.sass +1 -1
- data/_sass/typography/resets.sass +2 -2
- data/assets/css/env/gaitq_clinician.sass +1 -1
- data/assets/css/env/gaitq_landing.sass +1 -1
- data/assets/css/env/gaitq_pwp.sass +1 -1
- data/assets/css/gaitq_errors.sass +1 -1
- data/assets/js/mobile-nav-slider.js +1 -1
- data/assets/js/svg_text_width.js +4 -4
- metadata +7 -6
- data/_includes/footer/footer_full.html +0 -79
- data/_includes/functions/pull_page_args.html +0 -31
- data/_sass/footer_full.sass +0 -183
data/_sass/forms/mc-forms.sass
CHANGED
data/_sass/global.sass
CHANGED
@@ -87,6 +87,7 @@ body
|
|
87
87
|
object-fit: cover
|
88
88
|
object-position: center
|
89
89
|
width: 100%
|
90
|
+
display: inherit
|
90
91
|
|
91
92
|
.image__filter--mix
|
92
93
|
@include image-filter--mix
|
@@ -101,9 +102,35 @@ body
|
|
101
102
|
text-align: center
|
102
103
|
width: 100vw
|
103
104
|
|
104
|
-
|
105
|
+
|
106
|
+
& > p
|
107
|
+
opacity: 0
|
105
108
|
padding-top: 12px
|
109
|
+
animation: fadeInAnimation ease 1s
|
110
|
+
animation-delay: .8s
|
111
|
+
animation-iteration-count: 1
|
112
|
+
animation-fill-mode: forwards
|
113
|
+
|
114
|
+
& > h1, h2, h3, h4, h5
|
115
|
+
animation: zoomInAnimation ease .6s
|
116
|
+
animation-iteration-count: 1
|
117
|
+
animation-fill-mode: forwards
|
118
|
+
|
119
|
+
@keyframes zoomInAnimation
|
120
|
+
0%
|
121
|
+
transform: scale(0)
|
122
|
+
opacity: 0
|
123
|
+
|
124
|
+
100%
|
125
|
+
transform: scale(1)
|
126
|
+
opacity: 1
|
106
127
|
|
128
|
+
@keyframes fadeInAnimation
|
129
|
+
0%
|
130
|
+
opacity: 0
|
131
|
+
|
132
|
+
100%
|
133
|
+
opacity: 1
|
107
134
|
|
108
135
|
.hero__strap--center
|
109
136
|
//padding-top: $navbar-height
|
@@ -180,7 +207,8 @@ body
|
|
180
207
|
stroke-width: 1
|
181
208
|
|
182
209
|
& > .svg--text
|
183
|
-
font-size: $font-size
|
210
|
+
font-size: $lg-font-size
|
211
|
+
font-weight: $heavy-font
|
184
212
|
|
185
213
|
.svg__labels.hidden
|
186
214
|
|
@@ -208,6 +236,13 @@ body
|
|
208
236
|
& > .trans-right
|
209
237
|
animation: trans-in-right .6s ease-in-out
|
210
238
|
|
239
|
+
// This is digusting! We need to tweak the actual html so we can readilly access these elements.
|
240
|
+
.svg__labels--red
|
241
|
+
& > svg > * > *
|
242
|
+
fill: darken($opd-coral, 10)
|
243
|
+
& > svg > * > line
|
244
|
+
stroke: darken($opd-coral,10)!important
|
245
|
+
|
211
246
|
|
212
247
|
$svg-text-offset: 60px
|
213
248
|
|
@@ -261,6 +296,7 @@ $svg-text-offset: 60px
|
|
261
296
|
display: flex
|
262
297
|
padding: 0
|
263
298
|
margin: 0
|
299
|
+
line-height: 0
|
264
300
|
|
265
301
|
.social-media-item
|
266
302
|
list-style: none
|
@@ -314,9 +350,8 @@ $svg-text-offset: 60px
|
|
314
350
|
|
315
351
|
// This is basically a button and should to be centralised
|
316
352
|
.action__call
|
317
|
-
|
318
|
-
|
319
|
-
margin: -100px auto
|
353
|
+
font-size: $font-size
|
354
|
+
margin: 0 auto
|
320
355
|
padding: 2rem
|
321
356
|
position: relative
|
322
357
|
text-decoration: none
|
@@ -327,14 +362,14 @@ $svg-text-offset: 60px
|
|
327
362
|
content: ''
|
328
363
|
display: block
|
329
364
|
height: 6rem
|
330
|
-
left:
|
365
|
+
left: -1rem
|
331
366
|
position: absolute
|
332
|
-
top:
|
367
|
+
top: .5rem
|
333
368
|
transition: .2s ease
|
334
369
|
width: 6rem
|
335
370
|
|
336
371
|
span
|
337
|
-
font-weight:
|
372
|
+
font-weight: $heavy-font
|
338
373
|
position: relative
|
339
374
|
|
340
375
|
svg
|
@@ -358,3 +393,49 @@ $svg-text-offset: 60px
|
|
358
393
|
|
359
394
|
span
|
360
395
|
color: $white
|
396
|
+
|
397
|
+
|
398
|
+
.cc-window
|
399
|
+
background-color: $opd-blue
|
400
|
+
display: flex
|
401
|
+
align-items: center
|
402
|
+
position: fixed
|
403
|
+
|
404
|
+
.cc-message
|
405
|
+
width: 80vw
|
406
|
+
padding: 3rem 2rem
|
407
|
+
color: $pure-white
|
408
|
+
|
409
|
+
.cc-compliance
|
410
|
+
width: 20vw
|
411
|
+
border-style: none
|
412
|
+
height: 100%
|
413
|
+
|
414
|
+
|
415
|
+
|
416
|
+
.cc-dismiss
|
417
|
+
display: flex
|
418
|
+
flex-wrap: nowrap
|
419
|
+
background-color: $opd-coral
|
420
|
+
border-style: none
|
421
|
+
color: $pure-white
|
422
|
+
border-radius: 6px
|
423
|
+
|
424
|
+
&:hover
|
425
|
+
background-color: lighten($opd-coral, 10)
|
426
|
+
|
427
|
+
.cc-link
|
428
|
+
text-decoration: none
|
429
|
+
color: lighten($opd-coral, 10)
|
430
|
+
|
431
|
+
&:hover
|
432
|
+
color: $opd-coral
|
433
|
+
|
434
|
+
|
435
|
+
.skip-link
|
436
|
+
margin: 0
|
437
|
+
position: absolute
|
438
|
+
padding: 0
|
439
|
+
width: 1px
|
440
|
+
height: 1px
|
441
|
+
overflow: hidden
|
@@ -6,15 +6,15 @@
|
|
6
6
|
|
7
7
|
$navbar-height: 5vh
|
8
8
|
|
9
|
-
$mobile-navbar-height: 10vh
|
10
|
-
|
11
9
|
$secondary-navbar-height: 10vh
|
12
10
|
|
13
11
|
$brand-height: 55%
|
14
12
|
|
15
13
|
// change .nav-list.height manually in _sass/navbar/mobile.sass, can't figure out how to use calc --vh whith sass var
|
16
14
|
|
17
|
-
$
|
15
|
+
$mobile-navbar-height: 10vh
|
16
|
+
|
17
|
+
$mobile-nav-list-height: 90vh
|
18
18
|
|
19
19
|
// ************* Colours *************
|
20
20
|
|
data/_sass/navigation/base.sass
CHANGED
@@ -28,20 +28,23 @@
|
|
28
28
|
width: 30vw
|
29
29
|
padding-left: 3vw
|
30
30
|
z-index: 1
|
31
|
+
margin-top: .7rem
|
32
|
+
// fudge fix for G making logo apear off-centre
|
31
33
|
|
32
34
|
.site__logo *
|
33
35
|
@include default-trans
|
34
36
|
|
37
|
+
|
35
38
|
.nav-list
|
36
39
|
border-bottom-left-radius: 80px
|
37
40
|
font-size: 1.3rem
|
38
|
-
height: $nav-list-height
|
39
|
-
height: calc( var(--vh, 1vh) *
|
41
|
+
height: $mobile-nav-list-height
|
42
|
+
height: calc( var(--vh, 1vh) * #{ strip-unit($mobile-nav-list-height)} )
|
40
43
|
list-style: none
|
41
44
|
margin: 0
|
42
|
-
margin-block-start:
|
45
|
+
margin-block-start: calc( var(--vh, 1vh) * #{ strip-unit($mobile-navbar-height)} )
|
43
46
|
padding: 0
|
44
|
-
padding-top:
|
47
|
+
padding-top: 0
|
45
48
|
position: absolute
|
46
49
|
right: 0
|
47
50
|
top: 0
|
@@ -50,6 +53,12 @@
|
|
50
53
|
width: 100vw
|
51
54
|
box-sizing: content-box
|
52
55
|
background-color: $env-primary
|
56
|
+
overflow: scroll
|
57
|
+
|
58
|
+
.nav-group-content
|
59
|
+
//text-indent: 2rem
|
60
|
+
.nav-link
|
61
|
+
margin: 3vh 20vw
|
53
62
|
|
54
63
|
.nav-link
|
55
64
|
margin: 6vh 15vw
|
@@ -68,6 +77,7 @@
|
|
68
77
|
.nav-active
|
69
78
|
// we toggle this class in mobile-nav-slider.js on burger click
|
70
79
|
transform: translateX(0%)
|
80
|
+
box-shadow: -.2px .2px 0 rgba($pure-black, .3)
|
71
81
|
|
72
82
|
|
73
83
|
.site__logo-active
|
@@ -21,7 +21,8 @@
|
|
21
21
|
.nav-brand
|
22
22
|
@include default-trans
|
23
23
|
height: 8vh
|
24
|
-
max-height: 100px
|
24
|
+
//max-height: 100px
|
25
|
+
// max-height breaks vertical centering
|
25
26
|
|
26
27
|
.nav-scrolled
|
27
28
|
background-color: $env-primary
|
@@ -31,9 +32,11 @@
|
|
31
32
|
@include default-trans
|
32
33
|
display: flex
|
33
34
|
position: absolute
|
34
|
-
max-
|
35
|
+
//max-height: 100px
|
36
|
+
// max-height breaks vertical centering
|
35
37
|
height: 10vh
|
36
38
|
top: 7.5vh
|
39
|
+
margin-top: 0
|
37
40
|
|
38
41
|
.site__logo
|
39
42
|
position: absolute
|
@@ -50,10 +53,21 @@
|
|
50
53
|
height: 5vh
|
51
54
|
padding: 0
|
52
55
|
background-color: inherit
|
56
|
+
box-shadow: none
|
57
|
+
margin-block-start: 0
|
58
|
+
padding: 0
|
59
|
+
overflow: visible
|
53
60
|
|
54
61
|
.nav-group
|
55
62
|
padding: 0 2rem
|
56
63
|
|
64
|
+
.nav-group-content
|
65
|
+
//text-indent: 2rem
|
66
|
+
&:last-child
|
67
|
+
margin-right: 10rem
|
68
|
+
.nav-link
|
69
|
+
margin: 0
|
70
|
+
|
57
71
|
.nav-link
|
58
72
|
align-items: center
|
59
73
|
padding: 0
|
@@ -63,10 +77,31 @@
|
|
63
77
|
overflow: hidden
|
64
78
|
position: relative
|
65
79
|
|
80
|
+
|
66
81
|
.sub-link,
|
67
82
|
.subsub-link
|
68
83
|
color: $env-primary
|
84
|
+
border-bottom: solid 1px $pure-white
|
85
|
+
span
|
86
|
+
padding: 1rem 0
|
69
87
|
|
88
|
+
.nav-cta
|
89
|
+
@include default-trans
|
90
|
+
color: $pure-white
|
91
|
+
background-color: $env-primary
|
92
|
+
//padding: 2rem 2rem!important
|
93
|
+
margin-right: 8rem!important
|
94
|
+
border-radius: 6px
|
95
|
+
|
96
|
+
span
|
97
|
+
padding: 0
|
98
|
+
|
99
|
+
&:before, &:after
|
100
|
+
display: none!important
|
101
|
+
|
102
|
+
&:hover
|
103
|
+
background-color: darken($env-primary,10)
|
104
|
+
border-bottom: none
|
70
105
|
|
71
106
|
// Surround current link with ticks
|
72
107
|
.current--url
|
@@ -76,15 +111,18 @@
|
|
76
111
|
height: 2px
|
77
112
|
position: relative
|
78
113
|
vertical-align: middle
|
79
|
-
width:
|
114
|
+
width: 6px
|
80
115
|
|
81
116
|
&:before
|
82
|
-
right:
|
83
|
-
margin-left: -10%
|
117
|
+
right: 3px
|
84
118
|
|
85
119
|
&:after
|
86
|
-
left:
|
87
|
-
|
120
|
+
left: 3px
|
121
|
+
|
122
|
+
.current--env
|
123
|
+
span
|
124
|
+
border-bottom: solid 1px $pure-white
|
125
|
+
|
88
126
|
|
89
127
|
.nav-group-content
|
90
128
|
@include default-trans
|
@@ -139,12 +177,13 @@
|
|
139
177
|
|
140
178
|
.nav-group-container
|
141
179
|
.nav-link
|
142
|
-
font-weight:
|
180
|
+
font-weight: $heavy-font
|
143
181
|
text-transform: uppercase
|
144
182
|
padding: 1rem 3rem
|
145
183
|
&:not(.current--url)
|
146
184
|
&:hover
|
147
|
-
|
185
|
+
span
|
186
|
+
border-bottom: solid 1px $env-primary
|
148
187
|
|
149
188
|
.nav-group-container:hover > .nav-subsub-content
|
150
189
|
visibility: visible
|
data/_sass/post.sass
CHANGED
@@ -53,10 +53,16 @@
|
|
53
53
|
.post__content--image
|
54
54
|
display: block
|
55
55
|
object-fit: cover
|
56
|
-
object-position:
|
56
|
+
object-position: center
|
57
57
|
width: 100%
|
58
58
|
height: 50vh
|
59
59
|
|
60
|
+
.image--north
|
61
|
+
object-position: top
|
62
|
+
|
63
|
+
.image--south
|
64
|
+
object-position: bottom
|
65
|
+
|
60
66
|
.post__link
|
61
67
|
color: $opd-blue
|
62
68
|
text-decoration: none
|
@@ -6,7 +6,7 @@ const navSlide = ()=>{
|
|
6
6
|
const navBar = document.querySelector('.navbar');
|
7
7
|
|
8
8
|
// watch for touch clicks on the burger
|
9
|
-
burger.addEventListener('
|
9
|
+
burger.addEventListener('click', () => {
|
10
10
|
// animate accordinaly
|
11
11
|
navSlider.classList.toggle('nav-active');
|
12
12
|
brand.classList.toggle('site__logo-active');
|