jekyll-theme-pirati 7.6.1 → 8.0.0.pre.alpha2

data/_includes/contacts/residence.html

@@ -6,40 +6,26 @@
 {% endif  %}
 
 
-<div class="o-media">
-    {% if residence.residenceImg %}
-    	<div class="o-media__section">
-            {% asset '{{ residence.residenceImg }}' magick:resize='200x' alt='Sídlo' %}
-   	</div>
-    {% endif %}
-    <div class="o-media__section">
-	{% if residence.url %} 
-	    <a href="{{residence.url}}">
-               <h3 class="t-h5-super">{{ residence.name }}</h3>
-	    </a>
-        {% else  %}
-            <h3 class="t-h5-super">{{ residence.name }}</h3>
-        {% endif  %}
-        <p>
-	   {{ residence.address | newline_to_br }}
-	</p>
-        {% if residence.spravce %}
-           {% assign spravce = site.people | where_exp: "item","item.uid contains residence.spravce" | first %}
-           <p>
-           <div>
-	   Kontakt: 
-	   {{ spravce.name }},
-              <i class="fa fa-envelope-o"></i> 
-              <a class="c-emphasized-anchor" href="mailto:{{ include.item.mail }}">
-                  {{ spravce.mail }}
-              </a>
-	   </div>
-	</p>
-        {% endif %}
-        {% if residence.mapLink %}
-          <p>
-            <a class="c-emphasized-anchor" href="{{ site.organization.mapLink }}">Zobrazit mapu ›</a>
-          </p>
-        {% endif %}
-    </div>
-</div>
+{% if residence.residenceImg %}
+  <div class="mb-2">
+    {% asset '{{ residence.residenceImg }}' magick:resize='400x' alt='Sídlo' class="w-full" %}
+  </div>
+{% endif %}
+
+{% if residence.url %}
+  <a href="{{ residence.url }}"><strong>{{ residence.name }}</strong></a>
+{% else  %}
+  <strong>{{ residence.name }}</strong>
+{% endif  %}
+
+<p>
+  {{ residence.address | newline_to_br }}
+</p>
+
+{% if residence.spravce %}
+  {% assign spravce = site.people | where_exp: "item","item.uid contains residence.spravce" | first %}
+  {% include people/profile-badge.html item=spravce %}
+{% endif %}
+{% if residence.mapLink %}
+  {% include buttons/icon.html href=site.organization.mapLink icon="ico--map" class="btn--fullwidth" cta="Zobrazit mapu" %}
+{% endif %}

data/_includes/contacts/summary-table.html

