Merge pull request 'Sidebar menu and more' (#14) from benjaoming/website:new-website into new

2020-05-18 15:02:43 +00:00 · 2020-05-18 15:02:43 +00:00 · 0d41f95d95
parent bcadd7c8c5 80aca95892
commit 0d41f95d95
37 changed files with 1693 additions and 865 deletions
--- a/assets/css/style.scss
+++ b/assets/css/style.scss
@ -1,304 +0,0 @@
---
---
-
-//
-// IMPORTS
-//
-
-@import "reset";
-@import "variables";
-// Syntax highlighting @import is at the bottom of this file
-
-/**************/
-/* BASE RULES */
-/**************/
-
-html {
-  font-size: 100%;
-}
-
-body {
-	background: $white;
-  font: 18px/1.4 $helvetica;
-  color: $darkGray;
-}
-
-.container {
-  margin: 0 auto;
-  max-width: 740px;
-  padding: 0 10px;
-  width: 100%;
-}
-
-h1, h2, h3, h4, h5, h6 {
-  font-family: $helveticaNeue;
-  color: $darkerGray;
-  font-weight: bold;
-
-  line-height: 1.7;
-  margin: 1em 0 15px;
-  padding: 0;
-
-  @include mobile {
-    line-height: 1.4;
-  }
-}
-
-h1 {
-  font-size: 30px;
-  a {
-    color: inherit;
-  }
-}
-
-h2 {
-  font-size: 24px;
-}
-
-h3 {
-  font-size: 20px;
-}
-
-h4 {
-  font-size: 18px;
-  color: $gray;
-}
-
-p {
-  margin: 15px 0;
-}
-
-a {
-  color: $blue;
-  text-decoration: none;
-	cursor: pointer;
-  &:hover, &:active {
-    color: $blue;
-  }
-}
-
-ul, ol {
-  margin: 15px 0;
-  padding-left: 30px;
-}
-
-ul {
-  list-style-type: disc;
-}
-
-ol {
-  list-style-type: decimal;
-}
-
-ol ul, ul ol, ul ul, ol ol {
-  margin: 0;
-}
-
-ul ul, ol ul {
-  list-style-type: circle;
-}
-
-em, i {
-  font-style: italic;
-}
-
-strong, b {
-  font-weight: bold;
-}
-
-img {
-  max-width: 100%;
-}
-
-// Fixes images in popup boxes from Google Translate
-.gmnoprint img {
-  max-width: none;
-}
-
-.date {
-  font-style: italic;
-  color: $gray;
-}
-
-// Specify the color of the selection
-::-moz-selection {
-  color: $black;
-  background: $lightGray;
-}
-::selection {
-  color: $black;
-  background: $lightGray;
-}
-
-// Nicolas Gallagher's micro clearfix hack
-// http://nicolasgallagher.com/micro-clearfix-hack/
-.clearfix:before,
-.clearfix:after {
-    content: " ";
-    display: table;
-}
-
-.clearfix:after {
-    clear: both;
-}
-
-/*********************/
-/* LAYOUT / SECTIONS */
-/*********************/
-
-//
-// .masthead
-//
-
-.wrapper-masthead {
-  margin-bottom: 50px;
-}
-
-.masthead {
-  padding: 20px 0;
-  border-bottom: 1px solid $lightGray;
-
-  @include mobile {
-    text-align: center;
-  }
-}
-
-.site-avatar {
-  float: left;
-  width: 70px;
-  height: 70px;
-  margin-right: 15px;
-
-  @include mobile {
-    float: none;
-    display: block;
-    margin: 0 auto;
-  }
-
-  img {
-    border-radius: 5px;
-  }
-}
-
-.site-info {
-  float: left;
-
-  @include mobile {
-    float: none;
-    display: block;
-    margin: 0 auto;
-  }
-}
-
-.site-name {
-  margin: 0;
-  color: $darkGray;
-  cursor: pointer;
-  font-family: $helveticaNeue;
-  font-weight: 300;
-  font-size: 28px;
-  letter-spacing: 1px;
-}
-
-.site-description {
-  margin: -5px 0 0 0;
-  color: $gray;
-  font-size: 16px;
-
-  @include mobile {
-    margin: 3px 0;
-  }
-}
-
-nav {
-  float: right;
-  margin-top: 23px; // @TODO: Vertically middle align
-  font-family: $helveticaNeue;
-  font-size: 18px;
-
-  @include mobile {
-    float: none;
-    margin-top: 9px;
-    display: block;
-    font-size: 16px;
-  }
-
-  a {
-    margin-left: 20px;
-    color: $darkGray;
-    text-align: right;
-    font-weight: 300;
-    letter-spacing: 1px;
-
-    @include mobile {
-      margin: 0 10px;
-      color: $blue;
-    }
-  }
-}
-
-//
-// .main
-//
-
-.posts > .post {
-  padding-bottom: 2em;
-  border-bottom: 1px solid $lightGray;
-}
-
-.posts > .post:last-child {
-  padding-bottom: 1em;
-  border-bottom: none;
-}
-
-.post {
-  blockquote {
-    margin: 1.8em .8em;
-    border-left: 2px solid $gray;
-    padding: 0.1em 1em;
-    color: $gray;
-    font-size: 22px;
-    font-style: italic;
-  }
-
-  .comments {
-    margin-top: 10px;
-  }
-
-  .read-more {
-    text-transform: uppercase;
-    font-size: 15px;
-  }
-}
-
-.wrapper-footer {
-  margin-top: 50px;
-  border-top: 1px solid #ddd;
-  border-bottom: 1px solid #ddd;
-  background-color: $lightGray;
-}
-
-footer {
-  padding: 20px 0;
-  text-align: center;
-  font-size: 12px;
-}
-
-table th
-{
-  text-align: left;
-  font-weight: bold;
-}
-
-table td,
-table th
-{
-  padding: 5px;
-  border: 1px solid #ccc;
-}
-
-// Settled on moving the import of syntax highlighting to the bottom of the CSS
-// ... Otherwise it really bloats up the top of the CSS file and makes it difficult to find the start
-@import "highlights";
-@import "svg-icons";
-@import "datacoop";
--- a/content/_index.da.md
+++ b/content/_index.da.md
@ -2,4 +2,23 @@
 title: "Start"
 ---

-# Hej
+## Velkommen til data.coop
+
+Vi er en forening som har formålet, at passe på medlemmernes data. Vores kerneprincipper er 
+
+- Privatlivsbeskyttelse
+- Kryptering
+- Decentralisering
+- Zero-knowledge
+
+Ud fra de kerneprincipper vil vi med tiden udbyde onlinetjenester til medlemmerne. Hovedtanken er, 
+at vi som udgangspunkt stoler mere på hinanden end på "de store" som f.eks. Google, Microsoft eller Facebook.
+
+Foreningen holdt stiftende generalforsamling i 2014 og blev genstartet i 2016. 
+Foreningen arbejder nu på, at få gang i aktiviteterne. Inden længe vil du her på siden kunne læse om, 
+hvad du kan få ud af et medlemsskab samt detaljer om, hvordan du kan melde dig ind og være med til at opbygge noget fedt.
+
+| Næste arrangement                                                                                       | Bliv medlem                                         |
+|---------------------------------------------------------------------------------------------------------|-----------------------------------------------------|
+| Vi har umiddelbart ikke nogen arbejdsdag, men find os til næste [Cryptohagen](https://cryptohagen.dk/). | Vi har brug for medlemmer. [Læs mere her](/medlem). |
+
--- a/content/_index.en.md
+++ b/content/_index.en.md
@ -2,4 +2,22 @@
 title: "Start"
 ---

-# Start
+# data.coop welcomes you!
+
+We are an association whose purpose is to look after the members' data. Our core principles are
+
+- Privacy
+- Encryption
+- Decentralization
+- Zero-knowledge
+
+Based on the core principles, over time we will provide online services to members. The main idea is,
+that we basically rely more on each other than on the "big ones" such as Google, Microsoft or Facebook.
+
+The association held a founding general meeting in 2014 and was restarted in 2016.
+The association is now working to get the activities going. Soon you will be able to read about this on the site,
+what you can get out of a membership as well as details on how to sign up and help build some fat.
+
+| Next Event | Join |
+| --- | --- |
+| We do not have any working day right now, but we will find ourselves at the next [Cryptohagen](https://cryptohagen.dk/). | We need members. [Read more here](/member). |
--- a/i18n/da-DK.toml
+++ b/i18n/da-DK.toml
@ -1,3 +0,0 @@
-[home]
-other = "Home"
-
--- a/i18n/da.toml
+++ b/i18n/da.toml
@ -0,0 +1,11 @@
+[home]
+other = "Home"
+
+[generated_date]
+other = "Generateret med Hugo d. {{ .Count }}"
+
+[services_status]
+other = "Tjeneste Status"
+
+[tagline]
+other = "<u>vores</u> data i <u>vores</u> hænder"
--- a/i18n/en.toml
+++ b/i18n/en.toml
@ -0,0 +1,11 @@
+[home]
+other = "Home"
+
+[generated_date]
+other = "Generated by Hugo on {{ .Count }}"
+
+[services_status]
+other = "Services Status"
+
+[tagline]
+other = "our data in our hands"
--- a/static/android-chrome-192x192.png
+++ b/static/android-chrome-192x192.png
--- a/static/apple-touch-icon.png
+++ b/static/apple-touch-icon.png
--- a/static/browserconfig.xml
+++ b/static/browserconfig.xml
@ -2,8 +2,8 @@
 <browserconfig>
    <msapplication>
        <tile>
-            <square150x150logo src="/mstile-150x150.png"/>
-            <TileColor>#da532c</TileColor>
+            <square150x150logo src="/static/img/mstile-150x150.png"/>
+            <TileColor>#4b3aba</TileColor>
        </tile>
    </msapplication>
 </browserconfig>
--- a/static/favicon-16x16.png
+++ b/static/favicon-16x16.png
--- a/static/favicon-32x32.png
+++ b/static/favicon-32x32.png
--- a/static/favicon.ico
+++ b/static/favicon.ico
--- a/static/mstile-150x150.png
+++ b/static/mstile-150x150.png
--- a/static/safari-pinned-tab.svg
+++ b/static/safari-pinned-tab.svg
@ -1,46 +0,0 @@
-<?xml version="1.0" standalone="no"?>
-<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
- "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
-<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
- width="256.000000pt" height="256.000000pt" viewBox="0 0 256.000000 256.000000"
- preserveAspectRatio="xMidYMid meet">
-<metadata>
-Created by potrace 1.11, written by Peter Selinger 2001-2013
-</metadata>
-<g transform="translate(0.000000,256.000000) scale(0.100000,-0.100000)"
-fill="#000000" stroke="none">
-<path d="M750 2540 c-159 -34 -261 -81 -366 -167 -97 -78 -182 -183 -221 -271
-19 -46 -2 -71 65 -95 64 -22 138 -72 175 -119 24 -29 30 -47 29 -80 -1 -55
-13 -84 -134 -310 -144 -269 -189 -392 -208 -568 -18 -161 9 -319 80 -468 87
-182 216 -319 378 -401 120 -61 125 -61 707 -61 400 0 534 3 543 12 32 32 -1
-169 -55 229 -44 49 -107 69 -215 69 l-78 0 18 38 c19 36 55 143 66 192 5 23
-14 27 91 43 161 33 295 97 416 198 39 32 82 62 95 65 13 3 45 0 72 -6 82 -22
-224 13 256 62 15 23 15 29 -4 83 -28 82 -66 142 -100 160 l-29 15 51 51 c48
-48 50 52 44 92 -4 23 -30 89 -58 146 -89 181 -245 314 -412 352 -50 11 -56 16
-70 49 -8 20 -30 57 -50 83 -28 37 -36 56 -36 90 0 45 -13 67 -40 67 -30 0
-50 -34 -50 -82 0 -48 -45 -164 -54 -137 -2 7 -12 45 -21 83 -26 113 -71 217
-135 314 -95 144 -209 230 -360 271 -97 27 -268 28 -390 1z m359 -85 c94 -25
-163 -65 237 -139 58 -58 80 -90 122 -176 56 -114 97 -244 108 -338 l6 -60 -73
-42 c-99 -57 -163 -104 -231 -168 l-57 -54 -51 11 c-252 54 -530 -87 -647
-329 -52 -107 -73 -202 -73 -329 0 -168 50 -372 96 -393 20 -9 28 -8 41 5 18
-18 14 49 -23 177 -9 30 -18 109 -21 175 -6 139 8 218 59 324 38 80 149 196
-224 234 127 64 266 72 403 24 55 -19 79 -23 93 -16 22 12 24 52 4 69 -13 10
-7 19 34 55 57 51 147 113 207 144 52 26 51 26 55 0 2 -12 12 -28 23 -35 31
-21 65 6 65 51 0 48 19 131 42 185 l20 45 19 -35 c10 -19 30 -72 44 -117 22
-69 30 -84 51 -89 32 -8 54 11 54 47 0 38 12 37 97 -6 115 -57 221 -180 279
-323 26 -65 21 -81 -30 -106 -43 -20 -84 -20 -158 0 -47 13 -61 14 -73 4 -25
-21 -18 -58 15 -79 l31 -18 -28 -11 c-69 -26 -109 -33 -234 -42 -109 -7 -136
-12 -146 -26 -19 -26 -16 -42 11 -60 38 -24 257 -3 381 36 95 31 173 38 220
-20 18 -7 34 -27 51 -65 13 -31 24 -57 24 -60 0 -2 -25 -9 -56 -15 -41 -9 -68
-9 -99 -1 -95 24 -135 11 -236 -74 -98 -84 -276 -167 -401 -189 -42 -8 -41 -8
-52 86 -12 105 -90 209 -195 263 -94 47 -279 73 -309 43 -38 -38 4 -73 98 -81
-130 -12 225 -59 277 -136 69 -102 59 -290 -24 -459 l-35 -72 -44 0 c-35 0 -47
-5 -59 -24 -13 -19 -14 -29 -5 -45 10 -20 19 -21 186 -21 183 0 221 -7 256
-47 10 -11 21 -34 24 -51 l7 -32 -491 0 c-459 0 -494 1 -553 20 -126 38 -250
-134 -345 266 -99 138 -146 286 -145 464 0 195 46 333 220 655 101 186 123 244
-124 316 1 98 -64 180 -198 251 l-64 33 31 49 c63 102 198 211 328 266 130 54
-371 77 489 45z"/>
-<path d="M2040 1490 c-41 -41 -10 -110 48 -110 36 0 62 28 62 67 0 57 -69 84
-110 43z"/>
-</g>
-</svg>
--- a/static/site.webmanifest
+++ b/static/site.webmanifest
@ -3,17 +3,17 @@
    "short_name": "",
    "icons": [
        {
-            "src": "/android-chrome-192x192.png",
+            "src": "/static/img/android-chrome-192x192.png",
            "sizes": "192x192",
            "type": "image/png"
        },
        {
-            "src": "/android-chrome-256x256.png",
-            "sizes": "256x256",
+            "src": "/static/img/android-chrome-512x512.png",
+            "sizes": "512x512",
            "type": "image/png"
        }
    ],
-    "theme_color": "#ffffff",
-    "background_color": "#ffffff",
+    "theme_color": "#4b3aba",
+    "background_color": "#4b3aba",
    "display": "standalone"
 }
--- a/static/static/img/android-chrome-192x192.png
+++ b/static/static/img/android-chrome-192x192.png
--- a/static/static/img/android-chrome-256x256.png
+++ b/static/static/img/android-chrome-256x256.png
--- a/static/static/img/android-chrome-512x512.png
+++ b/static/static/img/android-chrome-512x512.png
--- a/static/static/img/apple-touch-icon.png
+++ b/static/static/img/apple-touch-icon.png
--- a/static/static/img/favicon-16x16.png
+++ b/static/static/img/favicon-16x16.png
--- a/static/static/img/favicon-32x32.png
+++ b/static/static/img/favicon-32x32.png
--- a/static/static/img/icons/close.svg
+++ b/static/static/img/icons/close.svg
@ -0,0 +1 @@
+<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><defs><style>.cls-1{fill:#4b3aba;}</style></defs><title>DataCoop_Cross_Purple</title><rect class="cls-1" x="9" width="2" height="20" transform="translate(-4.14 10) rotate(-45)"/><rect class="cls-1" x="9" width="2" height="20" transform="translate(10 24.14) rotate(-135)"/></svg>
--- a/static/static/img/icons/expand.svg
+++ b/static/static/img/icons/expand.svg
@ -0,0 +1 @@
+<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><defs><style>.cls-1{fill:#4b3aba;}</style></defs><title>DataCoop_Plus_Purple</title><rect class="cls-1" x="9" y="2" width="2" height="16"/><rect class="cls-1" x="9" y="2" width="2" height="16" transform="translate(0 20) rotate(-90)"/></svg>
--- a/static/static/img/logo.svg
+++ b/static/static/img/logo.svg
@ -0,0 +1,672 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   id="Layer_1"
+   data-name="Layer 1"
+   viewBox="0 0 103.37 48"
+   version="1.1"
+   sodipodi:docname="logo.svg"
+   width="103.37"
+   height="48"
+   inkscape:version="0.92.5 (2060ec1f9f, 2020-04-08)">
+  <metadata
+     id="metadata4087">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1608"
+     inkscape:window-height="986"
+     id="namedview4085"
+     showgrid="false"
+     inkscape:zoom="9.7721519"
+     inkscape:cx="51.37"
+     inkscape:cy="25.5"
+     inkscape:window-x="72"
+     inkscape:window-y="27"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="Layer_1" />
+  <defs
+     id="defs3922">
+    <style
+       id="style3920">.cls-1{fill:#483aaa;}.cls-2{fill:#afa7e9;}</style>
+  </defs>
+  <title
+     id="title3924">DataCoop_Logo</title>
+  <path
+     class="cls-1"
+     d="m 12.18,29 h -1.81 v -2.08 h -0.34 a 4.56,4.56 0 0 1 -4.34,2.39 c -3.13,0 -5.59,-2.51 -5.59,-6.23 0,-3.72 2.46,-6.22 5.59,-6.22 a 4.56,4.56 0 0 1 4.34,2.39 h 0.34 V 13 h 1.84 z M 2,23.08 c 0,2.85 1.71,4.56 4.12,4.56 2.41,0 4.25,-1.76 4.25,-4.56 0,-2.8 -1.76,-4.55 -4.22,-4.55 C 3.69,18.53 2,20.26 2,23.08 Z"
+     id="path3926"
+     inkscape:connector-curvature="0"
+     style="fill:#483aaa" />
+  <path
+     class="cls-1"
+     d="m 20.72,16.88 c 3.13,0 5,1.81 5,4.64 V 29 h -1.8 v -2 h -0.33 a 4.76,4.76 0 0 1 -4.47,2.29 c -2.63,0 -4.41,-1.37 -4.41,-3.47 0,-2.1 1.62,-3.21 4,-3.43 l 5.21,-0.5 v -0.51 c 0,-1.76 -1.19,-3 -3.26,-3 a 4.28,4.28 0 0 0 -4,2.75 l -1.57,-0.87 a 6.18,6.18 0 0 1 5.63,-3.38 z m -1.35,10.88 c 2.56,0 4.47,-1.54 4.47,-4.1 v -0.19 l -4.85,0.46 c -1.5,0.14 -2.44,0.77 -2.44,1.9 0,1.13 1.17,1.93 2.82,1.93 z"
+     id="path3928"
+     inkscape:connector-curvature="0"
+     style="fill:#483aaa" />
+  <path
+     class="cls-1"
+     d="m 28.37,13 h 1.83 v 4.22 h 3.47 v 1.57 h -3.43 v 7.89 c 0,0.48 0.24,0.72 0.68,0.72 h 2 V 29 h -2.7 a 1.72,1.72 0 0 1 -1.85,-1.86 z"
+     id="path3930"
+     inkscape:connector-curvature="0"
+     style="fill:#483aaa" />
+  <path
+     class="cls-1"
+     d="m 41.37,16.88 c 3.14,0 5,1.81 5,4.64 V 29 h -1.8 v -2 h -0.34 a 4.74,4.74 0 0 1 -4.46,2.29 c -2.63,0.04 -4.4,-1.29 -4.4,-3.43 0,-2.14 1.61,-3.21 3.95,-3.43 l 5.21,-0.5 v -0.51 c 0,-1.76 -1.18,-3 -3.25,-3 a 4.28,4.28 0 0 0 -4,2.75 L 35.71,20.3 a 6.16,6.16 0 0 1 5.66,-3.42 z m -1.3,10.88 c 2.56,0 4.46,-1.54 4.46,-4.1 v -0.19 l -4.85,0.46 c -1.49,0.14 -2.43,0.77 -2.43,1.9 0,1.13 1.12,1.93 2.81,1.93 z"
+     id="path3932"
+     inkscape:connector-curvature="0"
+     style="fill:#483aaa" />
+  <path
+     class="cls-1"
+     d="m 6.21,31.65 a 5.47,5.47 0 0 1 5.66,4.47 l -1.84,0.44 A 3.59,3.59 0 0 0 6.24,33.32 4.28,4.28 0 0 0 2,37.89 a 4.27,4.27 0 0 0 4.26,4.57 3.62,3.62 0 0 0 3.82,-3.24 l 1.84,0.41 a 5.48,5.48 0 0 1 -5.68,4.5 6.24,6.24 0 0 1 0,-12.48 z"
+     id="path3934"
+     inkscape:connector-curvature="0"
+     style="fill:#483aaa" />
+  <path
+     class="cls-1"
+     d="m 20.03,31.65 a 5.87,5.87 0 0 1 6.05,6.24 6.035,6.035 0 1 1 -12.07,0 5.86,5.86 0 0 1 6.02,-6.24 z m 0,10.81 c 2.54,0 4.19,-1.89 4.19,-4.57 0,-2.68 -1.65,-4.57 -4.19,-4.57 -2.54,0 -4.18,1.93 -4.18,4.57 0,2.64 1.65,4.57 4.18,4.57 z"
+     id="path3936"
+     inkscape:connector-curvature="0"
+     style="fill:#483aaa" />
+  <path
+     class="cls-1"
+     d="m 34.11,31.65 a 5.87,5.87 0 0 1 6,6.24 6.035,6.035 0 1 1 -12.07,0 5.86,5.86 0 0 1 6.07,-6.24 z m 0,10.81 c 2.54,0 4.19,-1.89 4.19,-4.57 0,-2.68 -1.65,-4.57 -4.19,-4.57 -2.54,0 -4.18,1.93 -4.18,4.57 0,2.64 1.64,4.57 4.18,4.57 z"
+     id="path3938"
+     inkscape:connector-curvature="0"
+     style="fill:#483aaa" />
+  <path
+     class="cls-1"
+     d="m 42.76,32 h 1.81 v 2 h 0.34 a 4.55,4.55 0 0 1 4.36,-2.39 c 3.11,0 5.61,2.51 5.61,6.24 0,3.73 -2.51,6.28 -5.61,6.28 a 4.55,4.55 0 0 1 -4.36,-2.4 H 44.62 V 48 h -1.86 z m 10.23,5.9 c 0,-2.86 -1.72,-4.57 -4.16,-4.57 -2.44,0 -4.21,1.76 -4.21,4.57 0,2.81 1.74,4.57 4.21,4.57 2.47,0 4.16,-1.75 4.16,-4.58 z"
+     id="path3940"
+     inkscape:connector-curvature="0"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="84.370003"
+     y="15"
+     width="9"
+     height="1"
+     id="rect3942"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="83.370003"
+     y="17"
+     width="10"
+     height="1"
+     id="rect3944"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="85.370003"
+     y="13"
+     width="7"
+     height="1"
+     id="rect3946"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="86.370003"
+     y="11"
+     width="6"
+     height="1"
+     id="rect3948"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="87.370003"
+     y="9"
+     width="4"
+     height="1"
+     id="rect3950"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="87.370003"
+     y="7"
+     width="3"
+     height="1"
+     id="rect3952"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="87.370003"
+     y="5"
+     width="2"
+     height="1"
+     id="rect3954"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="82.380005"
+     y="19"
+     width="10.99"
+     height="1"
+     id="rect3956"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="80.370003"
+     y="21"
+     width="12"
+     height="1"
+     id="rect3958"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="79.370003"
+     y="23"
+     width="13"
+     height="1"
+     id="rect3960"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="69.370003"
+     y="25"
+     width="29"
+     height="1"
+     id="rect3962"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="68.370003"
+     y="27"
+     width="32"
+     height="1"
+     id="rect3964"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="68.370003"
+     y="29"
+     width="28"
+     height="1"
+     id="rect3966"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="78.370003"
+     y="31"
+     width="13"
+     height="1"
+     id="rect3968"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="79.370003"
+     y="33"
+     width="11"
+     height="1"
+     id="rect3970"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="79.370003"
+     y="35"
+     width="10"
+     height="1"
+     id="rect3972"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="79.370003"
+     y="37"
+     width="9"
+     height="1"
+     id="rect3974"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="79.370003"
+     y="39"
+     width="8"
+     height="1"
+     id="rect3976"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="79.370003"
+     y="41"
+     width="7"
+     height="1"
+     id="rect3978"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="79.370003"
+     y="43"
+     width="6"
+     height="1"
+     id="rect3980"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="79.370003"
+     y="45"
+     width="4"
+     height="1"
+     id="rect3982"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="78.370003"
+     y="47"
+     width="2"
+     height="1"
+     id="rect3984"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="68.370003"
+     y="23"
+     width="5"
+     height="1"
+     id="rect3986"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="67.370003"
+     y="21"
+     width="4"
+     height="1"
+     id="rect3988"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="66.370003"
+     y="31"
+     width="3"
+     height="1"
+     id="rect3990"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-2"
+     x="73.370003"
+     y="0"
+     width="13"
+     height="1"
+     id="rect3992"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="69.370003"
+     y="2"
+     width="6"
+     height="1"
+     id="rect3994"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="77.870003"
+     y="2"
+     width="12.5"
+     height="1"
+     id="rect3996"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="79.370003"
+     y="4"
+     width="14"
+     height="1"
+     id="rect3998"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="66.370003"
+     y="4"
+     width="10"
+     height="1"
+     id="rect4000"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="64.370003"
+     y="6"
+     width="12"
+     height="1"
+     id="rect4002"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="81.370003"
+     y="6"
+     width="14"
+     height="1"
+     id="rect4004"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="82.370003"
+     y="8"
+     width="15"
+     height="1"
+     id="rect4006"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="62.369999"
+     y="8"
+     width="14"
+     height="1"
+     id="rect4008"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="84.370003"
+     y="10"
+     width="15"
+     height="1"
+     id="rect4010"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="60.369999"
+     y="10"
+     width="16"
+     height="1"
+     id="rect4012"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="85.370003"
+     y="12"
+     width="15"
+     height="1"
+     id="rect4014"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="59.369999"
+     y="12"
+     width="17"
+     height="1"
+     id="rect4016"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="58.369999"
+     y="14"
+     width="18"
+     height="1"
+     id="rect4018"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="87.370003"
+     y="14"
+     width="14"
+     height="1"
+     id="rect4020"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="87.370003"
+     y="16"
+     width="15"
+     height="1"
+     id="rect4022"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="57.369999"
+     y="16"
+     width="18"
+     height="1"
+     id="rect4024"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="63.369999"
+     y="18"
+     width="11"
+     height="1"
+     id="rect4026"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="85.370003"
+     y="18"
+     width="17"
+     height="1"
+     id="rect4028"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="57.369999"
+     y="18"
+     width="4"
+     height="1"
+     id="rect4030"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="56.369999"
+     y="20"
+     width="6"
+     height="1"
+     id="rect4032"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="89.370003"
+     y="20"
+     width="14"
+     height="1"
+     id="rect4034"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="56.369999"
+     y="22"
+     width="6"
+     height="1"
+     id="rect4036"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="93.370003"
+     y="22"
+     width="10"
+     height="1"
+     id="rect4038"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="73.370003"
+     y="44"
+     width="13"
+     height="1"
+     id="rect4040"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="69.370003"
+     y="42"
+     width="3"
+     height="1"
+     id="rect4042"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="74.370003"
+     y="42"
+     width="16"
+     height="1"
+     id="rect4044"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="66.370003"
+     y="40"
+     width="6"
+     height="1"
+     id="rect4046"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="76.370003"
+     y="40"
+     width="17"
+     height="1"
+     id="rect4048"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="78.370003"
+     y="38"
+     width="17"
+     height="1"
+     id="rect4050"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="64.370003"
+     y="38"
+     width="9"
+     height="1"
+     id="rect4052"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="62.369999"
+     y="36"
+     width="11"
+     height="1"
+     id="rect4054"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="79.370003"
+     y="36"
+     width="18"
+     height="1"
+     id="rect4056"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="60.369999"
+     y="34"
+     width="13"
+     height="1"
+     id="rect4058"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="81.370003"
+     y="34"
+     width="18"
+     height="1"
+     id="rect4060"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="59.369999"
+     y="32"
+     width="14"
+     height="1"
+     id="rect4062"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="82.370003"
+     y="32"
+     width="18"
+     height="1"
+     id="rect4064"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="58.369999"
+     y="30"
+     width="15"
+     height="1"
+     id="rect4066"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="83.370003"
+     y="30"
+     width="18"
+     height="1"
+     id="rect4068"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="84.370003"
+     y="28"
+     width="18"
+     height="1"
+     id="rect4070"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="57.369999"
+     y="28"
+     width="16"
+     height="1"
+     id="rect4072"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="64.370003"
+     y="26"
+     width="9"
+     height="1"
+     id="rect4074"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="57.369999"
+     y="26"
+     width="3"
+     height="1"
+     id="rect4076"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="85.370003"
+     y="26"
+     width="17"
+     height="1"
+     id="rect4078"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="90.370003"
+     y="24"
+     width="13"
+     height="1"
+     id="rect4080"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="56.369999"
+     y="24"
+     width="5"
+     height="1"
+     id="rect4082"
+     style="fill:#afa7e9" />
+</svg>
--- a/static/static/img/mark.svg
+++ b/static/static/img/mark.svg
@ -0,0 +1,625 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   id="Layer_1"
+   data-name="Layer 1"
+   viewBox="0 0 51 51"
+   version="1.1"
+   sodipodi:docname="mark.svg"
+   width="51"
+   height="51"
+   inkscape:version="0.92.5 (2060ec1f9f, 2020-04-08)">
+  <metadata
+     id="metadata153">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title>DataCoop_Mark</dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="870"
+     inkscape:window-height="679"
+     id="namedview151"
+     showgrid="false"
+     inkscape:zoom="5.5416667"
+     inkscape:cx="25"
+     inkscape:cy="24"
+     inkscape:window-x="72"
+     inkscape:window-y="27"
+     inkscape:window-maximized="0"
+     inkscape:current-layer="Layer_1" />
+  <defs
+     id="defs4">
+    <style
+       id="style2">.cls-1{fill:#483aaa;}.cls-2{fill:#afa7e9;}</style>
+  </defs>
+  <title
+     id="title6">DataCoop_Mark</title>
+  <rect
+     class="cls-1"
+     x="30"
+     y="17"
+     width="9"
+     height="1"
+     id="rect8"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="29"
+     y="19"
+     width="10"
+     height="1"
+     id="rect10"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="31"
+     y="15"
+     width="7"
+     height="1"
+     id="rect12"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="32"
+     y="13"
+     width="6"
+     height="1"
+     id="rect14"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="33"
+     y="11"
+     width="4"
+     height="1"
+     id="rect16"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="33"
+     y="9"
+     width="3"
+     height="1"
+     id="rect18"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="33"
+     y="7"
+     width="2"
+     height="1"
+     id="rect20"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="28.009998"
+     y="21"
+     width="10.99"
+     height="1"
+     id="rect22"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="26"
+     y="23"
+     width="12"
+     height="1"
+     id="rect24"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="25"
+     y="25"
+     width="13"
+     height="1"
+     id="rect26"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="15"
+     y="27"
+     width="29"
+     height="1"
+     id="rect28"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="14"
+     y="29"
+     width="32"
+     height="1"
+     id="rect30"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="14"
+     y="31"
+     width="28"
+     height="1"
+     id="rect32"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="24"
+     y="33"
+     width="13"
+     height="1"
+     id="rect34"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="25"
+     y="35"
+     width="11"
+     height="1"
+     id="rect36"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="25"
+     y="37"
+     width="10"
+     height="1"
+     id="rect38"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="25"
+     y="39"
+     width="9"
+     height="1"
+     id="rect40"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="25"
+     y="41"
+     width="8"
+     height="1"
+     id="rect42"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="25"
+     y="43"
+     width="7"
+     height="1"
+     id="rect44"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="25"
+     y="45"
+     width="6"
+     height="1"
+     id="rect46"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="25"
+     y="47"
+     width="4"
+     height="1"
+     id="rect48"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="24"
+     y="49"
+     width="2"
+     height="1"
+     id="rect50"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="14"
+     y="25"
+     width="5"
+     height="1"
+     id="rect52"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="13"
+     y="23"
+     width="4"
+     height="1"
+     id="rect54"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-1"
+     x="12"
+     y="33"
+     width="3"
+     height="1"
+     id="rect56"
+     style="fill:#483aaa" />
+  <rect
+     class="cls-2"
+     x="19"
+     y="2"
+     width="13"
+     height="1"
+     id="rect58"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="15"
+     y="4"
+     width="6"
+     height="1"
+     id="rect60"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="23.5"
+     y="4"
+     width="12.5"
+     height="1"
+     id="rect62"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="25"
+     y="6"
+     width="14"
+     height="1"
+     id="rect64"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="12"
+     y="6"
+     width="10"
+     height="1"
+     id="rect66"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="10"
+     y="8"
+     width="12"
+     height="1"
+     id="rect68"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="27"
+     y="8"
+     width="14"
+     height="1"
+     id="rect70"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="28"
+     y="10"
+     width="15"
+     height="1"
+     id="rect72"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="8"
+     y="10"
+     width="14"
+     height="1"
+     id="rect74"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="30"
+     y="12"
+     width="15"
+     height="1"
+     id="rect76"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="6"
+     y="12"
+     width="16"
+     height="1"
+     id="rect78"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="31"
+     y="14"
+     width="15"
+     height="1"
+     id="rect80"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="5"
+     y="14"
+     width="17"
+     height="1"
+     id="rect82"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="4"
+     y="16"
+     width="18"
+     height="1"
+     id="rect84"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="33"
+     y="16"
+     width="14"
+     height="1"
+     id="rect86"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="33"
+     y="18"
+     width="15"
+     height="1"
+     id="rect88"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="3"
+     y="18"
+     width="18"
+     height="1"
+     id="rect90"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="9"
+     y="20"
+     width="11"
+     height="1"
+     id="rect92"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="31"
+     y="20"
+     width="17"
+     height="1"
+     id="rect94"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="3"
+     y="20"
+     width="4"
+     height="1"
+     id="rect96"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="2"
+     y="22"
+     width="6"
+     height="1"
+     id="rect98"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="35"
+     y="22"
+     width="14"
+     height="1"
+     id="rect100"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="2"
+     y="24"
+     width="6"
+     height="1"
+     id="rect102"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="39"
+     y="24"
+     width="10"
+     height="1"
+     id="rect104"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="19"
+     y="46"
+     width="13"
+     height="1"
+     id="rect106"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="15"
+     y="44"
+     width="3"
+     height="1"
+     id="rect108"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="20"
+     y="44"
+     width="16"
+     height="1"
+     id="rect110"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="12"
+     y="42"
+     width="6"
+     height="1"
+     id="rect112"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="22"
+     y="42"
+     width="17"
+     height="1"
+     id="rect114"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="24"
+     y="40"
+     width="17"
+     height="1"
+     id="rect116"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="10"
+     y="40"
+     width="9"
+     height="1"
+     id="rect118"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="8"
+     y="38"
+     width="11"
+     height="1"
+     id="rect120"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="25"
+     y="38"
+     width="18"
+     height="1"
+     id="rect122"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="6"
+     y="36"
+     width="13"
+     height="1"
+     id="rect124"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="27"
+     y="36"
+     width="18"
+     height="1"
+     id="rect126"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="5"
+     y="34"
+     width="14"
+     height="1"
+     id="rect128"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="28"
+     y="34"
+     width="18"
+     height="1"
+     id="rect130"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="4"
+     y="32"
+     width="15"
+     height="1"
+     id="rect132"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="29"
+     y="32"
+     width="18"
+     height="1"
+     id="rect134"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="30"
+     y="30"
+     width="18"
+     height="1"
+     id="rect136"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="3"
+     y="30"
+     width="16"
+     height="1"
+     id="rect138"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="10"
+     y="28"
+     width="9"
+     height="1"
+     id="rect140"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="3"
+     y="28"
+     width="3"
+     height="1"
+     id="rect142"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="31"
+     y="28"
+     width="17"
+     height="1"
+     id="rect144"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="36"
+     y="26"
+     width="13"
+     height="1"
+     id="rect146"
+     style="fill:#afa7e9" />
+  <rect
+     class="cls-2"
+     x="2"
+     y="26"
+     width="5"
+     height="1"
+     id="rect148"
+     style="fill:#afa7e9" />
+</svg>
--- a/static/static/img/mstile-144x144.png
+++ b/static/static/img/mstile-144x144.png
--- a/static/static/img/mstile-150x150.png
+++ b/static/static/img/mstile-150x150.png
--- a/static/static/img/mstile-310x150.png
+++ b/static/static/img/mstile-310x150.png
--- a/static/static/img/mstile-310x310.png
+++ b/static/static/img/mstile-310x310.png
--- a/static/static/img/mstile-70x70.png
+++ b/static/static/img/mstile-70x70.png
--- a/static/static/img/safari-pinned-tab.svg
+++ b/static/static/img/safari-pinned-tab.svg
@ -0,0 +1,106 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
+ "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
+<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
+ width="700.000000pt" height="700.000000pt" viewBox="0 0 700.000000 700.000000"
+ preserveAspectRatio="xMidYMid meet">
+<metadata>
+Created by potrace 1.11, written by Peter Selinger 2001-2013
+</metadata>
+<g transform="translate(0.000000,700.000000) scale(0.100000,-0.100000)"
+fill="#000000" stroke="none">
+<path d="M2615 6722 c-3 -3 -5 -34 -5 -69 l0 -63 889 0 889 0 3 23 c2 12 2 42
+-1 67 l-5 46 -883 0 c-485 0 -885 -2 -887 -4z"/>
+<path d="M2060 6381 l0 -68 410 0 c364 1 410 2 411 16 1 17 1 88 0 109 -1 9
+-90 12 -411 12 l-410 0 0 -69z"/>
+<path d="M3225 6383 l1 -68 857 -1 857 0 0 68 0 68 -858 0 -858 0 1 -67z"/>
+<path d="M1649 6161 c-3 -49 -1 -112 3 -116 4 -5 556 -7 1271 -5 l98 0 -3 68
+-3 67 -682 1 c-618 1 -683 -1 -684 -15z"/>
+<path d="M3435 6172 c-3 -3 -5 -34 -5 -69 l0 -63 118 0 c64 0 312 0 550 0
+l432 0 0 -69 0 -70 -404 1 c-222 0 -408 -2 -413 -5 -5 -4 -9 -34 -8 -69 l2
+-63 411 0 412 0 0 -67 0 -68 -152 -1 c-84 0 -239 0 -344 1 l-191 1 0 -71 1
+-70 343 0 343 0 0 -69 0 -69 -205 2 c-199 1 -205 0 -206 -19 -2 -60 -1 -104 4
+-112 3 -5 64 -8 136 -8 l131 1 0 -68 0 -68 -64 0 c-42 0 -65 -4 -68 -12 -2 -7
+-4 -69 -4 -138 l1 -125 138 0 138 0 -3 -69 -3 -70 -202 1 -203 1 -1 -34 c-1
+-19 -1 -45 -1 -59 0 -14 0 -29 1 -35 1 -6 77 -10 206 -10 l206 0 -3 -67 -3
+-68 -235 -2 c-129 -1 -252 -2 -273 -3 l-38 0 3 -67 3 -68 135 0 136 0 -1 -62
+c0 -34 -3 -65 -7 -69 -4 -3 -96 -7 -205 -8 l-198 -1 0 -65 0 -65 480 -5 480
+-5 -1 -65 0 -65 -614 -1 -615 0 -3 -64 c-2 -35 1 -66 7 -69 7 -5 1585 -7 1627
+-2 11 1 13 108 2 126 -4 7 249 10 753 9 417 0 760 3 760 8 1 4 3 35 3 68 l2
+60 -686 0 -686 0 -2 68 -2 69 588 1 c323 0 602 1 620 1 l33 1 -3 68 -3 67
+-615 0 -616 0 -1 67 -2 68 72 0 c40 0 317 1 617 3 l545 2 3 68 3 67 -619 0
+-619 0 0 68 -1 68 537 -1 c295 0 542 1 549 3 8 3 12 26 12 71 l0 66 -617 0
+-617 0 -1 68 -1 67 548 0 c541 0 548 0 549 20 1 11 2 41 2 68 l1 47 -550 0
+-550 0 1 70 0 70 481 0 481 0 0 67 c0 66 -1 68 -26 69 -14 0 -261 1 -548 1
+l-523 1 0 69 0 68 410 0 c403 0 410 0 411 20 0 11 1 41 1 68 l1 47 -419 2
+c-230 1 -447 3 -481 3 l-63 0 0 68 0 67 343 0 342 0 3 68 2 67 -32 1 c-18 0
+-204 0 -413 0 l-381 1 0 69 1 70 210 -1 c115 -1 239 -1 275 -1 l65 1 -1 67 -2
+68 -956 1 c-526 0 -958 -1 -961 -4z"/>
+<path d="M1404 5902 l-32 -3 -1 -65 c0 -35 3 -65 7 -65 4 -1 375 -2 825 -3
+l817 -1 0 67 c0 67 0 68 -27 69 -120 2 -1565 3 -1589 1z"/>
+<path d="M1098 5576 c-1 -29 -2 -61 0 -70 3 -15 84 -16 963 -16 l959 0 0 69 0
+69 -959 1 -959 0 -4 -53z"/>
+<path d="M842 5352 c-21 -3 -22 -7 -18 -70 2 -37 5 -67 5 -67 1 0 494 0 1096
+0 l1096 0 -3 69 -3 69 -1075 1 c-591 1 -1085 0 -1098 -2z"/>
+<path d="M688 5072 c-3 -6 -2 -68 1 -114 1 -17 64 -18 1166 -18 l1165 0 0 69
+0 70 -1165 0 c-640 0 -1166 -3 -1167 -7z"/>
+<path d="M554 4801 c-11 -11 -3 -129 9 -133 6 -2 561 -3 1232 -3 l1220 1 3 69
+3 70 -1231 0 c-678 0 -1234 -2 -1236 -4z"/>
+<path d="M410 4460 l0 -70 1237 2 1237 3 -1 55 c-1 30 -2 61 -2 68 -1 9 -255
+12 -1236 12 l-1235 0 0 -70z"/>
+<path d="M414 4251 c-2 -2 -4 -33 -4 -68 0 -53 3 -63 18 -64 23 -1 503 -1 520
+0 8 1 12 22 12 69 l0 67 -271 0 c-149 0 -273 -2 -275 -4z"/>
+<path d="M1239 4255 c-7 0 -3 -128 4 -132 8 -5 1320 -8 1473 -4 l30 1 -2 63
+c-1 34 -2 64 -3 67 0 3 -338 5 -751 5 -412 0 -751 0 -751 0z"/>
+<path d="M273 3913 l2 -68 410 0 410 0 3 68 3 67 -415 0 -414 0 1 -67z"/>
+<path d="M1809 3840 c-22 -5 -24 -9 -23 -60 1 -30 2 -59 3 -65 0 -6 99 -10
+271 -10 263 0 270 1 271 20 5 112 5 115 -11 116 -66 4 -491 3 -511 -1z"/>
+<path d="M279 3706 c-1 -1 -2 -31 -3 -68 l-2 -68 413 0 414 0 -3 68 -3 67
+-407 1 c-225 0 -408 0 -409 0z"/>
+<path d="M5356 3701 c-2 -4 -4 -34 -4 -68 l0 -63 687 0 688 0 -3 63 c-1 34 -2
+64 -3 67 -1 8 -1361 8 -1365 1z"/>
+<path d="M1920 3500 l0 -70 345 0 344 0 0 70 0 70 -345 0 -344 0 0 -70z"/>
+<path d="M3430 3500 l0 -70 755 0 756 0 -3 -67 -3 -68 -1437 0 -1438 0 0 -70
+0 -70 -342 0 -343 0 -3 -67 -3 -68 275 0 274 0 4 -54 c1 -29 2 -60 0 -68 -2
+-13 -99 -15 -740 -16 -405 0 -745 -1 -754 -1 -15 -1 -18 -11 -18 -65 0 -42 4
+-65 13 -68 6 -2 347 -4 757 -4 l745 1 -2 -50 c-1 -27 -2 -58 -2 -67 -1 -17
+-41 -18 -686 -18 l-685 0 0 -70 0 -70 548 0 549 0 0 -68 0 -68 -466 1 c-256 0
+-473 -2 -481 -6 -11 -5 -15 -22 -14 -61 0 -30 3 -59 6 -64 4 -5 381 -9 960 -9
+l953 0 3 64 c2 35 -1 67 -7 70 -5 3 -129 6 -275 5 l-266 -1 0 69 0 68 276 0
+276 0 -2 38 c-1 20 -2 51 -1 69 l1 32 685 0 685 -1 0 -69 0 -69 -343 0 -343 0
+0 -67 1 -68 275 0 275 0 0 -70 0 -71 -207 1 -208 1 0 -68 0 -67 138 -3 137 -3
+0 -65 0 -65 -105 -2 c-58 -1 -120 -2 -137 -2 l-33 -1 0 -205 0 -205 -68 0 -68
+0 0 -67 1 -68 68 -3 67 -3 0 -67 0 -67 -205 0 -205 0 0 -67 c0 -64 1 -68 23
+-69 12 0 104 0 205 0 l182 0 0 -70 0 -69 -343 0 -342 0 1 -62 c1 -35 2 -66 3
+-69 0 -3 154 -5 341 -5 l341 1 -3 -69 -3 -70 -407 0 c-387 0 -408 -1 -409 -18
+0 -10 -1 -39 -1 -65 l-1 -48 412 -3 411 -2 0 -70 0 -70 275 0 275 0 0 70 0 70
+205 0 c230 0 207 -8 207 75 0 67 3 64 -62 61 -33 -1 -63 0 -68 3 -7 5 -9 106
+-3 131 0 3 154 5 341 4 l340 -1 0 68 0 69 -275 0 -276 0 2 69 2 69 475 0 c311
+0 477 3 481 10 5 8 6 98 2 122 -1 3 -186 5 -411 5 l-411 0 3 68 3 68 545 2
+545 2 3 68 3 67 -481 0 c-450 0 -480 1 -481 18 -2 24 -2 73 0 98 l1 21 610 0
+c336 0 613 3 616 6 6 6 7 30 5 102 l-1 30 -554 0 c-490 0 -553 2 -547 15 4 8
+6 38 6 65 l-1 50 686 5 685 5 0 65 0 65 -618 3 -618 2 3 68 3 67 677 0 c372 0
+680 4 684 7 4 4 8 33 8 64 1 41 -2 58 -14 63 -8 4 -287 6 -620 6 l-605 -1 3
+68 4 68 684 0 684 0 0 70 0 71 -349 -3 c-231 -2 -347 0 -343 7 4 6 7 37 7 70
+l0 60 410 0 410 0 3 68 3 67 -33 1 c-18 1 -71 1 -118 0 -132 -1 -129 -2 -127
+71 l2 63 138 3 137 3 0 68 0 68 -272 -1 -273 0 -5 69 -5 70 345 0 345 0 1 68
+0 67 -753 0 c-595 0 -753 3 -754 13 -1 6 -3 32 -4 57 -1 25 -3 51 -4 58 -1 9
+-186 12 -891 12 l-890 0 0 -70z m825 -409 l0 -66 -825 -3 -825 -2 3 57 c2 32
+5 63 7 69 2 7 250 10 822 10 l818 0 0 -65z m-137 -267 c-1 -33 1 -64 4 -70 4
+-5 -285 -9 -756 -9 l-761 0 1 25 c2 14 3 44 3 67 1 40 3 42 34 45 17 2 357 3
+754 3 l723 0 -2 -61z"/>
+<path d="M276 3368 c1 -35 2 -65 3 -69 0 -3 153 -5 339 -5 l337 1 3 68 3 67
+-344 0 -343 0 2 -62z"/>
+<path d="M415 3152 c-3 -3 -5 -34 -5 -69 l0 -63 208 0 207 0 0 65 c0 36 -2 66
+-5 66 -17 5 -401 5 -405 1z"/>
+<path d="M825 1993 l0 -68 893 -3 892 -2 0 70 0 70 -893 0 -893 0 1 -67z"/>
+<path d="M1099 1745 c-1 -49 2 -89 7 -94 3 -3 1420 -5 1487 -2 16 1 18 9 15
+68 l-3 68 -752 0 -753 0 -1 -40z"/>
+<path d="M1370 1440 l0 -70 618 2 617 3 3 68 3 67 -621 0 -620 0 0 -70z"/>
+<path d="M1649 1220 c-4 -87 -3 -113 4 -117 7 -4 632 -7 790 -4 27 1 27 2 27
+69 l0 67 -410 0 c-358 0 -410 -2 -411 -15z"/>
+<path d="M2060 891 l0 -68 205 0 205 1 0 68 0 68 -205 0 -205 0 0 -69z"/>
+<path d="M3301 270 c-4 -3 -7 -33 -7 -67 0 -50 3 -63 16 -64 22 -1 222 -1 243
+0 14 1 17 11 17 66 0 36 -3 65 -7 66 -30 4 -256 3 -262 -1z"/>
+</g>
+</svg>
--- a/themes/datacoop2020/README.md
+++ b/themes/datacoop2020/README.md
@ -1,174 +0,0 @@
-# Minimal Bootstrap Hugo Theme
-
-[![Netlify Status](https://api.netlify.com/api/v1/badges/e3929c16-50cc-4e8f-a8f2-e63acc35c83d/deploy-status)](https://app.netlify.com/sites/minimal-bootstrap-hugo-theme/deploys)
-
-A minimal hugo theme made with bootstrap that focuses on content readability. 
-
-## Table of contents
-
- [Demo](#demo)
- [Minimum Hugo version](#minimum-hugo-version)
- [Installation](#installation)
- [Updating](#updating)
- [Run example site](#run-example-site)
- [Configuration](#configuration)
- [Favicons](#favicons)
- [Override](#override)
-  - [Homepage example](#homepage-example)
-  - [Configure cookie consent](#configure-cookie-consent)
- [Syntax highlighting](#syntax-highlighting)
- [Shortcodes](#shortcodes)
-  - [`blockquote`](#blockquote)
-  - [`imgAbs`](#imgabs)
-  - [`imgRel`](#imgrel)
-  - [`imgProc`](#imgproc)
-  - [`mastodon`](#mastodon)
- [Getting help](#getting-help)
- [Stackbit Deploy](#stackbit-deploy)
-
-## Demo
-
-https://minimal-bootstrap-hugo-theme.netlify.com/
-
-## Minimum Hugo version
-
-Hugo version `0.60.1` or higher is required. View the [Hugo releases](https://github.com/gohugoio/hugo/releases) and download the binary for your OS.
-
-## Installation
-
-From the root of your site:
-
-```
-git submodule add https://github.com/zwbetz-gh/minimal-bootstrap-hugo-theme.git themes/minimal-bootstrap-hugo-theme
-```
-
-## Updating
-
-From the root of your site:
-
-```
-git submodule update --remote --merge
-```
-
-## Run example site
-
-From the root of `themes/minimal-bootstrap-hugo-theme/exampleSite`:
-
-```
-hugo server --themesDir ../..
-```
-
-## Configuration
-
-Copy the `config.toml` from the [`exampleSite`](https://github.com/zwbetz-gh/minimal-bootstrap-hugo-theme/tree/master/exampleSite), then edit as desired.
-
-## Favicons
-
-Upload your image to [RealFaviconGenerator](https://realfavicongenerator.net/) then copy-paste the generated favicon files under `static`. 
-
-## Override
-
-### Homepage example
-
-As an example, let's say you didn't like the default homepage, and wanted to design one of your own. To do this, you would:
-
-1. Copy file `YOUR_SITE/themes/minimal-bootstrap-hugo-theme/layouts/index.html`
-1. Paste that file to `YOUR_SITE/layouts/index.html`
-1. Edit `index.html` as desired
-
-### Configure cookie consent
-
-You can change the position, layout, color palette, "Learn more" link, compliance type, and custom text of the cookie consent popup. To do this, you would:
-
-1. Copy file `YOUR_SITE/themes/minimal-bootstrap-hugo-theme/layouts/partials/cookie-consent.html`
-1. Paste that file to `YOUR_SITE/layouts/partials/cookie-consent.html`
-1. Complete the [cookie consent wizard](https://cookieconsent.insites.com/download/)
-1. Paste the generated code from the wizard into `cookie-consent.html`
-
-## Syntax highlighting
-
-Hugo has built-in syntax highlighting, provided by Chroma. It is currently enabled in the `config.toml` file from the [`exampleSite`](https://github.com/zwbetz-gh/minimal-bootstrap-hugo-theme/tree/master/exampleSite).
-
-Checkout the [Chroma style gallery](https://xyproto.github.io/splash/docs/all.html) and choose the style you like.
-
-## Shortcodes
-
-### `blockquote`
-
-This will format your blockquotes nicely. To use it, put the quote within the shortcode. The `author` argument is optional.
-
-```
-{{< blockquote author="Laura Ingalls" >}}
-I am beginning to learn that it is the sweet, **simple** things of life which are the real ones after all.  
-{{< /blockquote >}}
-```
-
-### `imgAbs`
-
-This will insert an image into your content by absolute path. To use it, pass the `pathURL` of your image. 
-
-These arguments are optional: `alt`, `class`, `style`.
-
-```
-{{< imgAbs 
-pathURL="img/some-img.png" 
-alt="Some description" 
-class="some-class" 
-style="some-style" >}}
-```
-
-### `imgRel`
-
-This will insert an image into your content by relative path. To use it, pass the `pathURL` of your image. 
-
-These arguments are optional: `alt`, `class`, `style`.
-
-```
-{{< imgRel 
-pathURL="img/some-img.png" 
-alt="Some description" 
-class="some-class" 
-style="some-style" >}}
-```
-
-### `imgProc`
-
-This will process an image from a [page bundle](https://gohugo.io/content-management/page-bundles/), then provide a link to the original image. To use it, pass the image name, command, and command options. 
-
-The `command` argument will be one of: `Resize`, `Fit`, `Fill`. For a deeper dive see the [hugo docs for image processing](https://gohugo.io/content-management/image-processing/). 
-
-These arguments are optional: `alt`, `class`, `style`.
-
-The below example resizes an image to 800px width, while keeping the aspect ratio. 
-
-```
-{{< imgProc 
-img="some-img.png" 
-command="Resize" 
-options="800x" 
-alt="Some description" 
-class="some-class" 
-style="some-style" >}}
-```
-
-### `mastodon`
-
-This will embed a toot in an `iframe`.
-
-These arguments are optional: `width`, `height`.
-
-```
-{{% mastodon
-status="https://mastodon.social/@kevingimbel/100700713283716694"
-width="1000" height="500" %}}
-```
-
-## Getting help
-
-If you run into an issue that isn't answered by this documentation or the [`exampleSite`](https://github.com/zwbetz-gh/minimal-bootstrap-hugo-theme/tree/master/exampleSite), then visit the [Hugo forum](https://discourse.gohugo.io/). The folks there are helpful and friendly. **Before** asking your question, be sure to read the [requesting help guidelines](https://discourse.gohugo.io/t/requesting-help/9132). Feel free to tag me in your question, my forum username is [@zwbetz](https://discourse.gohugo.io/u/zwbetz/summary).
-
-## Stackbit Deploy
-
-This theme is ready to import into Stackbit. This theme can be deployed to Netlify and you can connect any headless CMS including Forestry, NetlifyCMS, DatoCMS, or Contentful.  
-
-[![Create with Stackbit](https://assets.stackbit.com/badge/create-with-stackbit.svg)](https://app.stackbit.com/create?theme=https://github.com/zwbetz-gh/minimal-bootstrap-hugo-theme)
--- a/themes/datacoop2020/assets/static/css/style.scss
+++ b/themes/datacoop2020/assets/static/css/style.scss
@ -39,66 +39,175 @@ $font-family-base: "Space Grotesk";
 $font-family-monospace: "Space Mono";

 $datacoop-purple: #4B3ABA;
-$data-coop-light-blue: #A8F3F4;
-$data-coop-curry: #BA8D21;
-$data-coop-grey: #BCB8B3;
+$datacoop-light-blue: #A8F3F4;
+$datacoop-curry: #BA8D21;
+$datacoop-grey: #BCB8B3;

-$fair-light-bluegreen: rgb(226, 243, 245);
-$fair-light-green: rgb(165, 206, 190);
-$fair-light-red: rgb(253, 210, 188);
-$fair-light-yellow: rgb(255, 249, 184);
-$fair-light-blue: rgb(181, 201, 232);
+
+$datacoop-curry-light: lighten($datacoop-curry, 12%);
+$datacoop-curry-lighter: lighten($datacoop-curry, 38%);
+
+$datacoop-grey: #BCB8B3;


 $primary:             $datacoop-purple;
-$secondary:           $data-coop-light-blue;
+$secondary:           $datacoop-light-blue;
 $success:             $datacoop-purple;
-$info:                $data-coop-grey;
-$warning:             $data-coop-curry;
-$danger:              $data-coop-curry;
-
+$info:                $datacoop-grey;
+$warning:             $datacoop-curry;
+$danger:              $datacoop-curry;

+$body-color: $datacoop-purple;



@import "bootstrap/bootstrap";

+html
+{
+  height: 100%;
+}
+
 body {
  min-width: 300px;
+  padding: 0;
+  height: 100%;
 }

-.custom-navbar {
-  margin-bottom: 1em;
-  height: 60px;
-}
+.everything-container {
+  height: 100%;
+  max-width: 1200px;
+  padding: 0;  // Overwrites .container-fluid
+  margin: 0;  // Overwrites .container-fluid

-.custom-navbar a {
-  display: inline-block; 
-  padding: 18px 0;
-  margin-right: 1em; 
-  font-weight: bold; 
-}
-
-.custom-navbar a:hover,
-.custom-navbar a:focus {
-  text-decoration: none; 
-}
-
-@media print {
-  .custom-navbar {
-    display: none;
+  > .row
+  {
+    max-width: 1200px;
+    margin: 0;  // Overwrites .row
+  height: 100%;
  }
+  
+}
+
+.datacoop-sidebar {
+  background-color: $datacoop-light-blue;
+}
+
+.datacoop-navbar {
+
+  background-color: $datacoop-light-blue;
+  color: $datacoop-purple;
+  height: 100%;
+  padding: 40px;
+  
+  a {
+    color: $datacoop-purple;
+  }
+
+  .datacoop-menulists
+  {
+    position: absolute;
+    bottom: 20px;
+  }
+
+  .data-coop-sidebar-logo
+  {
+    display: block;
+    width: 100%;
+    img {
+      display: block;
+      width: 100%;
+    }
+    font-size: 20px;
+  }
+
+  ul
+  {
+    list-style-type: none;
+    padding: 0;
+    margin: 0;
+  }
+
+
+  ul > li
+  {
+    list-style-type: none;
+    display: block;
+  }
+
+  ul > li > a
+  {
+    font-size: 40px;
+  }
+
+  ul.datacoop-langchooser
+  {
+    margin-top: 20px;
+    li {
+      display: inline-block;
+      margin-right: 20px;
+      a {
+        font-size: 18px;
+        text-transform: uppercase;
+      }
+    }
+  }
+
+  margin-bottom: 1em;
+}
+
+.datacoop-sidebar-gutter
+{
+  writing-mode: vertical-lr;
+  transform: rotate(180deg);
+  max-width: auto !important;  // overwrites col-md
+  flex: 0 0 0; // overwrites col-md
+  width: auto;
+  padding: 20px 10px;
+  background-color: $datacoop-curry-lighter;
+  color: $datacoop-purple;  
+  font-family: $font-family-monospace;
+  font-size: 12px;
+  
+}
+
+.datacoop-sidebar-gutter-right
+{
+  writing-mode: horizontal-lr;
+  transform: rotate(0);
+
+  padding: 0;
+  min-width: 33px;
+
+  .sidebar-rotated
+  {
+    transform: rotate(180deg);  
+    writing-mode: vertical-lr;
+    width: 500px;
+    font-size: 16px;
+    white-space: nowrap;
+    img {
+      width: 100%;
+      background-color: $datacoop-light-blue;
+    }
+  }
+
+}
+
+
+.datacoop-container-content
+{
+  padding: 30px 50px;
 }

 article {
-  padding-bottom: 1em;
+  padding: 1em 0;
 }

 img {
  max-width: 100%;
 }

-
 pre {
  display: block;
  padding: 9.5px;
@ -136,4 +245,9 @@ blockquote,
  border-left: 5px solid #6c757d;
 }

+h1, h2, h3, h4
+{
+  text-align: center;
+  font-weight: bold;
+}

--- a/themes/datacoop2020/gh-md-toc
+++ b/themes/datacoop2020/gh-md-toc
@ -1,256 +0,0 @@
-#!/usr/bin/env bash
-
-#
-# Steps:
-#
-#  1. Download corresponding html file for some README.md:
-#       curl -s $1
-#
-#  2. Discard rows where no substring 'user-content-' (github's markup):
-#       awk '/user-content-/ { ...
-#
-#  3.1 Get last number in each row like ' ... </span></a>sitemap.js</h1'.
-#      It's a level of the current header:
-#       substr($0, length($0), 1)
-#
-#  3.2 Get level from 3.1 and insert corresponding number of spaces before '*':
-#       sprintf("%*s", substr($0, length($0), 1)*3, " ")
-#
-#  4. Find head's text and insert it inside "* [ ... ]":
-#       substr($0, match($0, /a>.*<\/h/)+2, RLENGTH-5)
-#
-#  5. Find anchor and insert it inside "(...)":
-#       substr($0, match($0, "href=\"[^\"]+?\" ")+6, RLENGTH-8)
-#
-
-gh_toc_version="0.5.0"
-
-gh_user_agent="gh-md-toc v$gh_toc_version"
-
-#
-# Download rendered into html README.md by its url.
-#
-#
-gh_toc_load() {
-    local gh_url=$1
-
-    if type curl &>/dev/null; then
-        curl --user-agent "$gh_user_agent" -s "$gh_url"
-    elif type wget &>/dev/null; then
-        wget --user-agent="$gh_user_agent" -qO- "$gh_url"
-    else
-        echo "Please, install 'curl' or 'wget' and try again."
-        exit 1
-    fi
-}
-
-#
-# Converts local md file into html by GitHub
-#
-# ➥ curl -X POST --data '{"text": "Hello world github/linguist#1 **cool**, and #1!"}' https://api.github.com/markdown
-# <p>Hello world github/linguist#1 <strong>cool</strong>, and #1!</p>'"
-gh_toc_md2html() {
-    local gh_file_md=$1
-    URL=https://api.github.com/markdown/raw
-    TOKEN="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)/token.txt"
-    if [ -f "$TOKEN" ]; then
-        URL="$URL?access_token=$(cat $TOKEN)"
-    fi
-    OUTPUT="$(curl -s --user-agent "$gh_user_agent" \
-        --data-binary @"$gh_file_md" -H "Content-Type:text/plain" \
-        $URL)"
-
-    if [ "$?" != "0" ]; then
-        echo "XXNetworkErrorXX"
-    fi
-    if [ "$(echo "${OUTPUT}" | awk '/API rate limit exceeded/')" != "" ]; then
-        echo "XXRateLimitXX"
-    else
-        echo "${OUTPUT}"
-    fi
-}
-
-
-#
-# Is passed string url
-#
-gh_is_url() {
-    case $1 in
-        https* | http*)
-            echo "yes";;
-        *)
-            echo "no";;
-    esac
-}
-
-#
-# TOC generator
-#
-gh_toc(){
-    local gh_src=$1
-    local gh_src_copy=$1
-    local gh_ttl_docs=$2
-    local need_replace=$3
-
-    if [ "$gh_src" = "" ]; then
-        echo "Please, enter URL or local path for a README.md"
-        exit 1
-    fi
-
-
-    # Show "TOC" string only if working with one document
-    if [ "$gh_ttl_docs" = "1" ]; then
-
-        echo "Table of Contents"
-        echo "================="
-        echo ""
-        gh_src_copy=""
-
-    fi
-
-    if [ "$(gh_is_url "$gh_src")" == "yes" ]; then
-        gh_toc_load "$gh_src" | gh_toc_grab "$gh_src_copy"
-        if [ "${PIPESTATUS[0]}" != "0" ]; then
-            echo "Could not load remote document."
-            echo "Please check your url or network connectivity"
-            exit 1
-        fi
-        if [ "$need_replace" = "yes" ]; then
-            echo
-            echo "!! '$gh_src' is not a local file"
-            echo "!! Can't insert the TOC into it."
-            echo
-        fi
-    else
-        local rawhtml=$(gh_toc_md2html "$gh_src")
-        if [ "$rawhtml" == "XXNetworkErrorXX" ]; then
-             echo "Parsing local markdown file requires access to github API"
-             echo "Please make sure curl is installed and check your network connectivity"
-             exit 1
-        fi
-        if [ "$rawhtml" == "XXRateLimitXX" ]; then
-             echo "Parsing local markdown file requires access to github API"
-             echo "Error: You exceeded the hourly limit. See: https://developer.github.com/v3/#rate-limiting"
-             TOKEN="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)/token.txt"
-             echo "or place github auth token here: $TOKEN"
-             exit 1
-        fi
-        local toc=`echo "$rawhtml" | gh_toc_grab "$gh_src_copy"`
-        echo "$toc"
-        if [ "$need_replace" = "yes" ]; then
-            local ts="<\!--ts-->"
-            local te="<\!--te-->"
-            local dt=`date +'%F_%H%M%S'`
-            local ext=".orig.${dt}"
-            local toc_path="${gh_src}.toc.${dt}"
-            local toc_footer="<!-- Added by: `whoami`, at: `date --iso-8601='minutes'` -->"
-            # http://fahdshariff.blogspot.ru/2012/12/sed-mutli-line-replacement-between-two.html
-            # clear old TOC
-            sed -i${ext} "/${ts}/,/${te}/{//!d;}" "$gh_src"
-            # create toc file
-            echo "${toc}" > "${toc_path}"
-            echo -e "\n${toc_footer}\n" >> "$toc_path"
-            # insert toc file
-            if [[ "`uname`" == "Darwin" ]]; then
-                sed -i "" "/${ts}/r ${toc_path}" "$gh_src"
-            else
-                sed -i "/${ts}/r ${toc_path}" "$gh_src"
-            fi
-            echo
-            echo "!! TOC was added into: '$gh_src'"
-            echo "!! Origin version of the file: '${gh_src}${ext}'"
-            echo "!! TOC added into a separate file: '${toc_path}'"
-            echo
-        fi
-    fi
-}
-
-#
-# Grabber of the TOC from rendered html
-#
-# $1 — a source url of document.
-# It's need if TOC is generated for multiple documents.
-#
-gh_toc_grab() {
-	# if closed <h[1-6]> is on the new line, then move it on the prev line
-	# for example:
-	# 	was: The command <code>foo1</code>
-	# 		 </h1>
-	# 	became: The command <code>foo1</code></h1>
-    sed -e ':a' -e 'N' -e '$!ba' -e 's/\n<\/h/<\/h/g' |
-    # find strings that corresponds to template
-    grep -E -o '<a.*id="user-content-[^"]*".*</h[1-6]' |
-    # remove code tags
-    sed 's/<code>//' | sed 's/<\/code>//' |
-    # now all rows are like:
-    #   <a id="user-content-..." href="..."><span ...></span></a> ... </h1
-    # format result line
-    #   * $0 — whole string
-    echo -e "$(awk -v "gh_url=$1" '{
-    print sprintf("%*s", substr($0, length($0), 1)*3, " ") "* [" substr($0, match($0, /a>.*<\/h/)+2, RLENGTH-5)"](" gh_url substr($0, match($0, "href=\"[^\"]+?\" ")+6, RLENGTH-8) ")"}' | sed 'y/+/ /; s/%/\\x/g')"
-}
-
-#
-# Returns filename only from full path or url
-#
-gh_toc_get_filename() {
-    echo "${1##*/}"
-}
-
-#
-# Options hendlers
-#
-gh_toc_app() {
-    local app_name=$(basename $0)
-    local need_replace="no"
-
-    if [ "$1" = '--help' ] || [ $# -eq 0 ] ; then
-        echo "GitHub TOC generator ($app_name): $gh_toc_version"
-        echo ""
-        echo "Usage:"
-        echo "  $app_name [--insert] src [src]  Create TOC for a README file (url or local path)"
-        echo "  $app_name -                     Create TOC for markdown from STDIN"
-        echo "  $app_name --help                Show help"
-        echo "  $app_name --version             Show version"
-        return
-    fi
-
-    if [ "$1" = '--version' ]; then
-        echo "$gh_toc_version"
-        return
-    fi
-
-    if [ "$1" = "-" ]; then
-        if [ -z "$TMPDIR" ]; then
-            TMPDIR="/tmp"
-        elif [ -n "$TMPDIR" -a ! -d "$TMPDIR" ]; then
-            mkdir -p "$TMPDIR"
-        fi
-        local gh_tmp_md
-        gh_tmp_md=$(mktemp $TMPDIR/tmp.XXXXXX)
-        while read input; do
-            echo "$input" >> "$gh_tmp_md"
-        done
-        gh_toc_md2html "$gh_tmp_md" | gh_toc_grab ""
-        return
-    fi
-
-    if [ "$1" = '--insert' ]; then
-        need_replace="yes"
-        shift
-    fi
-
-    for md in "$@"
-    do
-        echo ""
-        gh_toc "$md" "$#" "$need_replace"
-    done
-
-    echo ""
-    echo "Created by [gh-md-toc](https://github.com/ekalinin/github-markdown-toc)"
-}
-
-#
-# Entry point
-#
-gh_toc_app "$@"
--- a/themes/datacoop2020/layouts/_default/baseof.html
+++ b/themes/datacoop2020/layouts/_default/baseof.html
@ -4,23 +4,53 @@
 {{ partial "head.html" . }}

 <body>
-  {{ partial "nav.html" . }}
-  
-  <div class="container">
-    <article>
-      {{ block "main" . }}{{ end }}
-    </article>
+
+<div class="container-fluid everything-container">
+
+  <div class="row">
+
+    <div class="col-md-3 datacoop-sidebar d-print-none" style="min-width: 340px;">
+      <div class="fixed-top" style="width: 340px; height: 100%;">
+        {{ partial "nav.html" . }}
+      </div>
+    </div>
+
+    <div class="col-md-1 datacoop-sidebar-gutter d-print-none d-none d-md-flex">
+      <div class="sticky-bottom">
+    	{{ with (now) | printf "%s" }}
+        {{ i18n "generated_date" . }}
+	    {{ end }}
+	    </div>
+    </div>
+
+    <div class="col-md-7">
+      <div class="container datacoop-container-content">
+        <article>
+          {{ block "main" . }}{{ end }}
+        </article>
+      </div>
+    </div>
+
+    <div class="col-md-1 datacoop-sidebar-gutter datacoop-sidebar-gutter-right d-print-none d-none d-md-flex">
+    
+      <div class="fixed-top">
+
+        <a href="#" class="sidebar-rotated">
+          <img src="{{ "/static/img/icons/expand.svg" | absURL }}" alt="open">
+          {{ i18n "services_status" }}
+        </a>
+
+      </div>
+    </div>
+
  </div>

-  {{ partial "bootstrap-js.html" . }}
-  {{ partial "mastodon-js.html" . }}
+</div>
+
+{{ partial "mastodon-js.html" . }}


-<ul>
-{{ range $.Site.Home.AllTranslations }}
-<li><a href="{{ .Permalink }}">{{ .Language.LanguageName }}</a></li>
-{{ end }}
-</ul>
+{{ partial "bootstrap-js.html" . }}

 </body>

--- a/themes/datacoop2020/layouts/partials/head.html
+++ b/themes/datacoop2020/layouts/partials/head.html
@ -8,26 +8,13 @@
  <meta name="description" content="{{ . }}">
  {{ end }}

-  {{ $appleTouchIcon := "apple-touch-icon.png" }}
-  <link rel="apple-touch-icon" sizes="180x180" href="{{ $appleTouchIcon | absURL }}">
-
-  {{ $favicon32x32 := "favicon-32x32.png" }}
-  <link rel="icon" type="image/png" sizes="32x32" href="{{ $favicon32x32 | absURL }}">
-
-  {{ $favicon16x16 := "favicon-16x16.png" }}
-  <link rel="icon" type="image/png" sizes="16x16" href="{{ $favicon16x16 | absURL }}">
-
-  {{ $siteWebmanifest := "site.webmanifest" }}
-  <link rel="manifest" href="{{ $siteWebmanifest | absURL }}">
-
-	<link rel="sitemap" href="{{ .Site.SitemapAbsURL }}" />
-
-  {{ $safariPinnedTab := "safari-pinned-tab.svg" }}
-  <link rel="mask-icon" href="{{ $safariPinnedTab | absURL }}" color="{{ .Site.Params.faviconSafariPinnedTabColor }}">
-
-  <meta name="msapplication-TileColor" content="{{ .Site.Params.faviconMsApplicationTileColor }}">
-
-  <meta name="theme-color" content="{{ .Site.Params.faviconThemeColor }}">
+  <link rel="apple-touch-icon" sizes="180x180" href="{{ "/static/img" | absURL }}/apple-touch-icon.png">
+  <link rel="icon" type="image/png" sizes="32x32" href="{{ "/static/img" | absURL }}/favicon-32x32.png">
+  <link rel="icon" type="image/png" sizes="16x16" href="{{ "/static/img" | absURL }}/favicon-16x16.png">
+  <link rel="manifest" href="{{ "" | absURL }}/site.webmanifest">
+  <link rel="mask-icon" href="{{ "/static/img" | absURL }}/safari-pinned-tab.svg" color="#4b3aba">
+  <meta name="msapplication-TileColor" content="#4b3aba">
+  <meta name="theme-color" content="#4b3aba">

  {{ $style := resources.Get "static/css/style.scss" | resources.ToCSS | resources.Minify }}
 	<link rel="stylesheet" href="{{ $style.RelPermalink }}">
--- a/themes/datacoop2020/layouts/partials/nav.html
+++ b/themes/datacoop2020/layouts/partials/nav.html
@ -1,7 +1,23 @@
-<nav class="custom-navbar">
-  <div class="container">
-    {{ range .Site.Menus.nav }}
-    <a href="{{ .URL }}">{{ .Name }}</a>
-    {{ end }}
+<nav class="datacoop-navbar">
+
+  <a href="/" class="data-coop-sidebar-logo">
+    <img src="{{ printf "/static/img/logo.svg" | absURL }}">
+    {{ (i18n "tagline") | safeHTML }}
+  </a>
+
+  <div class="datacoop-menulists">
+
+    <ul>
+      {{ range .Site.Menus.nav }}
+        <li><a href="{{ .URL }}">{{ .Name }}</a></li>
+      {{ end }}
+    </ul>
+    <ul class="datacoop-langchooser">
+      {{ range $.Site.Home.AllTranslations }}
+      <li><a href="{{ .Permalink }}">{{ .Language.LanguageName }}</a></li>
+      {{ end }}
+    </ul>
+
  </div>
-</nav>
+
+</nav>
				`@ -0,0 +1 @@`
				`<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><defs><style>.cls-1{fill:#4b3aba;}</style></defs><title>DataCoop_Cross_Purple</title><rect class="cls-1" x="9" width="2" height="20" transform="translate(-4.14 10) rotate(-45)"/><rect class="cls-1" x="9" width="2" height="20" transform="translate(10 24.14) rotate(-135)"/></svg>`