slow-steps 0.1.5 → 0.1.10

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 8774e2a7d4982872dce1ab0cbbd86e254fe902aa8d580fda62d3639380271907
-  data.tar.gz: 2a4347c7c4b2732e599eae66995d26f11c6c09c7886a6daff142b04c889a5e70
+  metadata.gz: e9a95b4b4dd8828879fc02993396b89d73f860150fc517f6eb107e0ec53d8bf4
+  data.tar.gz: b31c9f0c5bb63b9786917d63cc6b905c0e5d34ed3b93d86b204f1ee10eeb74a9
 SHA512:
-  metadata.gz: 0c84c0f0017d271004b18a17a914f3540f5400cdba145cc7554d9f6927c9a6d446328b8acfa29864018b1aa7d5e64e316063cffb04565d91425460d84ed66ba6
-  data.tar.gz: 80d9d09c698060635e65da65591b7a24fc6f1e6f8ca97e77076f5be7360b5363fe7f158c1817d18b3bcef7cc27bed3ad33f0971a0a13ae388bc2336841f0ba14
+  metadata.gz: 4d221bdd2f95a1e850aebcfbbca361e801eeb5b633488647875ffb1ed35b55a7fa8ad7485fe66a450a3f7b330ba64b1dd5597947abab1dc2ea23765f4f709d6c
+  data.tar.gz: 7b95604276b53832b699b118e20aef8265ca9680e559e81da82772573c8505be1513c4d7e23d67de5d8c88b83a8ac7618e41ff19b86e28c2d968fa3a7191d48c

data/_includes/contact-details.html

@@ -0,0 +1,25 @@
+<div class="contact-details">
+
+  <h4 class="form-instruction">Contact us directly</h4>
+
+  <p><i class="fas fa-envelope"></i>
+  <a href="mailto:{{ site.email }}">{{ site.email }}</a></p>
+
+  {% if site.phone %}
+  <p><i class="fas fa-phone-square"></i>
+  <a href="tel:{{ site.phone }}‬" ‬>{{ site.phone }}‬</a></p>
+  {% endif %}
+
+  <h4 class="form-instruction">Connect with us socially</h4>
+
+  <ul class="social-media">
+
+  {% for social in site.socials %}
+  <li class="social-media-item">
+  <a href="{{ social.url }}">
+  <i class="fab fa-{{ social.icon }} social--{{ social.name }} social-media-link"></i></a>
+  </li>
+  {% endfor %}
+
+  </ul>
+</div>

data/_includes/contact-form.html

@@ -0,0 +1,18 @@
+<div class="contact-form">
+  <h4 class="form-instruction">Get in touch using the form below</h4>
+
+  <form  action="https://formspree.io/f/{{ site.formspree }}" method="post" >
+
+    <label for="name">Enter your name</label>
+    <input type="text" class="form-element" name="name" id="name" placeholder="Your Name" required>
+
+    <label for="email">Enter your email</label>
+    <input type="text" class="form-element" name="email" id="email" placeholder="Your email" required>
+
+    <label for="message">Enter your message</label>
+    <textarea class="form-element" rows="5" name="message" id="message" placeholder="Your Message" required></textarea>
+
+    <button class="btn btn-pop btn-outline btn-contact" type="submit">SEND</button>
+
+  </form>
+</div>

data/_includes/gmap.html

@@ -0,0 +1,5 @@
+<div class="google-map">
+  <h4 class="form-instruction">Where to find us</h4>
+
+  <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2469.4696265600305!2d-1.2640352834469863!3d51.76102127967778!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x4876c6a77fce02c7%3A0x1d053d3e05342acd!2s46%20Woodstock%20Rd%2C%20Oxford%20OX2%206HT!5e0!3m2!1sen!2suk!4v1610722975887!5m2!1sen!2suk"  frameborder="1" allowfullscreen="" aria-hidden="false" tabindex="0"></iframe>
+</div>

data/_includes/google-analytics.html

