jekyll-theme-pirati 4.1.0 → 4.2.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: a76681b55f0517b6487380c2a8ace87ab35a62cabfe18a1d7ba5b9e767744a6f
-  data.tar.gz: ecb4ed49364f3466b6801748db3e614d7e9f33911d5bae06bfe83b8ea698a6a6
+  metadata.gz: fd30e980264ac27fb9a665e08b9022ae7e2f03312ed75749ff918edeaae5be86
+  data.tar.gz: 56cbea99cd4923ebd38b69a8c1e1bdfb3aa43a4708aa81a651101bec2a094aed
 SHA512:
-  metadata.gz: 026c997a91a7a13a98d1efec9862aba3dfea22b20976cc8a9061997e0747197714f159868ffb01344281c9dbe0a6afda35bdab8a030aac4aa74870130de0af26
-  data.tar.gz: 5dd3d87282e7afe3a59a9dd9428532fb215be3545c4b01a0dab1efa60da2a973c6abea53544e5ba11350f6b461363ed32770460cd49449f4b4013ade6e07ccdf
+  metadata.gz: 6a32ff91ebcc3960819c900faf768fcb7dc0d7633cab16b602f63b59c5801337651ebf786201726ad329c2e9ab520a239dcff5fcc77382483c570a89a0f7bed3
+  data.tar.gz: 4c935297f2f739d34a6351a6e07ed779fd76cc245f24bfc0fb61a16640990795a953d7938e5fabd965f9394dd2b45c3c2943a0a2c5d64e8d8f74e4a1d7099478

data/_data/menu.yml

@@ -20,27 +20,12 @@ main:
     name: Komunální volby
     match: komunalni-volby
     submenu:
-        - link: /komunalni-volby/praha2018
-          name: Program na radnici
-          match: radnice
-        - link: /komunalni-volby/senat
-          name: Senát
-          match: senat
-campaigns:
-  - title: Program na radnici
-    category: praha2018
-    candidates:
-      - prvni.leader
-      - mistni.predseda
-      - jakub.pirat
-      - aktivni.priznivec
-  - title: Senát
-    category: senat
-    candidates:
-      - jakub.pirat
-  - link: /kontakt/
-    name: Kontakt
-    match: kontakt
+      - link: /komunalni-volby/praha2018
+        name: Program na radnici
+        match: radnice
+      - link: /komunalni-volby/senat
+        name: Senát
+        match: senat
 
 bottom:
   - class: small-12 medium-4

data/_includes/articles/horizontal-article.html

@@ -3,7 +3,7 @@
 
   <div class="c-article-listing__row">
     <div class="c-article-listing__photobox">
-      <div itemprop="image" itemtype="http://schema.org/ImageObject" class="c-article-listing__image" itemscope="">
+      <div itemprop="image" itemtype="http://schema.org/ImageObject" class="c-article-listing__image {% if include.article.youtubeVideoId %}c-article-listing__image--videoicon{% endif %}" itemscope="">
         {% capture imgPath %}{% asset '{{ include.article.image }}' magick:resize="348x232^" magick:gravity='center' magick:crop='348x232+0+0' @path %}{% endcapture %}
         <a href="{{ include.article.url | relative_url }}">
           <img src="{{ imgPath }}" alt="{{ include.article.title }}">

data/_includes/articles/vertical-article.html

@@ -4,7 +4,7 @@
 
   <div class="c-article-listing__photobox">
     <a href="{{ include.article.url | relative_url }}">
-      <div itemprop="image" itemtype="http://schema.org/ImageObject" class="c-article-listing__image" itemscope="">
+      <div itemprop="image" itemtype="http://schema.org/ImageObject" class="c-article-listing__image {% if include.article.youtubeVideoId %}c-article-listing__image--videoicon{% endif %}" itemscope="">
         {% capture imgPath %}{% asset '{{ include.article.image }}' magick:resize='751x422^' magick:gravity='center' magick:crop='751x422+0+0' @path %}{% endcapture %}
         <img src="{{ imgPath }}" alt="{{ include.article.title }}">
         <meta itemprop="url" content="{{ imgPath }}">

data/_includes/headline-media.html

