index: try a different kind of buttons

content/_index.de.md

@@ -10,7 +10,7 @@ headerStats: true
 
 StuStaNet ist eine Organisation in der Studentenstadt Freimann, welche ein Computer-Netzwerk betreibt, das ca. {{< users >}} Nutzer in der Studentenstadt Freimann sowie dem Wohnheim Max-Bill-Straße an das Internet anbindet. Das Netzwerk wird ausschließlich von Freiwilligen betrieben.
 
-<a href="{{< ref "about.de.md" >}}">Mehr Infos über den Verein</a>.
+{{< button ref="about.de.md" label="Über den Verein" >}}
 
 
 ## Mitglied werden
@@ -22,8 +22,8 @@ Eine Mitgliedschaft, welche die Nutzung aller unserer Dienste erlaubt, steht all
 
 Du möchtest Mitglied im StuStaNet werden, um all unsere Dienste zu nutzen?
 
+{{< button href="https://reg.stustanet.de/" label="Registrieren" >}}
 
-<a class="button" href="https://reg.stustanet.de/">Registrieren</a>
 
 ### Nächste Sprechstunden
 Die [Sprechstunden]({{< ref "officehours.de.md" >}}) finden im Blauen Haus (Christoph-Probst-Straße 12) Zimmer 028 statt.

content/_index.en.md

@@ -10,7 +10,7 @@ headerStats: true
 
 StuStaNet is a registered association that operates a computer network connecting about {{< users >}} users in the Studentenstadt Freimann and the dormitory Max-Bill-Straße in Munich to the Internet. The network is operated entirely by volunteers.
 
-<a href="{{< ref "about.en.md" >}}">More info about the association</a>
+{{< button ref="about.en.md" label="About the Association" >}}
 
 
 ## Become a Member
@@ -22,8 +22,7 @@ Membership, allowing to use all of our services, is open to all residents of the
 
 You want to become a StuStaNet member in order to use our services?
 
-
-<a class="button" href="https://reg.stustanet.de/">Register</a>
+{{< button href="https://reg.stustanet.de/" label="Membership Registration" >}}
 
 ### Next Office Hours
 The [office hours]({{< ref "officehours.en.md" >}}) take place in the Blue Building (Christoph-Probst-Straße 12), room 028.

layouts/shortcodes/button.html

+<p class="button-container"><a class="button" href="{{ if .Get "ref" }}{{ ref . ( .Get "ref" ) }}{{ else }}{{ .Get "href" }}{{ end }}">{{ .Get "label" }}</a></p>

layouts/shortcodes/officehours.html

@@ -25,5 +25,3 @@
     {{ end }}
     </tbody>
 </table>
-
-

static/css/main.css

@@ -661,13 +661,14 @@ a {
     text-decoration: none;
 }
 
-a:hover, a:active {
+a:hover,
+a:active {
     text-decoration: underline;
 }
 
 a.button {
     display: inline-block;
-    padding: 5px 10px;
+    padding: 4px 8px;
     border: 1px solid #1b54ac;
     border-radius: 5px;
     cursor: pointer;
@@ -677,12 +678,24 @@ a.button {
     text-align: center;
     text-decoration: none;
 }
-
-a.button:hover {
+a.button:hover,
+p.button-container .button:hover {
     background-color: #1b54ac;
     color: #fff;
     text-decoration: none;
 }
+p.button-container {
+    text-align: center;
+    margin: 0.8em 0 2em;
+}
+p.button-container .button {
+    min-width: 40%;
+    padding: 6px 8px 2px;
+    background: #4f76b1;
+    border-color: #4f76b1;
+    color: #fff;
+}
+
 
 #main {
     margin-top: 30px;