@@ -0,0 +1,15 @@
+<!-- This goes before </head> closing tag -->
+
+<!-- Google site verification -->
+<meta name="google-site-verification" content="{{ site.google.verification }}" />
+
+<!-- Google Analytics -->
+
+<script async src="https://www.googletagmanager.com/gtag/js?id={{ site.google.analytics }}"></script>
+
+<script>
+  window.dataLayer = window.dataLayer || [];
+  function gtag(){dataLayer.push(arguments);}
+  gtag('js', new Date());
+  gtag('config', '{{ site.google.analytics }}');
+</script>

data/_includes/head/head.html

@@ -70,7 +70,9 @@
 
   <link rel="shortcut icon" type="image/x-icon" href="{{ site.baseurl }}{{ site.fallback_path }}{{ site.favicon }}">
 
-
+  {% if jekyll.environment == "production" %}
+  {% include google-analytics.html %}
+  {% endif %}
 
 </head>
 

data/_includes/navigation/global.html

@@ -9,6 +9,17 @@
     </a>
   </div>
 
+  <ul class="social-media">
+
+  {% for social in site.socials %}
+  <li class="social-media-item">
+  <a href="{{ social.url }}">
+  <i class="fab fa-{{ social.icon }} social--{{ social.name }} social-media-link"></i></a>
+  </li>
+  {% endfor %}
+
+  </ul>
+
   {% if page.layout == "env/landing" or page.layout == "error-page" %}
   </nav>
   {% else %}
@@ -22,6 +33,7 @@
 
         <div class="nav-group-content {{ item.env }}-group">
           {% for sub in item.submenu %}
+          <div class="nav-group-container">
           <a
             class="
               nav-link
@@ -31,9 +43,20 @@
               {% endif %}" href="{{ sub.url | relative_url }}">
             <span>{{ sub.name }}</span></a>
 
+            {% if sub.subsubmenu %}
+            <div class="nav-subsub-content ">
+              {% for subsub in sub.subsubmenu %}
+              <a class="nav-link subsub-link" href="{{ subsub.url | relative_url }}">
+                <span>{{ subsub.name }}</span></a>
+
+              {% endfor %}
+            </div>
+            {% endif %}
+
+</div>
           {% endfor %}
-        </div>
 
+        </div>
       </li>
       {% endfor %}
 

data/_includes/scripts.html

@@ -1,6 +1,7 @@
 
 {% assign scripts = page.scripts | split: ', '%}
 {% if scripts contains 'svg-aos' %}
+
   <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.6.1/lodash.min.js" ></script>
 
   <script type="text/javascript" src="{{ "{{ site.baseurl }}/assets/js/svg_text_width.js" | relative_url }}" async></script>
@@ -18,6 +19,8 @@
 
 <script type="text/javascript" src="{{ "{{ site.baseurl }}/assets/js/calc-mobile-viewport.js" | relative_url }}" async></script>
 
+<script type="text/javascript" src="{{ "{{ site.baseurl }}/assets/js/nav-scroll.js" | relative_url }}" async></script>
+
 <script type="text/javascript" src="{{ site.baseurl }}/assets/vendor/aos/aos.js" ></script>
 
 <script>

data/_layouts/about.html

@@ -63,7 +63,7 @@ Last full read through 29/12/2020
     {% endfor %}
   </div>
 
-  <div class="team__members">
+  <div class="team__members" id="gaitq-team">
 
     {% for member in site.data.team.members %}
 

data/_layouts/contact.html

@@ -0,0 +1,39 @@
+---
+layout: default
+---
+
+{% assign strap = page.title %}
+
+
+<div class="hero hero-65">
+
+  <div class="hero__overlay h-100">
+    {% picture {{ page.hero.image | prepend: 'content/' }}
+      --img class="hero__image hero__image--fixed hero-65"
+      --alt {{ page.hero.alt }} %}</div>
+
+  <header class="hero__strap hero__strap--center image__filter--blur hero-65" aria-label="{{ strap }}">
+
+      <h1 aria-hidden="true" >
+      {% assign n = strap.size | minus: 1 %}
+      {%- for char in (0..n ) -%}
+
+      <span style="animation-delay: {{ char | times: 40 | plus: 200 }}ms;">{{ strap | slice: char }}</span>
+      {%- endfor -%}</h1>
+
+  </header>
+
+</div>
+
+<div class="contact__wrapper">
+
+  <div class="contact--left">
+    {% include contact-form.html %}
+  </div>
+
+  <div class="contact--right">
+    {% include gmap.html %}
+
+    {% include contact-details.html %}
+  </div>
+</div>

