@open-rlb/ng-bootstrap 2.2.17

package/assets/scss/custom/components/_dropdown.scss

@@ -0,0 +1,102 @@
+//
+// _dropdown.scss
+//
+
+//.dropdown-menu {
+//  box-shadow: $box-shadow-lg;
+//  animation-name: DropDownSlide;
+//  animation-duration: 0.3s;
+//  animation-fill-mode: both;
+//  margin: 0;
+//  position: absolute;
+//  z-index: 1000;
+//
+//  &.show {
+//    top: 100% !important;
+//  }
+//}
+
+
+//.dropdown-menu-end[style] {
+//  left: auto !important;
+//  right: 0 !important;
+//}
+
+// default (static)
+//.dropdown-static .dropdown-menu {
+//  animation: DropDownSlide 0.3s both;
+//}
+//
+//// for dynamic (Popper)
+//.dropdown-dynamic .dropdown-menu {
+//  animation: DropDownFade 0.2s ease-out both;
+//}
+
+// ====== Popper-driven dropdowns (bootstrap default) ======
+//.dropdown-menu[data-popper-placement] {
+//  // Popper sets top/left/right by itself
+//  // we only disable animations
+//  &[data-popper-placement^="right"],
+//  &[data-popper-placement^="top"],
+//  &[data-popper-placement^="left"] {
+//    top: auto !important;
+//    animation: none !important;
+//  }
+//}
+
+//@keyframes DropDownSlide {
+//  100% {
+//    transform: translateY(0);
+//  }
+//  0% {
+//    transform: translateY(10px);
+//  }
+//}
+//
+//@keyframes DropDownFade {
+//  0% {
+//    opacity: 0;
+//    transform: scaleY(0.95);
+//  }
+//  100% {
+//    opacity: 1;
+//    transform: scaleY(1);
+//  }
+//}
+
+@media (min-width: 600px) {
+  .dropdown-menu-lg {
+    width: 320px;
+  }
+
+  .dropdown-menu-md {
+    width: 240px;
+  }
+}
+
+// Dropdown Mega Menu
+
+.dropdown-mega {
+  position: static !important;
+}
+
+.dropdown-megamenu[style] {
+  padding: 20px;
+  left: 20px !important;
+  right: 20px !important;
+}
+
+// Dropdown size
+
+.dropdown-mega-menu-xl {
+  width: 40rem;
+}
+
+.dropdown-mega-menu-lg {
+  width: 26rem;
+}
+
+// force inline styles to have bootstrap-like behavior
+rlb-dropdown {
+  display: inline-block;
+}

package/assets/scss/custom/components/_forms.scss