@@ -0,0 +1,17 @@
+<div class="o-section-block o-section-block-fill">
+  <div class="c-headline-media">
+    {% capture imgPath %}{% asset '{{ include.image }}' magick:resize='751x422^' magick:gravity='center' magick:crop='751x422+0+0' @path %}{% endcapture %}
+    <div class="c-headline-media__background" style="background-image: url({{ imgPath }})"></div>
+    <div class="row c-headline-media__body">
+      <div class="small-12 columns">
+        {% comment %}If youtube video id is provided, it takes precendece over the image{% endcomment %}
+        {%- if include.youtubeVideoId %}
+          {% include youtube.html width=751 height=422 id=include.youtubeVideoId %}
+        {% else %}
+          <img src="{{ imgPath }}" alt="{{ include.title }}">
+        {%- endif %}
+      </div>
+    </div>
+
+  </div>
+</div>

data/_includes/js/main.html

@@ -2,9 +2,9 @@
 This whole include will be overwritten by built JS files when publishing the
 theme Gem.
 {% endcomment %}
-<link rel="stylesheet" href="/assets/js/main.7e1dba7862b243eb382c.css" />
-<script src="/assets/js/0.main.7e1dba7862b243eb382c.js"></script>
-<script src="/assets/js/main.7e1dba7862b243eb382c.js"></script>
+<link rel="stylesheet" href="/assets/js/main.3dd297e4b94da9cfc686.css" />
+<script src="/assets/js/0.main.3dd297e4b94da9cfc686.js"></script>
+<script src="/assets/js/main.3dd297e4b94da9cfc686.js"></script>
 
 {% if site.facebook.loadSDK %}
 <script>

data/_includes/page-header.html

@@ -6,7 +6,7 @@
   </div>
   {% if include.content %}
     <div class="columns large-12">
-      {{ content }}
+      {{ include.content }}
     </div>
   {% endif %}
 </div>

data/_includes/submenu.html

@@ -1,26 +1,23 @@
 {% for menu in site.data.menu.main %}
-{% if page.url contains menu.match %}
-{% if menu.submenu %}
-<nav class="c-top-sub-nav u-center-860-down">
-    <div class="row">
-        <div class="c-top-sub-nav-inner">
-            <div class="u-cf">
-                <div class="c-top-sub-nav-header">
-                    <div class="c-top-sub-nav__heading"> {{menu.name}} </div>
-                </div>
-                <div class="c-top-sub-nav-divider"></div>
-                <ul class="c-top-sub-nav-items">
-
-                    {% for submenu in menu.submenu %}
-                    <li class="c-top-sub-nav__item">
-                        <a href="{{ submenu.link }}"> {{submenu.name}} </a>
-                    </li>
-                    {% endfor %}
-                </ul>
+  {% if page.url contains menu.match %}
+    {% if menu.submenu %}
+      <nav class="c-top-sub-nav">
+        <div class="row">
+          <div class="c-top-sub-nav-inner columns">
+            <div class="c-top-sub-nav__header">
+              <h2 class="c-top-sub-nav__heading">{{ menu.name }}</h2>
             </div>
+            <div class="c-top-sub-nav-divider"></div>
+            <ul class="c-top-sub-nav-items">
+              {% for submenu in menu.submenu %}
+              <li class="c-top-sub-nav__item {% if page.url contains submenu.match %}c-top-sub-nav__item--active{% endif %}">
+                <a href="{{ submenu.link }}">{{ submenu.name }} </a>
+              </li>
+              {% endfor %}
+            </ul>
+          </div>
         </div>
-    </div>
-</nav>
-{% endif %}
-{% endif %}
+      </nav>
+    {% endif %}
+  {% endif %}
 {% endfor %}

data/_layouts/blank-article.html

@@ -0,0 +1,20 @@
+---
+layout: default
+---
+
+<div class="row">
+  <div class="medium-12 {% unless page.rbar == empty or page.rbar == blank or page.rbar == nil %} large-8{% endunless %} columns">
+
+    <!-- Article -->
+    <article itemtype="http://schema.org/BlogPosting" itemscope="">
+      <link itemprop="mainEntityOfPage" href="{{ page.url }}">
+      {{ content }}
+    </article>
+    <!-- /Article -->
+  </div>
+  {% unless page.rbar == empty or page.rbar == blank or page.rbar == nil %}
+  <div class="medium-12 large-4 columns">
+    {% include right-bar/rbar.html %}
+  </div>
+  {% endunless %}
+</div>