data/_layouts/default.html

@@ -8,10 +8,6 @@ layout: compress
 
 {{ content }}
 
-{% if page.layout != "error-page" %}
-
-  {% include footer/footer_full.html %}
-
-{% endif %}
+{% include footer/footer_full.html %}
 
 {% include scripts.html %}

data/_layouts/faq.html

@@ -0,0 +1,63 @@
+---
+layout: default
+---
+
+{% assign strap = page.title %}
+
+
+<div class="hero hero-65">
+
+  <div class="hero__overlay h-100">
+    {% picture {{ page.hero.image | prepend: 'content/' }}
+      --img class="hero__image hero__image--fixed hero-65"
+      --alt {{ page.hero.alt }} %}</div>
+
+  <header class="hero__strap hero__strap--center image__filter--blur hero-65" aria-label="{{ strap }}">
+
+      <h1 aria-hidden="true" >
+      {% assign n = strap.size | minus: 1 %}
+      {%- for char in (0..n ) -%}
+
+      <span style="animation-delay: {{ char | times: 40 | plus: 200 }}ms;">{{ strap | slice: char }}</span>
+      {%- endfor -%}</h1>
+
+  </header>
+
+</div>
+
+<div class="faq__wrapper">
+{% for faq in site.data.faq %}
+<div class="faq__panel">
+  <div class="faq__question">
+    <h4>{{ faq.question }}</h4>
+  </div>
+
+  <div class="faq__answer faq__answer--reveal">
+    <p>{{ faq.answer }}</p>
+  </div>
+</div>
+{% endfor %}
+</div>
+
+
+<script>
+  /*
+  On load we hide all the answers.
+  */
+
+  const title = document.querySelectorAll(".faq__answer--reveal");
+  for(var i = 0; i < title.length; i++)
+    title[i].classList.remove('faq__answer--reveal');
+
+</script>
+
+<script>
+/* Watch for clicks on more info and reveal text */
+document.querySelectorAll('.faq__question').forEach(function(el){
+  el.addEventListener('click', function() {
+    const n = this.nextElementSibling;
+    n.classList.toggle('faq__answer--reveal');
+  });
+});
+
+</script>

data/_sass/_mixins.sass

@@ -17,6 +17,9 @@
   filter: grayscale(1) contrast(.2) brightness(1.8)
   opacity: .6
 
+@mixin image-filter-rotate
+  filter: grayscale(1) contrast(.8) brightness(.9) sepia(.4) hue-rotate(180deg)
+
 // Applied to an overlaying div
 @mixin image-filter--blur
   backdrop-filter: blur(8px)
@@ -35,6 +38,9 @@
 @mixin build-in($name)
   animation: .8s $bezier-snap 0s 1 $name
 
+@mixin default-trans
+  transition: all .4s ease-in-out
+
 // Keyframes
 @mixin slide-from-left
   @keyframes slide-from-left

data/_sass/colors/_variables.sass

@@ -54,7 +54,7 @@ $led: rgb(255, 70, 0)
 
 // Object colors
 
-$secondary-navbar-color: rgba(255, 255, 255, .3)
+$secondary-navbar-color: rgba(255, 255, 255, .8)
 
 
 // Color set mixins

data/_sass/colors/breakpoints/{768.sass → 1024.sass}

@@ -4,7 +4,7 @@
 // in assets/css/gaitq_env.sass we import this AFTER
 //  @import 'colors/env/env.sass'
 
-@media screen and ( min-width: 768px )
+@media screen and ( min-width: 1024px )
 
   .navbar
     background-color: $env-primary

