futuro 0.4.6 → 0.4.7

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 299a2dbb3e4c1d032ba75795f89a8bc7beeea15a5fb68b32f725e05af7e82d6f
-  data.tar.gz: 49d6a26460e153e32780f608a7d706c67592108ec8b7208cb752267149231c4a
+  metadata.gz: 3215c29030687df9ad178780991366de9c9cf45665aa5518d3bf18673c7e7c34
+  data.tar.gz: 6da57dc76450efb0c4e5fe2f7fd880e38148ba15a25e9fbfde34a5f7abb8217b
 SHA512:
-  metadata.gz: 763c781cf07746e8e2ff849739ff4a465a3c30f0d4bb98b9dd39fb7a1b162259b5bba96d1d13993a05c87a4213f6ffb8fe0b63df1f60c5dab0638593c8874ae8
-  data.tar.gz: df78ba0699041ab6b8b314982b72b3a897b313307e9046d58066cd4f1ef2853d86d2007cb90c714e5dca6b3cb7cef300b43c2b80be479049f3354d530a6d8449
+  metadata.gz: 7e3c13fd49e81f17594f983cb9ad557804be52a574b09ad7aae249a30c55f1da8895ef4e382b2c998c917158543df6c58703a2ce7db8d502061f008c2a3089e0
+  data.tar.gz: 7c1b625700abe59f3e2fefc256b7ad92fb73f21ce0b81aaf5db4046957a87de617fb7df6309c66d42840be4b165518a70117e990ab92caf5c1a6975007a8de48

data/_includes/artwork/orwell/animal/flob.scss

@@ -0,0 +1,5 @@
+
+.thingo {
+  background-color: red;
+  min-height: 2rem;
+}

data/_includes/artwork/orwell/animal/waldo.scss

@@ -0,0 +1,45 @@
+.tag {
+  &-buttons {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    font-size: 11px;
+
+    span:not(.hidden) {
+      display: inline-block;
+      color: #767676;
+    }
+
+    .tag-buttons__title {
+      padding-right: 0.5em;
+    }
+  }
+
+  &-button {
+    @extend %bold;
+    letter-spacing: normal;
+    display: inline-block;
+    max-width: 30ch;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    transition: all 0.1s;
+    border: 1px solid #767676;
+    border-radius: 11.5px;
+    text-decoration: none;
+    text-transform: uppercase;
+    padding: 5px 10px;
+    margin: 0.25em 0.5em 0.25em 0;
+
+    &:hover {
+      border-color: black;
+      color: black;
+    }
+
+    @media (min-width: 768px) {
+      font-size: 11px;
+      line-height: 13px;
+      border-radius: 12.5px;
+    }
+  }
+}

data/_includes/html/head.liquid

@@ -3,12 +3,14 @@
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <meta name="format-detection" content="telephone=no">
-  <link rel="icon" href="{{ "/assets/img/favicon.png?v=1580493508997" | relative_url }}">
-  <link rel="stylesheet" href="{{ "/assets/css/styles.css?v=1580493508997" | relative_url }}">
+  <link rel="icon" href="{{ "/assets/css/favicon.png?v=1581004857774" | relative_url }}">
+  <link rel="stylesheet" href="{{ "/assets/css/styles.css?v=1581004857774" | relative_url }}">
   {% seo %}
   {% feed_meta %}
   {% include html/analytics.liquid %}
-  <script src="{{ "/assets/js/header/data.js?v=1580493508997" | relative_url }}"></script>
-  <script src="{{ "/assets/js/header.vendor.js?v=1580493508997" | relative_url }}"></script>
-  <script src="{{ "/assets/js/header.custom.min.js?v=1580493508997" | relative_url }}"></script>
+  <script type="text/javascript">
+    let Config = {{ site.setup | jsonify }};
+  </script>
+  <script src="{{ "/assets/js/futuro.header.legacy.js?v=1581004857774" | relative_url }}"></script>
+  <script src="{{ "/assets/js/futuro.header.custom.js?v=1581004857774" | relative_url }}"></script>
 </head>

data/_includes/html/overlay/about.liquid

