init

sass/_vendor/simplex/_overrides.scss

@@ -0,0 +1,124 @@
+// Overrides
+@if $bulmaswatch-import-font {
+  @import url('https://fonts.googleapis.com/css?family=Open+Sans:400,700');
+}
+
+@mixin btn-shadow($color) {
+background-image: linear-gradient(
+  180deg,
+  lighten($color, 3%) 0%,
+  $color 60%,
+  darken($color, 3%) 100%
+);
+filter: none;
+}
+
+.button,
+.control.has-icons-left .icon,
+.control.has-icons-right .icon,
+.input,
+.pagination-ellipsis,
+.pagination-link,
+.pagination-next,
+.pagination-previous,
+.select,
+.select select,
+.textarea {
+height: 2.286em;
+}
+
+.button {
+@each $name, $pair in $colors {
+  $color: nth($pair, 1);
+  $color-invert: nth($pair, 2);
+
+  &.is-#{$name} {
+    &:not(.is-outlined):not(.is-inverted) {
+      border: 1px solid darken($color, 6.5%);
+      @include btn-shadow($color);
+    }
+  }
+}
+}
+
+.input,
+.textarea {
+box-shadow: none;
+}
+
+.card .card-header {
+  border-bottom: 1px solid $border;
+}
+
+.notification {
+@each $name, $pair in $colors {
+  $color: nth($pair, 1);
+  $color-invert: nth($pair, 2);
+  $color-lightning: max((100% - lightness($color)) - 2%, 0%);
+  &.is-#{$name} {
+    background-color: lighten($color, $color-lightning);
+    color: $color;
+    border: 1px solid lighten($color, 30);
+  }
+}
+}
+
+.navbar {
+@include btn-shadow($primary);
+.has-dropdown .navbar-item {
+  @include desktop {
+    color: $text;
+  }
+}
+
+@include touch {
+  .navbar-menu {
+    background-color: inherit;
+  }
+}
+
+.navbar-burger span {
+  background-color: $navbar-item-color;
+}
+
+@each $name, $pair in $colors {
+  $color: nth($pair, 1);
+  $color-invert: nth($pair, 2);
+
+  &.is-#{$name} {
+    @include btn-shadow($color);
+    @include touch {
+      .navbar-item,
+      .navbar-link {
+        color: rgba($color-invert, 0.7);
+
+        &.is-active {
+          color: $color-invert;
+        }
+      }
+
+      .navbar-burger span {
+        background-color: $color-invert;
+      }
+    }
+  }
+}
+}
+
+.hero {
+// Colors
+.navbar {
+  background-color: $primary;
+  @include btn-shadow($primary);
+}
+@each $name, $pair in $colors {
+  $color: nth($pair, 1);
+  $color-invert: nth($pair, 2);
+
+  &.is-#{$name} {
+    .navbar {
+      background: none;
+    }
+  }
+}
+}