viniBaxter-desk_front 10.0.0 → 15.0.0

data/lib/viniBaxter/sass/desk_front/beckyBaxter/custom/_navbar.scss

@@ -1,480 +1,479 @@
-.navbar {
-  width: 100%;
-  z-index: 1050;
-  background: $navbar-color;
-
-  .photo {
-    display: inline-block;
-    height: 30px;
-    width: 30px;
-    border-radius: 50%;
-    vertical-align: middle;
-    overflow: hidden;
-      img{
-        width: 100%;
-      }
-  }
-
-  .navbar-wrapper {
-    display: flex;
-    align-items: center;
-  }
-
-  .navbar-text {
-    color: $white;
-  }
-
-  .btn{
-    margin: 0 5px 0 10px;
-  }
-
-  &.navbar-absolute{
-    position: absolute;
-    z-index: 1050;
-  }
-
-
-  &.navbar-transparent{
-    background: transparent !important;
-  }
-
-  &.bg-white{
-    .navbar-nav{
-      .search-bar.input-group{
-        i{
-          color: $black;
-        }
-      }
-
-      .search-bar.input-group .form-control{
-        background: rgba($black,0.1);
-        border-radius: 4px;
-      }
-
-      a.nav-link{
-        color: $black !important;
-        p{
-          color: $black;
-        }
-      }
-
-    }
-
-    .navbar-text, .navbar-brand{
-      color: $black;
-    }
-
-    .form-control {
-      color: $black !important;
-    }
-
-    .form-control::placeholder {
-      color: $dark-gray !important;
-    }
-
-  }
-
-  &.bg-dark {
-    background: $black !important;
-  }
-
-  &.bg-primary {
-    background-color: $primary !important;
-  }
-
-  &.bg-warning {
-    background-color: $warning !important;
-  }
-
-  &.bg-info {
-    background-color: $info !important;
-  }
-
-  &.bg-success {
-    background-color: darken($success, 10%) !important;
-  }
-
-  &.bg-danger {
-    background-color: $danger !important;
-  }
-
-  .navbar-brand {
-    position: relative;
-    padding-top: .3125rem;
-    padding-bottom: .3125rem;
-    color: $white;
-    margin-left: 17px;
-    text-transform: uppercase;
-    font-size: $font-paragraph;
-  }
-
-  .navbar-toggle button:focus, .navbar-toggler{
-    outline: none;
-  }
-
-}
-
-.navbar-minimize-fixed {
-	position: fixed;
-  margin-left: 40px;
-  margin-top: 14px;
-	transition: 0.3s ease;
-	color: white;
-	z-index: 20;
-	opacity: 0;
-	transition: 0.2s ease;
-	button{
-		i {
-			font-size: 20px;
-		}
-	}
-}
+// .navbar {
+//   width: 100%;
+//   z-index: 1050;
+//   background: $navbar-color;
+
+//   .photo {
+//     display: inline-block;
+//     height: 30px;
+//     width: 30px;
+//     border-radius: 50%;
+//     vertical-align: middle;
+//     overflow: hidden;
+//       img{
+//         width: 100%;
+//       }
+//   }
+
+//   .navbar-wrapper {
+//     display: flex;
+//     align-items: center;
+//   }
+
+//   .navbar-text {
+//     color: $white;
+//   }
+
+//   .btn{
+//     margin: 0 5px 0 10px;
+//   }
+
+//   &.navbar-absolute{
+//     position: absolute;
+//     z-index: 1050;
+//   }
+
+//   &.navbar-transparent{
+//     background: transparent !important;
+//   }
+
+//   &.bg-white{
+//     .navbar-nav{
+//       .search-bar.input-group{
+//         i{
+//           color: $black;
+//         }
+//       }
+
+//       .search-bar.input-group .form-control{
+//         background: rgba($black,0.1);
+//         border-radius: 4px;
+//       }
+
+//       a.nav-link{
+//         color: $black !important;
+//         p{
+//           color: $black;
+//         }
+//       }
+
+//     }
+
+//     .navbar-text, .navbar-brand{
+//       color: $black;
+//     }
+
+//     .form-control {
+//       color: $black !important;
+//     }
+
+//     .form-control::placeholder {
+//       color: $dark-gray !important;
+//     }
+
+//   }
+
+//   &.bg-dark {
+//     background: $black !important;
+//   }
+
+//   &.bg-primary {
+//     background-color: $primary !important;
+//   }
+
+//   &.bg-warning {
+//     background-color: $warning !important;
+//   }
+
+//   &.bg-info {
+//     background-color: $info !important;
+//   }
+
+//   &.bg-success {
+//     background-color: darken($success, 10%) !important;
+//   }
+
+//   &.bg-danger {
+//     background-color: $danger !important;
+//   }
+
+//   .navbar-brand {
+//     position: relative;
+//     padding-top: .3125rem;
+//     padding-bottom: .3125rem;
+//     color: $white;
+//     margin-left: 17px;
+//     text-transform: uppercase;
+//     font-size: $font-paragraph;
+//   }
+
+//   .navbar-toggle button:focus, .navbar-toggler{
+//     outline: none;
+//   }
+
+// }
+
+// .navbar-minimize-fixed {
+// 	position: fixed;
+//   margin-left: 40px;
+//   margin-top: 14px;
+// 	transition: 0.3s ease;
+// 	color: white;
+// 	z-index: 20;
+// 	opacity: 0;
+// 	transition: 0.2s ease;
+// 	button{
+// 		i {
+// 			font-size: 20px;
+// 		}
+// 	}
+// }
 
 .notification {
   background: $danger;
-	color: $white;
-	border-radius: $border-radius-xl;
-	height: 6px;
-	width: 6px;
-	position: absolute;
-	text-align: center;
-	font-size: 12px;
-	font-weight: 800;
+  color: $white;
+  border-radius: $border-radius-xl;
+  height: 20px;
+  width: 20px;
+  position: absolute;
+  text-align: center;
+  font-size: 12px;
+  font-weight: 800;
   top: 10px;
   right: 10px;
-	border: 1px solid $danger;
-}
-
-.navbar-nav li{
-  padding: 0 10px;
-  a{
-    color: $white;
-  }
-  i{
-    vertical-align: middle;
-    font-size: 20px;
-  }
-}
-
-@include media-breakpoint-down(md){
-  .navbar {
-    top: -70px;
-  }
-
-  .navbar{
-      .container-fluid{
-          padding-right: 15px;
-          padding-left: 15px;
-      }
-
-      .navbar-collapse{
-        .input-group{
-          margin: 0;
-          margin-top: 5px;
-        }
-      }
-
-      .navbar-nav{
-
-        .btn{
-          margin-left: -3px;
-          display: flex;
-
-          i {
-            margin-right: 12px;
-          }
-
-          span {
-            margin: 0;
-            text-transform: uppercase;
-            font-weight: 300;
-
-            &,
-            &:hover,
-            &:focus,
-            &:active,
-            &:active:focus {
-              color: $black !important;
-            }
-          }
-        }
-
-          a.nav-link{
-            i{
-              opacity: 1;
-              margin-left: 4px;
-              margin-right: 5px;
-            }
-            p{
-              display: inline-block;
-              text-transform: uppercase;
-              margin-left: 7px;
-            }
-          }
-
-          .modal-search .modal-dialog{
-            padding: 0 40px;
-          }
-          .dropdown{
-            margin: 5px 0;
-            .nav-link{
-              padding-bottom: 0;
-            }
-            .dropdown-menu{
-              .dropdown-item{
-                margin-top: 0;
-                padding-left: 24px;
-              }
-            }
-          }
-      }
-
-      .dropdown.show .dropdown-menu{
-          display: block;
-
-      }
-
-      .dropdown .dropdown-menu{
-          display: none;
-          li a{
-            color: $black;
-          }
-      }
-
-      .dropdown.show .dropdown-menu,
-      .dropdown .dropdown-menu{
-          background-color: transparent;
-          border: 0;
-          transition: none;
-          -webkit-box-shadow: none;
-          box-shadow: none;
-          width: auto;
-          margin: 0px 1rem;
-          padding-top: 0;
-          margin-top: 0px;
-
-          &:before{
-              display: none;
-          }
-      }
-
-      .dropdown-menu .dropdown-item:focus,
-      .dropdown-menu .dropdown-item:hover{
-          color: $white;
-      }
-
-      &.bg-white .dropdown-menu .dropdown-item:focus,
-      &.bg-white .dropdown-menu .dropdown-item:hover{
-          color: $default;
-      }
-
-      .navbar-toggler-bar{
-          display: block;
-          position: relative;
-          width: 22px;
-          height: 1px;
-          border-radius: 1px;
-          background: $white;
-
-          &.navbar-kebab{
-            height: 4px;
-            width: 4px;
-            margin-bottom: 3px;
-            border-radius: 50%;
-          }
-
-          & + .navbar-toggler-bar{
-              margin-top: 7px;
-          }
-
-          & + .navbar-toggler-bar.navbar-kebab{
-              margin-top: 0px;
-          }
-
-          &.bar2{
-              width: 17px;
-              transition: width .2s linear;
-          }
-      }
-
-      &.bg-white:not(.navbar-transparent) .navbar-toggler-bar{
-          background-color: $default;
-      }
-
-      & .toggled .navbar-toggler-bar{
-          width: 24px;
-      }
-  }
-
-  .bar1,
-  .bar2,
-  .bar3 {
-    outline: 1px solid transparent;
-  }
-  .bar1 {
-    top: 0px;
-    @include bar-animation($topbar-back);
-  }
-  .bar2 {
-    opacity: 1;
-  }
-  .bar3 {
-    bottom: 0px;
-    @include bar-animation($bottombar-back);
-  }
-  .toggled .bar1 {
-    top: 6px;
-    @include bar-animation($topbar-x);
-  }
-  .toggled .bar2 {
-    opacity: 0;
-  }
-  .toggled .bar3 {
-    bottom: 9px;
-    @include bar-animation($bottombar-x);
-  }
-
-  @include topbar-x-rotation();
-  @include topbar-back-rotation();
-  @include bottombar-x-rotation();
-  @include bottombar-back-rotation();
-
-  @-webkit-keyframes fadeIn {
-    0% {opacity: 0;}
-    100% {opacity: 1;}
-  }
-  @-moz-keyframes fadeIn {
-    0% {opacity: 0;}
-    100% {opacity: 1;}
-  }
-  @keyframes fadeIn {
-    0% {opacity: 0;}
-    100% {opacity: 1;}
-  }
-
-  .navbar-nav{
-      .nav-link{
-          i.fa,
-          i.tim-icons{
-              opacity: .5;
-          }
-      }
-  }
-
+  border: 1px solid $danger;
 }
 