@@ -1,5 +1,5 @@
 
-<h4 class="title _overlay-about">About</h4>
+<h4 class="title overlay about">About</h4>
 <p>These guidelines have been created by the Barbican Studio, which is the in-house design team at the Barbican Centre, London. The Studio creates most of the visual material for the Centre. It is based in the Marketing Department and consists of four permanent designers.</p>
 <p>The current structure of the design team was created in 2011 and coincides with a major rebranding project undertaken by North. The philosophy of the team is based on the visual guidelines North created at the time. These set out a flexible system influenced by the Centre’s vision of ‘arts without boundaries’ and includes strong visual elements that allow freedom and diversity.</p>
 <p>For further information contact <a class="lnk" href="mailto:design@barbican.org.uk?subject=Branding enquiry">design@barbican.org.uk</a></p>

data/_includes/html/overlay/browse.liquid

@@ -1,11 +1,11 @@
 
-<h4 class="title _overlay-browse">Browse</h4>
+<h4 class="title overlay browse">Browse</h4>
 
-<div class="block _browse {{ site.setup.type | prepend: 'setup-' }}">
+<div class="block browse {{ site.setup.type | prepend: 'setup-' }}">
 
-  <div class="col _browse --book">
+  <div class="col browse book">
 
-    <div class="block _browse-label --head">
+    <div class="block browse-label head">
       <p><strong>Book</strong></p>
     </div>
 
@@ -22,14 +22,14 @@
 
         {% if page.live %}
 
-          <div class="block _browse-lnk">
-            <a href="{{ url }}" class="lnk _browse-book book-{{ book }}">{{ title }}</a>
+          <div class="block browse-lnk">
+            <a href="{{ url }}" class="lnk browse-book book-{{ book }}">{{ title }}</a>
           </div>
 
           {% else %}
 
-          <div class="block _browse-lnk">
-            <a href="/" class="lnk _browse-book book-{{ book }} --draft">{{ title }}</a>
+          <div class="block browse-lnk">
+            <a href="/" class="lnk browse-book book-{{ book }} draft">{{ title }}</a>
           </div>
 
         {% endif %}
@@ -40,9 +40,9 @@
 
   </div>
 
-  <div class="col _browse --chapter">
+  <div class="col browse chapter">
 
-    <div class="block _browse-label --head">
+    <div class="block browse-label head">
       <p><strong>Chapter</strong></p>
     </div>
 
@@ -54,7 +54,7 @@
         {% assign label = page.label %}
         {% assign loop = site.[label] | sort: 'weight' %}
 
-        <div class="block _browse-chunk --{{ label }}">
+        <div class="block browse-chunk {{ label }}">
 
         {% for page in loop %}
           {% if page.type == 'chapter' %}
@@ -62,8 +62,8 @@
           {% assign chapter = page.chapter | replace: ' ','-' | downcase %}
           {% assign weight  = page.weight | slice: 0,3 %}
 
-          <div class="block _browse-lnk">
-            <a href="{{ page.url | replace: 'index','' }}" class="lnk _browse-chapter book-{{ book }} chapter-{{ chapter }}">{{ weight }} {{ page.chapter }}</a>
+          <div class="block browse-lnk">
+            <a href="{{ page.url | replace: 'index','' }}" class="lnk browse-chapter book-{{ book }} chapter-{{ chapter }}">{{ weight }} {{ page.chapter }}</a>
           </div>
 
           {% endif %}
@@ -77,9 +77,9 @@
   </div>
 
 
-  <div class="col _browse --page">
+  <div class="col browse page">
 
-    <div class="block _browse-label --head">
+    <div class="block browse-label head">
       <p>Page</p>
     </div>
 
@@ -91,13 +91,13 @@
       {% assign label = page.label %}
       {% assign loop = site.[label] | sort: 'weight' %}
 
-      <div class="block _browse-chunk --{{ label }}">
+      <div class="block browse-chunk {{ label }}">
 
         {% for page in loop %}
           {%- if page.type == 'chapter' -%}
             {% assign match = page.chapter | replace: ' ','-' %}
 
