dealposbooks 1.0.0

package/assets/scss/layouts/_horizontal.scss

@@ -0,0 +1,317 @@
+/*
+Template Name: Admin Template
+Author: Niravjoshi / Wrappixel
+File: scss
+*/
+$sidebarheight: 54px;
+
+#main-wrapper[data-layout="horizontal"] {
+
+  // sidebar setting
+  .page-wrapper {
+    margin: 0 auto !important;
+  }
+
+  @include media-breakpoint-up(lg) {
+    .sidebar-nav ul .sidebar-item .first-level .sidebar-item .sidebar-link .iconify {
+      display: block;
+    }
+  }
+
+  /****************************
+    This is for the fixed sidebar layout
+    ***************************/
+  .topbar {
+    position: fixed;
+    width: 100%;
+    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.05);
+  }
+
+  .left-sidebar {
+    padding-top: 0;
+    position: fixed;
+    border-top: 1px solid var(--bs-border-color);
+    border-bottom: 1px solid var(--bs-border-color);
+  }
+
+  .sidebar-nav {
+    ul {
+      .sidebar-item {
+        .sidebar-link {
+          margin-bottom: 0;
+          padding: 17px 14px;
+
+          .iconify {
+            margin: 0 5px 0 5px;
+          }
+        }
+      }
+    }
+  }
+
+  .sidebar-nav #sidebarnav>.sidebar-item ul {
+    background: $sidebar;
+  }
+
+  .sidebar-nav .has-arrow::after {
+    top: 23px;
+  }
+
+  .sidebar-nav {
+    ul {
+      .sidebar-item {
+        .second-level {
+          .sidebar-item {
+            padding: 0 0 0px 0px;
+          }
+        }
+      }
+    }
+  }
+
+  .hide-menu {
+    margin-right: 30px;
+  }
+
+  .topbar .navbar-collapse {
+    padding: 0px 0px 0 0;
+    background: var(--bs-white);
+  }
+
+
+}
+
+/****************************
+This is for the horizontal layout
+***************************/
+
+@include media-breakpoint-up(lg) {
+  #main-wrapper[data-layout="horizontal"] {
+    background: var(--bs-body-bg);
+
+    .topbar {
+      transition: 0s;
+    }
+
+    .top-navbar,
+    .sidebar-nav,
+    .scroll-sidebar,
+    .page-wrapper>.container-fluid {
+      max-width: 100%;
+      margin: 0 auto;
+      position: relative;
+    }
+
+    // -------------------
+    // weather report css
+    // -------------------
+
+    .weather-report-wrapper .weather-report{
+      top: 126px;
+    }
+
+    /****************************
+        This is for the Boxed horizontal layout
+        ***************************/
+    &[data-boxed-layout="boxed"] {
+
+      .top-navbar,
+      .sidebar-nav,
+      .scroll-sidebar,
+      .page-wrapper>.container-fluid {
+        max-width: $boxed-width;
+        margin: 0 auto;
+        position: relative;
+      }
+
+      .sidebar-nav #sidebarnav>.mega-dropdown .first-level {
+        max-width: $boxed-width;
+        margin: 0 auto;
+      }
+
+      .sidebar-nav {
+        #sidebarnav {
+          flex-wrap: wrap;
+
+          >.sidebar-item>.has-arrow:after {
+            display: block;
+          }
+        }
+      }
+    }
+
+
+    .page-wrapper {
+      padding-top: 155px;
+    }
+
+    /****************************
+        This is for the horizontal layout
+        ***************************/
+
+    .topbar .sidebartoggler {
+      display: none;
+    }
+
+    .left-sidebar {
+      width: 100%;
+      top: $topbar-height;
+      height: auto;
+      z-index: 45;
+      transition: 0s;
+
+      .scroll-sidebar {
+        height: $sidebarheight;
+      }
+    }
+
+    .scroll-sidebar {
+      height: auto;
+    }
+
+    .sidebar-nav {
+      #sidebarnav {
+        display: flex;
+        width: 100%;
+
+        .sidebar-item {
+          .first-level {
+            padding: 0;
+          }
+
+          position: relative;
+          width: auto;
+          margin-bottom: 0;
+        }
+
+        >.sidebar-item {
+          &:last-child {
+            border-right: none;
+          }
+
+          >.has-arrow:after {
+            transform: rotate(-135deg) translate(0, -50%);
+          }
+
+          &:last-child>.first-level {
+            right: 0px;
+            left: auto;
+          }
+
+          &.two-column {
+            .first-level {
+              width: 400px;
+
+              >.sidebar-item {
+                float: $lft;
+                width: 50%;
+                vertical-align: top;
+              }
+            }
+          }
+        }
+
+        >.sidebar-item ul {
+          position: absolute;
+          left: 0px;
+          top: auto;
+          width: 220px;
+          padding-bottom: 0px;
+          z-index: 100;
+          display: none;
+          box-shadow: 5px 10px 20px rgba(0, 0, 0, 0.1);
+        }
+
+        >.mega-dropdown {
+          position: static;
+
+          .first-level {
+            width: 100vw;
+
+            >li {
+              width: 25%;
+              float: $lft;
+            }
+          }
+        }
+
+        >.sidebar-item:hover {
+          background: rgba(0, 0, 0, 0.025);
+        }
+
+        >.sidebar-item:hover ul.first-level,
+        >.sidebar-item:hover ul.first-level.collapse {
+          display: block;
+
+          &:after {
+            position: absolute;
+            content: "";
+            background: rgba(0, 0, 0, 0.025);
+            top: 0;
+            height: 100%;
+            width: 100%;
+            left: 0;
+            z-index: -1;
+          }
+        }
+
+        >.sidebar-item ul.second-level {
+          left: 220px;
+          top: 0px;
+        }
+
+        >.sidebar-item:last-child>.first-level ul.second-level,
+        >.sidebar-item .first-level .right-side-dd ul.second-level {
+          right: 220px;
+          top: 0px;
+          left: auto;
+        }
+
+        ul.first-level>.sidebar-item:hover ul.second-level {
+          display: block;
+        }
+
+        .nav-small-cap,
+        .sidebar-footer,
+        .user-pro,
+        .badge {
+          display: none;
+        }
+      }
+    }
+  }
+}
+
+// new main + horizontal combination style
+@include media-breakpoint-up(lg) {
+  #main-wrapper[data-layout="horizontal"] {
+    .topbar .top-navbar .navbar-header {
+      display: none;
+    }
+  }
+}
+
+@include media-breakpoint-down(lg) {
+  #main-wrapper[data-layout="horizontal"] {
+    .left-sidebar {
+      top: $topbar-height;
+      border-top: 0;
+      border-bottom: 0;
+      height: calc(100% - 50px);
+      overflow-y: auto;
+    }
+
+    .page-wrapper {
+      padding-top: 100px;
+    }
+  }
+}
+
+
+@include media-breakpoint-down(md) {
+  #main-wrapper[data-layout="horizontal"] {
+    .topbar .top-navbar {
+      display: block !important;
+    }
+  }
+}

