futuro 1.0.9 → 1.1.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: df006dc97dfd41ed409de4e0257ab098dd330c5c575f2732f6d6e94a5050b6bb
-  data.tar.gz: 3cda7862c3f909fb6b420b2ffcac8a1be375c18b7d955f093a094362741eedb1
+  metadata.gz: d8050b8e3d097383f0cbd38f342641bc1bdac3629ce2f7f60243aedb59a80f69
+  data.tar.gz: 90e6bd2abf546b589b9f6d665bdb221dafdc7623b30266aa613bdb685e8b786d
 SHA512:
-  metadata.gz: 395cfdc7341ac674c5d8370b80a8934a8ee625381b7d2e33e7a27feac78c819bd791356fec673fbade993a6f4ebfb549e2e79cad532f84de35724a72d8dff2ec
-  data.tar.gz: 69f14161038ad79f3da04059e485ccccec93a6513389da4ac2c8f2f3c539c6b9058fd0f366fac83d2c3ae24c6c606b1bda386b54b9431a87eaf114b8cb3636e2
+  metadata.gz: b6e1fc8e50526565a2b119a4da033e688e1c7b1981b4ad4a0975dbca198dfd8f720338c7d725b41f6c457989cd3344b0f86e6f758aa189382cadcc3406bc1d61
+  data.tar.gz: 1a5fe92b64381cb62c1a50f71b39c0a558ea3b086750164483383af83a50eb2f061db16dd65f80e3aebb418d353775a50e65e11f12fe5cbfa9f9233beaded222

data/_includes/html/assign/page.liquid

@@ -4,7 +4,8 @@
 {% assign PageChapter = page.chapter    | replace : ' ','-'     | downcase %}
 {% assign PageTopic   = page.topic      | replace : ' ','-'     | downcase %}
 {% assign PageTitle   = page.title      | replace : ' ','-'     | downcase %}
-{% assign PageTag     = page.tag        | replace : ' ',' tag-' | prepend : ' tag-'     | downcase %}
+{% assign PageTag     = page.tag        | replace : ' ',' tag-' | prepend : ' tag-' | downcase %}
+{% assign PageLabel   = page.label      | prepend: '/' | downcase %}
 
 {% assign PageUrl     = page.url | replace : '.html','' | replace : '/index','' | slice: 1,999 %}
 {% assign PageShare   = PageUrl  | prepend : '/' | prepend : site.url %}

data/_includes/html/assign/site.liquid

@@ -1,28 +1,25 @@
 
-{% assign SiteInstall = site.setup.install | replace : ' ','-' | prepend : 'install-' | downcase %}
-{% assign SiteStyle   = site.setup.style   | replace : ' ','-' | prepend : 'style-'   | downcase %}
-
-{% assign Site         = 'html/site/' %}
-{% assign SitePage     = 'html/page/' %}
-{% assign SiteOverlay  = 'html/overlay/' %}
-{% assign SiteLayout   = 'html/layout/' %}
-
-{% assign SiteUtil     = SitePage    | append : 'util/' %}
-{% assign SiteContent  = SitePage    | append : 'content/' %}
-{% assign PageBlock    = SitePage    | append : 'block/' %}
-
-{% assign ContentLoop  = SiteContent | append : 'loop/' %}
-{% assign LoopArtwork  = ContentLoop | append : 'artwork/' %}
-{% assign LoopForm     = ContentLoop | append : 'form/' %}
-{% assign LoopRoller   = ContentLoop | append : 'roller/' %}
-{% assign LoopHeader   = ContentLoop | append : 'header/' %}
-{% assign LoopScreen   = ContentLoop | append : 'screen/' %}
-{% assign LoopButton   = ContentLoop | append : 'button/' %}
-{% assign LoopAlert    = ContentLoop | append : 'alert/' %}
+{% assign Site        = 'html/site/' %}
+{% assign SitePage    = 'html/page/' %}
+{% assign SiteOverlay = 'html/overlay/' %}
+{% assign SiteLayout  = 'html/layout/' %}
+
+{% assign SiteUtil    = SitePage | append : 'util/' %}
+{% assign SiteContent = SitePage | append : 'content/' %}
+{% assign PageBlock   = SitePage | append : 'block/' %}
+{% assign SiteTopbar  = SitePage | append : 'topbar/' %}
+
+{% assign ContentLoop = SiteContent | append : 'loop/' %}
+{% assign LoopArtwork = ContentLoop | append : 'artwork/' %}
+{% assign LoopForm    = ContentLoop | append : 'form/' %}
+{% assign LoopRoller  = ContentLoop | append : 'roller/' %}
+{% assign LoopHeader  = ContentLoop | append : 'header/' %}
+{% assign LoopScreen  = ContentLoop | append : 'screen/' %}
+{% assign LoopButton  = ContentLoop | append : 'button/' %}
+{% assign LoopAlert   = ContentLoop | append : 'alert/' %}
 
 {% assign SiteSvg = 'svg/site/' %}
 {% assign SvgLoad = SiteSvg | append : 'load/' %}
