futuro 0.1.7 → 0.1.8

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: a1d1d56434abb293177d8e17debd8f72387be2cb749fcbeb29ca5d6114b4439a
-  data.tar.gz: 547c9d556e3d481a7bdb2f89a1c3d4647fb311f690d9072d4cde5f5ebf1307f5
+  metadata.gz: efd3d52f89cfc4773e4af72f71a62f48d9095113825c5be4f5d31721673d8516
+  data.tar.gz: 6fbcefc17e23356782dcc5d8c14fa0ebfd89114c8d97b55b11ff22e00bf127ce
 SHA512:
-  metadata.gz: ecd5d110952fe26b0d276d132048834805ee51f2220d3e2cc8019582e3683c611796a975efe11228314f8b63f13363972b93d98b60f31b5c123882fafc22dbdc
-  data.tar.gz: a9b5f4ab892c86b80e016cbae409900cd3f4eb8418d94e3d97fffa6d019432df7dd9491d411b042643c15f365c4fdb7470ef593f76e16706f0609d7f2ceae3b0
+  metadata.gz: bde3fedb0f791115bb22c10402ebc6f83baccfa1fa6540619c0bb1b94e02a7c018444f050d11c3e7106e038dc304ae883bae9e69091f8ca8d157f0214b26b3a7
+  data.tar.gz: 30054e41efae208a3af8b8d74dbcd1e873b8c6a6d2196e8023a13bf5a085c4b8de5ebc8740ff33930a6cd7120e7863c886086fe737153947f45b518d58f55436

data/_includes/html/head.html

@@ -14,5 +14,6 @@
   {% include html/analytics.html %}
   <script src="{{ "/assets/js/vendor/modernizr.min.js" | relative_url }}"></script>
   <script src="{{ "/assets/js/vendor/enquire.min.js" | relative_url }}"></script>
+  <script src="{{ "/assets/js/vendor/futuro-load.js" | relative_url }}"></script>
   <script src="{{ "/assets/js/vendor/simple-jekyll-search.js" | relative_url }}"></script>
 </head>

data/_includes/html/overlay-load.html

@@ -3,5 +3,3 @@
 <div class="box _load">
   <div class="bar _load"></div>
 </div>
-
-<input type="hidden" id="progress" value="0">

data/_includes/html/scripts.html

@@ -1,5 +1,4 @@
 
 <script src="{{ "/assets/js/vendor/jquery.min.js" | relative_url }}"></script>
 <script src="{{ "/assets/js/vendor/tweenmax.min.js" | relative_url }}"></script>
-<script src="{{ "/assets/js/vendor/futuro-load.js" | relative_url }}"></script>
 <script src="{{ "/assets/js/scripts.js" | relative_url }}"></script>

data/_sass/_bar.scss

@@ -2,18 +2,8 @@
 .bar {
   &._load {
     background-color: red;
+    @include load(bg);
     height: 20px;
     width: 7%;
-
-    &.--pop {
-
-      &op {
-        background-color: blue;
-
-        &op {
-          background-color: black;
-        }
-      }
-    }
   }
 }

data/_sass/_box.scss

@@ -1,18 +1,8 @@
 
 .box {
   &._load {
+    @include load(border);
     border: 3px solid;
     border-color: red;
-
-    &.--pop {
-
-      &op {
-        border-color: blue;
-
-        &op {
-          border-color: black;
-        }
-      }
-    }
   }
 }

data/_sass/_extends.scss

@@ -0,0 +1,63 @@
+
+%area_grid {
+  justify-content: center;
+  display: grid;
+}
+
+%grid {
+
+  &_default {
+    grid-template-columns: 40px minmax(240px,1000px) 40px;
+  }
+
+  &_load {
+    grid-template-columns: 40px minmax(240px,320px) 40px;
+  }
+
+  &_overlay {
+    grid-template-columns: 40px minmax(240px,560px) 40px;
+  }
+}
+
+%overlay {
+  display: none;
+
+  &_grid {
+    justify-content: center;
+
+    &.--open {
+      display: grid;
+    }
+  }
+
+  &_block {
+    text-align: center;
+    @include center();
+
+    &.--open {
+      display: block;
+    }
+  }
+}
+
+%wrap {
+
+  &_grid {
+    grid-column: 2 / 3;
+    display: grid;
+  }
+
+  &_block {
+    margin-right: auto;
+    margin-left: auto;
+  }
+
+  &_overlay {
+    min-width: 240px;
+    @include ib;
+  }
+}
+
+:focus {
+  outline: rgba(0,0,0,0);
+}

