NG: Remove unneeded js/css styling for mobile nav and abandoned elements

Author: msbt

src/crate/theme/rtd/crate/static/css/crateio.css

@@ -7,35 +7,6 @@
   color: #111;
 }
 
-.sub-menu {
-  list-style-type: none;
-  padding-left: 0;
-  top: 50px;
-  background-color: #fff;
-  position: absolute;
-  min-width: 180px;
-  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
-  z-index: 1;
-}
-
-.sub-menu li a {
-  display: block;
-  padding-top: 12px;
-  padding-bottom: 12px;
-  padding-left: 10px;
-}
-
-.sub-menu li a:hover {
-  background-color: #f1f1f1;
-}
-.menu-item-has-children .sub-menu {
-  display: none;
-}
-
-.menu-item-has-children:hover .sub-menu {
-  display: block;
-}
-
 html {
   height: 100%;
 }

src/crate/theme/rtd/crate/static/css/custom.css

@@ -38,12 +38,6 @@
   src: url("../fonts/montserrat-v26-latin-600.woff2") format("woff2");
 }
 
-.w-canvas {
-  margin-top: 64px;
-  margin-bottom: 64px;
-  padding-top: 32px;
-}
-
 a.copybtn {
   width: 2em;
   height: 2em;
@@ -341,12 +335,6 @@ header .navbar {
   height: auto;
 }
 
-.main-nav {
-  position: relative;
-  -webkit-perspective: 600px;
-  perspective: 600px;
-}
-
 .main-nav .btn-link:hover {
   text-decoration: none;
 }
@@ -390,78 +378,6 @@ header.header-nav {
   padding: 15px 5px;
 }
 
-body .main-nav .sub-menu li a {
-  padding-top: 8px;
-  padding-bottom: 8px;
-}
-
-.main-nav .sub-menu li a:active {
-  -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.05);
-  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.05);
-}
-
-.main-nav .menu-item-has-children .sub-menu {
-  opacity: 0;
-  position: absolute;
-  overflow: hidden;
-  padding: 10px;
-  top: -40px;
-  min-width: 200px;
-  -webkit-transition: all 0.2s;
-  transition: all 0.2s;
-  -webkit-transform: translateY(89px);
-  transform: translateY(89px);
-  will-change: transform;
-  display: none;
-  -webkit-box-shadow: none;
-  box-shadow: none;
-  background-color: transparent;
-  margin-bottom: 0px;
-}
-
-.main-nav .trigger-enter.menu-item-has-children .sub-menu {
-  display: block;
-}
-
-.trigger-enter-active.menu-item-has-children .sub-menu {
-  opacity: 1;
-  -webkit-transform: translateY(94px);
-  transform: translateY(94px);
-}
-
-.arrow {
-  position: absolute;
-  width: 20px;
-  height: 20px;
-  display: block;
-  background: white;
-}
-
-.arrow:after,
-.arrow:before {
-  bottom: 100%;
-  left: 50%;
-  border: solid transparent;
-  content: " ";
-  height: 0;
-  width: 0;
-  position: absolute;
-  pointer-events: none;
-}
-
-.arrow:after {
-  border-color: rgba(255, 255, 255, 0);
-  border-bottom-color: #ffffff;
-  border-width: 10px;
-  margin-left: -10px;
-}
-.arrow:before {
-  border-color: rgba(85, 212, 245, 0);
-  border-bottom-color: var(--primary-color);
-  border-width: 13px;
-  margin-left: -13px;
-}
-
 .fa.mobile-nav-button,
 .fa.mobile-nav-button:focus {
   color: black;
@@ -496,25 +412,7 @@ body .mm-menu .navbar-nav {
   margin-top: 43px;
 }
 
-#mobile-nav .sub-menu {
-  position: static;
-  background-color: transparent;
-  box-shadow: none;
-}
-
 @media screen and (max-width: 991px) {
-  .main-nav ul.menu > li.menu-item > a {
-    padding: 1rem 0.8rem;
-    font-size: 16px;
-  }
-
-  #mobile-menu-toggler {
-    margin-bottom: 16px;
-  }
-
-  .w-canvas {
-    margin-top: 30px;
-  }
   .mobileAlign {
     text-align: left;
   }
@@ -654,10 +552,6 @@ div.sidebar {
   h1 {
     font-size: 32px;
   }
-  .w-canvas {
-    padding-left: 0;
-    padding-right: 0;
-  }
 }
 
 /**
@@ -871,146 +765,10 @@ details.sd-dropdown summary.sd-summary-title {
 /**
 * MOBILE Nav
 */
-
-.w-canvas {
-  transition: transform 0.3s ease-in-out;
-}
-
 #mobile-nav-new {
   display: none;
 }
 
