slow-steps 0.1.1 → 0.1.6

data/assets/css/env/gaitq_clinician.sass

@@ -3,6 +3,10 @@
 
 $baseurl: '{{ site.baseurl }}/'
 
+@import '_variables'
+
+@import '_mixins'
+
 @import 'colors/_variables'
 
 @import 'navigation/_variables'
@@ -19,12 +23,12 @@ $baseurl: '{{ site.baseurl }}/'
 
 @import 'env/clinician'
 
-@import 'about'
+@import 'env/breakpoints/768'
 
-@import 'breakpoints/about'
+@import 'colors/breakpoints/1024'
 
-@import 'env/breakpoints/768'
+@import 'about'
 
-@import 'colors/breakpoints/768'
+@import 'breakpoints/about'
 
-@import "forms/mc-forms"
+@import 'forms/mc-forms'

data/assets/css/env/gaitq_landing.sass

@@ -2,6 +2,10 @@
 ---
 $baseurl: '{{ site.baseurl }}/'
 
+@import '_variables'
+
+@import '_mixins'
+
 @import 'colors/_variables'
 
 @import 'navigation/_variables'

data/assets/css/env/gaitq_pwp.sass

@@ -3,6 +3,10 @@
 
 $baseurl: '{{ site.baseurl }}/'
 
+@import '_variables'
+
+@import '_mixins'
+
 @import 'colors/_variables'
 
 @import 'navigation/_variables'
@@ -19,12 +23,12 @@ $baseurl: '{{ site.baseurl }}/'
 
 @import 'env/pwp'
 
-@import 'about'
+@import 'env/breakpoints/768'
 
-@import 'breakpoints/about'
+@import 'colors/breakpoints/1024'
 
-@import 'env/breakpoints/768'
+@import 'about'
 
-@import 'colors/breakpoints/768'
+@import 'breakpoints/about'
 
 @import 'forms/mc-forms'

data/assets/css/gaitq_about.sass

@@ -0,0 +1,22 @@
+---
+---
+
+$baseurl: '{{ site.baseurl }}/'
+
+@import '_variables'
+
+@import '_mixins'
+
+@import 'colors/_variables'
+
+@import 'navigation/_variables'
+
+@import 'colors/env/_pwp'
+
+@import 'typography/_variables'
+
+@import 'env/pwp'
+
+@import 'about'
+
+@import 'breakpoints/about'

data/assets/css/gaitq_global.sass

@@ -3,12 +3,14 @@
 
 // Site wide styling
 
+@import '_variables'
+
+@import '_mixins'
+
 @import 'typography/_variables'
 
 @import 'colors/_variables'
 
-@import 'global'
-
 @import 'typography/resets'
 
 @import 'typography/branding'
@@ -21,10 +23,12 @@
 
 @import 'navigation/burger'
 
-@import 'navigation/breakpoints/768'
+@import 'navigation/breakpoints/1024'
 
 // Footer
 
-@import 'footer'
+@import 'footer_full'
 
 @import 'aos-overrides'
+
+@import 'global'

data/assets/css/gaitq_post.sass

@@ -1,5 +1,6 @@
 ---
 ---
+@import '_mixins'
 
 @import "typography/_variables"
 

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

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

data/assets/js/svg_aos.js

@@ -0,0 +1,25 @@
+// collect all the circles and bubbles so we can ani them in at 20%
+var view_height = document.documentElement.clientHeight;
+
+var svg_aos = function(e) {
+
+  var svgs = Array.from(document.getElementsByClassName("svg__labels"));
+
+  for (let i = 0; i < svgs.length; i++) {
+
+    var abs_path_top = svgs[i].getBoundingClientRect().top;
+
+    if (abs_path_top <= .8 * view_height) {
+      svgs[i].classList.remove('hidden');
+      svgs[i].classList.add('not-hidden');
+    } else {
+      svgs[i].classList.add('hidden');
+      svgs[i].classList.remove('not-hidden');
+    }
+
+
+  }
+
+};
+
+window.addEventListener('scroll', _.throttle(svg_aos, 500, { leading: true, trailing: true}));

