a new start

_sass/pivoine/__link__/_menu.scss

@@ -0,0 +1,97 @@
+// THIS FILE IS AUTOGENERATED, DO NOT MODIFY!
+//
+// To change the contents of this file,
+// edit `_sass/pivoine/_menu.pre.scss`
+// and run `npm run build:css`.
+//
+// During development you can run `npm run watch:css`
+// to continuosly rebuild this file.
+
+// Copyright (c) 2017 Florian Klampfer <https://qwtel.com/>
+//
+// This program is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+//
+// This program is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+// GNU General Public License for more details.
+//
+// You should have received a copy of the GNU General Public License
+// along with this program.  If not, see <http://www.gnu.org/licenses/>.
+
+$navbar-height: 5rem;
+
+
+
+.navbar {
+//   @extend .color-transition; 
+  > .content {
+    
+
+    
+    $shadow-padding: 3rem;
+    &::before {
+      content: "";
+      position: absolute;
+      display: block;
+      width: calc(100% - #{$shadow-padding * 2});
+      height: $navbar-height;
+      left: $shadow-padding;
+      margin: auto;
+      box-shadow: 0 0 2rem rgba(0,0,0,0.25);
+      z-index: -1;
+    }
+    
+  }
+
+  
+  &.fixed-top {
+    > .content {
+      &::before {
+        bottom: 1px;
+      }
+    }
+  }
+
+  &.fixed-bottom {
+    > .content {
+      &::before {
+        top: 1px;
+      }
+    }
+  }
+  
+}
+
+
+
+
+a.nav-btn, button.nav-btn {
+  cursor: pointer;
+  &:hover, &:focus {
+    background-image: linear-gradient(90deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.05));
+  }
+}
+
+.nav-span {
+  flex: 1;
+}
+
+.animation-main {
+  opacity: 0;
+  pointer-events: none;
+}
+
+#_navbar {
+  z-index: 3;
+  background-color: var(--body-bg);
+}
+
+.navbar {
+  .loading { display: none; }
+  @media print { display: none; }
+}
+