package/assets/scss/layouts/_icon-hover.scss

@@ -0,0 +1,20 @@
+.nav-icon-hover-bg {
+    width: 40px;
+    height: 40px;
+    margin: 0 5px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+
+    &:hover {
+        background-color: var(--bs-primary-bg-subtle);
+        color: var(--bs-primary);
+    }
+
+    &.dark {
+        &:hover {
+            background-color: rgba(0, 0, 0, 0.1);
+            color: var(--bs-white);
+        }
+    }
+}

package/assets/scss/layouts/_layout.scss

@@ -0,0 +1,360 @@
+// App
+
+/*============================================================== 
+ For all pages 
+ ============================================================== */
+
+#main-wrapper {
+  width: 100%;
+
+  overflow: hidden;
+}
+
+.page-wrapper {
+  position: relative;
+  height: 100vh;
+  transition: 0.5s ease 0s;
+  background-color: #f9fafb;
+}
+
+.page-wrapper > .container-fluid {
+  padding: 0 24px;
+  min-height: calc(100vh - 100px);
+  max-width: $page-wrapper-max-width;
+  transition: 0.5s ease 0s;
+}
+
+a {
+  text-decoration: none;
+
+  &:hover {
+    h6,
+    .h6,
+    h5,
+    .h5,
+    h4,
+    .h4,
+    h3,
+    .h3,
+    h2,
+    .h2,
+    h1,
+    .h1 {
+      color: var(--bs-primary);
+    }
+  }
+}
+
+[class^='ti-'],
+[class*=' ti-'] {
+  font-family: 'themify' !important;
+}
+
+/*******************
+ Stickey inner-left-part
+*******************/
+
+.main-part {
+  display: flex;
+  height: calc(100vh - 181px);
+  align-items: stretch;
+  margin-bottom: 30px;
+  border-radius: $card-border-radius;
+  overflow: hidden;
+}
+
+$left-part-width: 260px;
+
+.left-part {
+  width: $left-part-width;
+  border-right: 1px solid $border-color;
+  flex-shrink: 0;
+
+  .show-left-part {
+    position: absolute;
+    top: 25%;
+    right: -41px;
+  }
+}
+
+.right-part {
+  width: 100%;
+
+  .dropdown-toggle::after {
+    display: none;
+  }
+}
+
+.reverse-mode {
+  .left-part {
+    right: 0;
+    border-left: 1px solid $border-color;
+  }
+
+  .show-left-part {
+    right: auto;
+    left: -41px;
+  }
+
+  .right-part {
+    margin-left: 0px;
+    margin-right: $left-part-width;
+  }
+}
+
+/*******************
+ Vertical layout
+*******************/
+
+#main-wrapper[data-layout='vertical'] {
+  /*Vertical*/
+  .topbar .top-navbar .navbar-header {
+    transition: 0.5s ease 0s;
+    min-height: inherit;
+    display: flex;
+  }
+
+  /*sidebar type*/
+  &[data-sidebartype='full'] {
+    .page-wrapper {
+      margin-left: $sidebar-width-full;
+    }
+  }
+
+  /*Sidebar position*/
+
+  .topbar .top-navbar .navbar-header {
+    position: fixed;
+    z-index: 100;
+    background: $topbar;
+  }
+
+  .left-sidebar {
+    position: fixed;
+  }
+
+  .page-wrapper {
+    // padding-top: calc(#{$topbar-height} + 30px);
+    padding-top: 0;
+  }
+
+  /*Boxed Layout*/
+  &[data-boxed-layout='boxed'] .page-wrapper > .container-fluid {
+    max-width: $boxed-width;
+    margin: 0 auto;
+    position: relative;
+  }
+
+  &[data-boxed-layout='full'] .page-wrapper > .container-fluid {
+    max-width: 100%;
+    margin: 0 auto;
+    position: relative;
+  }
+}
+
+/*******************
+ Vertical responsive layout
+*******************/
+
+@include media-breakpoint-up(lg) {
+  #main-wrapper[data-layout='vertical'] {
+    /*Vertical*/
+    &[data-sidebartype='full'] {
+      .topbar .top-navbar .navbar-header {
+        width: $sidebar-width-full;
+      }
+    }
+
+    /*Sidebar position*/
+    &[data-sidebartype='full'] {
+      .topbar .top-navbar .navbar-collapse {
+        margin-left: $sidebar-width-full;
+        min-height: inherit;
+      }
+    }
+
+    &[data-sidebartype='mini-sidebar'] {
+      .topbar {
+        width: $sidebar-width-mini;
+      }
+      .topbar .top-navbar .navbar-collapse {
+        margin-left: $sidebar-width-mini;
+        min-height: inherit;
+      }
+    }
+
+    /*Vertical with mini-sidebar*/
+    &[data-sidebartype='mini-sidebar'] {
+      .topbar .top-navbar .navbar-collapse {
+        margin-left: $sidebar-width-mini;
+        min-height: inherit;
+      }
+
+      .topbar .top-navbar .navbar-header,
+      .navbar-brand {
+        width: $sidebar-width-mini;
+
+        label[for='check'] {
+          position: absolute;
+          right: -15%;
+          top: 0;
+        }
+
+        .logo-text {
+          display: none;
+        }
+
+        &.expand-logo {
+          width: $sidebar-width-full;
+
+          .logo-text {
+            display: block;
+          }
+        }
+      }
+
+      .page-wrapper {
+        margin-left: $sidebar-width-mini;
+      }
+
+      .sidebar-nav {
+        .hide-menu,
+        .has-arrow:after {
+          display: none;
+        }
+
+        .nav-small-cap {
+          .iconify {
+            display: inline-block;
+          }
+        }
+
+        .first-level {
+          padding-left: 0;
+
+          .sidebar-item .sidebar-link .iconify {
+            display: block;
+          }
+        }
+      }
+
+      .left-sidebar {
+        width: $sidebar-width-mini;
+
+        .sidebar-nav {
+          ul {
+            .sidebar-item {
+              .sidebar-link,
+              .nav-small-cap {
+                justify-content: center;
+                text-align: center;
+              }
+
+              .sidebar-link {
+                .iconify {
+                  margin: 0 5px 0 5px;
+                }
+              }
+            }
+          }
+        }
+
+        // &:hover {
+        //   width: $sidebar-width-full;
+
+        //   .sidebar-nav {
+        //     ul {
+        //       .sidebar-item {
+        //         .sidebar-link,
+        //         .nav-small-cap {
+        //           justify-content: left;
+        //           text-align: left;
+        //         }
+
+        //         .sidebar-link {
+        //           .iconify {
+        //             margin: 0 8px 0 5px;
+        //           }
+        //         }
+        //       }
+        //     }
+        //   }
+
+        //   .sidebar-nav {
+        //     .hide-menu,
+        //     .has-arrow:after {
+        //       display: block;
+        //     }
+
+        //     .nav-small-cap {
+        //       .iconify {
+        //         display: none;
+        //       }
+        //     }
+
+        //     .first-level {
+        //       padding: $sidebar-first-level-padding;
+
+        //       .sidebar-item .sidebar-link .iconify {
+        //         display: none;
+        //       }
+        //     }
+        //   }
+        // }
+      }
+    }
+  }
+}
+
+@include media-breakpoint-down(lg) {
+  #main-wrapper {
+    &[data-sidebartype='mini-sidebar'] {
+      .left-sidebar {
+        left: -$sidebar-width-full;
+      }
+    }
+
+    &.show-sidebar {
+      .left-sidebar {
+        left: 0;
+      }
+    }
+
+    &[data-layout='vertical'] {
+      .topbar .top-navbar {
+        .navbar-collapse {
+          position: relative;
+          top: $topbar-height;
+          background: var(--bs-white);
+          min-height: inherit;
+        }
+      }
+    }
+  }
+  .left-part {
+    left: -$left-part-width;
+    background: $body-bg;
+    z-index: 1;
+    position: absolute;
+    height: calc(100vh - 175px);
+    transition: 0.1s ease-in;
+
+    &.show-panel {
+      left: 0px;
+    }
+  }
+
+  .reverse-mode .left-part {
+    right: -$left-part-width;
+    left: auto;
+
+    &.show-panel {
+      right: 0px;
+    }
+  }
+
+  .right-part {
+    width: 100%;
+    margin-left: 0px;
+  }
+}