data/assets/js/svg_text_width.js

@@ -0,0 +1,44 @@
+/*  Last full read through 27/12/2020
+ *
+ *##############################################
+ *# svg label calc  /assets/js/svg_text_width.js
+ *##############################################
+ *
+ */
+
+ // Get the svg text elemnets inside .svg__labels, calulate their length and position with 768 clientWidth condition.
+
+function svg_text_width() {
+  // scren width
+  const view_width = document.documentElement.clientWidth;
+  // Get svg text and lines contained by .svg__labels
+  const text = document.querySelectorAll('.svg__labels > .svg--text');
+  const lines = document.querySelectorAll('.svg__labels > .svg--line');
+
+  for (let i = 0; i < text.length; i++) {
+    // get width of all the text labels
+    const width = text[i].getComputedTextLength();
+    // set up vars depending on 768 breakpoint
+    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 ;
+    } 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 ;}
+      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');
+    } else {
+      lines[i].setAttribute("x2", lineLength + 'px')
+      text[i].setAttribute("x", lineLength + x_offset - width + 'px');
+      text[i].setAttribute("y", y_offset + 'rem');
+    };
+  };
+}
+
+svg_text_width()

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: slow-steps
 version: !ruby/object:Gem::Version
-  version: 0.1.1
+  version: 0.1.6
 platform: ruby
 authors:
 - Made Slowly
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2020-12-18 00:00:00.000000000 Z
+date: 2021-01-14 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: jekyll
@@ -188,6 +188,8 @@ files:
 - _includes/footer/footer.html
 - _includes/footer/footer_full.html
 - _includes/forms/mc-register.html
+- _includes/functions/calc-svg-coord.html
+- _includes/functions/pull_page_args.html
 - _includes/head/.DS_Store
 - _includes/head/README.md
 - _includes/head/descriptors/og-meta.html
@@ -199,6 +201,7 @@ files:
 - _includes/link.html
 - _includes/navigation/global.html
 - _includes/scripts.html
+- _includes/vimeoPlayer.html
 - _layouts/about.html
 - _layouts/compress.html
 - _layouts/default.html
@@ -207,16 +210,21 @@ files:
 - _layouts/env/pwp.html
 - _layouts/error-page.html
 - _layouts/feed.html
+- _layouts/full-width.html
 - _layouts/post.html
 - _layouts/register.html
+- _sass/_functions.sass
+- _sass/_mixins.sass
+- _sass/_variables.sass
 - _sass/about.sass
 - _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/env/breakpoints/768.sass
 - _sass/env/clinician.sass
@@ -229,7 +237,7 @@ files:
 - _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
@@ -242,11 +250,11 @@ files:
 - assets/css/env/gaitq_clinician.sass
 - assets/css/env/gaitq_landing.sass
 - assets/css/env/gaitq_pwp.sass
+- assets/css/gaitq_about.sass
 - assets/css/gaitq_errors.sass
 - assets/css/gaitq_feed.sass
 - assets/css/gaitq_global.sass
 - assets/css/gaitq_post.sass
-- assets/css/img_handler.sass
 - assets/fonts/.DS_Store
 - assets/fonts/Quicksand/OFL.txt
 - assets/fonts/Quicksand/Quicksand-VariableFont_wght.ttf
@@ -277,6 +285,8 @@ files:
 - assets/js/animate_after_load.js
 - assets/js/calc-mobile-viewport.js
 - assets/js/mobile-nav-slider.js
+- assets/js/svg_aos.js
+- assets/js/svg_text_width.js
 - assets/vendor/aos/aos.css
 - assets/vendor/aos/aos.js
 homepage: https://github.com/madeslowly/slow-steps

data/assets/css/img_handler.sass

@@ -1,5 +0,0 @@
----
----
-$baseurl: '{{ site.baseurl }}/'
-$img: url($baseurl + 'assets/img/pwp_device_group_docked.png')
-$img_height:  '{% imagesize source:height %} / {% imagesize source:width %}'