data/_layouts/{komunalni-volby.html → communal-elections.html}

@@ -1,26 +1,21 @@
 ---
-layout: page
+layout: blank-article
 ---
-{% assign candidates = site.kandidatka | where: "uid", page.candidateList | first %}
-{% assign programCategories = site.program | where: "campaignCategoryUid", page.campaignCategoryUid | sort:"order" %}
 
-{% if candidates.number %}
-<div class="row u-stacked">
-  <div class="columns">
-  <div class="c-tile c-tile--inverted c-tile--fill">
-    <div class="c-tile__body u-center">
-      <h1 class="u-0margin">Volte číslo {{ candidates.number }}!</h1>
-    </div>
-  </div>
-  {% comment %}
-  Tohle bych tělo ještě tučněji, nějak s tím víc graficky pracovat.
-  {% endcomment %}
-  </div>
-</div>
-{% endif %}
+<div class="c-corner-ribbon-container">
+  {% assign candidates = site.candidatelists | where: "uid", page.candidateListUid | first %}
+  {% assign programCategories = site.program | where: "campaignCategoryUid", page.campaignCategoryUid | sort:"order" %}
 
-<div class="row u-stacked">
-  <div class="columns">{{ content }}</div>
+  {% capture headline %}{{ page.title }}{% if candidates.number %}<span class="t-subheader u-1margin--left">&raquo; volte č. {{ candidates.number }} &laquo;</span>{% endif %}{% endcapture %}
+  {% capture headerContent %}
+    <div class="c-emphasized-text">{{ content }}</div>
+  {% endcapture %}
+
+  {% if candidates.number %}
+    <div class="c-corner-ribbon c-corner-ribbon--top-right">Volte č. {{ candidates.number }}!</div>
+  {% endif %}
+
+  {% include page-header.html headline=headline content=headerContent %}
 </div>
 
 <div class="o-section">
@@ -95,3 +90,4 @@ layout: page
     </div>
   </div>
 </div>
+

data/_layouts/page.html

@@ -1,21 +1,6 @@
 ---
-layout: default
+layout: blank-article
 ---
 
-<div class="row">
-  <div class="medium-12 {% unless page.rbar == empty or page.rbar == blank or page.rbar == nil %} large-8{% endunless %} columns">
-
-    <!-- Article -->
-    <article itemtype="http://schema.org/BlogPosting" itemscope="">
-      <link itemprop="mainEntityOfPage" href="{{ page.url }}">
-      {% capture headline %}{% if page.fullname %}{{ page.fullname }}{% else %}{{ page.title }}{% endif %}{% endcapture %}
-      {% include page-header.html headline=headline content=content %}
-    </article>
-    <!-- /Article -->
-  </div>
-  {% unless page.rbar == empty or page.rbar == blank or page.rbar == nil %}
-  <div class="medium-12 large-4 columns">
-    {% include right-bar/rbar.html %}
-  </div>
-  {% endunless %}
-</div>
+{% capture headline %}{% if page.fullname %}{{ page.fullname }}{% else %}{{ page.title }}{% endif %}{% endcapture %}
+{% include page-header.html headline=headline content=content %}

data/_layouts/post.html

@@ -49,7 +49,7 @@ layout: default
   </div>
 
   {% if page.image %}
-    {% include headline-image.html image=page.image title=page.title %}
+    {% include headline-media.html image=page.image title=page.title youtubeVideoId=page.youtubeVideoId %}
   {% endif %}
 
   <div class="row o-section-block">

data/_sass/_settings.scss

@@ -56,7 +56,7 @@ $foundation-palette: (
   alert: #cc0303,
   dark: #343434
 );
-$light-gray: #e6e6e6;
+$light-gray: #f3f3f3;
 $medium-gray: #cacaca;
 $dark-gray: #8a8a8a;
 $black: #0a0a0a;

data/_sass/components/article-listing.scss

@@ -49,3 +49,22 @@
     max-width: none;
   }
 }