data/_sass/contact.sass

@@ -0,0 +1,227 @@
+
+
+.contact__wrapper
+  display: flex
+  width: 100%
+  background-color: $white
+  padding: 5rem 0
+  flex-direction: column
+
+.contact--left
+  width: auto
+  padding: 0 1rem
+  padding-bottom: 5rem
+
+.contact--right
+  //width: 100%
+  padding: 0 1rem
+
+.form-instruction
+  padding-bottom: 2rem
+
+.contact-form
+  width: 100%
+  display: block
+
+  form
+    border: solid 1px rgba($env-primary, .2)
+    border-radius: 4px
+    padding: 2rem
+  label
+    font-size: $font-size * .8
+    color: $black
+
+.google-map
+  //grid-area: googleMap
+  width: 100%
+
+  //padding: 0 5rem
+  //filter: sepia(.3)
+  iframe
+    width: 100%
+    height: 40vh
+    border: solid 1px rgba($env-primary, .2)
+
+.contact-details
+  display: flex
+  flex-direction: column
+  padding: 4rem 0
+  p
+    padding-bottom: 2rem
+  .fas
+    color: $env-primary
+  a
+    color: $black
+    transition: all .2s ease-in-out
+    //text-decoration: none
+    &:hover
+      color: $env-primary
+  .social-media-link
+    font-size: $font-size * 1.4
+
+.form-element
+  width: 100%
+  height: 40px
+  border-radius: 4px
+  //font-size: 1rem
+  font-weight: 100
+  margin: 2vh 0
+  border: none
+  background-color: $pure-white
+  padding: .1rem 0 .4rem 0
+  text-indent: 1rem
+
+  &::placeholder
+    color: rgba($env-primary, .3)
+
+.btn-contact
+  background: $env-primary
+  color: #ffffff
+  cursor: pointer
+  font-size: $font-size * .8
+  padding: 1rem 2rem
+  border: 0
+  transition: all .3s
+  border-radius: 4px
+  width: auto
+  position: relative
+
+.social-media
+  display: flex
+  justify-content: center
+  padding: 0
+  margin: 0
+  z-index: 9999
+
+.social-media-item
+  list-style: none
+  padding-right: 2rem
+
+.social-media-link
+  color: $grey
+  transition: all .3s ease-in-out
+
+
+
+@media screen and ( min-width: 1024px )
+
+  .contact__wrapper
+    display: flex
+    flex-direction: row
+    width: 100%
+    background-color: $white
+    padding: 5rem 0
+
+  .contact--left
+    width: 40%
+    padding: 0 5rem
+
+  .contact--right
+    width: 60%
+    padding: 0 5rem
+
+  .form-instruction
+    padding-bottom: 2rem
+
+  .contact-form
+    width: 100%
+    display: block
+
+    form
+      border: solid 1px rgba($env-primary, .2)
+      border-radius: 4px
+      padding: 2rem
+    label
+      font-size: $font-size * .8
+      color: $black
+
+  .google-map
+    //grid-area: googleMap
+    width: 100%
+
+    //padding: 0 5rem
+    //filter: sepia(.3)
+    iframe
+      width: 100%
+      height: 40vh
+      border: solid 1px rgba($env-primary, .2)
+
+  .contact-details
+    display: flex
+    flex-direction: column
+    padding: 4rem 0
+    p
+      padding-bottom: 2rem
+    .fas
+      color: $env-primary
+    a
+      color: $black
+      transition: all .2s ease-in-out
+      text-decoration: none
+      &:hover
+        color: $env-primary
+    .social-media-link
+      font-size: $font-size * 2
+
+  .form-element
+    width: 100%
+    height: 40px
+    border-radius: 4px
+    //font-size: 1rem
+    font-weight: 100
+    margin: 2vh 0
+    border: none
+    background-color: $pure-white
+    padding: .1rem 0 .4rem 0
+    text-indent: 1rem
+
+    &::placeholder
+      color: rgba($env-primary, .3)
+
+  .btn-contact
+    background: $env-primary
+    color: #ffffff
+    cursor: pointer
+    font-size: $font-size * .8
+    padding: 1rem 2rem
+    border: 0
+    transition: all .3s
+    border-radius: 4px
+    width: auto
+    position: relative
+
+    &::after
+      content: "\f054"
+      font-family: "Font Awesome 5 Free"
+      font-weight: 900
+      position: absolute
+      //left: 85%
+      top: 28%
+      right: 5%
+      bottom: 0
+      opacity: 0
+
+    &:hover
+      background: rgba($env-primary, .9)
+      transition: all .5s
+      box-shadow: 0px 6px 15px rgba($env-primary, .3)
+      padding: 1rem 3rem 1rem 2.1rem
+
+      &::after
+        opacity: 1
+        transition: all 0.3s
+
+  .social-media
+    display: flex
+    justify-content: flex-start
+    padding: 0
+    margin: 0
+    z-index: 9999
+
+  .social-media-item
+    list-style: none
+    padding-right: 2rem
+
+  .social-media-link
+    color: $grey
+    transition: all .3s ease-in-out