-{% assign SvgBook = SiteSvg | append : 'book/' %}
 {% assign SvgBtn  = SiteSvg | append : 'btn/' %}
 {% assign SvgIcon = SiteSvg | append : 'icon.liquid' %}
 
@@ -32,6 +29,18 @@
 {% assign LayoutTitle   = page.title      | replace : ' ','-' | prepend : ' title-'   | downcase %}
 {% assign LayoutTopic   = page.topic      | replace : ' ','-' | downcase %}
 
+{%- if site.setup.install -%}
+  {% assign SiteInstall = site.setup.install | prepend : 'install-' %}
+{%- else -%}
+  {% assign SiteInstall = "install-library" %}
+{%- endif -%}
+
+{%- if site.setup.style -%}
+  {% assign SiteStyle = site.setup.style | prepend : 'style-' %}
+{%- else -%}
+  {% assign SiteStyle = "style-page" %}
+{%- endif -%}
+
 {%- if site.setup.respond -%}
   {% assign SiteIsResponsive = true %}
 {%- else -%}

data/_includes/html/layout/footer.liquid

@@ -1,7 +1,11 @@
 
 {% unless SiteIsTheme %}
 
-  {% include {{ SitePage | append : 'clippies.liquid' }} %}
+  {% unless PageIsHome %}
+
+    {% include {{ SitePage | append : 'clippies.liquid' }} %}
+    
+  {% endunless %}  
 
 {% endunless %}
 

data/_includes/html/page/header.liquid

@@ -1,6 +1,5 @@
 
-<div class="wrap page-wrap {{ PageType }}
-            {% if site.setup.style %}{{ SiteStyle }}{% endif %}
+<div class="wrap page-wrap {{ PageType }} {{ SiteStyle }}
             {% if page.collection %}{{ PageBook | prepend : 'book-' }}{% endif %}
             {% if page.chapter %}{{ PageChapter | prepend : 'chapter-' }}{% endif %}
             {% if page.topic %}{{ PageTopic | prepend : 'topic-' }} in-topic{% endif %}

data/_includes/html/page/layout/home.liquid

@@ -3,18 +3,28 @@
 
   {% for book in loop %}
 
-    {% assign label = book.label %}
-    {% assign url = label | prepend: '/' | append: '/' %}
-    {% assign svg = label | append: '.svg' %}
+    {% assign url = book.label | prepend: '/' | append: '/' %}
+    {% assign svg = book.label | append: '.svg' %}
 
-    {% unless label == 'posts' %}
+    {% if book.live %}
+      {% assign href  = url %}
+      {% assign class = book.label %}
+    {% else %}
+      {% assign href  = "#" %}
+      {% assign class = "draft" %}
+    {% endif %}
+
+    {% unless book.label == 'posts' %}
 
       <div class="wrap book">
 
-        <a class="link book {% if book.live %}{{ label }}{% else %}draft{% endif %}" 
-           href="{% if book.live %}{{ url }}{% else %}#{% endif %}">
+        <a class="link book {{ class }}" href="{{ href }}">
 
-          {% include {{ SvgBook | append : svg }} %}
+          <span class="title book {{ class }}">
+            
+            {{ book.label }}
+          
+          </span>
 
         </a>
 

data/_includes/html/page/topbar.liquid

@@ -1,52 +1,63 @@
 
-{% assign label = page.label | downcase | prepend: '/' %}
-
 <div class="area topbar">
 
     <div class="block navigation left">
 
       <button type="button" class="navigation about">
-        {% include {{ SvgBtn | append : 'about.svg' }} %}
+
+        {% include {{ SvgIcon }} type="about" %}
+
       </button>
 
       <button type="button" class="navigation browse">
-        {% include {{ SvgBtn | append : 'browse.svg' }} %}
+
+        {% include {{ SvgIcon }} type="browse" %}
+
       </button>
 
     </div>
 
     <div class="block navigation main">
 
-      {% assign loop = site.collections | sort: 'weight' %}
+      {% if page.error %}
 
-      {% for page in loop %}
+        {% include {{ SiteTopbar | append : 'navigation/link.liquid' }} 
+                      title = "Home"
+                      href  = "/" %}
+        
+      {% else %}
 
-        {% if page.live %}
+        {% assign loop = site.collections | sort: 'weight' %}
 
-        <a class="link navigation {{ page.label }}" href="{%- if site.setup.install == 'library' -%}{{ page.label | prepend: '/' }}{%- else -%}/{%- endif -%}">
-          <button type="button" name="button">
-            <strong>{{ page.label }}</strong>
-          </button>
-        </a>
+        {% for item in loop %}
 
-        {% endif %}
+          {% if item.live %}
 
-      {% endfor %}
+            {% include {{ SiteTopbar | append : 'navigation/link.liquid' }} 
+                          title = item.label %}
+
+          {% endif %}
+          
+        {% endfor %}
+        
+      {% endif %}
 
     </div>
 
     <div class="block navigation right">
 