-            <div class="block _browse-chunk --{{ match | downcase }}">
+            <div class="block browse-chunk {{ match | downcase }}">
 
               {% for page in loop %}
 
@@ -111,8 +111,8 @@
                   {% assign title   = page.title | downcase | replace: ' ','-' %}
                   {% assign weight  = page.weight | slice: 0,5 %}
 
-                  <div class="block _browse-lnk">
-                    <a href="{{ page.url | replace: '.html','' }}" class="lnk _browse-page chapter-{{ chapter }} title-{{ title }}">{{ weight }} {{ page.title }}</a>
+                  <div class="block browse-lnk">
+                    <a href="{{ page.url | replace: '.html','' }}" class="lnk browse-page chapter-{{ chapter }} title-{{ title }}">{{ weight }} {{ page.title }}</a>
                   </div>
 
                   {% endunless %}

data/_includes/html/overlay/load.liquid

@@ -1,56 +1,51 @@
 
-<p class="title _overlay-load">loading</p>
+<p class="title overlay load">loading</p>
 
-<div class="box _load">
-  <div class="bar _load"></div>
+<div class="box load">
+  <div class="bar load"></div>
 </div>
 
 <script type="text/javascript">
 
-let SiteTl = gsap.timeline({
-  repeat:-1,
-  repeatDelay:0.3
-});
-
-function LoadAnim() {
-  let speed = 0.3,
-      title = '.title._overlay-load',
-      box   = '.box._load',
-      bar   = '.bar._load';
-
-      SiteTl
-      .set(title,{
-        fontFamily: "'FuturaBT-Bold', 'Helvetica Neue', sans-serif",
-        textTransform: "uppercase",
-        fontSize: "4.8rem",
-        color: "red"
-      })
-      .set(box,{borderColor: "red"})
-      .set(bar,{backgroundColor: "red"})
-      .set(title,{
-        fontFamily: "'FuturaBT-Book', 'Helvetica Neue', sans-serif",
-        textTransform: "none",
-        fontSize: "4.4rem",
-        color: "blue"
-      },"+=" + speed)
-      .set(box,{borderColor: "blue"})
-      .set(bar,{
-        backgroundColor: "blue",
-        width: "43%"
-      })
-      .set(title,{
-        fontFamily: "'FuturaBT-BookItalic', 'Helvetica Neue', sans-serif",
-        fontSize: "5.4rem",
-        color: "black"
-      },"+=" + speed)
-      .set(box,{borderColor: "black"})
-      .set(bar,{
-        backgroundColor: "black",
-        width: "93%"
-      })
-      ;
-}
+if (Overlay.load.active) {
+
+  var SiteTl = gsap.timeline({ repeat : -1, repeatDelay : Overlay.load.speed });
+
+  function LoadAnim() {
+    SiteTl
+    .set(Overlay.load.title,{
+      fontFamily: "'FuturaBT-Bold', 'Helvetica Neue', sans-serif",
+      textTransform: "uppercase",
+      fontSize: "4.8rem",
+      color: "red"
+    })
+    .set(Overlay.load.box,{borderColor: "red"})
+    .set(Overlay.load.bar,{backgroundColor: "red"})
+    .set(Overlay.load.title,{
+      fontFamily: "'FuturaBT-Book', 'Helvetica Neue', sans-serif",
+      textTransform: "none",
+      fontSize: "4.4rem",
+      color: "blue"
+    },"+=" + Overlay.load.speed)
+    .set(Overlay.load.box,{borderColor: "blue"})
+    .set(Overlay.load.bar,{
+      backgroundColor: "blue",
+      width: "43%"
+    })
+    .set(Overlay.load.title,{
+      fontFamily: "'FuturaBT-BookItalic', 'Helvetica Neue', sans-serif",
+      fontSize: "5.4rem",
+      color: "black"
+    },"+=" + Overlay.load.speed)
+    .set(Overlay.load.box,{borderColor: "black"})
+    .set(Overlay.load.bar,{
+      backgroundColor: "black",
+      width: "93%"
+    });
+  }
+
+  LoadAnim();
 
-LoadAnim();
+}
 
 </script>