+
+.c-article-listing__image--videoicon {
+  position: relative;
+
+  &:before {
+    content: '\f144';
+    position: absolute;
+    width: 90px;
+    height: 130px;
+    top: 50%;
+    left: 50%;
+    margin-top: -65px;
+    margin-left: -45px;
+    font-family: 'FontAwesome';
+    font-size: 100px;
+    color: $secondary-color;
+    opacity: .85;
+  }
+}

data/_sass/components/corner-ribbon.scss

@@ -0,0 +1,24 @@
+.c-corner-ribbon-container {
+  position: relative;
+  overflow: hidden;
+}
+
+.c-corner-ribbon {
+  width: 200px;
+  background: $primary-color;
+  position: absolute;
+  top: 25px;
+  left: -50px;
+  text-align: center;
+  line-height: 50px;
+  letter-spacing: 1px;
+  color: $secondary-color;
+  transform: rotate(-45deg);
+}
+
+.c-corner-ribbon--top-right {
+  top: 25px;
+  right: -50px;
+  left: auto;
+  transform: rotate(45deg);
+}

data/_sass/components/{headline-image.scss → headline-media.scss}

@@ -3,10 +3,11 @@
  * with a stretched image. Over that the image in normal dimensions is shown.
  */
 
-.c-headline-image {
+.c-headline-media {
   position: relative;
   min-height: 420px;
   background: $secondary-color;
+  z-index: 1;
 
   @include breakpoint(medium down) {
     min-height: 250px;
@@ -18,27 +19,23 @@
   }
 }
 
-.c-headline-image__background {
-  margin: 0;
-  cursor: pointer;
-  overflow: hidden;
+.c-headline-media__background {
+  z-index: -1;
+  width: 100%;
+  height: 100%;
+  min-height: 100%;
   position: absolute;
-  top: 0;
-  right: 0;
-  bottom: 0;
-  left: 0;
+  background-position: center;
+  background-repeat: no-repeat;
+  background-size: cover;
+  opacity: .15;
+}
+
+.c-headline-media__body {
+  z-index: 1;
 
-  img {
-    min-width: 100%;
-    min-height: 100%;
-    position: absolute;
-    top: -100%;
-    right: -100%;
-    bottom: -100%;
-    left: -100%;
-    margin: auto;
-    opacity: 0.1;
-    user-select: none;
-    cursor: default;
+  // fixes overflow
+  iframe {
+    float: left;
   }
 }

data/_sass/components/top-sub-nav.scss

@@ -1,59 +1,18 @@
 $tsb-ns: '';
 
 nav.#{$tsb-ns}c-top-sub-nav {
-  background: #f3f3f3;
+  background: $light-gray;
 }
 
 .#{$tsb-ns}c-top-sub-nav .#{$tsb-ns}c-top-sub-nav-inner {
-  position: relative;
-  padding: 45px 2rem;
+  display: flex;
+  padding-top: 2rem;
+  padding-bottom: 2rem;
   overflow-y: hidden;
 
-  &:before {
-    content: '';
-    position: absolute;
-    display: block;
-    width: 335px;
-    height: 150px;
-    // background: url('../img/miscellaneous/vbox.png') no-repeat;
-    bottom: -20px;
-    right: 10px;
-  }
-
   @include breakpoint(mobile down) {
-    padding: 35px 1.25rem;
-  }
-
-  @include breakpoint(medium down) {
-
-    &:before {
-      right: 20px;
-    }
-
-  }
-
-  @include breakpoint(860px down) {
-    padding-bottom: 130px;
-
-    &:before {
-      transform: translateX(50%);
-      right: 50%;
-      bottom: 0;
-    }
-  }
-
-  &:after {
-    content: '';
-    display: block;
-    position: absolute;
-  }
-}
-
-.#{$tsb-ns}c-top-sub-nav .#{$tsb-ns}c-top-sub-nav-header {
-  display: inline-block;
-
-  @include breakpoint(860px down) {
-    display: block;
+    text-align: center;
+    flex-direction: column;
   }
 }
 
@@ -61,10 +20,11 @@ nav.#{$tsb-ns}c-top-sub-nav {
   font-size: 1.5rem;
   font-weight: 500;
   font-family: $header-font-family;
