@open-rlb/ng-bootstrap 2.2.17

package/assets/scss/custom/components/_root.scss

@@ -0,0 +1,116 @@
+// 
+// root.scss
+//
+
+//theme-light
+:root {
+    // Topbar - Default Light
+    --#{$prefix}header-bg:                              #{$header-bg}; 
+    --#{$prefix}header-item-color:                      #{$header-item-color}; 
+
+    // Topbar - Dark
+    --#{$prefix}header-dark-bg:                         #{$header-dark-bg}; 
+    --#{$prefix}header-dark-item-color:                 #{$header-dark-item-color}; 
+    
+    --#{$prefix}topbar-search-bg:                       #{$topbar-search-bg}; 
+
+    // Footer
+    --#{$prefix}footer-bg:                              #{$footer-bg}; 
+    --#{$prefix}footer-color:                           #{$footer-color}; 
+
+    // Horizontal nav
+    --#{$prefix}topnav-bg:                              #{$topnav-bg}; 
+    --#{$prefix}menu-item-color:                        #{$menu-item-color}; 
+    --#{$prefix}menu-item-active-color:                 #{$menu-item-active-color}; 
+
+    // Boxed layout width
+    --#{$prefix}boxed-body-bg:                          #{$boxed-body-bg}; 
+
+    --#{$prefix}display-none:                           #{$display-none};
+    --#{$prefix}display-block:                          #{$display-block};
+}
+
+//theme dark
+@if $enable-dark-mode {
+    @include color-mode(dark, true) { 
+        // Topbar - Default Light
+        --#{$prefix}header-bg:                              #{$header-bg-dark}; 
+        --#{$prefix}header-item-color:                      #{$header-item-color-dark}; 
+
+        // Topbar - Dark
+        --#{$prefix}header-dark-bg:                         #{$header-dark-bg-dark}; 
+        --#{$prefix}header-dark-item-color:                 #{$header-dark-item-color-dark}; 
+        --#{$prefix}topbar-search-bg:                       #{$topbar-search-bg-dark}; 
+
+        // Footer
+        --#{$prefix}footer-bg:                              #{$footer-bg-dark}; 
+        --#{$prefix}footer-color:                           #{$footer-color-dark}; 
+
+        // Horizontal nav
+        --#{$prefix}topnav-bg:                              #{$topnav-bg-dark}; 
+        --#{$prefix}menu-item-color:                        #{$menu-item-color-dark}; 
+        --#{$prefix}menu-item-active-color:                 #{$menu-item-active-color-dark}; 
+
+        // Boxed layout width
+        --#{$prefix}boxed-body-bg:                          #{$boxed-body-bg-dark};
+
+        // component variable
+        --#{$prefix}light:                                      #{$body-tertiary-bg-dark};
+        --#{$prefix}light-rgb:                                  #{to-rgb($body-tertiary-bg-dark)};
+        --#{$prefix}dark:                                       #{$body-tertiary-color-dark};
+        --#{$prefix}dark-rgb:                                   #{to-rgb($body-tertiary-color-dark)};
+
+        --#{$prefix}display-none:                           #{$display-none-dark};
+        --#{$prefix}display-block:                          #{$display-block-dark};
+
+        .btn-light {
+            --#{$prefix}btn-color:                                         #{$body-secondary-color-dark};
+            --#{$prefix}btn-bg:                                            #{$body-tertiary-bg-dark};
+            --#{$prefix}btn-border-color:                                  #{$body-tertiary-bg-dark};
+        }
+
+        .btn-outline-light {
+            --#{$prefix}btn-color:                                         #{$body-secondary-color-dark};
+            --#{$prefix}btn-border-color:                                  #{$body-tertiary-bg-dark};
+        }
+
+        .btn-light,
+        .btn-outline-light {
+            --#{$prefix}btn-hover-color:                        #{$body-secondary-color-dark};
+            --#{$prefix}btn-hover-bg:                           #{$body-tertiary-bg-dark};
+            --#{$prefix}btn-hover-border-color:                 #{$body-tertiary-bg-dark};
+            --#{$prefix}btn-active-color:                       #{$body-secondary-color-dark};
+            --#{$prefix}btn-active-bg:                          #{$body-tertiary-bg-dark};
+            --#{$prefix}btn-active-border-color:                #{$body-tertiary-bg-dark};
+            --#{$prefix}btn-focus-shadow-rgb:                   #{to-rgb($body-tertiary-bg-dark)};
+        }
+
+        .btn-dark {
+            --#{$prefix}btn-bg:                                 #{$body-color-dark};
+            --#{$prefix}btn-border-color:                       #{$body-color-dark};
+            --#{$prefix}btn-hover-bg:                           #{$body-color-dark};
+        }
+
+        .btn-outline-dark {
+            --#{$prefix}btn-color:                              #{$body-color-dark};
+            --#{$prefix}btn-border-color:                       #{$body-color-dark};
+        }
+
+        .dropdown-menu { 
+            --#{$prefix}dropdown-border-width:                  1px;
+        }
+
+        .table-light {
+            --bs-table-color:                                   #a6b0cf;
+            --bs-table-bg:                                      #32394e;
+            --bs-table-border-color:                            #32394e;
+        }
+
+        .table-dark {
+            --bs-table-color:                                   #a6b0cf;
+            --bs-table-bg:                                      #32394e;
+            --bs-table-border-color:                            #3a425a;
+        }
+
+    }
+}