data/_includes/html/overlay/mobile.liquid

@@ -1,6 +1,6 @@
 
-<h4 class="title _overlay --mobile">Too small</h4>
-<p class="copy _overlay --mobile">Browser needs to be <strong class="width"></strong> wider!</p>
-<div class="box _mobile">
-  <div class="bar _mobile"></div>
+<h4>Too small</h4>
+<p>Browser needs to be <strong class="width"></strong> wider!</p>
+<div class="box mobile">
+  <div class="bar mobile"></div>
 </div>

data/_includes/html/overlay/search.liquid

@@ -1,28 +1,32 @@
 
-<div class="title _overlay-search">
-  <input class="input _text --search" type="text" placeholder="Search">
+<div class="title overlay search">
+  <input class="input text search" type="text" placeholder="Search">
 </div>
 
-<div class="block _results"></div>
+<div class="block results"></div>
 
 <script>
+
+if (typeof Search != "undefined") {
   window.simpleJekyllSearch = new SimpleJekyllSearch({
-    searchInput: document.querySelector('.input.--search'),
-    resultsContainer: document.querySelector('.block._results'),
-    json: '/search.json',
+    searchInput: document.querySelector(Overlay.search.input),
+    resultsContainer: document.querySelector(Overlay.search.results),
+    json: Overlay.search.json,
     searchResultTemplate:
-    '<a href="/{url}" class="block _results-entry book-{book} chapter-{chapter}">
+    "<a href='/{url}' class='block results-entry book-{book} chapter-{chapter}'>
       <h1>{title}</h1>
-      <div class="block _results-info">
-        <div class="block _results-dot"></div>
+      <div class='block results-info'>
+        <div class='block results-dot'></div>
         <h5>{url}</h5>
       </div>
-    </a>',
+    </a>",
     noResultsText:
-    '<div class="block _results-entry --none">
+    "<div class='block results-entry none'>
       <h1>No results found</h1>
-    </div>',
+    </div>",
     fuzzy: true,
     limit: 5
   });
+}
+
 </script>

data/_includes/html/overlay.liquid

@@ -1,13 +1,16 @@
 
+{% assign title = include.title | downcase %}
+{% assign legacy = site.setup.legacy %}
+
 {% if include.state %}
-<div class="overlay{{ include.title | downcase | prepend: ' _' }}{% if include.demo %} --demo{% endif %}" style="{% if site.setup.legacy %} display: block; {% else %} display: grid; {% endif %}">
+<div class="area overlay {{ title }}{% if include.demo %} demo{% endif %}" style="{% if legacy %} display: block; {% else %} display: grid; {% endif %}">
 {% else %}
-<div class="overlay{{ include.title | downcase | prepend: ' _' }}{% if include.demo %} --demo{% endif %}">
+<div class="area overlay {{ title }}{% if include.demo %} demo{% endif %}">
 {% endif %}
   {% unless include.exit == 'false' %}
-  <div class="exit{{ include.title | downcase | prepend: ' _' }}"></div>
+  <div class="exit {{ title }}"></div>
   {% endunless %}
-    <div class="wrap _overlay{{ include.title | prepend: ' --' }}{% if include.demo %} --demo{% endif %}">
+    <div class="wrap overlay {{ title }}{% if include.demo %} demo{% endif %}">
       {% include html/overlay/{{ include.title }}.liquid %}
     </div>
 </div>

data/_includes/html/page/artwork.liquid

@@ -10,7 +10,7 @@
 {% assign img      = page.url | prepend: '/assets/img' %}
 {% assign vid      = page.url | prepend: '/assets/vid' %}
 
-<div class="area _page-artwork {{ setup }} {{ chapchap }} {{ titltitl }}">
+<div class="area page-artwork {{ setup }} {{ chapchap }} {{ titltitl }}">
 
   {%- unless site.setup.type == 'docs' -%}
 

data/_includes/html/page/info.liquid

@@ -1,7 +1,7 @@
 