data/_sass/env/clinician.sass

@@ -33,6 +33,8 @@
     padding: 5rem 0
     width: 50%
 
+.image--guarantee
+  @include image-filter-rotate
 
 .action__call
 

data/_sass/env/pwp.sass

@@ -53,7 +53,7 @@
   height: 50%
 
 .image--guarantee
-  filter: grayscale(1) contrast(.8) brightness(.9) sepia(.4) hue-rotate(180deg)
+  @include image-filter-rotate
 
 .strap__guarantee
   border-top: solid 1px $soft-white

data/_sass/faq.sass

@@ -0,0 +1,37 @@
+.faq__wrapper
+  display: flex
+  flex-direction: column
+  background-color: $pure-white
+  padding: 10vh 0
+
+.faq__panel
+  border: solid 1px rgba($env-primary, .4)
+  margin: 2rem auto
+  border-radius: 4px
+  width: 60%
+
+.faq__question
+  width: 100%
+  padding: 1rem 0
+  background-color: rgba($opd-blue-trust, .2)
+  border-radius: 4px
+  cursor: pointer
+  transition: .2s ease-in-out
+
+  &:hover
+    background-color: rgba($opd-blue-trust, 1)
+
+  & > *
+    padding-left: 1rem
+
+.faq__answer
+  max-height: 0
+  overflow: hidden
+  transition: .4s ease-in-out
+
+  & > *
+    padding: 1rem
+
+.faq__answer--reveal
+  max-height: 1000px
+  transition: .6s ease-in-out

data/_sass/footer_full.sass

@@ -19,7 +19,7 @@
   width: 90vw
 
 .ft__col
-  border-left: solid 1px rgba($opd-blue-trust, .05)
+  //border-left: solid 1px rgba($opd-blue-trust, .05)
   box-sizing: border-box
   padding: 0 5vw
   width: 90vw

data/_sass/global.sass

@@ -15,6 +15,9 @@
   -ms-transition: none !important
   -o-transition: none !important
 
+body
+  background-color: $white
+
 .fullwidth__wrap
   width: 90vw
   max-width: 800px
@@ -97,7 +100,7 @@
 
 
 .hero__strap--center
-  padding-top: $navbar-height
+  //padding-top: $navbar-height
 
   span
     animation-duration: .1s
@@ -282,6 +285,10 @@ $svg-text-offset: 60px
     max-width: 600px
     margin: 0 auto
 
+  .social--Facebook
+    &:hover
+      color: $facebook-primary
+
   .social--Twitter
     &:hover
       color: $twitter-primary

data/_sass/navigation/breakpoints/1024.sass