-      <button type="button" class="navigation cart" style="display:none;">
+      <!-- <button type="button" class="navigation cart">
         {% include {{ SvgBtn | append : 'cart.svg' }} %}
       </button>
 
-      <button type="button" class="navigation count" style="display:none;">
+      <button type="button" class="navigation count">
         <strong>0</strong>
-      </button>
+      </button> -->
 
       <button type="button" class="navigation search">
+
         {% include {{ SvgIcon }} type="search" %}
+
       </button>
 
     </div>

data/_includes/html/page/topbar/navigation/link.liquid

@@ -0,0 +1,22 @@
+
+{% assign class = include.title | replace : ' ','-' | downcase %}
+
+{% if include.href %}
+
+  {% assign href = include.href %}
+
+{% else %}
+    
+  {% assign href = class | prepend : '/' %}
+  
+{% endif %}
+
+<a class="link navigation {{ class }}" href={{ href }}>
+
+  <button type="button" name="button">
+
+    <strong>{{ include.title }}</strong>
+
+  </button>
+
+</a>

data/_includes/svg/site/icon.liquid

@@ -15,6 +15,14 @@
 
   <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"/><path d="M0 0h24v24H0z" fill="none"/></svg>
 
+{%- elsif include.type == "about" -%}
+
+  <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><path d="M17.5,10.5c-0.5,0.5-1.1,0.7-1.8,0.7c-0.7,0-1.3-0.2-1.7-0.7 c-0.5-0.5-0.7-1.1-0.7-1.8C13.3,8,13.5,7.5,14,7c0.5-0.5,1.1-0.7,1.7-0.7c0.7,0,1.3,0.2,1.8,0.7C18,7.5,18.2,8,18.2,8.7 C18.2,9.4,18,10,17.5,10.5z M13.5,25.3H18v-11h-4.5V25.3z M16,0C7.2,0,0,7.2,0,16c0,8.8,7.2,16,16,16c8.8,0,16-7.2,16-16	C32,7.2,24.8,0,16,0z" fill-rule="evenodd" clip-rule="evenodd"/></svg>
+
+{%- elsif include.type == "browse" -%}
+
+  <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><path d="M27.2,4.6C21-1.6,10.8-1.5,4.6,4.8C-1.6,11-1.5,21.2,4.8,27.4	s16.4,6.2,22.6-0.1S33.5,10.8,27.2,4.6z" fill-rule="evenodd" clip-rule="evenodd"/><path d="M25.3,22.3L17,24.4L17.1,11l8.2-2V22.3z M7,8.8l8,2l-0.1,13.3	L7,22.2V8.8z" fill-rule="evenodd" clip-rule="evenodd" fill="#FFFFFF"/></svg>
+
 {%- elsif include.type == "search" -%}
 
   <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M7.5,7.4C6.6,8.3,6,9.7,6,11.1s0.6,2.7,1.5,3.7c0.9,0.9,2.3,1.5,3.7,1.5 s2.7-0.6,3.7-1.5c0.9-0.9,1.5-2.3,1.5-3.7s-0.6-2.7-1.5-3.7c-1-1.1-2.3-1.5-3.7-1.5S8.5,6.4,7.5,7.4z M19.5,21.4l-4-4 c-1.2,0.9-2.7,1.3-4.2,1.3c-2.1,0-4-0.8-5.4-2.2c-1.4-1.4-2.2-3.3-2.2-5.3s0.8-4,2.2-5.4s3.4-2.3,5.4-2.3s4,0.8,5.4,2.2 S19,9,19,11.1c0,1.5-0.4,3-1.3,4.3l4,4L19.5,21.4z" fill-rule="evenodd" clip-rule="evenodd"/></svg>
@@ -67,7 +75,7 @@
 
   <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 12 12"><path d="M6,0c3.3,0,6,2.7,6,6s-2.7,6-6,6S0,9.3,0,6S2.7,0,6,0z"/></svg>
 
-{%- elsif include.type == "seatplan" -%}  
+{%- elsif include.type == "seatplan" -%}
 
   <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200">
     <path class="style-level-d" d="M109,102.5c3.6,0,6.5,2.9,6.5,6.5s-2.9,6.5-6.5,6.5s-6.5-2.9-6.5-6.5S105.4,102.5,109,102.5z"/>

data/_sass/block/chart.scss

@@ -39,6 +39,7 @@
 .block.chart-title {
   @include RotateTitle;
   left: calc(50% + 14px);
-  bottom: 10px;
+  position: absolute;
   color: white;
+  bottom: 10px;
 }

data/_sass/block/util.scss