@@ -0,0 +1,181 @@
+//
+// Forms.scss
+//
+
+[type="tel"],
+[type="url"],
+[type="email"],
+[type="number"] {
+  &::placeholder {
+    text-align: left
+      /*rtl: right*/
+    ;
+  }
+}
+
+.form-check {
+  position: relative;
+  text-align: left
+    /*rtl: right*/
+  ;
+}
+
+
+// checkbox input right
+
+.form-check-right {
+  padding-left: 0;
+  display: inline-block;
+  padding-right: $form-check-padding-start;
+
+  .form-check-input {
+    float: right;
+    margin-left: 0;
+    margin-right: $form-check-padding-start * -1;
+  }
+
+  .form-check-label {
+    display: block;
+  }
+}
+
+
+
+// checkbox
+
+.form-checkbox-outline {
+
+  .form-check-input {
+    border-width: 2px;
+    background-color: var(--#{$prefix}secondary-bg);
+
+    &:active {
+      filter: none;
+    }
+
+    &:checked {
+      background-color: var(--#{$prefix}secondary-bg)  !important;
+
+      &[type=checkbox] {
+        background-image: none;
+
+      }
+
+      &:after {
+        position: absolute;
+        content: '\F012C';
+        font-family: "Material Design Icons";
+        top: -4px !important;
+        left: 1px;
+        /*rtl: -4px */
+        font-size: 16px;
+        color: var(--#{$prefix}body-color);
+      }
+    }
+  }
+}
+
+// radio
+
+.form-radio-outline {
+  .form-check-input {
+    background-color: var(--#{$prefix}secondary-bg);
+    position: relative;
+
+    &:active {
+      filter: none;
+    }
+
+    &:checked {
+      background-color: var(--#{$prefix}secondary-bg)  !important;
+
+      &[type=checkbox] {
+        background-image: none;
+
+      }
+
+      &:after {
+        position: absolute;
+        content: '';
+        top: 3px !important;
+        left: 3px;
+        width: 5px;
+        height: 5px;
+        border-radius: 50%;
+      }
+    }
+  }
+}
+
+
+
+// checkbox color
+
+@each $color,
+$value in $theme-colors {
+  .form-check-#{$color} {
+    .form-check-input {
+      &:checked {
+        background-color: $value;
+        border-color: $value;
+      }
+    }
+  }
+
+  .form-radio-#{$color} {
+    .form-check-input {
+      &:checked {
+        border-color: $value;
+        background-color: $value;
+
+        &:after {
+          background-color: $value;
+        }
+      }
+    }
+  }
+}
+
+.form-check,
+.form-check-input,
+.form-check-label {
+  cursor: pointer;
+  margin-bottom: 0;
+}
+
+// Switch sizes
+
+.form-switch-md {
+  padding-left: 2.5rem;
+  min-height: 24px;
+  line-height: 24px;
+
+  .form-check-input {
+    width: 40px;
+    height: 20px;
+    left: -0.5rem;
+    position: relative;
+  }
+
+  .form-check-label {
+    vertical-align: middle;
+  }
+}
+
+
+.form-switch-lg {
+  padding-left: 2.75rem;
+  min-height: 28px;
+  line-height: 28px;
+
+  .form-check-input {
+    width: 48px;
+    height: 24px;
+    left: -0.75rem;
+    position: relative;
+  }
+}
+
+.input-group-text {
+  margin-bottom: 0px;
+}

package/assets/scss/custom/components/_helper.scss

@@ -0,0 +1,104 @@
+//
+// _helper.scss
+//
+
+.font-size-10 {
+    font-size: 10px !important;
+}
+
+.font-size-11 {
+    font-size: 11px !important;
+}
+
+.font-size-12 {
+    font-size: 12px !important;
+}
+
+.font-size-13 {
+    font-size: 13px !important;
+}
+
+.font-size-14 {
+    font-size: 14px !important;
+}
+
+.font-size-15 {
+    font-size: 15px !important;
+}
+
+.font-size-16 {
+    font-size: 16px !important;
+}
+
+.font-size-17 {
+    font-size: 17px !important;
+}
+
+.font-size-18 {
+    font-size: 18px !important;
+}
+
+.font-size-20 {
+    font-size: 20px !important;
+}
+
+.font-size-22 {
+    font-size: 22px !important;
+}
+
+.font-size-24 {
+    font-size: 24px !important;
+}
+
+// Social
+.social-list-item {
+    height: 2rem;
+    width: 2rem;
+    line-height: calc(2rem - 4px);
+    display: block;
+    border: 2px solid $gray-500;
+    border-radius: 50%;
+    color: $gray-500;
+    text-align: center;
+    transition: all 0.4s;
+
+    &:hover {
+        color: var(--#{$prefix}secondary-color);
+        background-color: $gray-200;
+    }
+}
+
+
+.w-xs {
+    min-width: 80px;
+}
+
+.w-sm {
+    min-width: 95px;
+}
+
+.w-md {
+    min-width: 110px;
+}
+
+.w-lg {
+    min-width: 140px;
+}
+
+.w-xl {
+    min-width: 160px;
+}
+
+
+// alert
+
+.alert-dismissible {
+    .btn-close {
+        font-size: 10px;
+        padding: $alert-padding-y * 1.4 $alert-padding-x;
+    }
+}
+
+.chartjs-chart {
+    max-height: 300px;
+}

package/assets/scss/custom/components/_nav.scss

@@ -0,0 +1,68 @@
+// 
+// _nav.scss
+// 
+
+.nav-tabs,.nav-pills {
+  > li {
+      > a {
+          color: var(--#{$prefix}emphasis-color);
+          font-weight: $font-weight-medium;
+      }
+  }
+}
+
+.nav-pills {
+  > a {
+      color: var(--#{$prefix}emphasis-color);  
+      font-weight: $font-weight-medium;
+  }
+}
+
+
+.nav-tabs-custom {
+  border-bottom: 2px solid var(--#{$prefix}border-color);
+
+  .nav-item {
+    position: relative;
+    color: var(--#{$prefix}body-color);
+    .nav-link {
+      border: none;
+
+      &::after {
+        content: "";
+        background: $primary;
+        height: 2px;
+        position: absolute;
+        width: 100%;
+        left: 0;
+        bottom: -1px;
+        transition: all 250ms ease 0s;
+        transform: scale(0);
+      }
+
+      &.active{
+        color: $primary;
+        &:after{
+          transform: scale(1);
+        }
+      }
+
+    }
+  }
+}
+
+
+// vertical nav
+
+.vertical-nav{
+  .nav{
+      .nav-link{
+          padding: 24px 16px;
+          text-align: center;
+          margin-bottom: 8px;
+          .nav-icon{
+              font-size: 24px;
+          }
+      }
+  }
+}

package/assets/scss/custom/components/_pagination.scss

@@ -0,0 +1,19 @@
+// 
+// _pagination.scss
+// 
+
+// Pagination rounded (Custom)
+.pagination-rounded {
+    .page-link {
+        border-radius: 30px !important;
+        margin: 0 3px !important;
+        border: none;
+        width: 32px;
+        height: 32px;
+        padding: 0;
+        text-align: center;
+        line-height: 32px;
+        padding-left: 10px;
+        padding-right: 10px;
+    }
+}

package/assets/scss/custom/components/_preloader.scss

@@ -0,0 +1,106 @@
+// 
+// preloader.scss
+//
+
+#preloader {
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background-color: var(--#{$prefix}secondary-bg);
+    z-index: 9999;
+}
+
+#status {
+    width: 40px;
+    height: 40px;
+    position: absolute;
+    left: 50%;
+    top: 50%;
+    margin: -20px 0 0 -20px;
+}
+
+.spinner-chase {
+    margin: 0 auto;
+    width: 40px;
+    height: 40px;
+    position: relative;
+    animation: spinner-chase 2.5s infinite linear both;
+}
+
+.chase-dot {
+    width: 100%;
+    height: 100%;
+    position: absolute;
+    left: 0;
+    top: 0; 
+    animation: chase-dot 2.0s infinite ease-in-out both; 
+    &:before {
+        content: '';
+        display: block;
+        width: 25%;
+        height: 25%;
+        background-color: $primary;
+        border-radius: 100%;
+        animation: chase-dot-before 2.0s infinite ease-in-out both; 
+    }
+
+    &:nth-child(1) { 
+        animation-delay: -1.1s; 
+        &:before{
+            animation-delay: -1.1s;
+        }
+    }
+    &:nth-child(2) { 
+        animation-delay: -1.0s;
+        &:before{
+            animation-delay: -1.0s;
+        }
+    }
+    &:nth-child(3) { 
+        animation-delay: -0.9s;
+        &:before{
+            animation-delay: -0.9s;
+        } 
+    }
+    &:nth-child(4) { 
+        animation-delay: -0.8s; 
+        &:before{
+            animation-delay: -0.8s;
+        } 
+    }
+    &:nth-child(5) { 
+        animation-delay: -0.7s; 
+        &:before{
+            animation-delay: -0.7s;
+        } 
+    }
+    &:nth-child(6) { 
+        animation-delay: -0.6s; 
+        &:before{
+            animation-delay: -0.6s;
+        }
+    }
+}
+
+@keyframes spinner-chase {
+    100% { 
+        transform: rotate(360deg); 
+    } 
+}
+
+@keyframes chase-dot {
+    80%, 100% { 
+        transform: rotate(360deg); 
+    } 
+}
+
+@keyframes chase-dot-before {
+    50% {
+        transform: scale(0.4); 
+    } 
+    100%, 0% {
+        transform: scale(1.0); 
+    } 
+}

package/assets/scss/custom/components/_print.scss

@@ -0,0 +1,26 @@
+// 
+// print.scss
+//
+
+// Used invoice page
+@media print {
+    .vertical-menu,
+    .right-bar,
+    .page-title-box,
+    .navbar-header,
+    .footer {
+        display: none !important;
+    }
+    .card-body,
+    .main-content,
+    .right-bar,
+    .page-content,
+    body {
+        padding: 0;
+        margin: 0;
+    }
+
+    .card{
+        border: 0;
+    }
+}

package/assets/scss/custom/components/_progress.scss

@@ -0,0 +1,53 @@
+// 
+// _progress.scss
+// 
+
+// Progress height small
+.progress-sm {
+  height: 5px;
+}
+
+
+// Progress height medium
+.progress-md {
+  height: 8px;
+}
+
+
+// Progress height large
+.progress-lg {
+  height: 12px;
+}
+
+// Progress height Extra large
+.progress-xl {
+  height: 16px;
+}
+
+.custom-progess{
+  position: relative;
+  .progress-icon{
+      position: absolute;
+      top: -12px;
+      .avatar-title{
+        background: var(--#{$prefix}secondary-bg);
+      }
+  }
+}
+
+// animated-progess
+
+.animated-progess{
+  position: relative;
+  .progress-bar {
+    position: relative;
+    border-radius: 6px;
+    animation: animate-positive 2s;
+  }
+}
+
+@keyframes animate-positive {
+  0% {
+      width: 0;
+  }
+}

package/assets/scss/custom/components/_reboot.scss

@@ -0,0 +1,51 @@
+/* =============
+   General
+============= */
+
+html {
+  position: relative;
+  min-height: 100%;
+}
+
+// .h1,.h2,.h3,.h4,.h5,.h6,
+// h1,h2,h3,h4,h5,h6 {
+//   color: $gray-700;
+// }
+
+a {
+  text-decoration: none !important;
+}
+
+label {
+  font-weight: 500;
+  margin-bottom: $form-label-margin-bottom;
+}
+
+// blockquote
+
+.blockquote {
+  padding: 10px 20px;
+  border-left: 4px solid var(--#{$variable-prefix}border-color);
+}
+
+.blockquote-reverse {
+  border-left: 0;
+  border-right: 4px solid var(--#{$variable-prefix}border-color);
+  text-align: right;
+}
+
+// container
+
+.container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl{
+  @media (min-width: 1200px){
+      max-width: 1140px;
+  }
+}
+
+// row
+
+.row{
+  > * {
+      position: relative;
+  }
+}