Merge branch 'feature/resource-boxes' of pmpc/website into master

site/config.toml

@@ -80,7 +80,6 @@ DefaultContentLanguage = "en"
 [params.resources.modal]
   client = "Client"
   date = "Date"
-  category = "Category"
   buttonText = "Close"
 
 # Sign section

site/data/de/resources/1-PublicAdmin.yaml

@@ -1,8 +1,8 @@
 modalID: 1
 title: Leitfaden für die öffentliche Verwaltung
-date: 2014-07-05
+date: 
 img: 1.jpg
-category: Public Money, Public Code
+shortLink: guideForPublicAdministration
 description:  "<p>GERMAN Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse iaculis molestie nisl, dapibus viverra nisl vehicula eu. Phasellus a lorem vel felis dignissim varius. Aenean et porta velit. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Aenean sodales augue eu lorem vestibulum luctus. Nunc bibendum sapien id ligula tempor, at tincidunt orci dignissim. Nam convallis, tortor nec bibendum ultrices, erat turpis vehicula enim, sit amet dictum leo urna non ante. Aenean fermentum finibus nibh, quis ultricies ipsum maximus vitae.</p>
 
 <p>Vivamus massa mauris, blandit eu ante nec, pretium accumsan risus. Sed malesuada eu elit sit amet feugiat. Morbi a neque lorem. In rutrum ante nisl. Aliquam dapibus tempor libero eget elementum. Donec vitae odio sed ligula dictum malesuada. Fusce vitae facilisis turpis. Vivamus congue dolor lobortis, rutrum nibh at, pulvinar eros.</p>

site/data/de/resources/2-Public.yaml

@@ -1,6 +1,6 @@
 modalID: 2
 title: Leitfaden für die Öffentlichkeit
-date: 2014-07-06
+date: 
 img: 2.jpg
-category: Public Money, Public Code
+shortLink: guideForGeneralPublic
 description: Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vel enim aliquid dicta ullam in repellendus amet perspiciatis adipisci architecto obcaecati sit voluptas ipsam, deleniti neque placeat tenetur cum tempore velit.

site/data/de/resources/3-Action.yaml

@@ -1,6 +1,6 @@
 modalID: 3
 title: Werde aktiv!
-date: 2014-07-07
+date: 
 img: 3.jpg
-category: Public Money, Public Code
+shortLink: takeAction
 description: Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vel enim aliquid dicta ullam in repellendus amet perspiciatis adipisci architecto obcaecati sit voluptas ipsam, deleniti neque placeat tenetur cum tempore velit.

site/data/de/resources/4-News.yaml

@@ -1,6 +1,6 @@
 modalID: 4
 title: Neuigkeiten
-date: 2014-07-09
+date: 
 img: 4.jpg
-category: Public Money, Public Code
+shortLink: latestNews
 description: Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vel enim aliquid dicta ullam in repellendus amet perspiciatis adipisci architecto obcaecati sit voluptas ipsam, deleniti neque placeat tenetur cum tempore velit.

site/data/de/resources/5-FOI.yaml

@@ -1,6 +1,6 @@
 modalID: 5
 title: Informationsfreiheit
-date: 2014-07-08
+date: 
 img: 5.jpg
-category: Public Money, Public Code
+shortLink: freedomOfInformation
 description: Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vel enim aliquid dicta ullam in repellendus amet perspiciatis adipisci architecto obcaecati sit voluptas ipsam, deleniti neque placeat tenetur cum tempore velit.

site/data/de/resources/6-Press.yaml

@@ -1,6 +1,6 @@
 modalID: 6
 title: Presse
-date: 2014-07-10
+date: 
 img: 6.jpg
-category: Public Money, Public Code
+shortLink: pressInformation
 description: Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vel enim aliquid dicta ullam in repellendus amet perspiciatis adipisci architecto obcaecati sit voluptas ipsam, deleniti neque placeat tenetur cum tempore velit.

site/data/en/resources/1-PublicAdmin.yaml