@@ -0,0 +1,142 @@
+// Navigation styling for breakpoint 768
+
+// Avoid declaring any styling like color etc.
+// These will be decalred in _sass/naviagtion/env/
+
+// Everything here will be included in EVERY .html
+
+$brand-height: 55%
+
+@media screen and ( min-width: 1024px )
+
+  .navbar
+    @include default-trans
+    height: $navbar-height
+    align-items: center
+
+  .nav-scrolled
+    @include default-trans
+    top: -$navbar-height
+    .nav-group-content
+      @include default-trans
+      height: 10vh
+    .nav-brand
+      @include default-trans
+      height: 8vh
+      top: 6vh
+
+  .nav-brand
+    @include default-trans
+    display: flex
+    position: absolute
+    max-width: 160px
+    height: 10vh
+    z-index: 999
+    top: 7.5vh
+
+    .site__logo
+      position: absolute
+      top: (100% - $brand-height) / 2
+      height: $brand-height
+
+  .nav-list
+    display: flex
+    justify-content: flex-end
+    align-items: center
+    height: inherit
+    top: 0
+    transform: none
+    border-top: none
+    height: 5vh
+    padding: 0
+    background-color: inherit
+
+  .nav-group
+    padding: 0 2rem
+
+  .nav-link
+    align-items: center
+    padding: 0
+    height: auto
+    opacity: 1
+    margin: 0
+    overflow: hidden
+    position: relative
+
+  // Surround current link with lines
+
+  .current--url
+    &:before, &:after
+      content: ""
+      display: inline-block
+      height: 2px
+      position: relative
+      vertical-align: middle
+      width: 6%
+
+    &:before
+      right: 0.5em
+      margin-left: -10%
+
+    &:after
+      left: 0.5em
+      margin-right: -10%
+
+  .nav-group-content
+    @include default-trans
+    align-items: center
+    justify-content: flex-end
+    position: absolute
+    top: 5vh
+    left: 0
+    width: 100vw
+    padding: 0
+    height: $secondary-navbar-height
+    backdrop-filter: blur(20px)
+
+  .nav-group-content .nav-link
+    margin: 0
+
+  .burger
+    display: none
+
+  .nav-subsub-content
+    background-color: $pure-white
+    box-shadow: 1px 1px 1px rgba(0, 0, 0, .1)
+    visibility: hidden
+    opacity: 0
+    border-radius: 6px
+    z-index: 1
+    position: absolute
+    padding: 1rem 0
+    margin-left: 3rem
+    transform: translateY(10px)
+    .subsub-link
+      &:hover
+        background: $white
+
+    &:before
+      background: inherit
+      content: ""
+      display: block
+      height: 16px
+      width: 16px
+      left: 5px
+      position: absolute
+      bottom: 100%
+      border-radius: 2px
+      transform: rotate(-45deg) translateY(14px)
+      z-index: -1
+
+  .nav-group-container:hover > .nav-subsub-content
+    visibility: visible
+    opacity: 1
+    transform: translateY(0px)
+    transition: opacity .1s ease-in, transform .2s ease-in
+
+  .nav-subsub-content .sub-link
+    transition: background-color .1s ease-in
+
+  .nav-subsub-content .sub-link:hover
+    background-color: $white
+    transition: background-color .1s ease-in

data/_sass/navigation/env/clinician.sass

@@ -1,16 +1,7 @@
 // Navbar site logo
 // make sure we don't style any other instance so nest with .nav-brand
 .nav-brand
-  .site__logo--group
-    .site__logo--curve,
-    .site__logo--legvert,
-    .site__logo--leg45,
-    .site__logo--g,
-    .site__logo--a,
-    .site__logo__i,
-    .site__logo--t,
-    .site__logo--Q
-      fill: $env-primary
+  @include logo-color($env-primary)
 
 
 // on mobile and within the clinician env we hide the other submenus and show the gaitq env .nav-group-link
@@ -34,12 +25,14 @@
     left: 0
     flex-direction: row
 
-  .nav-group-content
+  .nav-group-container
+
 
     .nav-link
       font-weight: 400
       color: $env-primary
       text-transform: uppercase
-      padding: 0 3rem
-      &:hover
-        text-decoration: underline
+      padding: 1rem 3rem
+      &:not(.current--url)
+        &:hover
+          text-decoration: underline

