jekyll-theme-glueckkanja 1.0.2 → 1.1.0

data/_sass/unify/base/headers/_headers.scss

@@ -0,0 +1,590 @@
+/*------------------------------------
+  Headers
+------------------------------------*/
+.u-header {
+  position: relative;
+  left: 0;
+  right: 0;
+  width: 100%;
+  @include px-to-rem(font-size, 13px);
+  z-index: 101; // because ".u-carousel-indicators-v22 li.slick-active span, .u-carousel-indicators-v22--white li.slick-active span" has "z-index: 100"
+  // transition: .2s ease;
+
+  //
+  // Positions
+
+  // Position Absolute
+  &--abs {
+    &-top,
+    &-bottom,
+    &-top-2nd-screen {
+      position: absolute;
+    }
+    &-top-2nd-screen {
+      top: 100%;
+      bottom: auto;
+    }
+    &-top {
+      top: 0;
+      bottom: auto;
+    }
+    &-bottom {
+      top: auto;
+      bottom: 0;
+
+      .dropdown-menu {
+        top: auto;
+        bottom: 100%;
+
+        margin-top: 0;
+        margin-bottom: .125rem;
+      }
+    }
+  }
+
+  // Position Sticky
+  &--sticky {
+    &-top,
+    &-bottom {
+      position: fixed;
+    }
+    &-top {
+      bottom: auto;
+      top: 0;
+    }
+    &-bottom {
+      top: auto;
+      bottom: 0;
+
+      .dropdown-menu {
+        top: auto;
+        bottom: 100%;
+        margin-top: 0;
+        margin-bottom: .125rem;
+      }
+    }
+  }
+
+  &--invisible {
+    display: none;
+  }
+
+  &--moved-up {
+    transform: translate3d(0, -100%, 0);
+  }
+
+  &--faded {
+    opacity: 0;
+    visibility: hidden;
+  }
+
+  &--untransitioned {
+    transition: none !important;
+  }
+
+  &__section--hidden {
+    position: relative;
+  }
+
+  &--floating {
+    position: absolute;
+    left: 0;
+    right: 0;
+
+    &.js-header-fix-moment {
+      margin-top: 0 !important;
+
+      // .navbar-brand {
+      //   transform: scale3d(.85, .85, .85);
+      // }
+
+      .navbar {
+        padding-left: 0;
+        padding-right: 0;
+      }
+    }
+  }
+
+  &[data-header-fix-effect] {
+    transition: .3s ease;
+  }
+
+  &-reduced--shift.js-header-change-moment {
+    padding-top: 0 !important;
+    padding-bottom: 0 !important;
+  }
+
+  &.js-header-fix-moment {
+    position: fixed;
+    top: 0;
+    bottom: auto;
+  }
+
+}
+
+.u-header__section {
+  position: relative;
+  z-index: 1;
+
+  @for $i from 1 through 5 {
+    &:nth-child(#{$i}) {
+      z-index: 6 - $i;
+    }
+  }
+}
+
+.u-header__sections-container {
+  position: relative;
+  z-index: 1;
+}
+
+.u-header__logo {
+  position: relative;
+  z-index: 1;
+
+  &-img {
+    top: 0;
+    left: 0;
+    /*transition: .3s ease;*/
+  }
+
+  &-img:not(.u-header__logo-img--main) {
+    position: absolute;
+    opacity: 0;
+  }
+}
+
+.dropdown-menu.u-dropdown--reverse-position {
+  left: auto;
+  right: 0;
+}
+
+//
+// Colors
+
+// BG Light
+.js-header-change-moment.g-bg-white--shift {
+  background-color: $g-color-white;
+}
+.js-header-change-moment.g-bg-light-semi-transparent--shift {
+  background-color: rgba(255,255,255, .9);
+}
+
+// BG Dark
+.js-header-change-moment.g-bg-black--shift {
+  background-color: $g-color-black;
+}
+.js-header-change-moment.g-bg-dark-semi-transparent--shift {
+  background-color: rgba($g-color-black, .9);
+}
+
+// BG Primary
+.js-header-change-moment.g-bg-primary--shift {
+  background-color: $g-color-primary;
+}
+.js-header-change-moment.g-bg-primary-semi-transparent--shift {
+  background-color: rgba($g-color-primary, .9);
+}
+
+// Header Light
+.u-header__section--light {
+  & .navbar-brand,
+  & .navbar-toggler,
+  &--shift.js-header-change-moment .navbar-brand,
+  &--shift.js-header-change-moment .navbar-toggler {
+    color: rgba($g-color-main, 1);
+  }
+  & .navbar-brand:focus,
+  & .navbar-brand:hover,
+  & .navbar-toggler:focus,
+  & .navbar-toggler:hover,
+  &--shift.js-header-change-moment .navbar-brand:focus,
+  &--shift.js-header-change-moment .navbar-brand:hover,
+  &--shift.js-header-change-moment .navbar-toggler:focus,
+  &--shift.js-header-change-moment .navbar-toggler:hover {
+    color: rgba($g-color-main, 1);
+  }
+  & .navbar-nav:not([class*="u-main-nav-v"]) .nav-link,
+  &--shift.js-header-change-moment .navbar-nav:not([class*="u-main-nav-v"]) .nav-link {
+    color: rgba($g-color-main, 1);
+  }
+  & .navbar-nav:not([class*="u-main-nav-v"]) .nav-link:focus,
+  & .navbar-nav:not([class*="u-main-nav-v"]) .nav-link:hover,
+  &--shift.js-header-change-moment .navbar-nav:not([class*="u-main-nav-v"]) .nav-link:focus,
+  &--shift.js-header-change-moment .navbar-nav:not([class*="u-main-nav-v"]) .nav-link:hover {
+    color: rgba($g-color-main, 1);
+  }
+  & .navbar-nav:not([class*="u-main-nav-v"]) .nav-link.disabled,
+  &--shift.js-header-change-moment .navbar-nav:not([class*="u-main-nav-v"]) .nav-link.disabled {
+    color: rgba($g-color-main, .5);
+  }
+  & .navbar-nav:not([class*="u-main-nav-v"]) .open > .nav-link,
+  & .navbar-nav:not([class*="u-main-nav-v"]) .active > .nav-link,
+  & .navbar-nav:not([class*="u-main-nav-v"]) .nav-link.open,
+  & .navbar-nav:not([class*="u-main-nav-v"]) .nav-link.active,
+  &--shift.js-header-change-moment .navbar-nav:not([class*="u-main-nav-v"]) .open > .nav-link,
+  &--shift.js-header-change-moment .navbar-nav:not([class*="u-main-nav-v"]) .active > .nav-link,
+  &--shift.js-header-change-moment .navbar-nav:not([class*="u-main-nav-v"]) .nav-link.open,
+  &--shift.js-header-change-moment .navbar-nav:not([class*="u-main-nav-v"]) .nav-link.active {
+    color: rgba($g-color-primary, 1);
+  }
+  & .navbar-toggler,
+  &--shift.js-header-change-moment .navbar-toggler {
+    border-color: rgba($g-color-main, .3);
+  }
+  & .navbar-toggler-icon,
+  &--shift.js-header-change-moment .navbar-toggler-icon {
+    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba($g-color-main, .5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
+  }
+  & .navbar-text,
+  &--shift.js-header-change-moment .navbar-text {
+    color: rgba($g-color-main, .7);
+  }
+}
+
+// Header Dark
+.u-header__section--dark,
+.u-header__section--primary {
+  & .navbar-brand,
+  & .navbar-toggler,
+  &--shift.js-header-change-moment .navbar-brand,
+  &--shift.js-header-change-moment .navbar-toggler {
+    color: $g-color-white;
+  }
+  & .navbar-brand:focus,
+  & .navbar-brand:hover,
+  & .navbar-toggler:focus,
+  & .navbar-toggler:hover,
+  &--shift.js-header-change-moment .navbar-brand:focus,
+  &--shift.js-header-change-moment .navbar-brand:hover,
+  &--shift.js-header-change-moment .navbar-toggler:focus,
+  &--shift.js-header-change-moment .navbar-toggler:hover {
+    color: $g-color-white;
+  }
+  & .navbar-nav:not([class*="u-main-nav-v"]) .nav-link,
+  &--shift.js-header-change-moment .navbar-nav:not([class*="u-main-nav-v"]) .nav-link {
+    color: rgba($g-color-white, .8);
+  }
+  & .navbar-nav:not([class*="u-main-nav-v"]) .nav-link:focus,
+  & .navbar-nav:not([class*="u-main-nav-v"]) .nav-link:hover,
+  &--shift.js-header-change-moment .navbar-nav:not([class*="u-main-nav-v"]) .nav-link:focus,
+  &--shift.js-header-change-moment .navbar-nav:not([class*="u-main-nav-v"]) .nav-link:hover {
+    color: $g-color-white;
+  }
+  & .navbar-nav:not([class*="u-main-nav-v"]) .nav-link.disabled,
+  &--shift.js-header-change-moment .navbar-nav:not([class*="u-main-nav-v"]) .nav-link.disabled {
+    color: rgba($g-color-white, .5);
+  }
+  & .navbar-nav:not([class*="u-main-nav-v"]) .open > .nav-link,
+  & .navbar-nav:not([class*="u-main-nav-v"]) .active > .nav-link,
+  & .navbar-nav:not([class*="u-main-nav-v"]) .nav-link.open,
+  & .navbar-nav:not([class*="u-main-nav-v"]) .nav-link.active,
+  &--shift.js-header-change-moment .navbar-nav:not([class*="u-main-nav-v"]) .open > .nav-link,
+  &--shift.js-header-change-moment .navbar-nav:not([class*="u-main-nav-v"]) .active > .nav-link,
+  &--shift.js-header-change-moment .navbar-nav:not([class*="u-main-nav-v"]) .nav-link.open,
+  &--shift.js-header-change-moment .navbar-nav:not([class*="u-main-nav-v"]) .nav-link.active {
+    color: $g-color-white;
+  }
+  & .navbar-toggler,
+  &--shift.js-header-change-moment .navbar-toggler {
+    border-color: rgba($g-color-white, .3);
+  }
+  & .navbar-toggler-icon,
+  &--shift.js-header-change-moment .navbar-toggler-icon {
+    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba($g-color-white, .5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
+  }
+  & .navbar-text,
+  &--shift.js-header-change-moment .navbar-text {
+    color: rgba($g-color-white, .7);
+  }
+}
+
+.navbar {
+  & > .container {
+    position: relative;
+  }
+}
+
+@media all and (min-width: $g-sm) {
+  .u-header {
+    // Position Absolute
+    &--abs {
+      &-top--sm,
+      &-bottom--sm,
+      &-top-2nd-screen--sm {
+        position: absolute;
+      }
+      &-top-2nd-screen--sm {
+        top: 100%;
+      }
+      &-top--sm {
+        bottom:  auto;
+        top: 0;
+      }
+      &-bottom--sm {
+        top: auto;
+        bottom: 0;
+      }
+    }
+
+    // Position Sticky
+    &--sticky {
+      &-top--sm,
+      &-bottom--sm {
+        position: fixed;
+      }
+      &-top--sm {
+        bottom: auto;
+        top: 0;
+      }
+      &-bottom--sm {
+        top: auto;
+        bottom: 0;
+      }
+    }
+
+    &--floating--sm {
+      position: absolute;
+      left: 0;
+      right: 0;
+
+      &.js-header-fix-moment {
+        margin-top: 0 !important;
+
+        // .navbar-brand {
+        //   transform: scale3d(.85, .85, .85);
+        // }
+
+        .navbar {
+          padding-left: 0;
+          padding-right: 0;
+        }
+      }
+    }
+  }
+}
+
+@media all and (min-width: $g-md) {
+  .u-header {
+    // Position Absolute
+    &--abs {
+      &-top--md,
+      &-bottom--md,
+      &-top-2nd-screen--md {
+        position: absolute;
+      }
+      &-top-2nd-screen--md {
+        top: 100%;
+      }
+      &-top--md {
+        bottom: auto;
+        top: 0;
+      }
+      &-bottom--md {
+        top: auto;
+        bottom: 0;
+      }
+    }
+
+    // Position Sticky
+    &--sticky {
+      &-top--md,
+      &-bottom--md {
+        position: fixed;
+      }
+      &-top--md {
+        bottom: auto;
+        top: 0;
+      }
+      &-bottom--md {
+        top: auto;
+        bottom: 0;
+      }
+    }
+
+    &--floating--md {
+      position: absolute;
+      left: 0;
+      right: 0;
+
+      &.js-header-fix-moment {
+        margin-top: 0 !important;
+
+        // .navbar-brand {
+        //   transform: scale3d(.85, .85, .85);
+        // }
+
+        .navbar {
+          padding-left: 0;
+          padding-right: 0;
+        }
+      }
+    }
+  }
+}
+
+@media all and (min-width: $g-lg) {
+  .u-header {
+    // Position Absolute
+    &--abs {
+      &-top--lg,
+      &-bottom--lg,
+      &-top-2nd-screen--lg {
+        position: absolute;
+      }
+      &-top-2nd-screen--lg {
+        top: 100%;
+      }
+      &-top--lg {
+        bottom: auto;
+        top: 0;
+      }
+      &-bottom--lg {
+        top: auto;
+        bottom: 0;
+      }
+    }
+
+    // Position Sticky
+    &--sticky {
+      &-top--lg,
+      &-bottom--lg {
+        position: fixed;
+      }
+      &-top--lg {
+        bottom: auto;
+        top: 0;
+      }
+      &-bottom--lg {
+        top: auto;
+        bottom: 0;
+      }
+    }
+
+    &--floating--lg {
+      position: absolute;
+      left: 0;
+      right: 0;
+
+      &.js-header-fix-moment {
+        margin-top: 0 !important;
+
+        // .navbar-brand {
+        //   transform: scale3d(.85, .85, .85);
+        // }
+
+        .navbar {
+          padding-left: 0;
+          padding-right: 0;
+        }
+      }
+    }
+  }
+}
+
+@media all and (min-width: $g-xl) {
+  .u-header {
+    // Position Absolute
+    &--abs {
+      &-top--xl,
+      &-bottom--xl,
+      &-top-2nd-screen--xl {
+        position: absolute;
+      }
+      &-top-2nd-screen--xl {
+        top: 100%;
+      }
+      &-top--xl {
+        bottom: auto;
+        top: 0;
+      }
+      &-bottom--xl {
+        top: auto;
+        bottom: 0;
+      }
+    }
+
+    // Position Sticky
+    &--sticky {
+      &-top--xl,
+      &-bottom--xl {
+        position: fixed;
+      }
+      &-top--xl {
+        bottom: auto;
+        top: 0;
+      }
+      &-bottom--xl {
+        top: auto;
+        bottom: 0;
+      }
+    }
+
+    &--floating--xl {
+      position: absolute;
+      left: 0;
+      right: 0;
+
+      &.js-header-fix-moment {
+        margin-top: 0 !important;
+
+        // .navbar-brand {
+        //   transform: scale3d(.85, .85, .85);
+        // }
+
+        .navbar {
+          padding-left: 0;
+          padding-right: 0;
+        }
+      }
+    }
+  }
+}
+
+@media all and (max-width: #{$g-xl}-1) {
+  .navbar-expand-xl > .container,
+  .navbar-expand-xl > .container-fluid {
+    justify-content: flex-start;
+  }
+
+  .navbar-expand-xl .navbar-collapse {
+    width: 100%;
+    order: 10;
+  }
+}
+
+@media all and (max-width: #{$g-lg}-1) {
+  .navbar-expand-lg > .container,
+  .navbar-expand-lg > .container-fluid {
+    justify-content: flex-start;
+  }
+
+  .navbar-expand-lg .navbar-collapse {
+    width: 100%;
+    order: 10;
+  }
+}
+
+@media all and (max-width: #{$g-md}-1) {
+  .navbar-expand-md > .container,
+  .navbar-expand-md > .container-fluid {
+    justify-content: flex-start;
+  }
+
+  .navbar-expand-md .navbar-collapse {
+    width: 100%;
+    order: 10;
+  }
+}
+
+@media all and (max-width: #{$g-sm}-1) {
+  .navbar-expand-sm > .container,
+  .navbar-expand-sm > .container-fluid {
+    justify-content: flex-start;
+  }
+
+  .navbar-expand-sm .navbar-collapse {
+    width: 100%;
+    order: 10;
+  }
+}

data/_sass/unify/base/headings/_heading-v1-1.scss

@@ -0,0 +1,13 @@
+/*------------------------------------
+  Heading-v1-1
+------------------------------------*/
+.u-heading-v1-1 {
+  &::before {
+    top: 48%;
+    border-top-style: solid;
+  }
+  &::after {
+    top: 58%;
+    border-top-style: solid;
+  }
+}

data/_sass/unify/base/headings/_heading-v1-2.scss

@@ -0,0 +1,13 @@
+/*------------------------------------
+  Heading-v1-2
+------------------------------------*/
+.u-heading-v1-2 {
+  &::before {
+    top: 48%;
+    border-top-style: dashed;
+  }
+  &::after {
+    top: 58%;
+    border-top-style: dashed;
+  }
+}

data/_sass/unify/base/headings/_heading-v1-3.scss

@@ -0,0 +1,13 @@
+/*------------------------------------
+  Heading-v1-3
+------------------------------------*/
+.u-heading-v1-3 {
+  &::before {
+    top: 48%;
+    border-top-style: dotted;
+  }
+  &::after {
+    top: 58%;
+    border-top-style: dotted;
+  }
+}

data/_sass/unify/base/headings/_heading-v1-4.scss

@@ -0,0 +1,7 @@
+/*------------------------------------
+  Heading-v1-4
+------------------------------------*/
+.u-heading-v1-4::before {
+  top: 50%;
+  border-top-style: solid;
+}

data/_sass/unify/base/headings/_heading-v1-5.scss

@@ -0,0 +1,7 @@
+/*------------------------------------
+  Heading-v1-5
+------------------------------------*/
+.u-heading-v1-5::before {
+  top: 50%;
+  border-top-style: dashed;
+}

data/_sass/unify/base/headings/_heading-v1-6.scss

@@ -0,0 +1,7 @@
+/*------------------------------------
+  Heading-v1-6
+------------------------------------*/
+.u-heading-v1-6::before {
+  top: 50%;
+  border-top-style: dotted;
+}

data/_sass/unify/base/headings/_heading-v1-7.scss

@@ -0,0 +1,6 @@
+/*------------------------------------
+  Heading-v1-7
+------------------------------------*/
+.u-heading-v1-7 {
+  background: url('data:image/svg+xml,<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="9px" height="6px"><polygon opacity="0.2" points="4.5,4.5 0,0 0,1.208 4.5,5.708 9,1.208 9,0 "/></svg>') 0 50% repeat-x;
+}