@@ -1,8 +1,8 @@
 modalID: 1
 title: Guide for Public Administration
-date: 2014-07-05
+date: 
 img: 1.jpg
-category: Public Money, Public Code
+shortLink: guideForPublicAdministration
 description:  "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse iaculis molestie nisl, dapibus viverra nisl vehicula eu. Phasellus a lorem vel felis dignissim varius. Aenean et porta velit. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Aenean sodales augue eu lorem vestibulum luctus. Nunc bibendum sapien id ligula tempor, at tincidunt orci dignissim. Nam convallis, tortor nec bibendum ultrices, erat turpis vehicula enim, sit amet dictum leo urna non ante. Aenean fermentum finibus nibh, quis ultricies ipsum maximus vitae.</p>
 
 <p>Vivamus massa mauris, blandit eu ante nec, pretium accumsan risus. Sed malesuada eu elit sit amet feugiat. Morbi a neque lorem. In rutrum ante nisl. Aliquam dapibus tempor libero eget elementum. Donec vitae odio sed ligula dictum malesuada. Fusce vitae facilisis turpis. Vivamus congue dolor lobortis, rutrum nibh at, pulvinar eros.</p>

site/data/en/resources/2-Public.yaml

@@ -1,6 +1,6 @@
 modalID: 2
 title: Guide for general public
-date: 2014-07-06
+date: 
 img: 2.jpg
-category: Public Money, Public Code
+shortLink: guideForGeneralPublic
 description: Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vel enim aliquid dicta ullam in repellendus amet perspiciatis adipisci architecto obcaecati sit voluptas ipsam, deleniti neque placeat tenetur cum tempore velit.

site/data/en/resources/3-Action.yaml

@@ -1,6 +1,6 @@
 modalID: 3
 title: Take Action!
-date: 2014-07-07
+date: 
 img: 3.jpg
-category: Public Money, Public Code
+shortLink: takeAction
 description: Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vel enim aliquid dicta ullam in repellendus amet perspiciatis adipisci architecto obcaecati sit voluptas ipsam, deleniti neque placeat tenetur cum tempore velit.

site/data/en/resources/4-News.yaml

@@ -1,6 +1,6 @@
 modalID: 4
 title: Latest News
-date: 2014-07-09
+date: 
 img: 4.jpg
-category: Public Money, Public Code
+shortLink: latestNews
 description: Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vel enim aliquid dicta ullam in repellendus amet perspiciatis adipisci architecto obcaecati sit voluptas ipsam, deleniti neque placeat tenetur cum tempore velit.

site/data/en/resources/5-FOI.yaml

@@ -1,6 +1,6 @@
 modalID: 5
 title: Freedom of Information
-date: 2014-07-08
+date: 
 img: 5.jpg
-category: Public Money, Public Code
+shortLink: freedomOfInformation
 description: Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vel enim aliquid dicta ullam in repellendus amet perspiciatis adipisci architecto obcaecati sit voluptas ipsam, deleniti neque placeat tenetur cum tempore velit.

site/data/en/resources/6-Press.yaml

@@ -1,6 +1,6 @@
 modalID: 6
 title: Press information
-date: 2014-07-10
+date: 
 img: 6.jpg
-category: Public Money, Public Code
+shortLink: pressInformation
 description: Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vel enim aliquid dicta ullam in repellendus amet perspiciatis adipisci architecto obcaecati sit voluptas ipsam, deleniti neque placeat tenetur cum tempore velit.

site/layouts/partials/modals.html

@@ -1,7 +1,7 @@
 {{ "<!-- RESOURCES MODALS -->" | safeHTML }}
 {{ $data := index .Site.Data .Site.Language.Lang }}
 {{ range $data.resources }}
-<div class="resources-modal modal fade" id="resourcesModal{{ .modalID }}" tabindex="-1" role="dialog" aria-hidden="true">
+<div class="resources-modal modal fade" id="{{ .shortLink }}" tabindex="-1" role="dialog" aria-hidden="true">
     <div class="modal-content">
         <div class="close-modal" data-dismiss="modal">
             <div class="lr">