-@include media-breakpoint-up(lg) {
-  .navbar-collapse {
-      background: none !important;
-  }
-
-  .navbar .navbar-toggle {
-      display: none;
-
-  }
-
-  .navbar-nav {
-      .nav-link {
-          &.profile-photo {
-              padding: 0;
-              margin: 7px $padding-base-horizontal;
-          }
-      }
-  }
-
-  .navbar {
-    .caret {
-      position: absolute;
-      left: 80%;
-      top: 55%;
-      margin-left: 0;
-    }
-  }
-
-  .navbar-expand-lg .navbar-nav .nav-link {
-    padding-right: $list-inline-padding;
-    padding-left: $list-inline-padding;
-  }
-
-}
-
-@include media-breakpoint-down(xs) {
-  .navbar[class*='navbar-toggleable-'] .container {
-    margin-left: 0;
-    margin-right: 0;
-  }
-
-}
-
-@include media-breakpoint-between (md, lg){
-  .bar1,
-  .bar2,
-  .bar3 {
-    outline: 1px solid transparent;
-  }
-  .bar1 {
-    top: 0px;
-    @include bar-animation($topbar-back);
-  }
-  .bar2 {
-    opacity: 1;
-  }
-  .bar3 {
-    bottom: 0px;
-    @include bar-animation($bottombar-back);
-  }
-  .toggled .bar1 {
-    top: 7px;
-    @include bar-animation($topbar-x);
-  }
-  .toggled .bar2 {
-    opacity: 0;
-  }
-  .toggled .bar3 {
-    bottom: 9px;
-    @include bar-animation($bottombar-x);
-  }
-
-  @include topbar-x-rotation();
-  @include topbar-back-rotation();
-  @include bottombar-x-rotation();
-  @include bottombar-back-rotation();
-
-  @-webkit-keyframes fadeIn {
-    0% {opacity: 0;}
-    100% {opacity: 1;}
-  }
-  @-moz-keyframes fadeIn {
-    0% {opacity: 0;}
-    100% {opacity: 1;}
-  }
-  @keyframes fadeIn {
-    0% {opacity: 0;}
-    100% {opacity: 1;}
-  }
-
-  .navbar .navbar-toggler-bar.bar2 {
-    width: 17px;
-    transition: width .2s linear;
-}
-
-  .navbar .navbar-toggler-bar {
-    display: block;
-    position: relative !important;
-    width: 22px;
-    height: 1px;
-    border-radius: 1px;
-    background: $white;
-  }
-  .navbar .navbar-toggler-bar+.navbar-toggler-bar {
-    margin-top: 7px;
-  }
-
-  .navbar .navbar-toggle .navbar-toggler{
-    display: block;
-  }
-
-  .navbar-minimize-fixed{
-    display: none;
-  }
-}
+// .navbar-nav li{
+//   padding: 0 10px;
+//   a{
+//     color: $white;
+//   }
+//   i{
+//     vertical-align: middle;
+//     font-size: 20px;
+//   }
+// }
+
+// @include media-breakpoint-down(md){
+//   .navbar {
+//     top: -70px;
+//   }
+
+//   .navbar{
+//       .container-fluid{
+//           padding-right: 15px;
+//           padding-left: 15px;
+//       }
+
+//       .navbar-collapse{
+//         .input-group{
+//           margin: 0;
+//           margin-top: 5px;
+//         }
+//       }
+
+//       .navbar-nav{
+
+//         .btn{
+//           margin-left: -3px;
+//           display: flex;
+
+//           i {
+//             margin-right: 12px;
+//           }
+
+//           span {
+//             margin: 0;
+//             text-transform: uppercase;
+//             font-weight: 300;
+
+//             &,
+//             &:hover,
+//             &:focus,
+//             &:active,
+//             &:active:focus {
+//               color: $black !important;
+//             }
+//           }
+//         }
+
+//           a.nav-link{
+//             i{
+//               opacity: 1;
+//               margin-left: 4px;
+//               margin-right: 5px;
+//             }
+//             p{
+//               display: inline-block;
+//               text-transform: uppercase;
+//               margin-left: 7px;
+//             }
+//           }
+
+//           .modal-search .modal-dialog{
+//             padding: 0 40px;
+//           }
+//           .dropdown{
+//             margin: 5px 0;
+//             .nav-link{
+//               padding-bottom: 0;
+//             }
+//             .dropdown-menu{
+//               .dropdown-item{
+//                 margin-top: 0;
+//                 padding-left: 24px;
+//               }
+//             }
+//           }
+//       }
+
+//       .dropdown.show .dropdown-menu{
+//           display: block;
+
+//       }
+
+//       .dropdown .dropdown-menu{
+//           display: none;
+//           li a{
+//             color: $black;
+//           }
+//       }
+
+//       .dropdown.show .dropdown-menu,
+//       .dropdown .dropdown-menu{
+//           background-color: transparent;
+//           border: 0;
+//           transition: none;
+//           -webkit-box-shadow: none;
+//           box-shadow: none;
+//           width: auto;
+//           margin: 0px 1rem;
+//           padding-top: 0;
+//           margin-top: 0px;
+
+//           &:before{
+//               display: none;
+//           }
+//       }
+
+//       .dropdown-menu .dropdown-item:focus,
+//       .dropdown-menu .dropdown-item:hover{
+//           color: $white;
+//       }
+
+//       &.bg-white .dropdown-menu .dropdown-item:focus,
+//       &.bg-white .dropdown-menu .dropdown-item:hover{
+//           color: $default;
+//       }
+
+//       .navbar-toggler-bar{
+//           display: block;
+//           position: relative;
+//           width: 22px;
+//           height: 1px;
+//           border-radius: 1px;
+//           background: $white;
+
+//           &.navbar-kebab{
+//             height: 4px;
+//             width: 4px;
+//             margin-bottom: 3px;
+//             border-radius: 50%;
+//           }
+
+//           & + .navbar-toggler-bar{
+//               margin-top: 7px;
+//           }
+
+//           & + .navbar-toggler-bar.navbar-kebab{
+//               margin-top: 0px;
+//           }
+
+//           &.bar2{
+//               width: 17px;
+//               transition: width .2s linear;
+//           }
+//       }
+
+//       &.bg-white:not(.navbar-transparent) .navbar-toggler-bar{
+//           background-color: $default;
+//       }
+
+//       & .toggled .navbar-toggler-bar{
+//           width: 24px;
+//       }
+//   }
+
+//   .bar1,
+//   .bar2,
+//   .bar3 {
+//     outline: 1px solid transparent;
+//   }
+//   .bar1 {
+//     top: 0px;
+//     @include bar-animation($topbar-back);
+//   }
+//   .bar2 {
+//     opacity: 1;
+//   }
+//   .bar3 {
+//     bottom: 0px;
+//     @include bar-animation($bottombar-back);
+//   }
+//   .toggled .bar1 {
+//     top: 6px;
+//     @include bar-animation($topbar-x);
+//   }
+//   .toggled .bar2 {
+//     opacity: 0;
+//   }
+//   .toggled .bar3 {
+//     bottom: 9px;
+//     @include bar-animation($bottombar-x);
+//   }
+
+//   @include topbar-x-rotation();
+//   @include topbar-back-rotation();
+//   @include bottombar-x-rotation();
+//   @include bottombar-back-rotation();
+
+//   @-webkit-keyframes fadeIn {
+//     0% {opacity: 0;}
+//     100% {opacity: 1;}
+//   }
+//   @-moz-keyframes fadeIn {
+//     0% {opacity: 0;}
+//     100% {opacity: 1;}
+//   }
+//   @keyframes fadeIn {
+//     0% {opacity: 0;}
+//     100% {opacity: 1;}
+//   }
+
+//   .navbar-nav{
+//       .nav-link{
+//           i.fa,
+//           i.tim-icons{
+//               opacity: .5;
+//           }
+//       }
+//   }
+
+// }
+
+// @include media-breakpoint-up(lg) {
+//   .navbar-collapse {
+//       background: none !important;
+//   }
+
+//   .navbar .navbar-toggle {
+//       display: none;
+
+//   }
+
+//   .navbar-nav {
+//       .nav-link {
+//           &.profile-photo {
+//               padding: 0;
+//               margin: 7px $padding-base-horizontal;
+//           }
+//       }
+//   }
+
+//   .navbar {
+//     .caret {
+//       position: absolute;
+//       left: 80%;
+//       top: 55%;
+//       margin-left: 0;
+//     }
+//   }
+
+//   .navbar-expand-lg .navbar-nav .nav-link {
+//     padding-right: $list-inline-padding;
+//     padding-left: $list-inline-padding;
+//   }
+
+// }
+
+// @include media-breakpoint-down(xs) {
+//   .navbar[class*='navbar-toggleable-'] .container {
+//     margin-left: 0;
+//     margin-right: 0;
+//   }
+
+// }
+
+// @include media-breakpoint-between (md, lg){
+//   .bar1,
+//   .bar2,
+//   .bar3 {
+//     outline: 1px solid transparent;
+//   }
+//   .bar1 {
+//     top: 0px;
+//     @include bar-animation($topbar-back);
+//   }
+//   .bar2 {
+//     opacity: 1;
+//   }
+//   .bar3 {
+//     bottom: 0px;
+//     @include bar-animation($bottombar-back);
+//   }
+//   .toggled .bar1 {
+//     top: 7px;
+//     @include bar-animation($topbar-x);
+//   }
+//   .toggled .bar2 {
+//     opacity: 0;
+//   }
+//   .toggled .bar3 {
+//     bottom: 9px;
+//     @include bar-animation($bottombar-x);
+//   }
+
+//   @include topbar-x-rotation();
+//   @include topbar-back-rotation();
+//   @include bottombar-x-rotation();
+//   @include bottombar-back-rotation();
+
+//   @-webkit-keyframes fadeIn {
+//     0% {opacity: 0;}
+//     100% {opacity: 1;}
+//   }
+//   @-moz-keyframes fadeIn {
+//     0% {opacity: 0;}
+//     100% {opacity: 1;}
+//   }
+//   @keyframes fadeIn {
+//     0% {opacity: 0;}
+//     100% {opacity: 1;}
+//   }
+
+//   .navbar .navbar-toggler-bar.bar2 {
+//     width: 17px;
+//     transition: width .2s linear;
+// }
+
+//   .navbar .navbar-toggler-bar {
+//     display: block;
+//     position: relative !important;
+//     width: 22px;
+//     height: 1px;
+//     border-radius: 1px;
+//     background: $white;
+//   }
+//   .navbar .navbar-toggler-bar+.navbar-toggler-bar {
+//     margin-top: 7px;
+//   }
+
+//   .navbar .navbar-toggle .navbar-toggler{
+//     display: block;
+//   }
+
+//   .navbar-minimize-fixed{
+//     display: none;
+//   }
+// }