data/_sass/_mixins.scss

@@ -0,0 +1,73 @@
+
+@mixin zero($b:0,$r:0,$l:0,$t:0) {
+  bottom: $b;
+  right: $r;
+  left: $l;
+  top: $t;
+}
+
+@mixin center() {
+  &:before {
+    display: inline-block;
+    vertical-align: middle;
+    margin-right: -0.25em;
+    height: 100%;
+    content: '';
+  }
+}
+
+@mixin ib() {
+  vertical-align: middle;
+  display: inline-block;
+  max-width: 90%;
+}
+
+@mixin cf {
+  &:before {
+    content: " ";
+    display: table;
+  }
+  &:after {
+    content: " ";
+    display: table;
+    clear: both;
+  }
+}
+
+@mixin load($anim:bg) {
+  animation: $anim 1s steps(1) infinite;
+}
+
+@keyframes bg {
+  33% {
+    background-color: blue;
+    width: 43%;
+  }
+  66% {
+    background-color: black;
+    width: 93%;
+  }
+}
+
+@keyframes title {
+  33% {
+    text-transform: none;
+    font-size: 44px;
+    color: blue;
+  }
+  66% {
+    font-family: $book;
+    font-style: italic;
+    font-size: 54px;
+    color: black;
+  }
+}
+
+@keyframes border {
+  33% {
+    border-color: blue;
+  }
+  66% {
+    border-color: black;
+  }
+}

data/_sass/_overlay.scss

@@ -14,6 +14,7 @@
     background-color: $smoke;
     font-size: 54px;
     color: $gun;
