slow-steps 0.3.0 → 0.4.1

data/_sass/navigation/_variables.sass

@@ -6,15 +6,15 @@
 
 $navbar-height: 5vh
 
-$mobile-navbar-height: 10vh
-
 $secondary-navbar-height: 10vh
 
 $brand-height: 55%
 
 // change .nav-list.height manually in _sass/navbar/mobile.sass, can't figure out how to use calc --vh whith sass var
 
-$nav-list-height: 85vh
+$mobile-navbar-height: 10vh
+
+$mobile-nav-list-height: 90vh
 
 // ************* Colours *************
 

data/_sass/navigation/base.sass

@@ -28,20 +28,23 @@
   width: 30vw
   padding-left: 3vw
   z-index: 1
+  margin-top: .7rem
+  // fudge fix for G making logo apear off-centre
 
   .site__logo *
     @include default-trans
 
+
 .nav-list
   border-bottom-left-radius: 80px
   font-size: 1.3rem
-  height: $nav-list-height
-  height: calc( var(--vh, 1vh) * 85 )
+  height: $mobile-nav-list-height
+  height: calc( var(--vh, 1vh) * #{ strip-unit($mobile-nav-list-height)} )
   list-style: none
   margin: 0
-  margin-block-start: 0
+  margin-block-start: calc( var(--vh, 1vh) * #{ strip-unit($mobile-navbar-height)} )
   padding: 0
-  padding-top: 15vh
+  padding-top: 0
   position: absolute
   right: 0
   top: 0
@@ -50,6 +53,12 @@
   width: 100vw
   box-sizing: content-box
   background-color: $env-primary
+  overflow: scroll
+
+.nav-group-content
+  //text-indent: 2rem
+  .nav-link
+    margin: 3vh 20vw
 
 .nav-link
   margin: 6vh 15vw
@@ -68,6 +77,7 @@
 .nav-active
   // we toggle this class in mobile-nav-slider.js on burger click
   transform: translateX(0%)
+  box-shadow: -.2px .2px 0 rgba($pure-black, .3)
 
 
 .site__logo-active

data/_sass/navigation/breakpoints/1024.sass

@@ -21,7 +21,8 @@
     .nav-brand
       @include default-trans
       height: 8vh
-      max-height: 100px
+      //max-height: 100px
+      // max-height breaks vertical centering
 
   .nav-scrolled
     background-color: $env-primary
@@ -31,9 +32,11 @@
     @include default-trans
     display: flex
     position: absolute
-    max-width: 160px
+    //max-height: 100px
+    // max-height breaks vertical centering
     height: 10vh
     top: 7.5vh
+    margin-top: 0
 
     .site__logo
       position: absolute
@@ -50,10 +53,21 @@
     height: 5vh
     padding: 0
     background-color: inherit
+    box-shadow: none
+    margin-block-start: 0
+    padding: 0
+    overflow: visible
 
   .nav-group
     padding: 0 2rem
 
+  .nav-group-content
+    //text-indent: 2rem
+    &:last-child
+      margin-right: 10rem
+    .nav-link
+      margin: 0
+
   .nav-link
     align-items: center
     padding: 0
@@ -67,6 +81,19 @@
   .subsub-link
     color: $env-primary
 
+  .nav-cta
+    @include default-trans
+    color: $pure-white
+    background-color: $env-primary
+    padding: 2rem 2rem!important
+    margin-right: 8rem!important
+    border-radius: 6px
+
+    &:before, &:after
+      display: none!important
+
+    &:hover
+      background-color: darken($env-primary,10)
 
   // Surround current link with ticks
   .current--url
@@ -76,15 +103,13 @@
       height: 2px
       position: relative
       vertical-align: middle
-      width: 6%
+      width: 6px
 
     &:before
-      right: 0.5em
-      margin-left: -10%
+      right: 3px
 
     &:after
-      left: 0.5em
-      margin-right: -10%
+      left: 3px
 
   .nav-group-content
     @include default-trans
@@ -139,7 +164,7 @@
 
   .nav-group-container
     .nav-link
-      font-weight: 400
+      font-weight: $heavy-font
       text-transform: uppercase
       padding: 1rem 3rem
       &:not(.current--url)

data/_sass/navigation/burger.sass

@@ -4,7 +4,7 @@
   cursor: pointer
   display: block
   padding-right: 3vw
-  z-index: 1
+  z-index: 1000
   & > div
     background-color: $burger-color
     height: 2px

data/_sass/typography/_variables.sass

@@ -20,6 +20,6 @@ $xlight-font: 100
 
 $light-font: 200
 
-$medium-font: 300
+$medium-font: 400
 
 $heavy-font: 600

data/_sass/typography/resets.sass

@@ -29,11 +29,11 @@ h3,
 h4,
 h5,
 h6
-  font-weight: 400
+  font-weight: $heavy-font
 
 p,
 a
-  font-weight: 200
+  font-weight: $medium-font
 
 
 .center-text

data/assets/css/env/gaitq_clinician.sass

@@ -47,7 +47,7 @@ $baseurl: '{{ site.baseurl }}/'
 
 @import 'collage'
 
-@import 'footer_full'
+@import 'footer_redesign'
 
 @import 'aos-overrides'
 

data/assets/css/env/gaitq_landing.sass

@@ -26,7 +26,7 @@ $baseurl: '{{ site.baseurl }}/'
 
 
 
-@import 'footer_full'
+@import 'footer_redesign'
 
 @import 'aos-overrides'
 

data/assets/css/env/gaitq_pwp.sass

@@ -49,7 +49,7 @@ $baseurl: '{{ site.baseurl }}/'
 
 // Footer
 
-@import 'footer_full'
+@import 'footer_redesign'
 
 @import 'aos-overrides'
 

data/assets/css/gaitq_errors.sass

@@ -7,8 +7,20 @@
 
 @import 'typography/_variables'
 
-@import '_colors/_variables'
+@import 'typography/resets'
+
+@import 'typography/branding'
+
+@import '_colors/collection'
 
 @import 'error-page'
 
 @import 'navigation/no-nav'
+
+// Footer
+
+@import 'footer_redesign'
+
+@import 'aos-overrides'
+
+@import 'global'

data/assets/js/mobile-nav-slider.js

@@ -6,7 +6,7 @@ const navSlide = ()=>{
   const navBar = document.querySelector('.navbar');
 
   // watch for touch clicks on the burger
-  burger.addEventListener('touchstart', () => {
+  burger.addEventListener('click', () => {
     // animate accordinaly
     navSlider.classList.toggle('nav-active');
     brand.classList.toggle('site__logo-active');

data/assets/js/svg_text_width.js

@@ -22,21 +22,21 @@ function svg_text_width() {
     if(view_width > 768 ){
       var lineLength = 100 ; // length in pixels of the drawn line
       var x_offset = 10 + width ; // offset the text label s.t. last character sits 10 px from end of line
-      var y_offset = .5 ;
+      var y_offset = 5 ;
     } else {
       var lineLength = 70 ;
       var x_offset = 0 ; // offset the text label s.t. first character sits inline with end of line
-      var y_offset = -1.5 ;}
+      var y_offset = -8 ;}
       lines[i].setAttribute("stroke-dashoffset", lineLength + 'px')
       lines[i].setAttribute("stroke-dasharray", lineLength + 'px')
     if( text[i].classList.contains('trans-left')){
       lines[i].setAttribute("x2", -lineLength + 'px')
       text[i].setAttribute("x", - lineLength - x_offset + 'px');
-      text[i].setAttribute("y", y_offset + 'rem');
+      text[i].setAttribute("y", y_offset + 'px');
     } else {
       lines[i].setAttribute("x2", lineLength + 'px')
       text[i].setAttribute("x", lineLength + x_offset - width + 'px');
-      text[i].setAttribute("y", y_offset + 'rem');
+      text[i].setAttribute("y", y_offset + 'px');
     };
   };
 }

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: slow-steps
 version: !ruby/object:Gem::Version
-  version: 0.3.0
+  version: 0.4.1
 platform: ruby
 authors:
 - Made Slowly
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2021-01-24 00:00:00.000000000 Z
+date: 2021-02-04 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: jekyll
@@ -184,21 +184,22 @@ files:
 - _includes/build-version.html
 - _includes/contact-details.html
 - _includes/contact-form.html
+- _includes/cookie-consent.html
 - _includes/env_filter.html
 - _includes/errors/robot-403.svg
 - _includes/errors/robot-404.svg
 - _includes/errors/robot-405.svg
 - _includes/footer/footer.html
-- _includes/footer/footer_full.html
+- _includes/footer/footer_redesign.html
 - _includes/forms/mc-register.html
 - _includes/functions/calc-svg-coord.html
-- _includes/functions/pull_page_args.html
+- _includes/functions/reposition-svg-labels.html
 - _includes/gmap.html
-- _includes/google-analytics.html
 - _includes/head/README.md
 - _includes/head/descriptors/og-meta.html
 - _includes/head/descriptors/structured-data.html
 - _includes/head/descriptors/twitter-meta.html
+- _includes/head/google-analytics.html
 - _includes/head/head.html
 - _includes/head/stylesheets.html
 - _includes/image-post.html
@@ -243,7 +244,7 @@ files:
 - _sass/faq.sass
 - _sass/feed.sass
 - _sass/footer.sass
-- _sass/footer_full.sass
+- _sass/footer_redesign.sass
 - _sass/forms/mc-forms.sass
 - _sass/global.sass
 - _sass/navigation/README.md

data/_includes/footer/footer_full.html

@@ -1,79 +0,0 @@
-<!-- footer -->
-<footer class="ft__wrapper">
-
-  <div class="ft__head">
-
-  </div>
-  <div class="ft__body">
-
-    <div class="ft__contact ft__col">
-
-      <a href="{{ site.baseurl }}/">
-        {% include /branding/site-logo.svg %}
-      </a>
-      <div class="ft__contact__add">
-        <ul class="ft__contact--list">
-          {% for item in site.postal_add %}
-          <li class="address">{{ item[1] }}</li>
-          {% endfor %}
-          <li><a class="ft--link" href="mailto:{{ site.email }}">{{ site.email }}</a></li>
-          <li>{{ site.phone }}</li>
-
-          <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>
-
-        </ul>
-
-      </div>
-    </div>
-
-    <div class="ft__sitemap ft__col">
-      <div class="ft__sitemap--menu">
-        <h3 class="ft__sitemap--header">INFORMATION FOR</h3>
-
-        <div class="ft__sitemap--env-wrap">
-        {% for item in site.data.menu.navigation %}
-
-        <div class="ft__sitemap--env">
-
-          <h4 class="ft__sitemap--env-header">{{ item.name }}</h4>
-          <ul class="ft__sitemap--submenu">
-          {% for sub in item.submenu %}
-          <li><a class="ft--link" href="{{ sub.url }}">{{ sub.alt }}</a></li>
-          {% endfor %}
-          </ul>
-        </div>
-
-        {% endfor %}
-
-      </div>
-      </div>
-    </div>
-
-  </div>
-  <!-- footer base and copyright -->
-
-  <div class="ft__base">
-
-    <p class="copyright">&copy; <script>
-        document.write(new Date().getFullYear())
-      </script> {{ site.title }}</p>
-
-
-    <div class="legal-links">
-      {% for item in site.data.menu.legals %}
-      <a href="{{ item.url }}">{{ item.name }}</a>
-      {% endfor %}
-    </div>
-    <a href="{{ site.author.url }}" class="slogan">Jekyll theme Slow Steps</a>
-  </div>
-
-</footer>

data/_includes/functions/pull_page_args.html

@@ -1,31 +0,0 @@
-
-<script type="text/javascript">
-
-function svg_aug_contained_image(){
-
-  var x_i = document.getElementsByClassName("image--guarantee")[0].offsetWidth ;
-  var y_i = document.getElementsByClassName("image--guarantee")[0].offsetHeight ;
-  /* get svg labels */
-  var svg = document.querySelectorAll('.svg__augment > .augment--guarantee');
-
-  /* origanal image width in pixels */
-  var x_0 = {{ page.images.guarantee.size | split: ', ' | first }} ;
-  var y_0 = {{ page.images.guarantee.size | split: ', ' | last }} ;
-
-  for (let i = 0; i < svg.length; i++) {
-  /* origanal x position in pixels */
-  var dx_0 = parseInt( svg[i].getAttribute('x'), 10 ) / 100 ;
-  var dy_0 = parseInt( svg[i].getAttribute('y'), 10 ) / 100 ;
-
-  var dx_0Pixel = dx_0 * x_0 ;
-  var dy_0Pixel = dy_0 * y_0 ;
-
-  svg[i].setAttribute("x", (dx_0Pixel - ( x_0 / 2) + (x_i / 2) ) / x_i * 100 + '%');
-  svg[i].setAttribute("y", (dy_0Pixel - ( y_0 / 2) + (y_i / 2) ) / y_i * 100 + '%');
- };
-
-}
-
-//window.setInterval(svg_aug_contained_image, 200 )
-
-</script>