@@ -1,58 +1,64 @@
-<table>
-  <tbody>
-    {% if site.contactSummaryItems %}
-      {% for line in site.contactSummaryItems %}
-        <tr>
-          {% if line.type == 'organizationEmail' %}
-            <td><i class="fa fa-envelope"></i>&nbsp;&nbsp;Emailová adresa:</td>
-            <td><a class="c-emphasized-anchor" href="mailto:{{ site.organization.email }}">{{ site.organization.email }}</a></td>
-          {% elsif line.type == 'organizationRedmineLink' %}
-            <td><i class="fa fa-envelope"></i>&nbsp;&nbsp;Podatelna (Redmine):</td>
-            <td><a class="c-emphasized-anchor" href="{{ site.organization.redmineLink }}">podatelna</a></td>
-          {% elsif line.type == 'organizationPhone' %}
-            <td><i class="fa fa-phone"></i>&nbsp;&nbsp;Telefonický kontakt</td>
-            <td><a class="c-emphasized-anchor" href="tel:{{ site.organization.phone }}">{{ site.organization.phone }}</a></td>
-          {% elsif line.type == 'organizationTransparentAccount' %}
-            <td><i class="fa fa-university"></i>&nbsp;&nbsp;Transparentní {% if line.includeMoreLink %}účty{% else %}účet{% endif %}</td>
-            <td>{{ site.organization.transparentAccount }}{% if line.includeMoreLink %} a <a class="c-emphasized-anchor" href="https://wiki.pirati.cz/fo/seznam_uctu">další účty</a>{% endif %}</td>
-          {% elsif line.type == 'organizationDataBox' %}
-            <td><i class="fa fa-files-o"></i>&nbsp;&nbsp;Datová schránka</td>
-            <td>{{ site.organization.dataBoxId }}</td>
-          {% elsif line.type == 'piratiRootWebsite' %}
-            <td><i class="fa fa-desktop"></i>&nbsp;&nbsp;Celostátní web</td>
-            <td><a class="c-emphasized-anchor" href="https://www.pirati.cz">www.pirati.cz</a></td>
-          {% elsif line.type == 'custom' %}
-            <td>{% if line.iconClass %}<i class="{{ line.iconClass }}"></i>&nbsp;&nbsp;{% endif %}{{ line.label }}</td>
-            <td class="c-content-block">{{ line.body }}</td>
-          {% endif %}
-        </tr>
-      {% endfor %}
-    {% else %}
-      {% comment %}Support legacy configuration where site.contactSummaryItems is undefined{% endcomment %}
-      <tr>
-        <td><i class="fa fa-envelope"></i>&nbsp;&nbsp;Emailová adresa:</td>
-        <td><a class="c-emphasized-anchor" href="mailto:{{ site.organization.email }}">{{ site.organization.email }}</a></td>
-      </tr>
-      <tr>
-          <td><i class="fa fa-envelope"></i>&nbsp;&nbsp;Podatelna (Redmine):</td>
-          <td><a class="c-emphasized-anchor" href="{{ site.organization.redmineLink }}">podatelna</a></td>
-      </tr>
-      <tr>
-          <td><i class="fa fa-phone"></i>&nbsp;&nbsp;Telefonický kontakt</td>
-          <td><a class="c-emphasized-anchor" href="tel:{{ site.organization.phone }}">{{ site.organization.phone }}</a></td>
-      </tr>
-      <tr>
-          <td><i class="fa fa-desktop"></i>&nbsp;&nbsp;Celostátní web</td>
-          <td><a class="c-emphasized-anchor" href="https://www.pirati.cz">www.pirati.cz</a></td>
-      </tr>
-      <tr>
-          <td><i class="fa fa-files-o"></i>&nbsp;&nbsp;Datová schránka</td>
-          <td>{{ site.organization.dataBoxId | default: 'b2i4r6j' }}</td>
-      </tr>
-      <tr>
-          <td><i class="fa fa-university"></i>&nbsp;&nbsp;Transparentní účty</td>
-          <td>{{ site.organization.transparentAccount | default: '2100048174/2010' }} a <a class="c-emphasized-anchor" href="https://wiki.pirati.cz/fo/seznam_uctu">další účty</a></td>
-      </tr>
-    {% endif %}
-  </tbody>
-</table>
+{% if site.contactSummaryItems %}
+  {% for line in site.contactSummaryItems %}
+    <div>
+      {% if line.type == 'organizationEmail' %}
+        <h4>Emailová adresa</h4>
+        {% capture href %}mailto:{{ site.organization.email }}{% endcapture %}
+        {% include contact-line.html href=href icon="ico--envelope" caption=site.organization.email %}
+      {% elsif line.type == 'organizationRedmineLink' %}
+        <h4>Podatelna (Redmine)</h4>
+        {% include contact-line.html href=site.organization.redmineLink icon="ico--envelope" caption=site.organization.email %}
+      {% elsif line.type == 'organizationPhone' %}
+        <h4>Telefonický kontakt</h4>
+        {% capture href %}tel:{{ site.organization.phone }}{% endcapture %}
+        {% include contact-line.html href=href icon="ico--phone" caption=site.organization.phone %}
+      {% elsif line.type == 'organizationTransparentAccount' %}
+        <h4>Transparentní {% if line.includeMoreLink %}účty{% else %}účet{% endif %}</h4>
+        {% capture href %}tel:{{ site.organization.phone }}{% endcapture %}
+        {{ site.organization.transparentAccount }}{% if line.includeMoreLink %} a <a href="https://wiki.pirati.cz/fo/seznam_uctu">další účty</a>{% endif %}
+      {% elsif line.type == 'organizationDataBox' %}
+        <h4>Datová schránka</h4>
+        {% include contact-line.html icon="ico--drawer" caption=site.organization.dataBoxId %}
+      {% elsif line.type == 'piratiRootWebsite' %}
+        <h4>Celostátní web</h4>
+        {% include contact-line.html href="https://www.pirati.cz" icon="ico--pirati" caption="www.pirati.cz" %}
+      {% elsif line.type == 'custom' %}
+        <h4>{{ line.body }}</h4>
+        {% if line.iconClass %}
+          {% include contact-line.html icon=line.iconClass caption=line.label %}
+        {% else %}
+          {{ line.label }}
+        {% endif %}
+      {% endif %}
+    </div>
+  {% endfor %}
+{% else %}
+  {% comment %}Support legacy configuration where site.contactSummaryItems is undefined{% endcomment %}
+  <div>
+    <h4>Emailová adresa</h4>
+    {% capture href %}mailto:{{ site.organization.email }}{% endcapture %}
+    {% include contact-line.html href=href icon="ico--envelope" caption=site.organization.email %}
+  </div>
+  <div>
+    <h4>Podatelna (Redmine)</h4>
+    {% include contact-line.html href=site.organization.redmineLink icon="ico--envelope" caption=site.organization.email %}
+  </div>
+  <div>
+    <h4>Telefonický kontakt</h4>
+    {% capture href %}tel:{{ site.organization.phone }}{% endcapture %}
+    {% include contact-line.html href=href icon="ico--phone" caption=site.organization.phone %}
+  </div>
+  <div>
+    <h4>Celostátní web</h4>
+    {% include contact-line.html href="https://www.pirati.cz" icon="ico--pirati" caption="www.pirati.cz" %}
+  </div>
+  <div>
+    <h4>Datová schránka</h4>
+    {% include contact-line.html icon="ico--drawer" caption=site.organization.dataBoxId %}
+  </div>
+  <div>
+    <h4>Transparentní {% if line.includeMoreLink %}účty{% else %}účet{% endif %}</h4>
+    {% capture href %}tel:{{ site.organization.phone }}{% endcapture %}
+    {{ site.organization.transparentAccount | default: '2100048174/2010' }}{% if line.includeMoreLink %} a <a href="https://wiki.pirati.cz/fo/seznam_uctu">další účty</a>{% endif %}
+  </div>
+{% endif %}