@@ -8,6 +8,9 @@
 
 .block.util.type-page.style-page {
   @extend %ContentPrep;
+  fill: setcolor(coal);
+  grid-row-gap: 6px;
+  display: grid;
 }
 
 .block.util.type-chapter.style-page {

data/_sass/futuro.core.scss

@@ -5,6 +5,7 @@
 
 @import
 "helpers/variables",
+"helpers/variables/colors",
 "helpers/mixins",
 "helpers/mixins/layout",
 "helpers/mixins/items",
@@ -93,6 +94,7 @@
 
 @import
 "title/alert",
+"title/book",
 "title/browse",
 "title/checkbox",
 "title/copied",

data/_sass/helpers/extends.scss

@@ -24,20 +24,3 @@
 :focus {
   outline: rgba(0,0,0,0);
 }
-
-// MINDSETS IMPORT ************************************************************
-
-// %table {
-//   grid-template-columns: 220px repeat(4,110px);
-//   list-style: none;
-//   display: grid;
-//   padding: 0;
-
-//   li {
-//     padding: 5px;
-
-//     &:nth-of-type(n+2) {
-//       text-align: center;
-//     }
-//   }
-// }

data/_sass/helpers/mixins/layout.scss

@@ -14,7 +14,6 @@
 @mixin RotateTitle($origin : bottom left, $deg : 90){
   transform: rotate(-#{$deg}deg);
   transform-origin: $origin;
-  position: absolute;
 }
 
 @mixin PadBtn($value : 4) {

data/_sass/helpers/mixins/theme.scss

@@ -1,6 +1,4 @@
 
-
-
 // Used in Mindsets
 @mixin ThemeMorph($name,$color) {
   // find output path by dynamic class name
@@ -267,7 +265,7 @@
   } @else {
 
     // book covers
-    .area.type-chapter.book-#{$book} {
+    .wrap.page-wrap.type-chapter.book-#{$book} {
       background-color: setcolor($color);
     }
   }

data/_sass/helpers/themes.scss

@@ -1,14 +1,15 @@
 
-// // ThemeBook | $name | $col
-
-// @include ThemeBook("orwell",blue);
-
-// @include ThemeBook("woolf",green);
-
-// // ThemeCover | $name | $col | $left | $chapter
-
-// @include ThemeCover("animal",blue,false,true);
-
-// // ThemePages | $name | $col | $right | $chapter
-
-// @include ThemePages("animal",blue,false,true);
+$books : (
+  "orwell" : (
+    colour : "success"
+  ),
+  "woolf" : (
+    colour : "error"
+  )
+);
+
+@each $book, $map in $books {
+  @include ThemeBook ($book, map-get($map,colour));
+  @include ThemeCover ($book, false, map-get($map,colour));
+  @include ThemePages ($book, false, map-get($map,colour), map-get($map,info));
+}

data/_sass/helpers/variables.scss

@@ -1,29 +1,4 @@
 
-// https://stackoverflow.com/questions/27740063/merge-multiple-sass-maps
-
-// Function for collecting multiple maps;
-
-@function map-collect($maps...) {
-  $collection: ();
-
-  @each $map in $maps {
-    $collection: map-merge($collection, $map);
-  }
-  @return $collection;
-}
-
-// $color: map-collect($color-name, $color-event, $color-category);
-
-// Function for shorter usage of map-get();
-
-@function setcolor($scheme, $tone: base) {
-
-  @return map-get(map-get($colormap, $scheme), $tone);
-
-}
-
-// color: setcolor(brown, light);
-
 $site : (
   padding : 50px
 );
@@ -34,9 +9,22 @@ $topbar : (
 );
 
 $book : (
-  large  : 110px,
-  medium : 90px,
-  small  : 75px
+
+  large : (
+    title  : 5.6rem,
+    width  : 110px
+  ),
+
+  medium : (
+    title  : 5.6rem,
+    width  : 90px
+  ),
+
+  small : (
+    title  : 5.6rem,
+    width  : 75px
+  )
+
 );
 
 $query : (
@@ -53,223 +41,17 @@ $query : (
   min1024 : 'only screen and (min-width: 1024px)'
 );
 
-$colormap : (
-
-  error : (
-    base : #B94A48, // untested
-    dark : darken(#B94A48,10%), // untested
-    light  : lighten(#B94A48,23%), // untested
-    xlight : lighten(#B94A48,46%) // untested
-  ),
-
-  success : (
-    base : #468847, // untested
-    dark : darken(#468847,10%), // untested
-    light  : lighten(#468847,26%), // untested
-    xlight : lighten(#468847,52%) // untested
-  ),
-
-  level : (
-    a : #e61717,
-    b : #0099e6,
-    c : #ff8001,
-    d : #3bb300,
-    e : #8b3788,
-    f : #e60073,
-    g : #b35900,
-    y : #ffaa00,
-    l : #b8b8b8
-  ),
-
-  system : (
-    base : #6e46a0
-  ),
-
-  brand : (
-    base : #ff8200
-  ),
-
-  supply : (
-    base : #f00a0a
-  ),
-
-  demo : (
-    base : #005a9b
-  ),
-  
-  theatre : (
-    base : #019fc6
-  ),
-
-  talks : (
-    base : #ff9000
-  ),
-
-  music : (
-    base : #dc3636
-  ),
-
-  classical : (
-    base : #bf8f3a
-  ),
-
-  cinema : (
-    base : #259d31
-  ),
-
-  tours : (
-    base : #718ab2
-  ),
-
-  hire : (
-    base : #412f79, // untested
-    dark : darken(#412f79,0%), // untested
-    light  : lighten(#412f79,32%), // untested
-    xlight : lighten(#412f79,64%) // untested
-  ),
-
-  members : (
-    base : #5d91e5, // untested
-    dark : darken(#5d91e5,10%), // untested
-    light  : lighten(#5d91e5,18%), // untested
-    xlight : lighten(#5d91e5,35%) // untested
-  ),
-
-  art  : (
-    base : #f90082
-  ),
-
-  shop : (
-    base : #23D5B0, // untested
-    dark : darken(#23D5B0,0%), // untested
-    light  : lighten(#23D5B0,25%), // untested
-    xlight : lighten(#23D5B0,50%) // untested
-  ),
-
-  addicts : (
-    base : #e6433a,
-    dark : darken(#e6433a,10%), // untested
-    light  : lighten(#e6433a,20%), // untested
-    xlight : lighten(#e6433a,40%) // untested
-  ),
-
-  family : (
-    base : #029ddf,
-    dark : darken(#029ddf,10%), // untested
-    light  : lighten(#029ddf,20%), // untested
-    xlight : lighten(#029ddf,40%) // untested
-  ),
-
-  receptive : (
-    base : #b25400,
-    dark : darken(#b25400,10%), // untested
-    light  : lighten(#b25400,20%), // untested
-    xlight : lighten(#b25400,40%) // untested
-  ),
-
-  value : (
-    base : #5fb641,
-    dark : darken(#5fb641,10%), // untested
-    light  : lighten(#5fb641,20%), // untested
-    xlight : lighten(#5fb641,40%) // untested
-  ),
-
-  next : (
-    base : #ffa905,
-    dark : darken(#ffa905,10%), // untested
-    light  : lighten(#ffa905,20%), // untested
-    xlight : lighten(#ffa905,40%) // untested
-  ),
-
-  maybe : (
-    base : #974597,
-    dark : darken(#974597,10%), // untested
-    light  : lighten(#974597,20%), // untested
-    xlight : lighten(#974597,40%) // untested
-    ),
-
-  paradise : (
-    base : #e8396c,
-    dark : darken(#e8396c,10%), // untested
-    light  : lighten(#e8396c,20%), // untested
-    xlight : lighten(#e8396c,40%) // untested
-  ),
-
-  artforall : (
-    base : #f9ae00
-  ),
-
-  park : (
-    base : #009640
-  ),
-
-  news : (
-    base : #009fe3
-  ),
-
-  green : (
-    base : #259d31
-  ),  
-
-  generic : (
-    base : #fe5900,
-    dark : darken(#fe5900,10%),
-    light  : lighten(#fe5900,24%),
-    xlight : lighten(#fe5900,48%)
-  ),
-
-  dodgers : (
-    base : #0092FF,
-    dark : darken(#0092FF,10%),
-    light  : lighten(#0092FF,24%),
-    xlight : lighten(#0092FF,48%)
-  ),
-
-  smoke : (
-    base   : #E6E6E6,
-    dark   : darken(#E6E6E6,10%),
-    light  : lighten(#E6E6E6,50%),
-    xlight : lighten(#E6E6E6,75%)
-  ), 
-
-  gray : (
-    base   : #CCCCCC,
-    dark   : darken(#CCCCCC,10%),
-    light  : lighten(#CCCCCC,50%),
-    xlight : lighten(#CCCCCC,75%)
-  ), 
-
-  gun : (
-    base   : #666666, // untested
-    dark   : darken(#666666,10%), // untested
-    light  : lighten(#666666,32%), // untested
-    xlight : lighten(#666666,56%) // untested
-  ), 
+$radius : 4px;
+$NavBorder : 1px solid setcolor(gray);
+$BigGap    : map-get($topbar,height) + map-get($site,padding);
+$SmallGap  : 20px;
 
-  slate : (
-    base   : #333333, // tested
-    dark   : darken(#333333,10%), // tested
-    light  : lighten(#333333,50%), // tested
-    xlight : lighten(#333333,75%) // tested
-  ), 
 
-  carbon : (
-    base   : #1A1A1A,
-    dark   : darken(#1A1A1A,10%),
-    light  : lighten(#1A1A1A,50%),
-    xlight : lighten(#1A1A1A,75%)
-  ), 
+// https://stackoverflow.com/questions/27740063/merge-multiple-sass-maps
+// function for more concise usage of map-get()
 
-  coal : (
-    base   : #0D0D0D,
-    dark   : darken(#0D0D0D,10%),
-    light  : lighten(#0D0D0D,50%),
-    xlight : lighten(#0D0D0D,75%)
-  )
+@function getbook($size, $value) {
 
-);
+  @return map-get(map-get($book, $size), $value);
 
-$radius : 4px;
-$NavBorder : 1px solid setcolor(gray);
-$BigGap    : map-get($topbar,height) + map-get($site,padding);
-$SmallGap  : 20px;
+}

data/_sass/helpers/variables/colors.scss

@@ -0,0 +1,290 @@
+
+// https://stackoverflow.com/questions/27740063/merge-multiple-sass-maps
+// function for collecting multiple sass maps
+
+@function map-collect($maps...) {
+  $collection: ();
+
+  @each $map in $maps {
+    $collection: map-merge($collection, $map);
+  }
+
+  @return $collection;
+}
+
+$ux-colors : (
+
+  generic : (
+    base : #fe5900,
+    dark : darken(#fe5900,10%),
+    light  : lighten(#fe5900,24%),
+    xlight : lighten(#fe5900,48%)
+  ),
+
+  dodgers : (
+    base : #0092FF,
+    dark : darken(#0092FF,10%),
+    light  : lighten(#0092FF,24%),
+    xlight : lighten(#0092FF,48%)
+  ),
+
+  error : (
+    base : #B94A48, // untested
+    dark : darken(#B94A48,10%), // untested
+    light  : lighten(#B94A48,23%), // untested
+    xlight : lighten(#B94A48,46%) // untested
+  ),
+
+  success : (
+    base : #468847, // untested
+    dark : darken(#468847,10%), // untested
+    light  : lighten(#468847,26%), // untested
+    xlight : lighten(#468847,52%) // untested
+  )
+
+);
+
+$tier-colors : (
+
+  level_a : (
+    base : #e61717
+  ),
+
+  level_b : (
+    base : #0099e6
+  ),
+
+  level_c : (
+    base : #ff8001
+  ),
+
+  level_d : (
+    base : #3bb300
+  ),
+
+  level_e : (
+    base : #8b3788
+  ),
+
+  level_f : (
+    base : #e60073
+  ),
+
+  level_g : (
+    base : #b35900
+  ),
+
+  level_y : (
+    base : #ffaa00
+  ),
+
+  level_l : (
+    base : #b8b8b8
+  )
+
+);
+
+$artform-colors : (
+
+  theatre : (
+    base : #019fc6
+  ),
+
+  talks : (
+    base : #ff9000
+  ),
+
+  music : (
+    base : #dc3636
+  ),
+
+  classical : (
+    base : #bf8f3a
+  ),
+
+  cinema : (
+    base : #259d31
+  ),
+
+  tours : (
+    base : #718ab2
+  ),
+
+  hire : (
+    base : #412f79, // untested
+    dark : darken(#412f79,0%), // untested
+    light  : lighten(#412f79,32%), // untested
+    xlight : lighten(#412f79,64%) // untested
+  ),
+
+  members : (
+    base : #5d91e5, // untested
+    dark : darken(#5d91e5,10%), // untested
+    light  : lighten(#5d91e5,18%), // untested
+    xlight : lighten(#5d91e5,35%) // untested
+  ),
+
+  art  : (
+    base : #f90082
+  ),
+
+  shop : (
+    base : #23D5B0, // untested
+    dark : darken(#23D5B0,0%), // untested
+    light  : lighten(#23D5B0,25%), // untested
+    xlight : lighten(#23D5B0,50%) // untested
+  )
+
+);
+
+$mindset-colors : (
+
+  addicts : (
+    base : #e6433a,
+    dark : darken(#e6433a,10%), // untested
+    light  : lighten(#e6433a,20%), // untested
+    xlight : lighten(#e6433a,40%) // untested
+  ),
+
+  family : (
+    base : #029ddf,
+    dark : darken(#029ddf,10%), // untested
+    light  : lighten(#029ddf,20%), // untested
+    xlight : lighten(#029ddf,40%) // untested
+  ),
+
+  receptive : (
+    base : #b25400,
+    dark : darken(#b25400,10%), // untested
+    light  : lighten(#b25400,20%), // untested
+    xlight : lighten(#b25400,40%) // untested
+  ),
+
+  value : (
+    base : #5fb641,
+    dark : darken(#5fb641,10%), // untested
+    light  : lighten(#5fb641,20%), // untested
+    xlight : lighten(#5fb641,40%) // untested
+  ),
+
+  next : (
+    base : #ffa905,
+    dark : darken(#ffa905,10%), // untested
+    light  : lighten(#ffa905,20%), // untested
+    xlight : lighten(#ffa905,40%) // untested
+  ),
+
+  maybe : (
+    base : #974597,
+    dark : darken(#974597,10%), // untested
+    light  : lighten(#974597,20%), // untested
+    xlight : lighten(#974597,40%) // untested
+  )
+
+);
+
+$wgp-colors : (
+
+  paradise : (
+    base : #e8396c,
+    dark : darken(#e8396c,10%), // untested
+    light  : lighten(#e8396c,20%), // untested
+    xlight : lighten(#e8396c,40%) // untested
+  ),
+
+  artforall : (
+    base : #f9ae00
+  ),
+
+  park : (
+    base : #009640
+  ),
+
+  news : (
+    base : #009fe3
+  )
+
+);
+
+$design-colors : (
+
+  system : (
+    base : #6e46a0
+  ),
+
+  brand : (
+    base : #ff8200
+  ),
+
+  supply : (
+    base : #f00a0a
+  ),
+
+  demo : (
+    base : #005a9b
+  )
+
+);
+
+$gradient-colors : (
+
+  smoke : (
+    base   : #E6E6E6,
+    dark   : darken(#E6E6E6,10%),
+    light  : lighten(#E6E6E6,50%),
+    xlight : lighten(#E6E6E6,75%)
+  ), 
+
+  gray : (
+    base   : #CCCCCC,
+    dark   : darken(#CCCCCC,10%),
+    light  : lighten(#CCCCCC,50%),
+    xlight : lighten(#CCCCCC,75%)
+  ), 
+
+  gun : (
+    base   : #666666, // untested
+    dark   : darken(#666666,10%), // untested
+    light  : lighten(#666666,32%), // untested
+    xlight : lighten(#666666,56%) // untested
+  ), 
+
+  slate : (
+    base   : #333333, // tested
+    dark   : darken(#333333,10%), // tested
+    light  : lighten(#333333,50%), // tested
+    xlight : lighten(#333333,75%) // tested
+  ), 
+
+  carbon : (
+    base   : #1A1A1A,
+    dark   : darken(#1A1A1A,10%),
+    light  : lighten(#1A1A1A,50%),
+    xlight : lighten(#1A1A1A,75%)
+  ), 
+
+  coal : (
+    base   : #0D0D0D,
+    dark   : darken(#0D0D0D,10%),
+    light  : lighten(#0D0D0D,50%),
+    xlight : lighten(#0D0D0D,75%)
+  )
+
+);
+
+$colormap : map-collect($ux-colors, 
+                        $tier-colors, 
+                        $artform-colors, 
+                        $mindset-colors, 
+                        $wgp-colors, 
+                        $design-colors, 
+                        $gradient-colors);
+
+// https://stackoverflow.com/questions/27740063/merge-multiple-sass-maps
+// function for more concise usage of map-get()
+
+@function setcolor($scheme, $tone: base) {
+
+  @return map-get(map-get($colormap, $scheme), $tone);
+
+}

data/_sass/link/book.scss

@@ -1,15 +1,17 @@
 
 .link.book {
-  width: map-get($book,large);
-  display: block;
-  fill: white;
-
+  height: getbook(large,width) * 4;
+  width:  getbook(large,width);
+  text-decoration: none;
+  place-content: center;
+  display: grid;
+  
   @media#{map-get($query,max767)} {
-    width: map-get($book,medium);
+    width: getbook(medium,width);
   }
 
   @media#{map-get($query,max599)} {
-    width: map-get($book,small);
+    width: getbook(small,width);
   }
 }
 

data/_sass/link/navigation.scss

@@ -5,12 +5,16 @@
   line-height: 1.1;
   padding: 0 20px;
   display: grid;
+}
 
-  button {
-    text-transform: capitalize;
-    border-radius: 0;
-    line-height: 1.1;
-    color: inherit;
-    padding: 0;
-  }
+.link.navigation > button {
+  text-transform: capitalize;
+  border-radius: 0;
+  line-height: 1.1;
+  color: inherit;
+  padding: 0;
+}
+
+.link.navigation.home > button {
+  border-bottom: 3px solid;
 }

data/_sass/title/book.scss

@@ -0,0 +1,9 @@
+
+.title.book {
+  @include RotateTitle(center);
+  @extend %bold;
+  font-size: getbook(large,title);
+  pointer-events: none;
+  position: relative;
+  color: white;
+}

data/_sass/title/page.scss

@@ -5,6 +5,7 @@
 
 .title.page-chapter {
   @include RotateTitle(top right);
+  position: absolute;
   right: 78px;
   top: 56px;
 }
@@ -12,6 +13,7 @@
 .title.page-weight {
   @include RotateTitle;
   left: calc(100% - 58px);
+  position: absolute;
   text-align: right;
   bottom: 56px;
 }

data/_sass/title/type.scss

@@ -1,6 +1,7 @@
 
 %StylePage {
   @include RotateTitle;
+  position: absolute;
   bottom: 56px;
   left: 128px;
 }

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: futuro
 version: !ruby/object:Gem::Version
-  version: 1.0.9
+  version: 1.1.0
 platform: ruby
 authors:
 - Paul Heading
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2020-05-22 00:00:00.000000000 Z
+date: 2020-05-26 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: jekyll
@@ -180,6 +180,7 @@ files:
 - _includes/html/page/title.liquid
 - _includes/html/page/title/create.liquid
 - _includes/html/page/topbar.liquid
+- _includes/html/page/topbar/navigation/link.liquid
 - _includes/html/page/util.liquid
 - _includes/html/page/util/author.liquid
 - _includes/html/page/util/share.liquid
@@ -189,8 +190,6 @@ files:
 - _includes/html/site/header.liquid
 - _includes/html/site/scroller.liquid
 - _includes/svg/orwell/animal/icon.svg
-- _includes/svg/site/book/orwell.svg
-- _includes/svg/site/book/woolf.svg
 - _includes/svg/site/btn/about.svg
 - _includes/svg/site/btn/add.svg
 - _includes/svg/site/btn/author.svg
@@ -273,6 +272,7 @@ files:
 - _sass/helpers/mixins/theme.scss
 - _sass/helpers/themes.scss
 - _sass/helpers/variables.scss
+- _sass/helpers/variables/colors.scss
 - _sass/item/pie.scss
 - _sass/item/roller.scss
 - _sass/item/scroller.scss
@@ -284,6 +284,7 @@ files:
 - _sass/list/roller.scss
 - _sass/list/scroller.scss
 - _sass/title/alert.scss
+- _sass/title/book.scss
 - _sass/title/browse.scss
 - _sass/title/checkbox.scss
 - _sass/title/copied.scss

data/_includes/svg/site/book/orwell.svg

@@ -1 +0,0 @@
-<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0" y="0" viewBox="0 0 110 440" xml:space="preserve" enable-background="new 0 0 110 440"><path d="M55.8,263.6c8.9,0,14.9,6.5,14.9,16.4c0,9.5-6.3,16.4-14.9,16.4c-8.6,0-14.9-6.9-14.9-16.6C41,270.2,47.1,263.6,55.8,263.6z M55.9,286.2c4.1,0,7.3-2.6,7.3-6.2c0-4.1-2.7-6.5-7.3-6.5c-4.4,0-7.3,2.5-7.3,6.3C48.6,283.5,51.7,286.2,55.9,286.2z M42,261.8	v-9.3h3.5c-3.2-2-4.3-4.1-4.3-7.4c0-0.7,0.1-1.1,0.3-3.4h8.9c-0.3,1.1-0.4,1.7-0.4,2.5c0,5.2,2.8,7.9,8,7.9h11.7v9.7H42z M42,231.3	l14.9-5.2L42,221.4v-7l14.9-4.6L42,204.6v-9.5l27.7,10.8v7.3L54.2,218l15.6,4.9v7.4L42,241.5V231.3z M61,167.4	c6.1,0.7,9.9,6.4,9.9,14.6c0,9.4-5.8,15.4-14.8,15.4c-9,0-14.9-5.9-14.9-15c0-5.9,2.5-11,6.5-13.1c2.2-1.2,5.7-2,9.1-2h1.9v20.1	c3.7-0.2,5.5-1.9,5.5-5.2c0-2.4-0.5-3.2-3-4.7V167.4z M52,177.3c-3.1,0.5-4.4,2-4.4,4.9c0,2.7,1.6,4.5,4.4,5V177.3z M28,165.6v-9.7	h41.8v9.7H28z M28,153.4v-9.7h41.8v9.7H28z"/></svg>

data/_includes/svg/site/book/woolf.svg

@@ -1 +0,0 @@
-<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0" y="0" viewBox="0 0 110 440" xml:space="preserve" enable-background="new 0 0 110 440"><path d="M42.6,281l14.9-5.2l-14.9-4.7v-7l14.9-4.6l-14.9-5.2v-9.5l27.7,10.8v7.3l-15.6,4.7l15.6,4.9v7.4l-27.7,11.3V281z M56.4,214.4c8.9,0,14.9,6.5,14.9,16.4c0,9.5-6.3,16.4-14.9,16.4c-8.6,0-14.9-6.9-14.9-16.6C41.6,221,47.7,214.4,56.4,214.4z M56.5,237.1c4.1,0,7.3-2.6,7.3-6.2c0-4.1-2.7-6.5-7.3-6.5c-4.4,0-7.3,2.5-7.3,6.3C49.2,234.4,52.3,237.1,56.5,237.1z M56.4,180.4	c8.9,0,14.9,6.5,14.9,16.4c0,9.5-6.3,16.4-14.9,16.4c-8.6,0-14.9-6.9-14.9-16.6C41.6,187,47.7,180.4,56.4,180.4z M56.5,203.1	c4.1,0,7.3-2.6,7.3-6.2c0-4.1-2.7-6.5-7.3-6.5c-4.4,0-7.3,2.5-7.3,6.3C49.2,200.4,52.3,203.1,56.5,203.1z M28.6,178.6v-9.7h41.8v9.7	H28.6z M42.6,167.4v-3.9H38c-7,0-10-3.1-10-10.6c0-1.4,0.1-2.4,0.5-4.1h7.4c-0.3,1-0.4,1.5-0.4,2.1c0,2,1.2,2.8,4.1,2.8h3.1v-5H50	v5.1h20.3v9.7H50v3.9H42.6z"/></svg>