@posiwise/shared-components 0.0.10 → 0.0.11

package/assets/scss/_bootstrap_modules.scss

@@ -0,0 +1,40 @@
+@import 'bootstrap/scss/functions';
+@import 'bootstrap/scss/variables';
+@import 'bootstrap/scss/mixins';
+@import 'bootstrap/scss/root';
+@import 'bootstrap/scss/reboot';
+@import 'bootstrap/scss/type';
+@import 'bootstrap/scss/images';
+//@import 'bootstrap/scss/code';
+@import 'bootstrap/scss/grid';
+@import 'bootstrap/scss/tables';
+@import 'bootstrap/scss/forms';
+@import 'bootstrap/scss/buttons';
+@import 'bootstrap/scss/transitions';
+@import 'bootstrap/scss/dropdown';
+@import 'bootstrap/scss/button-group';
+@import 'bootstrap/scss/forms/input-group';
+@import 'bootstrap/scss/forms/form-check';
+@import 'bootstrap/scss/forms/form-control';
+@import 'bootstrap/scss/forms/form-text';
+@import 'bootstrap/scss/forms/labels';
+@import 'bootstrap/scss/forms/validation';
+@import 'bootstrap/scss/forms/floating-labels';
+@import 'bootstrap/scss/forms/form-range';
+@import 'bootstrap/scss/forms/form-select';
+@import 'bootstrap/scss/nav';
+@import 'bootstrap/scss/navbar';
+@import 'bootstrap/scss/card';
+@import 'bootstrap/scss/breadcrumb';
+@import 'bootstrap/scss/pagination';
+@import 'bootstrap/scss/badge';
+@import 'bootstrap/scss/alert';
+@import 'bootstrap/scss/progress';
+//@import 'bootstrap/scss/media';
+@import 'bootstrap/scss/list-group';
+@import 'bootstrap/scss/close';
+@import 'bootstrap/scss/modal';
+@import 'bootstrap/scss/tooltip';
+@import 'bootstrap/scss/popover';
+@import 'bootstrap/scss/carousel';
+@import 'bootstrap/scss/utilities';

package/assets/scss/_custom-bootstrap.scss

@@ -0,0 +1,13 @@
+@import 'custom-bootstrap/reboot';
+@import 'custom-bootstrap/badge';
+@import 'custom-bootstrap/buttons';
+@import 'custom-bootstrap/card';
+@import 'custom-bootstrap/forms';
+@import 'custom-bootstrap/carousel';
+@import 'custom-bootstrap/modal';
+@import 'custom-bootstrap/navbar';
+@import 'custom-bootstrap/popover';
+@import 'custom-bootstrap/progress';
+@import 'custom-bootstrap/type';
+@import 'custom-bootstrap/links';
+@import 'custom-bootstrap/_form_select';

package/assets/scss/_dashboard.scss

@@ -0,0 +1,31 @@
+//  Dashboard mixins
+@import 'dashboard/mixins/utilities';
+@import 'dashboard/mixins/typography';
+@import 'dashboard/mixins/type';
+@import 'dashboard/mixins/buttons';
+@import 'dashboard/mixins/shadows';
+@import 'dashboard/mixins/vendor-prefixes';
+
+// Doashboard scss modules
+@import 'dashboard/components';
+@import 'dashboard/icons';
+@import 'dashboard/ui-switch';
+@import 'dashboard/select';
+@import 'dashboard/tabs';
+@import 'dashboard/notifications';
+@import 'dashboard/animations';
+@import 'dashboard/upload';
+@import 'dashboard/tables';
+@import 'dashboard/chat';
+@import 'dashboard/email';
+@import 'dashboard/gallery';
+@import 'dashboard/helper';
+@import 'dashboard/bootstrap-social';
+@import 'dashboard/misc';
+@import 'dashboard/vertical-timeline';
+@import 'dashboard/profile';
+@import 'dashboard/sidebar-content'; // vertical menu
+@import 'dashboard/responsive'; // responsive vertical menu
+@import 'dashboard/utilities';
+@import 'dashboard/palette';
+@import 'dashboard/admin';

package/assets/scss/_dynamic-styles.scss