data/_includes/countdown.html

@@ -0,0 +1,13 @@
+<aside class="bg-black text-white px-4 py-12 lg:py-16 lg:px-24 {{ include.classes }}">
+  <div class="flex flex-col lg:flex-row items-center">
+    <h1 class="head-alt-md md:head-alt-xl flex-grow text-center lg:text-left mb-8 lg:mb-0">Do voleb<br>nám zbývá</h1>
+    <div class="__js-root">
+      <ui-flip-clock
+        clock-classes="text-6xl md:text-7xl lg:text-9xl"
+        slot-classes="text-2xl md:text-3xl lg:text-4xl"
+        deadline="{{ include.deadline }}"
+        units="days,hours"
+      />
+    </div>
+  </div>
+</aside>

data/_includes/footer.html

@@ -1,139 +1,103 @@
-<a href="{{ site.github.url }}edit/{{ site.github.branch }}/{{ page.path }}" class="c-suggest-improvement show-for-medium hide-for-print">
-  <i class="fa fa-pencil"></i>
-  Navrhni úpravu
-</a>
-
-<footer class="o-section o-section--darker o-section--bigger u-inverted u-cf">
-  <div class="o-section-inner">
-    <div class="row">
-      <div class="medium-12 large-3 u-stacked--medium-down u-center--medium-down columns">
-        <img src="/assets/img/brand/logo_napis_white.svg" alt='Česká pirátská strana' class="logo u-center-medium-down u-stacked">
-        <p class="u-noWrap u-stacked u-smaller-line-height show-for-large">
-          <span class="u-mirror-horizontally">&copy;</span> Piráti, {{ site.time | date: '%Y' }}. Všechna práva vyhlazena.
-          <br>Sdílejte a nechte ostatní sdílet za stejných
-          <br>podmínek.
-      </div>
-      <div class="medium-12 large-6 u-stacked--medium-down u-center--medium-down columns show-for-medium">
-        <div class="row">
+<footer class="footer bg-grey-700 text-white __js-root">
+  <ui-app inline-template>
+    <div>
+      <div class="footer__main py-4 lg:py-16 container container--default">
+        <section class="footer__brand">
+          <img src="{{ site.styleguide_base_url }}/images/logo-full-white.svg" alt="Pirátská strana" class="w-32 md:w-40 pb-6" />
+          <p class="para hidden md:block md:mb-4 lg:mb-0 text-grey-200">
+            Piráti, {{ site.time | date: '%Y' }}. Všechna práva vyhlazena.
+            Sdílejte a nechte ostatní sdílet za stejných podmínek.
+          </p>
+        </section>
+        <section class="footer__main-links bg-grey-700 text-white lg:grid grid-cols-3 gap-4">
           {% for linkGroup in site.data.menu.bottom %}