package/assets/scss/custom/components/_table.scss

@@ -0,0 +1,28 @@
+// 
+// _table.scss
+// 
+
+.table {
+  th {
+      font-weight: $font-weight-bold;
+  }
+}
+
+.table-dark>:not(:last-child)>:last-child>*{
+  border-bottom-color:  $table-dark-border-color;
+}
+
+
+.table-bordered {
+  border: $table-border-width solid $table-border-color;
+}
+
+.table-nowrap {
+  th, td {
+    white-space: nowrap;
+  }
+}
+
+.table>:not(:first-child) {
+    border-top: 0;
+}

package/assets/scss/custom/components/_waves.scss

@@ -0,0 +1,168 @@
+
+/*!
+ * Waves v0.7.6
+ * http://fian.my.id/Waves 
+ * 
+ * Copyright 2014-2018 Alfiana E. Sibuea and other contributors 
+ * Released under the MIT license 
+ * https://github.com/fians/Waves/blob/master/LICENSE */
+ .waves-effect {
+    position: relative;
+    cursor: pointer;
+    display: inline-block;
+    overflow: hidden;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    -webkit-tap-highlight-color: transparent;
+  }
+  .waves-effect .waves-ripple {
+    position: absolute;
+    border-radius: 50%;
+    width: 100px;
+    height: 100px;
+    margin-top: -50px;
+    margin-left: -50px;
+    opacity: 0;
+    background: rgba(0, 0, 0, 0.2);
+    background: -webkit-radial-gradient(rgba(0, 0, 0, 0.2) 0, rgba(0, 0, 0, 0.3) 40%, rgba(0, 0, 0, 0.4) 50%, rgba(0, 0, 0, 0.5) 60%, rgba(255, 255, 255, 0) 70%);
+    background: -o-radial-gradient(rgba(0, 0, 0, 0.2) 0, rgba(0, 0, 0, 0.3) 40%, rgba(0, 0, 0, 0.4) 50%, rgba(0, 0, 0, 0.5) 60%, rgba(255, 255, 255, 0) 70%);
+    background: -moz-radial-gradient(rgba(0, 0, 0, 0.2) 0, rgba(0, 0, 0, 0.3) 40%, rgba(0, 0, 0, 0.4) 50%, rgba(0, 0, 0, 0.5) 60%, rgba(255, 255, 255, 0) 70%);
+    background: radial-gradient(rgba(0, 0, 0, 0.2) 0, rgba(0, 0, 0, 0.3) 40%, rgba(0, 0, 0, 0.4) 50%, rgba(0, 0, 0, 0.5) 60%, rgba(255, 255, 255, 0) 70%);
+    -webkit-transition: all 0.5s ease-out;
+    -moz-transition: all 0.5s ease-out;
+    -o-transition: all 0.5s ease-out;
+    transition: all 0.5s ease-out;
+    -webkit-transition-property: -webkit-transform, opacity;
+    -moz-transition-property: -moz-transform, opacity;
+    -o-transition-property: -o-transform, opacity;
+    transition-property: transform, opacity;
+    -webkit-transform: scale(0) translate(0, 0);
+    -moz-transform: scale(0) translate(0, 0);
+    -ms-transform: scale(0) translate(0, 0);
+    -o-transform: scale(0) translate(0, 0);
+    transform: scale(0) translate(0, 0);
+    pointer-events: none;
+  }
+  .waves-effect.waves-light .waves-ripple {
+    background: rgba(255, 255, 255, 0.4);
+    background: -webkit-radial-gradient(rgba(255, 255, 255, 0.2) 0, rgba(255, 255, 255, 0.3) 40%, rgba(255, 255, 255, 0.4) 50%, rgba(255, 255, 255, 0.5) 60%, rgba(255, 255, 255, 0) 70%);
+    background: -o-radial-gradient(rgba(255, 255, 255, 0.2) 0, rgba(255, 255, 255, 0.3) 40%, rgba(255, 255, 255, 0.4) 50%, rgba(255, 255, 255, 0.5) 60%, rgba(255, 255, 255, 0) 70%);
+    background: -moz-radial-gradient(rgba(255, 255, 255, 0.2) 0, rgba(255, 255, 255, 0.3) 40%, rgba(255, 255, 255, 0.4) 50%, rgba(255, 255, 255, 0.5) 60%, rgba(255, 255, 255, 0) 70%);
+    background: radial-gradient(rgba(255, 255, 255, 0.2) 0, rgba(255, 255, 255, 0.3) 40%, rgba(255, 255, 255, 0.4) 50%, rgba(255, 255, 255, 0.5) 60%, rgba(255, 255, 255, 0) 70%);
+  }
+  .waves-effect.waves-classic .waves-ripple {
+    background: rgba(0, 0, 0, 0.2);
+  }
+  .waves-effect.waves-classic.waves-light .waves-ripple {
+    background: rgba(255, 255, 255, 0.4);
+  }
+  .waves-notransition {
+    -webkit-transition: none !important;
+    -moz-transition: none !important;
+    -o-transition: none !important;
+    transition: none !important;
+  }
+  .waves-button,
+  .waves-circle {
+    -webkit-transform: translateZ(0);
+    -moz-transform: translateZ(0);
+    -ms-transform: translateZ(0);
+    -o-transform: translateZ(0);
+    transform: translateZ(0);
+    -webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%);
+  }
+  .waves-button,
+  .waves-button:hover,
+  .waves-button:visited,
+  .waves-button-input {
+    white-space: nowrap;
+    vertical-align: middle;
+    cursor: pointer;
+    border: none;
+    outline: none;
+    color: inherit;
+    background-color: rgba(0, 0, 0, 0);
+    font-size: 1em;
+    line-height: 1em;
+    text-align: center;
+    text-decoration: none;
+    z-index: 1;
+  }
+  .waves-button {
+    padding: 0.85em 1.1em;
+    border-radius: 0.2em;
+  }
+  .waves-button-input {
+    margin: 0;
+    padding: 0.85em 1.1em;
+  }
+  .waves-input-wrapper {
+    border-radius: 0.2em;
+    vertical-align: bottom;
+  }
+  .waves-input-wrapper.waves-button {
+    padding: 0;
+  }
+  .waves-input-wrapper .waves-button-input {
+    position: relative;
+    top: 0;
+    left: 0;
+    z-index: 1;
+  }
+  .waves-circle {
+    text-align: center;
+    width: 2.5em;
+    height: 2.5em;
+    line-height: 2.5em;
+    border-radius: 50%;
+  }
+  .waves-float {
+    -webkit-mask-image: none;
+    -webkit-box-shadow: 0px 1px 1.5px 1px rgba(0, 0, 0, 0.12);
+    box-shadow: 0px 1px 1.5px 1px rgba(0, 0, 0, 0.12);
+    -webkit-transition: all 300ms;
+    -moz-transition: all 300ms;
+    -o-transition: all 300ms;
+    transition: all 300ms;
+  }
+  .waves-float:active {
+    -webkit-box-shadow: 0px 8px 20px 1px rgba(0, 0, 0, 0.3);
+    box-shadow: 0px 8px 20px 1px rgba(0, 0, 0, 0.3);
+  }
+  .waves-block {
+    display: block;
+  }
+
+.waves-effect.waves-light {
+    .waves-ripple {
+        background-color: rgba($white, 0.4);
+    }
+}
+
+.waves-effect.waves-primary {
+    .waves-ripple {
+        background-color: rgba($primary, 0.4);
+    }
+}
+.waves-effect.waves-success {
+    .waves-ripple {
+        background-color: rgba($success, 0.4);
+    }
+}
+.waves-effect.waves-info {
+    .waves-ripple {
+        background-color: rgba($info, 0.4);
+    }
+}
+.waves-effect.waves-warning {
+    .waves-ripple {
+        background-color: rgba($warning, 0.4);
+    }
+}
+.waves-effect.waves-danger {
+    .waves-ripple {
+        background-color: rgba($danger, 0.4);
+    }
+}