data/_sass/navigation/env/landing.sass

@@ -7,4 +7,13 @@
 // Navbar site logo
 // make sure we don't style any other instance so nest with .nav-brand
 .nav-brand
-  @include logo-primary-colors
+  @include logo-color($white)
+  height: 14rem
+  transform: translateY(15vh)
+
+@media screen and ( min-width: 1024px )
+  .nav-brand
+    transform: translateY(-7.5vh)
+
+.social-media
+  display: none

data/_sass/navigation/env/pwp.sass

@@ -21,13 +21,14 @@
     left: 0
     flex-direction: row
 
-  .nav-group-content
+  .nav-group-container
 
 
     .nav-link
       font-weight: 400
+      color: $env-primary
       text-transform: uppercase
-      padding: 0 3rem
+      padding: 1rem 3rem
       &:not(.current--url)
         &:hover
           text-decoration: underline

data/_sass/navigation/global.sass

@@ -18,6 +18,18 @@
   width: 100%
   z-index: 99
 
+  .social-media
+    padding-left: 4rem
+  .social-media-link
+    color: $white
+    font-size: $font-size * .8
+    transform: translateY(0)
+    &:hover
+      text-shadow: 3px 3px 6px rgba($black, .2)
+      //font-size: $font-size * 1
+      transform: translateY(-2px)
+
+
 .nav-brand
   width: 30vw
   padding-left: 3vw

data/assets/css/env/gaitq_clinician.sass

@@ -25,10 +25,14 @@ $baseurl: '{{ site.baseurl }}/'
 
 @import 'env/breakpoints/768'
 
-@import 'colors/breakpoints/768'
+@import 'colors/breakpoints/1024'
 
 @import 'about'
 
 @import 'breakpoints/about'
 
 @import 'forms/mc-forms'
+
+@import 'contact'
+
+@import 'faq'

data/assets/css/env/gaitq_pwp.sass

@@ -25,10 +25,14 @@ $baseurl: '{{ site.baseurl }}/'
 
 @import 'env/breakpoints/768'
 
-@import 'colors/breakpoints/768'
+@import 'colors/breakpoints/1024'
 
 @import 'about'
 
 @import 'breakpoints/about'
 
 @import 'forms/mc-forms'
+
+@import 'contact'
+
+@import 'faq'

data/assets/css/gaitq_global.sass

@@ -23,7 +23,7 @@
 
 @import 'navigation/burger'
 
-@import 'navigation/breakpoints/768'
+@import 'navigation/breakpoints/1024'
 
 // Footer
 

data/assets/js/nav-scroll.js

@@ -0,0 +1,16 @@
+navbar = document.querySelector('nav');
+
+function navBarScroll() {
+  var currentScrollPos = window.pageYOffset;
+  if (window.pageYOffset != 0) {
+    navbar.classList.add('nav-scrolled');
+  } else {
+    navbar.classList.remove('nav-scrolled');
+  }
+};
+
+/* load nav color if reloading and pageYOffset != 0 */
+/* moved to scripts to avoid conflicts with other onloads */
+/*window.onload = function() { navBarScroll() };*/
+
+window.onscroll = function() { navBarScroll() };

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: slow-steps
 version: !ruby/object:Gem::Version
-  version: 0.1.5
+  version: 0.1.10
 platform: ruby
 authors:
 - Made Slowly
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2021-01-14 00:00:00.000000000 Z
+date: 2021-01-16 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: jekyll
@@ -181,6 +181,9 @@ files:
 - _config.yml
 - _includes/.DS_Store
 - _includes/branding/site-logo.svg
+- _includes/build-version.html
+- _includes/contact-details.html
+- _includes/contact-form.html
 - _includes/env_filter.html
 - _includes/errors/robot-403.svg
 - _includes/errors/robot-404.svg
@@ -190,6 +193,8 @@ files:
 - _includes/forms/mc-register.html
 - _includes/functions/calc-svg-coord.html
 - _includes/functions/pull_page_args.html