-            <div class="columns {{ linkGroup.class }}">
-                <nav class="c-vertical-navigation u-center---medium-down">
-                  {% if linkGroup.title %}
-                    <h3 class="c-vertical-navigation__title">{{ linkGroup.title }}</h3>
-                  {% endif %}
-                  <ul class="c-vertical-navigation-items">
-                    {% for linkGroupItem in linkGroup.links %}
-                    <li class="c-vertical-navigation__item">
+            <div class="{% if forloop.first %}pt-8 pb-4 lg:py-0{% else %}py-4 lg:py-0 border-t border-grey-400 lg:border-t-0{% endif %}">
+              <ui-footer-collapsible label="{{ linkGroup.title }}">
+                <ul class="mt-6 space-y-2 text-grey-200">
+                  {% for linkGroupItem in linkGroup.links %}
+                    <li>
                       <a href="{{ linkGroupItem.link }}">{{ linkGroupItem.name }}</a>
                     </li>
-                    {% endfor %}
-                  </ul>
-                </nav>
+                  {% endfor %}
+                </ul>
+              </ui-footer-collapsible>
             </div>
           {% endfor %}
-        </div>
-      </div>
-      <div class="medium-12 large-3 u-stacked--medium-down columns u-center--medium-down">
-        <nav class="c-vertical-navigation u-stacked">
-          <h3 class="c-vertical-navigation__title">Buďte s námi v síti</h3>
-          <ul class="c-vertical-navigation-items c-vertical-navigation-items--horizontal">
-            {% if site.facebook.profilePage %}
-            <li class="c-vertical-navigation__item">
-              <a href="{{ site.facebook.profilePage }}" rel="noopener noreferrer" title="Facebook - {{ site.organization.shortName }}">
-                <i class="fa fa-facebook c-icon c-icon--big" aria-hidden="true"></i>
-              </a>
-            </li>
-            {% endif %}
-            {% if site.twitter.profile %}
-            <li class="c-vertical-navigation__item">
-              <a href="https://www.twitter.com/{{ site.twitter.profile }}" rel="noopener noreferrer" title="Twitter - {{ site.organization.shortName }}">
-                <i class="fa fa-twitter c-icon c-icon--big" aria-hidden="true"></i>
-              </a>
-            </li>
-            {% endif %}
-            {% if site.instagram.profilePage %}
-            <li class="c-vertical-navigation__item">
-              <a href="{{ site.instagram.profilePage }}" rel="noopener noreferrer" title="Instagram - {{ site.organization.shortName }}">
-                <i class="fa fa-instagram c-icon c-icon--big" aria-hidden="true"></i>
-              </a>
-            </li>
+        </section>
+        <section class="footer__social lg:text-right">
+          <div class="mb-4">
+            {% include social-icon-group.html class="space-x-2 text-white pb-4" %}
+            {% if site.organization.email %}
+              {% capture href %}mailto:{{ site.organization.email }}{% endcapture %}
+              {% include contact-line.html href=href icon="ico--envelope" caption="Dejte nám vědět" %}
             {% endif %}
