jekyll-theme-isotc211 0.2.4 → 0.3

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 5a04026c63161ab6aa4de91d5bfcc66af255768d01929389bfd0c17dd9e921fd
-  data.tar.gz: db98e5f06a93993b44ff42efd6cb0d92cdbf8b0f6b90e1c1980137756ea6d58a
+  metadata.gz: e9ea16ec48f64dc0ddfa05644d0773f34228fcea9d155d50594daf5285adf8f4
+  data.tar.gz: c81df5f9596a7ed860cc2dc80f6d979fa54f3b4fa1c624619e4baf9d2c067b29
 SHA512:
-  metadata.gz: 6b1ddde92e284495f2f27a9cc98262a04452b63d12ac1d04f39e426465c3a4bb32084e4aefc54241374532ede5af98db74fb86594dfed0ba79312ef9a0d518e6
-  data.tar.gz: 83b9e5e18a3a8d7cb6988049bf8248b2a714c8b88f3c95f3f9089cb08ab4bd4c4939af4eac698631428b27bef63bf8573ca7dd724df17bb353aba3a4b4a5cbed
+  metadata.gz: 0f9066da821978a383e0a06984ba30d0ec7b0f55cbc155c64f651b93ff6fb477bffe77ee532a30c276ceefb019562ca7514bcc61c73f502898e228d5acf8dc7c
+  data.tar.gz: 02babca920bd2532fc7f27077f5bc7a2b17010a6a00e1a8e2b26a127a6bae41841027f6758b9acfcafa99fa64819cf9952ca01a9ebb1beb7edb48e6f33ec5123

data/_includes/newsroll-entry.html

@@ -0,0 +1,17 @@
+<article class="
+    news-item-card
+    {% if post.illustration %}news-item--with-illustration{% endif %}">
+
+  {% if post.illustration %}
+    <a class="illustration-container" href="{{ post.url | relative_url }}">
+      <img src="{{ post.illustration | relative_url }}">
+    </a>
+  {% endif %}
+
+  <h3 class="title"><a href="{{ post.url | relative_url }}">{{ post.title }}</a></h3>
+
+  <div class="meta">{{ post.date | date: '%B %d, %Y' }}</div>
+
+  <div class="excerpt">{{ post.excerpt }}</div>
+
+</article>

data/_layouts/default.html

@@ -43,6 +43,15 @@
       {{ content }}
     </main>
 
+    {% if site.awards %}
+      <p class="awards">
+        Winner of 
+        {% for award in site.awards %}
+          <span class="award"><a href="{{ award.path }}"
+            >{{ award.title }}</a>{%- unless forloop.last -%}, {% endunless %}</span>{% endfor %}.
+      </p>
+    {% endif %}
+
     <footer>
       <ul role="nav">
         {% for link in site.social.links %}

data/_layouts/home.html

@@ -13,20 +13,7 @@ bodyClass: home
 
     <div class="items">
       {% for post in site.posts %}
-
-        <article class="
-            news-item-card
-            {% if post.illustration %}news-item--with-illustration{% endif %}">
-
-          {% if post.illustration %}
-            <div class="illustration-container">
-              <img src="{{ post.illustration | relative_url }}">
-            </div>
-          {% endif %}
-
-          <h3 class="title"><a href="{{ post.url | relative_url }}">{{ post.title }}</a></h3>
-          <div class="excerpt">{{ post.excerpt }}</div>
-        </article>
+        {% include newsroll-entry.html %}
       {% endfor %}
     </div>
   </section>

data/_layouts/post.html

@@ -6,7 +6,7 @@ bodyClass: post
 
 <h2>{{ page.title }}</h2>
 
-<p>{{ page.date | date: '%B %d, %Y' }}</p>
+<p class="meta">{{ page.date | date: '%B %d, %Y' }}</p>
 
 {% if page.illustration %}
   <div class="illustration">

data/_sass/home.scss