+    z-index: 5;
 
     &.--demo {
       @extend %overlay_grid;

data/_sass/_title.scss

@@ -0,0 +1,11 @@
+
+.title {
+  &._load {
+    text-transform: uppercase;
+    @include load(title);
+    padding-bottom: 20px;
+    text-align: center;
+    font-size: 48px;
+    color: red;
+  }
+}

data/_sass/_vars.scss

@@ -0,0 +1,26 @@
+
+$system : rgb(110,70,160);
+$brand  : rgb(255,130,0);
+$supply : rgb(240,10,10);
+$demo   : rgb(0,90,155);
+
+$generic    : #fe5900;
+$theatre    : #019fc6;
+$talks      : #ff9000;
+$music      : #dc3636;
+$classical  : #bf8f3a;
+$cinema     : #259d31;
+$tours      : #718ab2;
+$hire       : #412f79;
+$membership : #5d91e5;
+$art        : #f90082;
+
+$smoke  : darken(white,7%);
+$gray   : darken(white,25%);
+$gun    : darken(white,60%);
+$carbon : lighten(black,10%);
+$coal   : lighten(black,5%);
+
+$min640w  : 'only screen and (min-width: 640px)';
+$min768w  : 'only screen and (min-width: 768px)';
+$min1024w : 'only screen and (min-width: 1024px)';

data/_sass/futuro.scss

@@ -2,9 +2,11 @@
 @charset 'utf-8';
 
 @import
-'base',
+'vars',
 'fonts',
-'helpers',
+'mixins',
+'extends',
+'base',
 'area',
 'bar',
 'box',
@@ -16,5 +18,5 @@
 'site',
 'task',
 'textarea',
-'titles',
+'title',
 'wrap';

data/assets/js/vendor/futuro-load.js

@@ -1,50 +1,7 @@
 
-// credit | http://talkerscode.com/webtricks/display-progress-bar-while-page-loads-using-jquery.php
-
-var loadTl = new TimelineMax({repeat:-1,repeatDelay:0.2}),
-    siteTl = new TimelineMax({delay:1}),
-    loaders = ['.title._load,.box._load,.bar._load'];
-
-loadTl
-.set(loaders,{className:'+=--pop'})
-.add('popop','0.2')
-.set(loaders,{className:'-=--pop'},'popop')
-.set(loaders,{className:'+=--popop'},'popop')
-.add('popopop','0.4')
-.set(loaders,{className:'-=--popop'},'popopop')
-.set(loaders,{className:'+=--popopop'},'popopop')
-;
-
-document.onreadystatechange = function(e) {
-  if(document.readyState == "interactive") {
-    var all = document.getElementsByTagName('*');
-    for(var i = 0, max = all.length; i < max; i++) {
-      set_ele(all[i]);
-    }
-  }
-}
-
-function check_element(ele){
-  var all = document.getElementsByTagName('*'),
-      prog = document.getElementById("progress"),
-      pcent = 100/all.length;
-
-  if($(ele).on()) {
-    var prog_width = pcent + Number(prog.value);
-    prog.value = prog_width;
-    TweenLite.to('.bar._load',1,{width:prog_width+'%'});
-  } else {
-    set_ele(ele);
-  }
-}
-
-function set_ele(set_element){
-  check_element(set_element);
-}
-
 var siteFunc = () => {
-  siteTl
-  .set('.overlay._load',{className:'-=--open'},'0.1')
-  .set('.site',{className:'+=--open',onComplete:function(){loadTl.stop();}},'0.1')
-  ;
+  $('.site').addClass('--open');
+  setTimeout(function() {
+    $('.overlay._load').removeClass('--open');
+  },1000);
 }

data/assets/ref/js/futuro-load.js

@@ -0,0 +1,30 @@
+
+// credit | http://talkerscode.com/webtricks/display-progress-bar-while-page-loads-using-jquery.php
+// <input type="hidden" id="progress" value="0">
+
+document.onreadystatechange = function(e) {
+  if(document.readyState == "interactive") {
+    var all = document.getElementsByTagName('*');
+    for(var i = 0, max = all.length; i < max; i++) {
+      set_ele(all[i]);
+    }
+  }
+}
+
+function check_element(ele){
+  var all = document.getElementsByTagName('*'),
+      prog = document.getElementById("progress"),
+      pcent = 100/all.length;
+
+  if($(ele).on()) {
+    var prog_width = pcent + Number(prog.value);
+    prog.value = prog_width;
+    TweenMax.to('.bar._load',1,{width:prog_width+'%'});
+  } else {
+    set_ele(ele);
+  }
+}
+
+function set_ele(set_element){
+  check_element(set_element);
+}

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: futuro
 version: !ruby/object:Gem::Version
-  version: 0.1.7
+  version: 0.1.8
 platform: ruby
 authors:
 - Paul Heading
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2019-04-22 00:00:00.000000000 Z
+date: 2019-04-23 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: jekyll
@@ -104,15 +104,17 @@ files:
 - _sass/_box.scss
 - _sass/_btn.scss
 - _sass/_exit.scss
+- _sass/_extends.scss
 - _sass/_fonts.scss
 - _sass/_form.scss
-- _sass/_helpers.scss
 - _sass/_input.scss
+- _sass/_mixins.scss
 - _sass/_overlay.scss
 - _sass/_site.scss
 - _sass/_task.scss
 - _sass/_textarea.scss
-- _sass/_titles.scss
+- _sass/_title.scss
+- _sass/_vars.scss
 - _sass/_wrap.scss
 - _sass/futuro.scss
 - assets/art/favicon.psd
@@ -145,9 +147,8 @@ files:
 - assets/ref/_config.yml
 - assets/ref/gem.txt
 - assets/ref/jekyll.txt
-- assets/ref/js/paulh.click.js
-- assets/ref/js/paulh.random.js
-- assets/ref/js/paulh.timeline.js
+- assets/ref/js/futuro-load.js
+- assets/ref/js/futuro-random.js
 - assets/ref/js/scripts.js
 - assets/ref/liquid.txt
 - assets/ref/markdown.md
@@ -170,7 +171,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubygems_version: 3.0.1
+rubygems_version: 3.0.2
 signing_key: 
 specification_version: 4
 summary: Private theme for Paul Heading

data/_sass/_helpers.scss

@@ -1,124 +0,0 @@
-
-$system : rgb(110,70,160);
-$brand  : rgb(255,130,0);
-$supply : rgb(240,10,10);
-$demo   : rgb(0,90,155);
-
-$generic    : #fe5900;
-$theatre    : #019fc6;
-$talks      : #ff9000;
-$music      : #dc3636;
-$classical  : #bf8f3a;
-$cinema     : #259d31;
-$tours      : #718ab2;
-$hire       : #412f79;
-$membership : #5d91e5;
-$art        : #f90082;
-
-$smoke  : darken(white,7%);
-$gray   : darken(white,25%);
-$gun    : darken(white,60%);
-$carbon : lighten(black,10%);
-$coal   : lighten(black,5%);
-
-$min640w  : 'only screen and (min-width: 640px)';
-$min768w  : 'only screen and (min-width: 768px)';
-$min1024w : 'only screen and (min-width: 1024px)';
-
-@mixin zero($b:0,$r:0,$l:0,$t:0) {
-  bottom: $b;
-  right: $r;
-  left: $l;
-  top: $t;
-}
-
-@mixin center() {
-  &:before {
-    display: inline-block;
-    vertical-align: middle;
-    margin-right: -0.25em;
-    height: 100%;
-    content: '';
-  }
-}
-
-@mixin ib() {
-  vertical-align: middle;
-  display: inline-block;
-  max-width: 90%;
-}
-
-@mixin cf {
-  &:before {
-    content: " ";
-    display: table;
-  }
-  &:after {
-    content: " ";
-    display: table;
-    clear: both;
-  }
-}
-
-%area_grid {
-  justify-content: center;
-  display: grid;
-}
-
-%grid {
-
-  &_default {
-    grid-template-columns: 40px minmax(240px,1000px) 40px;
-  }
-
-  &_load {
-    grid-template-columns: 40px minmax(240px,320px) 40px;
-  }
-
-  &_overlay {
-    grid-template-columns: 40px minmax(240px,560px) 40px;
-  }
-}
-
-%overlay {
-  display: none;
-
-  &_grid {
-    justify-content: center;
-
-    &.--open {
-      display: grid;
-    }
-  }
-
-  &_block {
-    text-align: center;
-    @include center();
-
-    &.--open {
-      display: block;
-    }
-  }
-}
-
-%wrap {
-
-  &_grid {
-    grid-column: 2 / 3;
-    display: grid;
-  }
-
-  &_block {
-    margin-right: auto;
-    margin-left: auto;
-  }
-
-  &_overlay {
-    min-width: 240px;
-    @include ib;
-  }
-}
-
-:focus {
-  outline: rgba(0,0,0,0);
-}

data/_sass/_titles.scss

@@ -1,25 +0,0 @@
-
-.title {
-
-  &._load {
-    padding-bottom: 20px;
-    text-align: center;
-    color: red;
-
-    &.--pop {
-      text-transform: uppercase;
-      font-size: 48px;
-
-      &op {
-        font-size: 44px;
-        color: blue;
-
-        &op {
-          font-family: $book;
-          font-style: italic;
-          color: black;
-        }
-      }
-    }
-  }
-}

data/assets/ref/js/paulh.click.js

@@ -1,11 +0,0 @@
-
-function clickFunc() {
-
-  if( $body.hasClass('open')) {
-    // do something
-  } else {
-    // do something
-  }
-}
-
-$item.on('mousedown','.foo',clickFunc);

data/assets/ref/js/paulh.timeline.js

@@ -1,21 +0,0 @@
-
-function fooFunc() {
-
-  const fooTl = new TimelineMax();
-
-  fooTl
-  .to($item,.5,{display:'none'})
-  ;
-
-  return fooTl;
-}
-
-TweenMax.to($item,.5,{display:'none'});
-
-timelineTl.play();
-timelineTl.pause();
-
-timelineTl
-.to($item,.5,{display:'none'})
-.add(fooFunc())
-;