+- _includes/gmap.html
+- _includes/google-analytics.html
 - _includes/head/.DS_Store
 - _includes/head/README.md
 - _includes/head/descriptors/og-meta.html
@@ -204,11 +209,13 @@ files:
 - _includes/vimeoPlayer.html
 - _layouts/about.html
 - _layouts/compress.html
+- _layouts/contact.html
 - _layouts/default.html
 - _layouts/env/clinician.html
 - _layouts/env/landing.html
 - _layouts/env/pwp.html
 - _layouts/error-page.html
+- _layouts/faq.html
 - _layouts/feed.html
 - _layouts/full-width.html
 - _layouts/post.html
@@ -220,24 +227,26 @@ files:
 - _sass/aos-overrides.sass
 - _sass/breakpoints/about.sass
 - _sass/colors/_variables.sass
-- _sass/colors/breakpoints/768.sass
+- _sass/colors/breakpoints/1024.sass
 - _sass/colors/burger.sass
 - _sass/colors/env/_clinician.sass
 - _sass/colors/env/_pwp.sass
 - _sass/colors/global.sass
 - _sass/colors/navigation.sass
+- _sass/contact.sass
 - _sass/env/breakpoints/768.sass
 - _sass/env/clinician.sass
 - _sass/env/landing.sass
 - _sass/env/pwp.sass
 - _sass/error-page.sass
+- _sass/faq.sass
 - _sass/feed.sass
 - _sass/footer.sass
 - _sass/footer_full.sass
 - _sass/forms/mc-forms.sass
 - _sass/global.sass
 - _sass/navigation/_variables.sass
-- _sass/navigation/breakpoints/768.sass
+- _sass/navigation/breakpoints/1024.sass
 - _sass/navigation/burger.sass
 - _sass/navigation/env/clinician.sass
 - _sass/navigation/env/landing.sass
@@ -285,6 +294,7 @@ files:
 - assets/js/animate_after_load.js
 - assets/js/calc-mobile-viewport.js
 - assets/js/mobile-nav-slider.js
+- assets/js/nav-scroll.js
 - assets/js/svg_aos.js
 - assets/js/svg_text_width.js
 - assets/vendor/aos/aos.css

data/_sass/navigation/breakpoints/768.sass

@@ -1,84 +0,0 @@
-// Navigation styling for breakpoint 768
-
-// Avoid declaring any styling like color etc.
-// These will be decalred in _sass/naviagtion/env/
-
-// Everything here will be included in EVERY .html
-
-@media screen and ( min-width: 768px )
-
-  .navbar
-    height: $navbar-height
-    align-items: center
-
-  .nav-brand
-    display: flex
-    position: absolute
-    max-width: 160px
-    height: 10vh
-    z-index: 999
-    top: 7.5vh
-
-    .site__logo
-      position: absolute
-      top: 30%
-      height: 40%
-
-  .nav-list
-    display: flex
-    justify-content: flex-end
-    align-items: center
-    height: inherit
-    top: 0
-    transform: none
-    border-top: none
-    height: 5vh
-    padding: 0
-    background-color: inherit
-
-  .nav-group
-    padding: 0 2rem
-
-  .nav-link
-    align-items: center
-    padding: 0
-    height: auto
-    opacity: 1
-    margin: 0
-    overflow: hidden
-
-  // Surround current link with lines
-
-  .current--url
-    &:before, &:after
-      content: ""
-      display: inline-block
-      height: 2px
-      position: relative
-      vertical-align: middle
-      width: 6%
-
-    &:before
-      right: 0.5em
-      margin-left: -10%
-
-    &:after
-      left: 0.5em
-      margin-right: -10%
-
-  .nav-group-content
-    align-items: center
-    justify-content: flex-end
-    position: absolute
-    top: 5vh
-    left: 0
-    width: 100vw
-    padding: 0
-    height: $secondary-navbar-height
-    backdrop-filter: blur(20px)
-
-  .nav-group-content .nav-link
-    margin: 0
-
-  .burger
-    display: none