@@ -13,11 +13,10 @@ body.home {
     > .news {
 
       // Assuming it goes right before footer
-      box-shadow: 0 5px 20px -10px silver inset;
-      border-bottom: 0;
       flex: 1;
-      background: whitesmoke;
-      margin-top: 1em;
+      border-bottom: 0;
+      background: $headerFooterBackgroundColor;
+      box-shadow: 0 5px 20px -10px $mainShadowColor inset;
 
       .items {
         display: flex;
@@ -25,14 +24,17 @@ body.home {
         justify-content: flex-start;
         align-items: stretch;
         overflow-y: auto;
-        margin-bottom: 1em;
+        padding-top: 1em;
+        padding-bottom: 1em;
       }
+
       .news-item-card {
         max-width: 90vw;
         border-radius: .5em;
-        padding: 0 .75em;
+        padding: 0 $homeSectionItemSidePadding;
         background: #fff;
         margin-right: 1em;
+        box-shadow: 1px 1px 20px -5px rgba(black, 0.3);
 
         min-width: 320px;
         @media screen and (min-width: $bigscreenBreakpoint) {
@@ -43,13 +45,14 @@ body.home {
         &.news-item--with-illustration {
           position: relative;
 
-          .title, .excerpt {
+          .title, .excerpt, .meta {
             margin-left: 155px;
           }
 
           .illustration-container {
             position: absolute;
             top: 0; left: 0; bottom: 0;
+            display: block;
             width: 155px;
             overflow: hidden;
 
@@ -67,11 +70,19 @@ body.home {
 
         .title {
           font-weight: normal;
+          margin-top: .75em;
+          margin-bottom: .4em;
+
           a {
             text-decoration: none;
           }
         }
 
+        .meta {
+          font-size: 80%;
+          color: lighten($textColor, 50);
+        }
+
         div.excerpt p {
           font-size: 90%;
           line-height: 1.6;

data/_sass/jekyll-theme-isotc211.scss

@@ -5,11 +5,18 @@ $bigscreenBreakpoint: 900px;
 $logoOffset: 112px;
 $logoSize: 100px;
 
+$isoTCColor: #0f6db3;
 $textColor: black;
 
-$linkColor: blue;
+$mainShadowColor: rgba(black, 0.4);
+$headerFooterBackgroundColor: rgba(black, 0.05);
+$mainSectionBackgroundColor: rgba(white, 0.8);
+
+$linkColor: $isoTCColor;
 $linkColorInverse: white;
 
+$homeSectionItemSidePadding: 1em;
+
 @mixin titleFontFamily($useBold: false) {
   font-family: 'Tienne', Georgia, serif;
 
@@ -26,6 +33,17 @@ body {
   font-family: $bodyFontFamily;
 }
 
+a {
+  &:link, &:visited, &:hover {
+    color: inherit;
+  }
+}
+main a {
+  &:link, &:visited, &:hover {
+    color: $linkColor;
+  }
+}
+
 input, textarea, button {
   font-size: inherit;
   font-family: inherit;
@@ -43,17 +61,8 @@ html {
   text-transform: uppercase;
   flex-shrink: 0;
   margin-top: 0;
+  margin-bottom: 0;
   position: relative;
-
-  @media screen and (min-width: $bigscreenBreakpoint) {
-    &:before {
-      position: absolute;
-      width: 112px;
-      left: -112px;
-      text-align: center;
-      content: "⧐";
-    }
-  }
 }
 
 @import 'offsets';

data/_sass/main.scss

@@ -33,8 +33,20 @@ body > main > .section {
   }
 }
 
+body > main,
+body.home > main > section,
+body.home > main > .section {
+  background: $mainSectionBackgroundColor;
+}
+
+body.home > main {
+  background: transparent;
+}
+
 body {
-  $footerH: $logoSize + 20px;
+  $footerLogoSize: 60px;
+  $footerH: $footerLogoSize + 20px;
+  $footerPoweredByLogoWidth: 100px;
 
   flex: 1;
 
@@ -43,29 +55,34 @@ body {
   align-items: stretch;
   margin-bottom: -$footerH;
 
+  background: linear-gradient(90deg, $isoTCColor 30px, transparent 20px);
+
+  > .awards {
+    color: grey;
+    margin: 0;
+    padding: 1em 15vw;
+    background: rgba(black, 0.1);
+    font-size: 80%;
+  }
+
   > footer {
     flex-shrink: 0;
     font-size: 90%;
     line-height: 1.6;
 
-    background: whitesmoke;
-    box-shadow: 0 5px 20px -10px silver inset;
+    background: $headerFooterBackgroundColor;;
+    box-shadow: 0 5px 20px -10px $mainShadowColor inset;
 
     padding-top: 1em;
 
-    @media screen and (min-width: $bigscreenBreakpoint) {
-      height: $footerH;
-      padding-top: 0;
-    }
-
     .logo {
       width: $logoOffset;
       margin-left: 0;
       display: inline-block;
 
       img {
-        width: $logoSize;
-        height: $logoSize;
+        width: $footerLogoSize;
+        height: $footerLogoSize;
         vertical-align: middle;
       }
     }
@@ -82,7 +99,7 @@ body {
       }
 
       img {
-        width: $logoSize;
+        width: $footerPoweredByLogoWidth;
         display: block;
       }
     }
@@ -110,11 +127,14 @@ body {
 
     @media screen and (min-width: $bigscreenBreakpoint) {
       display: flex;
-      flex-flow: row nowrap;
+      flex-flow: row wrap;
       align-items: center;
       justify-content: flex-end;
 
-      > * {
+      height: $footerH;
+      padding-top: 0;
+
+      .powered-by {
         margin-left: 2em;
       }
     }
@@ -122,12 +142,11 @@ body {
 
   > header {
     flex-shrink: 0;
-    background: whitesmoke;
-    margin-bottom: 1em;
-    padding-top: 0;
+    padding-top: .5em;
     padding-bottom: .5em;
 
-    box-shadow: 0 -5px 20px -10px silver inset;
+    background: $headerFooterBackgroundColor;
+    box-shadow: 0 -5px 20px -10px $mainShadowColor inset;
 
     .site-headline {
       .parent-org-reference {

data/_sass/offsets.scss

@@ -16,7 +16,7 @@ body > footer {
 
   // Hanging logo on the right
   @media screen and (min-width: $bigscreenBreakpoint) {
-    padding: 0 calc(#{$sideOffsetBase} - #{$logoOffset}) 0 calc(#{$sideOffsetBase} - 1em);
+    padding: 0 calc(#{$sideOffsetBase} - #{$logoOffset}) 0 $sideOffsetBase;
   }
 }
 
@@ -32,7 +32,7 @@ body.home > main  {
 body.home > main > .news {
   .items {
     .news-item-card:first-child {
-      margin-left: calc(#{$sideOffsetBase} - .75em);
+      margin-left: calc(#{$sideOffsetBase} - #{$homeSectionItemSidePadding});
     }
   }
 }

data/_sass/post.scss

@@ -1,6 +1,17 @@
 body.post {
   > main {
-    margin-bottom: 1em;
+    padding-bottom: 1em;
+  }
+
+  .meta {
+    color: lighten($textColor, 50);
+    margin-bottom: 2em;
+  }
+
+  h2 {
+    margin-bottom: 0;
+    font-weight: normal;
+    font-size: 200%;
   }
 
   .illustration {

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: jekyll-theme-isotc211
 version: !ruby/object:Gem::Version
-  version: 0.2.4
+  version: '0.3'
 platform: ruby
 authors:
 - Ribose Inc.
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2019-03-22 00:00:00.000000000 Z
+date: 2019-03-24 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: jekyll
@@ -135,6 +135,7 @@ files:
 - _includes/copyright.html
 - _includes/google-analytics.html
 - _includes/head.html
+- _includes/newsroll-entry.html
 - _includes/script.html
 - _layouts/default.html
 - _layouts/home.html