-/* MOBILE */
-@media all and (max-width: 1023px) {
-  .main-nav {
-    position: fixed;
-    z-index: 9999;
-    top: 65px;
-    right: 0;
-    max-width: 400px;
-    width: 100%;
-    display: block !important;
-    transform: translateX(100%);
-    transition: transform 0.3s ease-in-out;
-    border-left: 2px solid var(--primary-color);
-    height: calc(100vh - 65px);
-    background: #fff !important;
-    gap: 0;
-  }
-
-  header.header-nav {
-    z-index: 9999;
-  }
-
-  .main-nav ul.menu {
-    flex-direction: column;
-    align-items: stretch;
-    background: #fff;
-  }
-
-  .main-nav ul.menu > li.menu-item {
-    display: block;
-    margin: 0;
-    border-top: 1px solid #e7e7e7;
-  }
-
-  .navlink.w-nav-link.menu-item.menu-item-has-children:first-child {
-    border-top: none;
-  }
-
-  .main-nav ul.menu > li.menu-item > a {
-    display: block;
-    padding-left: 10px;
-  }
-
-  .main-nav ul.menu .btn-link a {
-    color: black;
-    font-weight: 600;
-    border-left: 0;
-    border-right: 0;
-    padding-left: 10px !important;
-  }
-
-  /* checked */
-  #mobile-nav-new:checked ~ .header-nav .main-nav {
-    transform: translateX(0);
-  }
-
-  #mobile-nav-new:checked ~ .w-canvas {
-    transform: translate3d(-440px, 0, 0);
-  }
-
-  #mobile-nav-new:checked ~ .footer {
-    transform: translate3d(-440px, 0, 0);
-  }
-
-  .main-nav .menu-item-has-children .sub-menu {
-    padding: 0;
-    border-right: 1px solid #e7e7e7;
-  }
-
-  body .main-nav .sub-menu li a {
-    padding: 1rem 1rem;
-  }
-
-  .menu-item-has-children {
-    padding-right: 65px !important;
-    background-color: #fff !important;
-    border-right: 1px solid #dedede !important;
-  }
-
-  .menu-item-has-children > a {
-    background-color: white;
-    border-right: 1px solid #dedede !important;
-  }
-
-  .menu-item-has-children:after {
-    content: "";
-    border: 2px solid transparent;
-    display: block;
-    width: 8px;
-    height: 8px;
-    /* margin: auto; */
-    position: absolute;
-    top: 23px;
-    bottom: 0;
-    transform: rotate(-45deg);
-    border-top: none;
-    border-left: none;
-    right: 30px;
-    border-color: rgba(0, 0, 0, 0.3);
-  }
-
-  .menu-item-has-children:hover:after,
-  .menu-item-has-children:active:after,
-  .menu-item-has-children:focus:after {
-    transform: rotate(45deg);
-  }
-
-  /* Submenu */
-  .main-nav .menu-item-has-children .sub-menu {
-    position: relative !important;
-  }
-
-  .main-nav .sub-menu {
-    top: 0 !important;
-    transform: initial !important;
-    /*background-color: #F4F4F4 !important;
-    margin-right: -40px;*/
-  }
-
-  .main-nav .menu-item {
-    border-top: 1px solid #e7e7e7;
-  }
-}
-
-@media all and (max-width: 767px) {
-  .main-nav {
-    top: 60px;
-    height: calc(100vh - 60px);
-  }
-}
-
 /* DESKTOP */
 @media all and (min-width: 1024px) {
   .fa.mobile-nav-button,
@@ -1644,11 +1402,6 @@ ul.search li {
   display: flex;
 }
 
-.cr-docs-sql-99 .w-canvas {
-  margin-top: 32px;
-  padding-top: 1px;
-}
-
 .cr-sql-99-headline p {
   font-size: 20px;
   line-height: 24px;
@@ -1700,10 +1453,6 @@ ul.search li {
 }
 
 @media all and (max-width: 992px) {
-  .w-canvas {
-    padding-top: 64px;
-  }
-
   .cr-sql-99-headline {
     align-items: flex-start;
     flex-direction: column;
@@ -1712,17 +1461,9 @@ ul.search li {
   .cr-sql-99-logo {
     margin: 20px 20px 10px 0;
   }
-
-  .cr-docs-sql-99.notif-bar-enabled .w-canvas {
-    padding-top: 0px !important;
-  }
 }
 
 @media all and (max-width: 540px) {
-  .cr-docs-sql-99 .w-canvas {
-    margin-top: 15px;
-  }
-
   .cr-sql-99-header {
     display: flex;
     flex-direction: column;