-            {% if site.gplus.profilePage %}
-            <li class="c-vertical-navigation__item">
-              <a href="{{ site.gplus.profilePage }}" rel="noopener noreferrer" title="Google Plus - {{ site.organization.shortName }}">
-                <i class="fa fa-google-plus c-icon c-icon--big" aria-hidden="true"></i>
-              </a>
-            </li>
-            {% endif %}
-          </ul>
-        </nav>
-        <p class=" u-stacked u-maxWidth80percent u-smaller-line-height hide-for-large">
-          <span class="u-mirror-horizontally">&copy;</span> Piráti, {{ site.time | date: '%Y' }}. Všechna práva vyhlazena.
-          <br> Sdílejte a nechte ostatní sdílet za stejných podmínek.
-      </div>
-    </div>
-  </div>
-</footer>
-
-{% if site.data.menu.contact %}
-    <aside class="o-section o-section--bigger c-contact-bar u-inverted u-center--medium-down show-for-medium">
-      <div class="o-section-inner">
-        <div class="row">
-          <div class="small-12 columns">
-            <header class="c-contact-bar-header u-stacked--medium-down">
-              <h3 class="c-contact-bar__heading"> <a href="{{ '/kontakt/' | relative_url }}">Kontakt</a> </h3>
-            </header>
+          </div>
+          <div class="flex flex-col md:flex-row lg:flex-col lg:items-end space-y-2 md:space-y-0 md:space-x-2 lg:space-x-0 lg:space-y-2">
+            <a href="https://dary.pirati.cz" rel="noopener noreferrer" target="_blank" class="btn btn--icon btn--cyan-200 btn--hoveractive text-lg btn--fullwidth sm:btn--autowidth">
+              <div class="btn__body-wrap">
+                <div class="btn__body ">Přispěj</div>
+                <div class="btn__icon ">
+                  <i class="ico--pig"></i>
+                </div>
+              </div>
+            </a>
 
-            {% for contact in site.data.menu.contact %}
-            {% assign person = site.people | where_exp:"item","item.uid contains contact.id" | first %}
-            <ul class="c-contact-bar-items u-stacked--medium-down">
-              <li class="c-contact-bar__item u-stacked--medium-down">
-                {% if contact.position %}
-                <div class="c-contact-bar__section"> {{ contact.position }} </div>
-                {% endif %}
-                <div class="c-contact-bar__description"> 
-                  <a href="{{ person.url }}">{{ person.name }}</a>, 
-                  <a href="mailto:{{ person.mail }}">{{ person.mail }}</a>
+            <a href="https://nalodeni.pirati.cz" rel="noopener noreferrer" target="_blank" class="btn btn--icon btn--blue-300 btn--hoveractive text-lg btn--fullwidth sm:btn--autowidth">
+              <div class="btn__body-wrap">
+                <div class="btn__body ">Naloď se</div>
+                <div class="btn__icon ">
+                  <i class="ico--anchor"></i>
                 </div>
-              </li>
-            </ul>
-            {% endfor %}
+              </div>
+            </a>
 
           </div>
-        </div>
+        </section>
       </div>
-    </aside>
-{% else %}
-{% assign contactPerson = site.people | where_exp: "item","item.uid contains site.organization.contactUid" | first %}
-{% assign contactPersons = site.people | where_exp: "item","item.category contains 'kontaktni_osoba'" | sort:"ordpak" %}
-{% unless contactPersons == empty or contactPersons == blank or contactPersons == nil %}
-<aside class="o-section o-section--bigger c-contact-bar u-inverted u-center--medium-down show-for-medium">
-  <div class="o-section-inner">
-    <div class="row">
-      <div class="small-12 columns">
-        <header class="c-contact-bar-header u-stacked--medium-down">
-          <h3 class="c-contact-bar__heading"> <a href="{{ '/kontakt/' | relative_url }}">Kontakt</a> </h3>
-        </header>
 
