X-Git-Url: https://juplo.de/gitweb/?a=blobdiff_plain;f=sass%2Fjuplo.scss;h=dc9f3a78d677182ee4054bafc23d769cef52d791;hb=0120b11a3eb7caaa27c6a364c6cd236dc038de98;hp=89948e7675c6f1ff82ab3923c3b61fe5a85938c5;hpb=54964ea99c292eaba7f4dad3d0308f0e656cf6d9;p=website

diff --git a/sass/juplo.scss b/sass/juplo.scss
index 89948e76..dc9f3a78 100644
--- a/sass/juplo.scss
+++ b/sass/juplo.scss
@@ -26,11 +26,102 @@ $primary-invert: $pink-invert;
 // 4. Import the rest of Bulma
 */
 
+$primary: #0ACF00;
+$button-text-color: #FFF !important;
+$button-border-color: #000 !important;
+$button-hover-border-color: #000 !important;
+
 @import "../node_modules/bulma/bulma";
+@import "../node_modules/@fortawesome/fontawesome-free/scss/fontawesome";
+@import "../node_modules/@fortawesome/fontawesome-free/scss/regular";
+@import "../node_modules/@fortawesome/fontawesome-free/scss/solid";
+@import "../node_modules/@fortawesome/fontawesome-free/scss/brands";
 
 .navbar-item > .logo
 {
   max-height: none;
 }
 
-@import "navigation";
+
+// Navigation
+
+#navigation li.s.off
+{
+  display: none;
+}
+#navigation li.s > a.selected,
+#navigation li.s > a.leaf,
+#navigation li.s > strong.selected,
+#navigation li.s > strong.leaf
+{
+  @extend .button;
+  @extend .is-primary;
+  @extend .is-rounded;
+  @extend .has-text-weight-bold;
+  @extend .mb-3;
+}
+#navigation li.s > a.leaf,
+#navigation li.s > strong.leaf
+{
+  color: #ccc;
+  background-color: #fff;
+}
+#navigation li.s > a.selected:after,
+#navigation li.s > a.leaf:after,
+#navigation li.s > strong.selected:after,
+#navigation li.s > strong.leaf:after
+{
+  content: "\f0a8";
+  padding-left: .5em;
+  margin-right: -.5em;
+  font-family: 'Font Awesome 5 Free';
+  font-weight: 900;
+  font-size: 2em;
+  -webkit-font-smoothing: antialiased;
+  display: inline-block;
+  font-style: normal;
+  font-variant: normal;
+  text-rendering: auto;
+  line-height: 1;
+}
+#navigation li.s > a.leaf:after,
+#navigation li.s > strong.leaf:after
+{
+  color: #fff;
+}
+#navigation li.s.sub > a.selected:after,
+#navigation li.s.sub > a.selected:after,
+#navigation li.s.sub > strong.leaf:after,
+#navigation li.s.sub > strong.leaf:after
+{
+  content: "\f0ab";
+}
+
+
+html
+{
+  height: 100%;
+}
+body
+{
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+}
+#page
+{
+  flex: 1 0 auto;
+  display: flex;
+  justify-content: flex-end;
+}
+footer
+{
+  flex-shrink: 0;
+}
+main {
+  flex-grow: 1;
+  max-width: 768px;
+}
+nav {
+  flex-grow: 0;
+}