-{% assign info    = page.type | prepend: '_' | append: '-info' %}
-{% assign chap    = page.type | prepend: '_' | append: '-chapter' %}
-{% assign weight  = page.type | prepend: '_' | append: '-weight' %}
+{% assign info    = page.type | append: '-info' %}
+{% assign chap    = page.type | append: '-chapter' %}
+{% assign weight  = page.type | append: '-weight' %}
 {% assign chapter = page.chapter | replace: ' ','-' | downcase %}
 {% assign bPath   = page.collection | prepend: '/svg/' %}
 {% assign cPath   = chapter | append: '/icon.svg' %}
@@ -16,7 +16,7 @@
 
   {%- if page.icon -%}
 
-    <div class="block _page-icon {{ chapter | prepend: '--'}}">
+    <div class="block page-icon {{ chapter }}">
       {% include {{ bPath }}/{{ cPath }} %}
     </div>
 

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

@@ -10,11 +10,11 @@
 
   {% include html/page/header.liquid %}
 
-      <div class="{{ split }} --left">
+      <div class="{{ split }} left">
         {% include html/page/title.liquid  %}
       </div>
 
-      <div class="{{ split }} --right">
+      <div class="{{ split }} right">
 
         <h2>
           {{ page.weight | slice: 0,3 }}

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

@@ -1,23 +1,25 @@
 
 {% assign loop = site.collections | sort: 'weight' %}
 
-<div class="wrap _home">
+<div class="wrap home">
   {% for book in loop %}
     {% assign title = book.label %}
+    {% assign url = title | prepend: '/' | append: '/' %}
+    {% assign svg = title | prepend: '/svg/site/book/' | append: '.svg' %}
 
     {% if book.live == true %}
-      <div class="area _book">
-        <div class="wrap _book">
-          <a class="lnk _book{{ title | prepend: ' --' }}" href="{{ title | prepend: '/' | append: '/' }}">
-            {% include {{ title | prepend: '/svg/site/book/' | append: '.svg' }} %}
+      <div class="area book">
+        <div class="wrap book">
+          <a class="lnk book {{ title }}" href="{{ url }}">
+            {% include {{ svg }} %}
           </a>
         </div>
       </div>
     {% elsif book.live == false %}
-      <div class="area _book">
-        <div class="wrap _book">
-          <div class="lnk _book --draft">
-            {% include {{ title | prepend: '/svg/site/book/' | append: '.svg' }} %}
+      <div class="area book">
+        <div class="wrap book">
+          <div class="lnk book draft">
+            {% include {{ svg }} %}
           </div>
         </div>
       </div>

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

@@ -3,7 +3,7 @@
 
   {%- if site.setup.type == 'docs' -%}
 
-    <div class="block _expand-title {{ page.collection | prepend: 'book-' }}">
+    <div class="block expand-title {{ page.collection | prepend: 'book-' }}">
 
       {% include html/page/title.liquid %}
 
@@ -13,11 +13,11 @@
 
   {% else %}
 
-    <div class="{{ split }} --left">
+    <div class="{{ split }} left">
 
       {% include html/page/title.liquid %}
 
-      <div class="block _page-content">
+      <div class="block page-content">
 
         {% include html/page/subtitle.liquid %}
 
@@ -31,7 +31,7 @@
 
     </div>
 
-    <div class="{{ split }} --right">
+    <div class="{{ split }} right">
 
       {% include html/page/artwork.liquid %}
 

data/_includes/html/page/title.liquid

@@ -1,6 +1,6 @@
 
-{% assign type    = page.type | prepend: '_' | append: '-title' %}
-{% assign setup   = site.setup.type | prepend: '--' %}
+{% assign type    = page.type | append: '-title' %}
+{% assign setup   = site.setup.type %}
 {% assign chapter = page.chapter | prepend: '<div>' | append: '</div>' %}
 {% assign cDivs   = chapter | split: ' ' | join: '</div><div>' %}
 
@@ -20,7 +20,7 @@
         {{ page.title }}
       </h5>
 
-      <div class="block _expand-block">
+      <div class="block expand-block">
         Show
       </div>
 

data/_includes/html/page/topbar.liquid

@@ -1,21 +1,21 @@
 
-<div class="area _topbar">
+<div class="area topbar">
 
