Split styles into multiple files

2025-11-27 23:25:51 +00:00 · 2020-07-07 15:33:47 -07:00
parent dd7b467b16
commit dbe253ac0b
22 changed files with 1853 additions and 1855 deletions
--- a/styles/_top-nav.scss
+++ b/styles/_top-nav.scss
@@ -0,0 +1,187 @@
+/* Top navigation ----------------------------------------------------------- */
+
+.navbar.fixed-top {
+  box-shadow: inset 0 -1px 0 0 $gray-200;
+}
+
+.navbar .navbar-nav .nav-link {
+  color: $gray-600;
+}
+
+.navbar .navbar-nav .nav-link:hover,
+.navbar .navbar-nav .nav-link:active,
+.navbar .navbar-nav .active .nav-link,
+.navbar .active-parent .nav-link {
+  color: $black;
+}
+
+.navbar.fixed-top {
+  font-weight: 400;
+  padding: 0;
+  margin: 0 48px;
+}
+
+@media (max-width: 1105px) {
+  .navbar.fixed-top {
+    margin: 0 20px;
+  }
+  .navbar .navbar-nav .nav-link {
+    padding-right: 5px;
+  }
+}
+
+.navbar-brand {
+  text-decoration: none;
+  white-space: pre;
+  -webkit-transition: opacity 200ms ease, color 200ms ease;
+  transition: opacity 200ms ease, color 200ms ease;
+}
+.navbar-brand:hover {
+  opacity: 0.5;
+}
+
+.navbar .navbar-nav .nav-link {
+  font-size: 1rem;
+  line-height: 52px;
+  text-decoration: none;
+  font-family: 'Space Mono', monospace;
+}
+
+.navbar .navbar-nav .nav-link:hover {
+  background-color: transparent;
+  box-shadow: inset 0 -1px 0 0 #000;
+  text-decoration: none;
+}
+
+.navbar .navbar-nav .active a {
+  font-weight: 700;
+  box-shadow: inset 0 -1px 0 0 #000;
+}
+.navbar .active-parent a {
+  font-weight: 700;
+  box-shadow: inset 0 -1px 0 0 #000;
+}
+
+#navbar-search {
+  position: relative;
+  margin-right: 0.375rem;
+}
+
+#navbar-search .form-inline {
+  min-width: 224px; /* more room for placeholder text */
+}
+
+#topsearchbar {
+  padding-right: 40px;
+  width: 100%;
+  font-size: 0.875rem;
+}
+
+#navbar-search .btn {
+  position: absolute;
+  right: 0;
+}
+
+/* Top navigation Mobile ----------------------------------------------------------- */
+@media (max-width: 991px) {
+
+  .navbar .navbar-nav .nav-link {
+    height: 48px;
+  }
+  .github-edit-wrap {
+    margin: 20px 10px 20px 0;
+  }
+
+  #navbar-search .btn::after {
+    display: none;
+  }
+
+  .navbar-collapse {
+    background-color: white;
+    position: absolute;
+    top: 200px;
+    right: 0;
+    overflow: scroll;
+    width: 260px;
+    max-height: 60vh;
+    margin-right: 24px;
+    margin-bottom: 108px;
+    padding: 24px;
+    -webkit-box-flex: 1;
+    z-index: 10;
+
+    transform: translateX(1000px);
+    transition-duration: 1s;
+  }
+
+  .navbar-collapse.show {
+    transform: translateX(0px);
+    transition-duration: 0.5s;
+  }
+
+  .menu-overlay.active {
+    transform: translateX(0px);
+    transition-duration: 0.5s;
+  }
+
+  .menu-overlay {
+    background-color: black;
+    bottom: 0;
+    left: 0;
+    opacity: 0.88;
+    filter: alpha(opacity=80);
+    /* IE7 & 8 */
+    position: fixed;
+    right: 0;
+    top: 0;
+    z-index: 5;
+    transform: translateX(1000px);
+    transition-duration: 0.5s;
+  }
+
+}
+
+/* Push content below fixed header ------------------------------------------ */
+#main_content_wrapper {
+  margin-top: 68px;
+  padding: 0 48px;
+}
+
+/* Fix so anchors don't jump under the fixed header ------------------------- */
+.main h1:before,
+.main h2:before,
+.main h3:before,
+.main h4:before,
+.main h5:before,
+.main h6:before,
+#main_content_wrapper:before,
+.interactive-block:before {
+  display: block;
+  content: " ";
+  margin-top: -67px;
+  height: 67px;
+  visibility: hidden;
+}
+
+.card h1:before,
+.card h2:before,
+.card h3:before,
+.card h4:before,
+.card h5:before,
+.card h6:before {
+  display: none;
+}
+
+
+@media (max-width: 1010px) {
+  .navbar-brand,
+  .github-edit-wrap,
+  #navbar-search {
+    margin-right: 3px;
+  }
+}
+
+#navbarHolder .language-selector .btn {
+  font-size: 0.875rem;
+  padding: .375rem .75rem;
+}