+  margin: 0;
 }
 
 .#{$tsb-ns}c-top-sub-nav .#{$tsb-ns}c-top-sub-nav-divider {
-  margin: 10px auto;
+  margin: 0 2rem;
 
   &:before {
     content: '\f105';
@@ -72,115 +32,44 @@ nav.#{$tsb-ns}c-top-sub-nav {
     font-size: 1.3rem;
   }
 
-  @include breakpoint(800px) {
-    display: inline-block;
-    width: 1px;
-    height: 22px;
-    margin: auto 30px;
-    vertical-align: baseline;
-  }
-
-  @include breakpoint(860px down) {
+  @include breakpoint(mobile down) {
     display: block;
-    margin: 10px auto;
 
     &:before {
       content: '\f107';
       margin-left: -7px;
     }
   }
-
-  @include breakpoint(mobile down) {
-    margin: 0px auto;
-  }
 }
 
-.#{$tsb-ns}c-top-sub-nav .#{$tsb-ns}c-top-sub-nav-items {
-  display: inline-block;
+.#{$tsb-ns}c-top-sub-nav-items {
   list-style-type: none;
   margin-left: 0;
   margin-bottom: 0;
-
-  @include breakpoint(800px down) {
-    display: block;
-  }
-
 }
 
-.#{$tsb-ns}c-top-sub-nav .#{$tsb-ns}c-top-sub-nav-items.#{$tsb-ns}c-top-sub-nav-items--bigLh {
-
-  @include breakpoint(mobile down) {
-    line-height: 2;
-  }
-
-}
-
-.#{$tsb-ns}c-top-sub-nav .#{$tsb-ns}c-top-sub-nav__item {
+.#{$tsb-ns}c-top-sub-nav__item {
   display: inline-block;
   margin-left: 0;
   font-size: 1.15rem;
 
   a {
-    color: #0a0a0a;
     text-decoration: underline;
   }
 
-  a:hover {
-    text-decoration: none;
-  }
-
-}
-
-.#{$tsb-ns}c-top-sub-nav {
-
-  @include breakpoint(medium) {
-
-    .#{$tsb-ns}c-top-sub-nav__item +
-    .#{$tsb-ns}c-top-sub-nav__item {
-      margin-left: 25px;
-    }
-
-    .#{$tsb-ns}c-top-sub-nav__item.#{$tsb-ns}c-top-sub-nav__item--smallerSpace +
-    .#{$tsb-ns}c-top-sub-nav__item.#{$tsb-ns}c-top-sub-nav__item--smallerSpace {
-      margin-left: 12px;
-    }
-
-  }
-
-  @include breakpoint(820px down) {
-
-    .#{$tsb-ns}c-top-sub-nav__item +
-    .#{$tsb-ns}c-top-sub-nav__item {
-      margin-left: 20px;
-    }
-
-    .#{$tsb-ns}c-top-sub-nav__item.#{$tsb-ns}c-top-sub-nav__item--smallerSpace +
-    .#{$tsb-ns}c-top-sub-nav__item.#{$tsb-ns}c-top-sub-nav__item--smallerSpace {
-      margin-left: 10px;
-    }
-
-  }
-
-}
-
-.#{$tsb-ns}c-top-sub-nav .#{$tsb-ns}c-top-sub-nav__section {
-  display: inline-block;
-  font-weight: bold;
-  vertical-align: middle;
-
   @include breakpoint(mobile down) {
     display: block;
   }
-
 }
+.#{$tsb-ns}c-top-sub-nav__item +
+.#{$tsb-ns}c-top-sub-nav__item {
+  margin-left: 2rem;
 
-.#{$tsb-ns}c-top-sub-nav .#{$tsb-ns}c-top-sub-nav__item {
-
-  a:hover .#{$tsb-ns}c-top-sub-nav__itemDescription {
-    text-decoration: underline;
+  @include breakpoint(medium down) {
+    margin-left: 1rem;
   }
 
-  .#{$tsb-ns}c-top-sub-nav__itemDescription {
-    margin-left: 5px;
+  @include breakpoint(mobile down) {
+    margin: 0;
   }
 }