package/assets/scss/custom/components/_widgets.scss

@@ -0,0 +1,37 @@
+// 
+// Widgets.scss
+// 
+
+.mini-stats-wid{
+    .mini-stat-icon{
+        overflow: hidden;
+        position: relative;
+        &:before, &:after{
+            content: "";
+            position: absolute;
+            width: 8px;
+            height: 54px;
+            background-color: rgba($white,.1);
+            left: 16px;
+            transform: rotate(32deg);
+            top: -5px;
+            transition: all 0.4s;
+        }
+
+        &::after{
+            left: -12px;
+            width: 12px;
+            transition: all 0.2s;
+        }
+    }
+
+    &:hover{
+        .mini-stat-icon{
+            &::after{
+                left: 60px;
+            }
+        }
+    }
+}
+
+

package/assets/scss/custom/fonts/_fonts.scss

@@ -0,0 +1,5 @@
+//
+// Google font - Poppins
+//
+
+@import url('https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700&display=swap');

package/assets/scss/custom/pages/_authentication.scss

@@ -0,0 +1,89 @@
+// 
+// authentication.scss
+//
+
+
+// authentication home icon
+.home-btn {
+    position: absolute;
+    top: 15px;
+    right: 25px;
+}
+
+// auth 2
+
+.auth-logo{
+    .auth-logo-dark{
+        display: var(--#{$prefix}display-block);
+    }
+    .auth-logo-light{
+        display: var(--#{$prefix}display-none);
+    }
+}
+
+.auth-body-bg{
+    background-color: var(--#{$prefix}secondary-bg);
+}
+
+
+// auth-pass-inputgroup
+
+.auth-pass-inputgroup{
+    input[type="input"] + .btn .mdi-eye-outline{
+        &:before{
+            content: "\F06D1";
+        }
+    }
+}
+
+// authentication full page
+
+.auth-full-bg{
+    background-color: rgba($primary, 0.25);
+    display: flex;
+
+    @media (min-width: 1200px){
+        height: 100vh;
+    }
+    
+
+    &::before{
+        content: "";
+        position: absolute;
+        width: 300px;
+        height: 300px;
+        border-radius: 50%;
+    }
+
+    .bg-overlay{
+        background: url("../../../images/bg-auth-overlay.png");
+        background-size: cover;
+        background-repeat: no-repeat;
+        background-position: center;
+    }
+}
+
+.auth-full-page-content{
+    display: flex;
+
+    @media (min-width: 1200px){
+        min-height: 100vh;
+    }
+}
+
+.auth-review-carousel{
+    &.owl-theme {
+        .owl-dots {
+            .owl-dot{
+                span{
+                    background-color: rgba($primary, 0.25);
+                }
+                &.active, &:hover{
+                    span{
+                        background-color: $primary;
+                    }
+                }
+            }
+        }
+    }
+}

package/assets/scss/custom/pages/_chat.scss

@@ -0,0 +1,242 @@
+//
+// Chat.scss
+//
+
+.chat-leftsidebar {
+    @media (min-width: 992px) {
+        min-width: 260px;
+    }
+
+    @media (min-width: 1200px) {
+        min-width: 380px;
+    }
+
+    .chat-leftsidebar-nav {
+        .nav {
+            background-color: var(--#{$prefix}secondary-bg);
+        }
+
+        .tab-content {
+            min-height: 488px;
+        }
+    }
+}
+
+.chat-noti-dropdown {
+    &.active {
+        &:before {
+            content: "";
+            position: absolute;
+            width: 8px;
+            height: 8px;
+            background-color: $danger;
+            border-radius: 50%;
+            right: 0;
+        }
+    }
+
+    .btn {
+        padding: 6px;
+        box-shadow: none;
+        font-size: 20px;
+    }
+}
+
+.chat-search-box {
+    .form-control {
+        border: 0;
+    }
+}
+
+.chat-list {
+    margin: 0;
+    li {
+        &.active {
+            a {
+                background-color: var(--#{$prefix}secondary-bg);
+                border-color: transparent;
+                box-shadow: $box-shadow;
+            }
+        }
+        a {
+            display: block;
+            padding: 14px 16px;
+            color: var(--#{$prefix}secondary-color);
+            transition: all 0.4s;
+            border-top: 1px solid var(--#{$prefix}border-color);
+            border-radius: 4px;
+            &:hover {
+                background-color: var(--#{$prefix}secondary-bg);
+                border-color: transparent;
+                box-shadow: $box-shadow;
+            }
+        }
+    }
+}
+
+.user-chat-nav {
+    .dropdown {
+        .nav-btn {
+            color: var(--#{$prefix}body-color);
+            height: 40px;
+            width: 40px;
+            line-height: 42px;
+            box-shadow: none;
+            padding: 0;
+            font-size: 16px;
+            background-color: var(--#{$prefix}light);
+            border-radius: 50%;
+            border: none;
+        }
+
+        .dropdown-menu {
+            box-shadow: $box-shadow;
+            border: 1px solid var(--#{$prefix}border-color);
+        }
+    }
+}
+
+.chat-conversation {
+    li {
+        clear: both;
+    }
+
+    .chat-day-title {
+        position: relative;
+        text-align: center;
+        margin-bottom: 24px;
+
+        .title {
+            background-color: var(--#{$prefix}secondary-bg);
+            position: relative;
+            z-index: 1;
+            padding: 6px 24px;
+        }
+
+        &:before {
+            content: "";
+            position: absolute;
+            width: 100%;
+            height: 1px;
+            left: 0;
+            right: 0;
+            background-color: var(--#{$prefix}border-color);
+            top: 10px;
+        }
+        .badge {
+            font-size: 12px;
+        }
+    }
+    .conversation-list {
+        margin-bottom: 24px;
+        display: inline-block;
+        position: relative;
+
+        .ctext-wrap {
+            padding: 12px 24px;
+            background-color: rgba($primary, 0.1);
+            border-radius: 8px 8px 8px 0px;
+            overflow: hidden;
+
+            .conversation-name {
+                font-weight: $font-weight-semibold;
+                color: $primary;
+                margin-bottom: 4px;
+            }
+        }
+
+        .dropdown {
+            float: right;
+            .dropdown-toggle {
+                font-size: 18px;
+                padding: 4px;
+                color: var(--#{$prefix}secondary-color);
+                @media (max-width: 575.98px) {
+                    display: none;
+                }
+            }
+
+            .dropdown-menu {
+                box-shadow: $box-shadow;
+                border: 1px solid var(--#{$prefix}border-color);
+            }
+        }
+
+        .chat-time {
+            font-size: 12px;
+        }
+    }
+
+    .right {
+        .conversation-list {
+            float: right;
+            .ctext-wrap {
+                background-color: var(--#{$prefix}light);
+                text-align: right;
+                border-radius: 8px 8px 0px 8px;
+            }
+            .dropdown {
+                float: left;
+            }
+
+            &.last-chat {
+                .conversation-list {
+                    &:before {
+                        right: 0;
+                        left: auto;
+                    }
+                }
+            }
+        }
+    }
+
+    .last-chat {
+        .conversation-list {
+            &:before {
+                content: "\F0009";
+                font-family: "Material Design Icons";
+                position: absolute;
+                color: $primary;
+                right: 0;
+                bottom: 0;
+                font-size: 16px;
+
+                @media (max-width: 575.98px) {
+                    display: none;
+                }
+            }
+        }
+    }
+}
+
+.chat-input-section {
+    border-top: 1px solid var(--#{$prefix}border-color);
+}
+
+.chat-input {
+    border-radius: 30px;
+    background-color: var(--#{$prefix}light) !important;
+    border-color: var(--#{$prefix}light) !important;
+    padding-right: 120px;
+}
+
+.chat-input-links {
+    position: absolute;
+    right: 16px;
+    top: 50%;
+    transform: translateY(-50%);
+    li {
+        a {
+            font-size: 16px;
+            line-height: 36px;
+            padding: 0px 4px;
+            display: inline-block;
+        }
+    }
+}
+
+.chat-send {
+    @media (max-width: 575.98px) {
+        min-width: auto;
+    }
+}

package/assets/scss/custom/pages/_coming-soon.scss

@@ -0,0 +1,20 @@
+// 
+// coming-soon.scss
+//
+
+.counter-number {
+    font-size: 32px;
+    font-weight: $font-weight-semibold;
+    text-align: center;
+    display: flex;
+    span {
+        font-size: 16px;
+        font-weight: $font-weight-normal;
+        display: block;
+        padding-top: 5px;
+    }
+}
+
+.coming-box {
+    width: 25%;
+}