#336 Add case studies (#370)

* #336 Add case studies

* #336 Refactoring casestudy

* #336 Display flex chv-casestudy

* #336 Include chv-baseline

* #336 Fix typo

* #336 Align line spacing

chcemvediet/locale/sk/LC_MESSAGES/django.po

@@ -8,7 +8,7 @@ msgid ""
 msgstr ""
 "Project-Id-Version: PACKAGE VERSION\n"
 "Report-Msgid-Bugs-To: \n"
-"POT-Creation-Date: 2020-05-18 17:57+0200\n"
+"POT-Creation-Date: 2021-05-02 16:58+0200\n"
 "PO-Revision-Date: YEAR-MO-DA HO:MI+ZONE\n"
 "Last-Translator: FULL NAME <EMAIL@ADDRESS>\n"
 "Language-Team: LANGUAGE <[email protected]>\n"
@@ -1359,6 +1359,12 @@ msgstr "Inštitúcií <br>v databáze"
 msgid "main:homepage:bigstats:beta"
 msgstr "Na vývoji portálu chcemvediet.sk priebežne pracujeme. Posielanie žiadostí, notifikácie a expertný právny systém fungujú. "
 
+msgid "main:homepage:casestudy:anchor"
+msgstr "vybrane-pripady"
+
+msgid "main:homepage:casestudy:heading"
+msgstr "Vybrané prípady"
+
 msgid "main:homepage:didyouknow:twitter"
 msgstr "Tweet"
 

chcemvediet/static/main/css/custom.sass

@@ -80,6 +80,43 @@ a:hover, a:focus
       padding-top: chv_baseline_fix($chv-fontsize-base, 1)
       overflow: hidden
 