-        {% for person in contactPersons %}
-	<ul class="c-contact-bar-items u-stacked--medium-down">
-          <li class="c-contact-bar__item u-stacked--medium-down">
- 	    {% if person.contactType %}
-        <div class="c-contact-bar__section"> {{ person.contactType }} </div>
-            {% endif %}
-            <div class="c-contact-bar__description"> 
-              <a href="{{ person.url }}">{{ person.name }}</a>, 
-              <a href="mailto:{{ person.mail }}">{{ person.mail }}</a>
-            </div>
-          </li>
-        </ul>
-        {% endfor %}
+      {% if site.data.menu.transparencySection %}
+        <section class="footer__sub-links lg:border-t border-grey-400">
+          <div class="container container--default">
+            <ui-footer-collapsible label="Otevřenost" labelClass="lg:w-1/4" wrapperClass="flex flex-col lg:flex-row lg:space-x-4 lg:items-center py-4 lg:py-8 border-t border-grey-400 lg:border-t-0" slotWrapperclass="lg:w-2/4">
+              <ul class="lg:w-full lg:pr-8 grid grid-cols-1 lg:grid-cols-3 lg:gap-4 items-center mt-6 space-y-2 lg:mt-0 lg:space-y-0 text-grey-200">
+                <li class="w-full">
+                  <a href="https://ucet.pirati.cz" rel="noreferrer noopener" target="_blank">Transparentní účet</a>
+                </li>
+                <li class="w-full">
+                  <a href="https://smlouvy.pirati.cz" rel="noreferrer noopener" target="_blank">Registr smluv</a>
+                </li>
+                <li class="w-full">
+                  <a href="https://wiki.pirati.cz/fo/otevrene_ucetnictvi" rel="noreferrer noopener" target="_blank">Otevřené účetnictví</a>
+                </li>
+              </ul>
+            </ui-footer-collapsible>
+          </div>
+        </section>
+      {% endif %}
 
-      </div>
+      <section class="bg-black py-4 lg:py-12">
+        <div class="container container--default">
+          <div class="grid gap-4 grid-cols-1 md:grid-cols-2 xl:grid-cols-3">
+            {% if site.data.menu.contact %}
+              {% for contact in site.data.menu.contact %}
+                {% assign person = site.people | where_exp:"item","item.uid contains contact.id" | first %}
+                {% include people/profile-badge.html item=person description=contact.position %}
+              {% endfor %}
+            {% else %}
+              {% assign contactPerson = site.people | where_exp: "item","item.uid contains site.organization.contactUid" | first %}
+              {% assign contactPersons = site.people | where_exp: "item","item.category contains 'kontaktni_osoba'" | sort:"ordpak" %}
+              {% unless contactPersons == empty or contactPersons == blank or contactPersons == nil %}
+                {% for person in contactPersons %}
+                  {% include people/profile-badge.html item=person %}
+                {% endfor %}
+              {% endunless %}
+            {% endif %}
+          </div>
+        </div>
+      </section>
     </div>
-  </div>
-</aside>
-{% endunless %}
-{% endif %}
+  </ui-app>
+</footer>
+
+
 
-<div class="__vue-root" data-app="ScrollTop"></div>

data/_includes/head.html

@@ -43,19 +43,25 @@
     <meta property="og:title"         content="{{ title }}" />
     <meta property="og:description"   content="{{ description }}" />
     {% if page.layout == 'post' %}
-    {% capture img_path %}{% asset '{{ page.image }}' @path %}{% endcapture %}
-    <meta property="og:image"         content="{{ img_path | absolute_url }}" />
+        {% if site.mediaStorage %}
+            {% capture img_path %}https://a.pirati.cz/{{ site.mediaStorage }}/img/{{ page.image }}{% endcapture %}
+        {% else %}
+            {% capture img_path %}{% asset '{{ page.image }}' @path %}{% endcapture %}
+        {% endif %}
+        <meta property="og:image"         content="{{ img_path | absolute_url }}" />
     {% elsif page.img %}
-    {% capture img_path %}{% asset '{{ page.img }}' @path %}{% endcapture %}
-    <meta property="og:image"         content="{{ img_path | absolute_url }}" />
+        {% if site.mediaStorage %}
+            {% capture img_path %}https://a.pirati.cz/{{ site.mediaStorage }}/img/{{ page.img }}{% endcapture %}
+        {% else %}
+            {% capture img_path %}{% asset '{{ page.img }}' @path %}{% endcapture %}
+        {% endif %}
+        <meta property="og:image"         content="{{ img_path | absolute_url }}" />
     {% else %}
     <meta property="og:image"         content="{{ 'assets/img/brand/logo-round.png' | absolute_url }}" />
     {% endif %}
     <!-- Fonts -->
     {% if page.layout != 'blank' %}
-    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
-    {% comment %}This actually points to assets/css/main.scss{% endcomment %}
-    <link rel="stylesheet" href="{% asset 'main.css' @path !type %}">
+    <link rel="stylesheet" href="{{ site.styleguide_base_url }}/css/styles.css">
     {% endif %}
     <!-- API Mapy.cz that has to be in the header -->
     {% if page.mapycz_api %}