-    <div class="nav _left">
-      <div class="btn _nav --about">
+    <div class="nav left">
+      <div class="btn nav about">
         {% include svg/site/btn/about.svg %}
       </div>
-      <div class="btn _nav --browse">
+      <div class="btn nav browse">
         {% include svg/site/btn/browse.svg %}
       </div>
     </div>
 
-    <div class="nav _main">
+    <div class="nav main">
       {% assign loop = site.collections | sort: 'weight' %}
       {% for page in loop %}
         {% if page.live %}
           <div>
-            <a class="lnk _nav --{{ page.label }}" href="/">
+            <a class="lnk nav {{ page.label }}" href="/">
               <strong>{{ page.label }}</strong>
             </a>
           </div>
@@ -23,14 +23,14 @@
       {% endfor %}
     </div>
 
-    <div class="nav _right">
-      <div class="btn _nav --cart" style="display:none;">
+    <div class="nav right">
+      <div class="btn nav cart" style="display:none;">
         {% include svg/site/btn/cart.svg %}
       </div>
-      <div class="btn _nav --count" style="display:none;">
+      <div class="btn nav count" style="display:none;">
         <strong>0</strong>
       </div>
-      <div class="btn _nav --search">
+      <div class="btn nav search">
         {% include svg/site/btn/search.svg %}
       </div>
     </div>

data/_includes/html/page/util.liquid

@@ -1,7 +1,7 @@
 
-{% assign type = page.type | prepend: '--' %}
+{% assign type = page.type %}
 
-<div class="block _util {{ type }}">
+<div class="block util {{ type }}">
 
 {% include html/page/utils/share.liquid %}
 

data/_includes/html/page/utils/author.liquid

@@ -1,5 +1,5 @@
 
-<div class="block _util-author">
+<div class="block util-author">
   {% include svg/site/btn/author.svg %}
   <p>By {{ page.author }}</p>
 </div>

data/_includes/html/page/utils/share.liquid

@@ -1,7 +1,7 @@
 
-{%- unless site.share == false -%}
+{%- unless site.share == "false" -%}
 
-  <div class="block _util-share {{ type }}">
+  <div class="block util-share {{ type }}">
 
     {% include svg/site/btn/share/{{ page.type }}.svg %}
 
@@ -11,7 +11,7 @@
       <p>Copy page</p>
     {%- endif -%}
 
-    <div class="block _util-url" onclick="copy(this)">{{ site.url }}{{ page.url | replace: '.html','' }}</div>
+    <div class="block util-url">{{ site.url }}{{ page.url | replace: '.html','' }}</div>
 
   </div>
 

data/_includes/html/page/utils/update.liquid

@@ -1,5 +1,5 @@
 
-<div class="block _util-update">
+<div class="block util-update">
   {% include svg/site/btn/update.svg %}
   <p>Updated {{ page.update | date: "%b %y" }}</p>
 </div>

data/_includes/html/scripts.liquid

@@ -1,3 +1,3 @@
 
-<script src="{{ "/assets/js/futuro.vendor.js?v=1580493508997" | relative_url }}"></script>
-<script src="{{ "/assets/js/futuro.custom.min.js?v=1580493508997" | relative_url }}"></script>
+<script src="{{ "/assets/js/futuro.footer.vendor.js?v=1581004857774" | relative_url }}"></script>
+<script src="{{ "/assets/js/futuro.footer.custom.js?v=1581004857774" | relative_url }}"></script>

data/_layouts/feed.html

@@ -22,7 +22,7 @@ layout: mini
     {% include html/overlay.liquid title='browse' %}
     {% include html/overlay.liquid title='search' %}
 
-    <div class="site _feed">
+    <div class="site feed">
 
       {% if site.header %}
       <header>

data/_layouts/single.html

@@ -31,7 +31,7 @@ layout: mini
         {% include html/overlay.liquid title='search' %}
       {% endunless %}
 
-    <div class="site{% if page.type == 'home' %} _full {% else %} _single{% endif %}">
+    <div class="site{% if page.type == 'home' %} full {% else %} single {% endif %}">
 
       {% if site.header %}
       <header>