+//
+// Casestudy link component
+//
+
+.chv-casestudy.chv-casestudy
+  display: flex
+  flex-direction: row
+  flex-wrap: wrap
+  padding: ($chv-baseline - 1px)
+  margin-bottom: $chv-baseline
+  border: solid 1px $chv-color-gray-ll
+  border-radius: 4px
+  color: #4d4d4d
+  &:hover, &:focus
+    color: darken(#4d4d4d, 20%)
+  @include clearfix()
+  > .chv-casestudy-img
+      display: block
+      float: left
+      height: ($chv-baseline * 8)
+      width: ($chv-baseline * 8)
+      margin-right: $chv-baseline
+  > .chv-casestudy-wrap
+    flex-basis: 50%
+    flex-grow: 1
+    > .chv-casestudy-date
+      display: block
+      @include chv-baseline($chv-fontsize-base * 0.9, 1, 0, 0)
+      color: lighten($chv-color-gray, 20%)
+      white-space: nowrap
+    > .chv-casestudy-heading
+      font-weight: 700
+      color: $chv-color-blue
+    > .chv-casestudy-text, .chv-casestudy-heading
+      display: block
+      @include chv-baseline($chv-fontsize-base, 1, 0.5, 0)
+
 //
 // Component for statistics with big numbers
 //

chcemvediet/templates/main/homepage/about.html

@@ -21,6 +21,10 @@
       </a>
     </div>
   </div>
+  <div class="col-md-8 col-sm-6">
+    {% include "main/homepage/casestudy/main.html" %}
+  </div>
+  <div class="chv-hidden-md col-sm-12"></div>
   {% if user.is_authenticated %}
     {# FIXME: Show something to authenticated user; See #110 #}
   {% else %}

chcemvediet/templates/main/homepage/casestudy/base.html

@@ -0,0 +1,19 @@
+{# vim: set filetype=htmldjango shiftwidth=2 :#}
+
+{% comment %}
+ %
+ % Context:
+ %  -- None
+ %
+{% endcomment %}
+
+{% block casestudy %}
+  <a class="chv-casestudy" rel="noreferrer noopener" href="{% block link %}{% endblock %}" target="_blank">
+    <img class="chv-casestudy-img" src="{% block img %}{% endblock %}">
+    <div class="chv-casestudy-wrap">
+      <span class="chv-casestudy-date">{% block date %}{% endblock %}</span>
+      <span class="chv-casestudy-heading">{% block heading %}{% endblock %}</span>
+      <span class="chv-casestudy-text">{% block text %}{% endblock %}</span>
+    </div>
+  </a>
+{% endblock %}

chcemvediet/templates/main/homepage/casestudy/main.html

@@ -0,0 +1,16 @@
+{# vim: set filetype=htmldjango shiftwidth=2 :#}
+{% load trans from i18n %}
+
+{% comment %}
+ %
+ % Context:
+ %  -- None
+ %
+{% endcomment %}
+
+<h2 id="{% trans 'main:homepage:casestudy:anchor' %}" class="text-center">
+  {% trans 'main:homepage:casestudy:heading' %}
+</h2>
+{% include "main/homepage/casestudy/sk/sef_danovych_kriminalistov.html" %}
+{% include "main/homepage/casestudy/sk/ako_infoziadosti_pomahaju.html" %}
+{% include "main/homepage/casestudy/sk/ako_pomaha_nas_portal.html" %}

chcemvediet/templates/main/homepage/casestudy/sk/ako_infoziadosti_pomahaju.html

@@ -0,0 +1,19 @@
+{# vim: set filetype=htmldjango shiftwidth=2 :#}
+{% extends "main/homepage/casestudy/base.html" %}
+{% load static from staticfiles %}
+
+{% comment %}
+ %
+ % Context:
+ %  -- None
+ %
+{% endcomment %}
+
+{% block link %}https://www.youtube.com/watch?v=7z4VgEbCBOk{% endblock %}
+{% block img %}{% static "main/images/casestudy/ako_infoziadosti_pomahaju.jpg" %}{% endblock %}
+{% block date %}4. október 2018{% endblock %}
+{% block heading %}Ako infožiadosti pomáhajú zvýšiť transparentnosť majetku úradníkov?{% endblock %}
+{% block text %}
+  Investigatívny novinár M. Turček si vyžiadal zdôvodnenie predaja majetku obce Jelenec riaditeľovi
+  KÚFS.
+{% endblock %}

chcemvediet/templates/main/homepage/casestudy/sk/ako_pomaha_nas_portal.html

@@ -0,0 +1,18 @@
+{# vim: set filetype=htmldjango shiftwidth=2 :#}
+{% extends "main/homepage/casestudy/base.html" %}
+{% load static from staticfiles %}
+
+{% comment %}
+ %
+ % Context:
+ %  -- None
+ %
+{% endcomment %}
+
+{% block link %}https://www.facebook.com/chcemvedietsk/posts/1737298786550549{% endblock %}
+{% block img %}{% static "main/images/casestudy/ako_pomaha_nas_portal.jpg" %}{% endblock %}
+{% block date %}11. august 2016{% endblock %}
+{% block heading %}Ako pomáha náš portál v investigatíve.{% endblock %}
+{% block text %}
+  Ale aj o ďalších nástrojoch, hovorí J. Suchal v prednáške. Náš portál sa objaví v 23:20.
+{% endblock %}

chcemvediet/templates/main/homepage/casestudy/sk/sef_danovych_kriminalistov.html

@@ -0,0 +1,18 @@
+{# vim: set filetype=htmldjango shiftwidth=2 :#}
+{% extends "main/homepage/casestudy/base.html" %}
+{% load static from staticfiles %}
+
+{% comment %}
+ %
+ % Context:
+ %  -- None
+ %
+{% endcomment %}
+
+{% block link %}https://www.aktuality.sk/clanok/693148/sef-danovych-kriminalistov-kupuje-majetky-odmieta-ich-komentovat/{% endblock %}
+{% block img %}{% static "main/images/casestudy/sef_danovych_kriminalistov.jpg" %}{% endblock %}
+{% block date %}6. jún 2019{% endblock %}
+{% block heading %}S akými utajovaniami sa stretávajú investigatívci?{% endblock %}
+{% block text %}
+  A ako sa s tým vysporiadať? Nadácia Zastavme korupciu vyhrala súd o informácie.
+{% endblock %}

chcemvediet/templates/styleguide/components/casestudy.html

@@ -0,0 +1,25 @@
+{# vim: set filetype=htmldjango shiftwidth=2 :#}
+{% extends "main/homepage/casestudy/base.html" %}
+{% load static from staticfiles %}
+{% load lorem from poleno.utils %}
+
+{% comment %}
+ %
+ % Context:
+ %  -- None
+ %
+{% endcomment %}
+
+
+{% block casestudy %}
+  <h3>Case study</h3>
+  <p>chv-casestudy <br>main/homepage/casestudy/base.html</p>
+  <div class="sg-specimen chv-scheme-white">
+    {{ block.super }}
+  </div>
+{% endblock %}
+
+{% block img %}{% static "main/images/casestudy/ako_infoziadosti_pomahaju.jpg" %}{% endblock %}
+{% block date %}1. apríl 2015{% endblock %}
+{% block heading %}{% lorem 4 %}{% endblock %}
+{% block text %}{% lorem 3 %}{% endblock %}

chcemvediet/templates/styleguide/components/main.html

@@ -21,4 +21,7 @@
     <div class="col-sm-4">{% include "styleguide/components/carousel.html" %}</div>
     <div class="col-sm-4">{% include "styleguide/components/sidebar.html" %}</div>
   </div>
+  <div class="row">
+    <div class="col-sm-6 col-md-8">{% include "styleguide/components/casestudy.html" %}</div>
+  </div>
 {% endblock %}