@@ -0,0 +1,534 @@
+@import 'variables';
+
+:root {
+    --titles: rgb(34 34 34);
+    --tabs_bg: rgb(23, 105, 225);
+    --tabs_text: rgb(255, 255, 255);
+    --sidebar_bg: rgb(0, 48, 63);
+    --sidebar_text: rgb(255, 255, 255);
+    --first: rgb(23 105 225);
+    --second: rgb(54 194 131);
+    --text: rgb(34 34 34);
+}
+
+:root {
+    .app-sidebar {
+        .sidebar-header {
+            .dropdown-toggle {
+                &:after {
+                    color: var(--sidebar_text);
+                }
+            }
+
+            a.nav-close,
+            a.nav-toggle {
+                color: var(--sidebar_text);
+            }
+        }
+
+        .logo-text,
+        .sidebar-title {
+            color: var(--sidebar_text);
+        }
+
+        background: var(--sidebar_bg);
+
+        ul.navigation.side-menu > li:last-child,
+        ul.navigation.side-menu > li:nth-last-child(1) {
+            background-color: var(--sidebar_bg);
+        }
+
+        .navigation {
+            i {
+                color: var(--sidebar_text);
+            }
+
+            li {
+                a {
+                    color: var(--sidebar_text);
+                }
+            }
+        }
+    }
+
+    .pw-tab {
+        .p-tabmenu {
+            margin-top: 40px;
+            .p-tabmenu-nav {
+                border-bottom: 4px solid var(--tabs_bg);
+
+                .p-tabmenuitem {
+                    .tab-style {
+                        background-color: var(--tabs_bg);
+                        color: var(--tabs_text);
+                    }
+
+                    .p-menuitem-link.p-menuitem-link-active {
+                        background-color: var(--tabs_bg);
+                        color: var(--tabs_text);
+                    }
+
+                    .p-menuitem-link {
+                        color: var(--tabs_bg);
+                    }
+                }
+
+                .p-tabmenuitem.p-highlight {
+                    a {
+                        background-color: var(--tabs_bg) !important;
+                        color: var(--tabs_text) !important;
+
+                        &:hover {
+                            background-color: var(--tabs_bg) !important;
+                            color: var(--tabs_text) !important;
+                        }
+                    }
+                }
+            }
+        }
+    }
+
+    h1,
+    h2,
+    h3,
+    h4,
+    h5,
+    h6 {
+        color: var(--titles) !important;
+    }
+
+    .nav-tabs {
+        .nav-link.active {
+            border-bottom: 3px solid var(--tabs_bg);
+        }
+
+        a {
+            color: var(--tabs_bg);
+        }
+    }
+
+    // buttons
+
+    .btn-outline-primary {
+        border-color: var(--first) !important;
+        color: var(--first) !important;
+
+        &:hover {
+            background-color: var(--first) !important;
+            color: #fff !important;
+        }
+    }
+
+    .btn-primary {
+        background-color: var(--first) !important;
+        border-color: var(--first) !important;
+        &:hover {
+            background-color: transparent !important;
+            color: var(--first) !important;
+        }
+    }
+
+    // tables
+    .primeng-datatable-container table thead tr th {
+        background-color: var(--tabs_bg) !important;
+        color: var(--tabs_text) !important;
+    }
+
+    .p-paginator .p-paginator-pages .p-paginator-page.p-highlight {
+        background-color: var(--tabs_bg) !important;
+        border-color: var(--tabs_bg) !important;
+        color: var(--tabs_text) !important;
+    }
+
+    pw-posts-list {
+        ul.tags li {
+            color: var(--titles);
+        }
+    }
+
+    // signin buttons
+    .sign-btn {
+        background-color: var(--first);
+        color: #fff;
+
+        &:hover {
+            background-color: #fff;
+            color: var(--first);
+        }
+
+        &:disabled {
+            // border: 2px solid $loginButton;
+            background: var(--first);
+            color: rgb(255 255 255);
+        }
+    }
+
+    .back-btn {
+        &:hover {
+            background: rgb(255 255 255);
+            color: var(--first);
+        }
+
+        &:disabled {
+            background: var(--first);
+            color: rgb(255 255 255);
+        }
+    }
+
+    //   register right tabs
+    .register-right {
+        .tab-content {
+            border-top: 6px solid var(--tabs_bg) !important;
+        }
+
+        ul {
+            &.nav-tabs {
+                li {
+                    a {
+                        &.active {
+                            background-color: var(--tabs_bg) !important;
+                            color: var(--tabs_text);
+                        }
+                    }
+                }
+            }
+        }
+    }
+
+    // widgets
+    .form-check-input:checked ~ .form-check-label::before {
+        color: #fff;
+        border-color: var(--first) !important;
+        background-color: var(--first) !important;
+    }
+
+    .form-check-label.size-lg::before,
+    .form-check-label.size-lg::after {
+        content: '';
+        width: 2rem !important;
+        height: 2rem !important;
+        outline: none;
+    }
+
+    .input-group-append .btn {
+        background: var(--first) !important;
+        border: 1px solid var(--first) !important;
+        color: #fff !important;
+    }
+
+    .p-button,
+    .p-button:enabled:active,
+    .p-button:hover {
+        background: var(--first);
+        border: 1px solid var(--first);
+        color: #fff !important;
+    }
+
+    .p-autocomplete {
+        .p-button,
+        .p-button:enabled:active,
+        .p-button:hover {
+            border: 1px solid var(--first) !important;
+            background: var(--first) !important;
+        }
+        .p-autocomplete-multiple-container {
+            .p-autocomplete-token {
+                background: var(--first);
+            }
+        }
+    }
+
+    // toggle
+    .switch.checked {
+        background: var(--first) !important;
+    }
+
+    a,
+    a:hover {
+        color: var(--first);
+    }
+
+    .cc-window {
+        background-color: var(--first) !important;
+        .cc-btn,
+        .cc-btn:hover {
+            background-color: var(--second);
+        }
+    }
+
+    .accordion-heading {
+        background: var(--tabs_bg);
+        color: var(--tabs_text) !important;
+    }
+
+    // check circle
+
+    i.fa-check {
+        &::after {
+            background: var(--titles) !important;
+        }
+    }
+
+    .icon-check {
+        &::before {
+            color: var(--titles) !important;
+        }
+    }
+
+    // chat style
+
+    .chat-application .chats .chat-body .chat-content {
+        background-color: var(--tabs_bg);
+        p {
+            color: var(--tabs_text) !important;
+        }
+        &::before {
+            border-left-color: var(--tabs_bg);
+        }
+    }
+
+    .chat-application .chats .chat-left .chat-content {
+        background-color: rgb(245, 247, 250);
+        p {
+            color: var(--text) !important;
+        }
+        &::before {
+            border-left-color: transparent;
+            border-right-color: rgb(245, 247, 250);
+        }
+    }
+
+    .border-right-primary {
+        border-right-color: var(--titles);
+    }
+
+    // modal
+
+    .swal2-modal {
+        .swal2-confirm {
+            background-color: var(--first) !important;
+        }
+        .swal2-title {
+            color: var(--text) !important;
+        }
+        .swal2-icon {
+            border-color: var(--first) !important;
+            color: var(--first) !important;
+        }
+    }
+
+    .swal2-styled.swal2-confirm:focus {
+        box-shadow: 0 0 0 3px var(--first) !important;
+    }
+
+    // radio
+    p-radiobutton {
+        .p-highlight {
+            .p-radiobutton-icon {
+                background-color: var(--titles) !important;
+            }
+        }
+
+        .p-radiobutton .p-radiobutton-box.p-highlight {
+            border-color: var(--titles) !important;
+            background: #fff !important;
+            box-shadow: none !important;
+            transition: none !important;
+        }
+    }
+
+    // last sync
+    .last-sync {
+        color: var(--titles);
+    }
+
+    // badge
+    .bg-primary {
+        background-color: var(--first);
+        color: #fff;
+    }
+
+    .navbar-search-input {
+        > button {
+            background: var(--sidebar_bg) !important;
+            border: var(--sidebar_bg) !important;
+            color: var(--sidebar_text) !important;
+        }
+    }
+
+    .hopscotch-bubble {
+        .hopscotch-content {
+            font-size: 15px;
+            color: var(--text) !important;
+        }
+        .hopscotch-bubble-number {
+            height: auto !important;
+            line-height: normal !important;
+        }
+        .hopscotch-bubble-content {
+            clear: both;
+            margin: 0 !important;
+        }
+        .hopscotch-nav-button.next {
+            background: var(--first) !important;
+            background-color: var(--first) !important;
+            border-color: var(--first) !important;
+            color: #fff !important;
+        }
+        .hopscotch-nav-button.prev {
+            background: map-get($grey, darken-1) !important;
+            background-color: map-get($grey, darken-1) !important;
+            border-color: map-get($grey, darken-1) !important;
+            color: #fff !important;
+            text-shadow: none !important;
+        }
+        .hopscotch-bubble-arrow-container.right {
+            right: -34px;
+            top: 10px;
+            .hopscotch-bubble-arrow-border {
+                border-bottom: 17px solid transparent !important;
+                border-left: 17px solid rgba(239, 239, 239) !important;
+            }
+            .hopscotch-bubble-arrow {
+                left: -4px;
+                top: -34px !important;
+            }
+        }
+    }
+    .hopscotch-title {
+        color: var(--titles) !important;
+        margin-bottom: 10px !important;
+    }
+
+    .p-multiselect-panel {
+        .p-multiselect-items {
+            .p-multiselect-item.p-highlight {
+                background: var(--first);
+            }
+        }
+    }
+    .p-multiselect-item {
+        .p-checkbox {
+            .p-checkbox-box.p-highlight {
+                background: var(--first);
+            }
+        }
+    }
+
+    .toast-info {
+        border-left: 8px solid var(--first) !important;
+        i {
+            color: var(--first);
+        }
+    }
+
+    //   spinner color
+
+    p-progressSpinner .p-progress-spinner-circle {
+       animation: custom-progress-spinner-dash 1.5s ease-in-out infinite,
+           custom-progress-spinner-color 6s ease-in-out infinite;
+    }
+
+    @keyframes custom-progress-spinner-color {
+        100%,
+        0% {
+            stroke: var(--first);
+        }
+        40% {
+            stroke: var(--second);
+        }
+        66% {
+            stroke: var(--third);
+        }
+        80%,
+        90% {
+            stroke: var(--first);
+        }
+    }
+
+    @keyframes custom-progress-spinner-dash {
+        0% {
+            stroke-dasharray: 1, 200;
+            stroke-dashoffset: 0;
+        }
+        50% {
+            stroke-dasharray: 89, 200;
+            stroke-dashoffset: -35px;
+        }
+        100% {
+            stroke-dasharray: 89, 200;
+            stroke-dashoffset: -124px;
+        }
+    }
+
+    .ql-container {
+        resize: vertical;
+        overflow: auto;
+    }
+
+    .tooltip-wrap {
+        font-size: 16px;
+        vertical-align: middle;
+        color: #000;
+    }
+
+    div.ql-editing[data-mode='video'] {
+        left: 2px !important;
+    }
+    a[disabled='true'] {
+        pointer-events: none;
+        opacity: 0.5;
+    }
+
+    .form-check-label:before {
+        position: absolute;
+        top: 0.25rem;
+        left: -1.5rem;
+        display: block;
+        width: 1rem;
+        height: 1rem;
+        pointer-events: none;
+        content: '';
+        background-color: #fff;
+        border: 1px solid #adb5bd;
+    }
+
+    .form-check-label:after {
+        position: absolute;
+        top: 0.25rem;
+        left: -1.5rem;
+        display: block;
+        width: 1rem;
+        height: 1rem;
+        content: '';
+        background: 50%/50% 50% no-repeat;
+    }
+
+    .form-check-label {
+        position: relative;
+        margin-bottom: 0;
+        vertical-align: top;
+    }
+
+    .custom-checkbox .form-check-label:before {
+        border-radius: 0.25rem;
+    }
+
+    .form-check-input {
+        position: absolute;
+        left: 0;
+        z-index: -1;
+        width: 1rem;
+        height: 1.25rem;
+        opacity: 0;
+    }
+    .custom-checkbox .form-check-input:checked ~ .form-check-label:after {
+        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26l2.974 2.99L8 2.193z'/%3e%3c/svg%3e");
+    }
+    .container-fluid.pw-tab.overflow-hidden {
+        margin-top: -12px;
+    }
+    .toast-container {
+        position: fixed !important;
+    }
+}

package/assets/scss/_plugins.scss

@@ -0,0 +1,3 @@
+@import 'plugins/perfect-scrollbar/main';
+@import 'plugins/plugin-nouislider';
+@import 'plugins/toastr';

package/assets/scss/_public-pages.scss

@@ -0,0 +1,7 @@
+// Loading partials
+@import 'public-pages/layout';
+@import 'public-pages/buttons';
+@import 'public-pages/input-fields';
+
+// Mixins
+@import 'public-pages/mixins/buttons';

package/assets/scss/_shared.scss

@@ -0,0 +1,3 @@
+@import 'shared/prime-ng-tables'; // This is a collection of rich UI components for Angular
+@import 'shared/prime-ng'; // This is a collection of rich UI components for Angular
+@import 'shared/modal';

package/assets/scss/_variables.scss

@@ -0,0 +1,5 @@
+@import 'variables/generic-variables';
+@import 'variables/branding-variables';
+@import 'variables/dashboard-variables';
+@import 'variables/app-colors-variables';
+@import 'variables/primeng-variables';