@@ -23,23 +23,11 @@
                         {{ with .description }}
                             <p>{{ . | markdownify }}</p>
                         {{ end }}
-                        {{ if or .client .date .category }}
+                        {{ if .date }}
                             <ul class="list-inline item-details">
-                                {{ if .client }}
+                                <li><strong>{{ with $.Site.Params.resources.modal.date }}{{.}}</strong>: {{ end }}
-                                    <li>{{ with $.Site.Params.resources.modal.client }}{{.}}: {{ end }}
+                                    {{ .date }}
-                                        <strong><a href="{{ with .clientLink }}{{ . }}{{ else }}#{{ end }}">{{ .client }}</a></strong>
+                                </li>
-                                    </li>
-                                {{ end }}
-                                {{ if .date }}
-                                    <li>{{ with $.Site.Params.resources.modal.date }}{{.}}: {{ end }}
-                                        <strong><a href="#">{{ .date }}</a></strong>
-                                    </li>
-                                {{ end }}
-                                {{ if .category }}
-                                    <li>{{ with $.Site.Params.resources.modal.category }}{{.}}: {{ end }}
-                                        <strong><a href="#">{{ .category }}</a></strong>
-                                    </li>
-                                {{ end }}
                             </ul>
                         {{ end }}
                     </div>

site/layouts/partials/resources.html

@@ -6,16 +6,11 @@
         <div class="row no-gutter">
             {{ range $data.resources }}
                 <div class="col-lg-4 col-sm-6">
-                    <a href="#resourcesModal{{ .modalID }}" class="resources-box resources-link" data-toggle="modal">
+                    <a href="#{{ .shortLink }}" class="resources-box resources-link" data-toggle="modal">
                         <img src="/img/resources/{{ .img }}" class="img-responsive" alt="">
-                        {{ if and .category .title }}
+                        {{ if .title }}
                             <div class="resources-box-caption">
                                 <div class="resources-box-caption-content">
-                                    {{ with .category }}
-                                        <div class="resource-category text-faded">
-                                            {{ . }}
-                                        </div>
-                                    {{ end }}
                                     {{ with .title }}
                                         <div class="resource-name">
                                             {{ . }}

site/static/css/creative.css

@@ -357,8 +357,7 @@ header .header-content .header-content-inner p {
     height: 100%;
     text-align: center;
     color: #fff;
-    opacity: 0;
+    background: rgba(0, 0, 0, .4);
-    background: rgba(76, 189, 56, .9);
     -webkit-transition: all .35s;
     -moz-transition: all .35s;
     transition: all .35s;
@@ -389,7 +388,7 @@ header .header-content .header-content-inner p {
 }
 
 .resources-box:hover .resources-box-caption {
-    opacity: 1;
+    background: rgba(76, 189, 56, .9);
 }
 
 @media(min-width:768px) {

site/static/css/modals.css

@@ -16,6 +16,8 @@ body {
   margin: 0 auto;
 }
 
+.modal { overflow-y: scroll }
+
 .resources-modal .modal-content {
   padding: 50px 0;
   min-height: 100%;

site/static/js/creative.js

@@ -46,3 +46,27 @@
     new WOW().init();
 
 })(jQuery); // End of use strict
+
+
+/* 
+* This function allows you to open a modal box by defining it in the URL
+* e.g. https://localhost:1313/#resourcesModal1
+*/
+(function() {
+    if (window.location.href.indexOf('#') > -1) {
+      var modalID = window.location.href.split('#')[1];
+      var modal = document.getElementById(modalID);
+      
+      modal.className += ' in';
+      modal.style.display = 'block';
+      
+      var closeButtons = document.getElementsByClassName('close-modal');
+      
+      for(var i = 0; i < closeButtons.length; i++) {
+        closeButtons[i].onclick = function() {
+          modal.style.display = 'none';
+          modal.classList.remove('in');
+        };
+      }
+    }
+})();