index: add header stats

content/_index.de.md

 ---
 header: StuStaNet e.V.
+subheader: Der gemeinnützige Internet Service Provider in der Studentenstadt Freimann
 hero: true
 headerImage: headers/home.jpg
+headerStats: true
 ---
 
 ### Nächste Sprechstunden

content/_index.en.md

 ---
 header: StuStaNet e.V.
+subheader: The Non-Profit Internet Service Provider in the Studentenstadt Freimann
 hero: true
 headerImage: headers/home.jpg
+headerStats: true
 ---
 
 ### Next Office Hours

layouts/_default/baseof.html

@@ -85,10 +85,20 @@
 
     <article{{ if .Params.Hero }} class="big-hero"{{ end }}>
       <header{{ if .Params.HeaderImage }} style="background-image: url(/{{ .Params.HeaderImage }});"{{ end }}>
-        <h1>{{ .Params.Header | default .Title }}</h1>
-        {{ with .Params.SubHeader }}
-        <span class="subtitle">{{.}}</span>
-        {{ end }}
+        <div class="container">
+          <h1>{{ .Params.Header | default .Title }}</h1>
+          {{ with .Params.SubHeader }}
+          <span class="subtitle">{{.}}</span>
+          {{ end }}
+          {{ if .Params.HeaderStats }}
+          <div id="stats">
+            <div><i class="fa fa-users" aria-hidden="true"></i><span>2700</span>Active Users</div>
+            <div><i class="fa fa-server" aria-hidden="true"></i><span>71</span> Servers</div>
+            <div><i class="fa fa-tachometer" aria-hidden="true"></i><span>4 Gbit/s</span>Internet Connection</div>
+            <div><i class="fa fa-id-card-o" aria-hidden="true"></i><span>0</span> Paid Employees</div>
+          </div>
+          {{ end }}
+        </div>
       </header>
       <div class="container">
         {{ block "main" . }}{{.Content}}{{ end }}

static/css/main.css

@@ -314,8 +314,7 @@ ul.menu li a {
 }
 
 article > *,
-.container,
-header h1 {
+.container {
     position: relative;
     margin-left: auto;
     margin-right: auto;
@@ -403,6 +402,35 @@ header h1 {
 }
 .blue header h1 { color: white; }
 
+#stats {
+    color: #FFF;
+    position: absolute;
+    top: 50px;
+    right: 20px;
+    text-shadow: 0px 0px 1px rgba(0,0,0,0.8);
+}
+
+#stats div {
+    padding: 12px 0;
+    font-size: 15px;
+}
+
+#stats div i {
+    font-size: 36px;
+    display: inline-block;
+    width: 56px;
+    height: 48px;
+    float: left;
+    vertical-align: middle;
+}
+
+#stats div span {
+    display: block;
+    font-weight: bold;
+    font-size: 1.5em;
+    width: 200px;
+}
+
 h1,
 h2,
 h3,