@posiwise/core-styles 1.0.0 → 1.0.2

package/scss/common/landing-page-a/landing-page-style-1.scss

@@ -1,4 +1,4 @@
-@import 'variables';
+@import '../../variables';
 
 .register {
     background: rgb(255 255 255) url('/assets/img/landing-page/testimonial-bg.png') fixed center top;
@@ -274,7 +274,7 @@ label {
     text-decoration: underline;
 }
 
-.msp-container {
+.resource-container {
     padding: 0 !important;
 
     .register-container {
@@ -380,7 +380,7 @@ label {
     }
 
     .form-container {
-        background-image: url('/assets/img/products/cloud-olive/login-form-background-img.png');
+        background-image: url('/assets/img/products/trial/login-form-background-img.png');
     }
 }
 
@@ -505,7 +505,7 @@ app-social-login {
 
 @media screen and (max-width: 768px) {
     .vendor-container {
-        background-image: url('/assets/img/products/cloud-olive/login-form-background-img.png');
+        background-image: url('/assets/img/products/c/login-form-background-img.png');
         background-position: right;
         background-repeat: no-repeat;
         background-size: 60vw 100%;
@@ -557,7 +557,7 @@ app-social-login {
     }
 }
 
-pw-cloudolive-signup-tabs-a {
+pw-signup-tabs-a {
     width: 100%;
 }
 
@@ -611,11 +611,11 @@ pw-cloudolive-signup-tabs-a {
 
     .register-outer {
         margin: 0 auto !important;
-        padding: 0 20px !important;
+        padding: 0 3rem !important;
     }
 }
 
-.cloudolive-header,
+.primary-header,
 .blinking-text-wrapper {
     h1 {
         color: map-get($secondary, base);

package/scss/common/landing-page-b/banner.scss

@@ -77,12 +77,12 @@
     }
 }
 
-@media (max-width:768px){
+@media (max-width: 768px) {
     .banner {
         .banner-logo {
-           img{
-            max-width: 200px !important;
-           }
+            img {
+                max-width: 200px !important;
+            }
         }
 
         .banner-sub-heading,
@@ -114,8 +114,8 @@
     }
 
     section.banner::after {
-        background: url('/assets/img/products/cloud-olive/cloudolive-new/white-stripes-right1.png')
-            right bottom no-repeat;
+        background: url('/assets/img/products/trial/white-stripes-right1.png') right bottom
+            no-repeat;
         bottom: 0;
         clip-path: circle(55% at 80% 80%);
         content: '';
@@ -127,8 +127,8 @@
 
     .banner {
         .stripes-img::before {
-            background: url('/assets/img/products/cloud-olive/cloudolive-new/white-stripes-left.png')
-                left bottom no-repeat;
+            background: url('/assets/img/products/trial/white-stripes-left.png') left bottom
+                no-repeat;
             bottom: 0;
             clip-path: circle(50.9% at 1% 44%);
             content: '';

package/scss/common/landing-page-b/contact-us.scss

@@ -1,8 +1,8 @@
 @import 'variables/landing-page-new-variables';
 @import 'common/landing-page-b/landing-page-style-2';
 
-.cloudolive-contact-us {
-    background: url('/assets/img/products/cloud-olive/cloudolive-new/contact-us-bg.jpg') center;
+.contact-us-section {
+    background: url('/assets/img/products/trial/contact-us-bg.jpg') center;
     background-size: cover;
     padding: 40px 0;
 
@@ -125,7 +125,7 @@
 }
 
 @media (max-width: 991px) {
-    .cloudolive-contact-us {
+    .contact-us-section {
         .left-section-outer {
             order: 2;
         }
@@ -145,7 +145,7 @@
 }
 
 @media (min-width: 992px) {
-    .cloudolive-contact-us {
+    .contact-us-section {
         padding: 0;
 
         .left-section {

package/scss/common/landing-page-b/explainer.scss

@@ -2,7 +2,7 @@
 @import 'common/landing-page-b/landing-page-style-2';
 @import 'public-pages/mixins/buttons';
 
-.cloudolive-contract-for-msps {
+.product-explainer-section {
     background-color: $bg-color-black-grey;
     padding: 40px 0;
     position: relative;
@@ -35,8 +35,8 @@
 }
 
 @media (max-width: 768px) {
-    .cloudolive-contract-for-msps {
-        .cloudolive-video {
+    .product-explainer-section {
+        .product-video {
             margin-top: 50px;
         }
 
@@ -48,7 +48,7 @@
 }
 
 @media (min-width: 991px) {
-    .cloudolive-contract-for-msps {
+    .product-explainer-section {
         .stripes::after {
             background: rgb(145 196 216 / 80%) right bottom no-repeat;
             bottom: 0;
@@ -61,8 +61,8 @@
         }
 
         .stripes::before {
-            background: url('/assets/img/products/cloud-olive/cloudolive-new/white-stripes-right1.png')
-                right top no-repeat;
+            background: url('/assets/img/products/trial/white-stripes-right1.png') right top
+                no-repeat;
             clip-path: circle(45% at 67% 61%);
             content: '';
             height: 350px;

package/scss/common/landing-page-b/explainer2.scss

@@ -2,7 +2,7 @@
 @import 'common/landing-page-b/landing-page-style-2';
 @import 'public-pages/mixins/buttons';
 
-.cloudolive-contract-for-msps {
+.product-explainer-section {
     background: $bg-color-blue;
     padding: 40px 0;
     position: relative;

package/scss/common/landing-page-b/landing-page-style-2.scss

@@ -1,8 +1,9 @@
-@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;1,100;1,200;1,300;1,400;1,500;1,600;1,700&display=swap');
 @import 'variables/branding-variables';
 
+// ⚡ PERFORMANCE FIX: Use Roboto (already loaded) instead of Montserrat from Google CDN
+// This eliminates 1.7 second delay on CS2, CS3, CS4 pages
 * {
-    font-family: $familyMontserrat;
+    font-family: $mainFontFamily;
 }
 
 h2 {
@@ -15,6 +16,6 @@ h2 {
 
 @media (max-width: 1200px) {
     .container-wrapper {
-        padding: 0 20px !important;
+        padding: 0 3rem !important;
     }
 }

package/scss/custom-bootstrap/_badge.scss

@@ -142,7 +142,7 @@
 }
 
 .bg-default-3 {
-    background-color: map-get($default, lighten-3);
+    background-color: map-get($default, darken-3);
 }
 
 .bg-default-4 {
@@ -161,7 +161,7 @@
 }
 
 .bg-default-7 {
-    background-color: map-get($default, accent-1);
+    background-color: map-get($default, darken-1);
     color: rgb(255 255 255);
 }
 
@@ -176,7 +176,7 @@
 }
 
 .bg-default-10 {
-    background-color: map-get($pink, lighten-4);
+    background-color: map-get($pink, darken-3);
     color: rgb(255 255 255);
 }
 
@@ -214,7 +214,7 @@
 }
 
 .bg-default-18 {
-    background-color: map-get($warning, lighten-4);
+    background-color: map-get($warning, darken-2);
 }
 
 .bg-default-19 {
@@ -238,7 +238,7 @@
 }
 
 .bg-default-24 {
-    background-color: map-get($warning, accent-4);
+    background-color: map-get($warning, darken-1);
 }
 
 // blue-grey badges
@@ -258,7 +258,7 @@
 }
 
 .bg-blue-grey-3 {
-    background-color: map-get($blue-grey, lighten-4);
+    background-color: map-get($blue-grey, darken-3);
 }
 
 .bg-blue-grey-4 {
@@ -282,82 +282,82 @@
 }
 
 .bg-blue-grey-8 {
-    background-color: map-get($warning, lighten-1);
+    background-color: map-get($blue-grey, accent-4);
 }
 
 .bg-blue-grey-9 {
-    background-color: map-get($warning, darken-1);
+    background-color: map-get($blue-grey, darken-1);
 }
 
 .bg-blue-grey-10 {
-    background-color: map-get($warning, lighten-4);
+    background-color: map-get($blue-grey, darken-2);
 }
 
 .bg-blue-grey-11 {
-    background-color: map-get($warning, darken-4);
+    background-color: map-get($blue-grey, darken-4);
 }
 
 .bg-blue-grey-12 {
-    background-color: map-get($warning, lighten-3);
+    background-color: map-get($blue-grey, lighten-3);
 }
 
 .bg-blue-grey-13 {
-    background-color: map-get($warning, darken-3);
+    background-color: map-get($blue-grey, darken-3);
 }
 
 .bg-blue-grey-14 {
-    background-color: map-get($warning, lighten-2);
+    background-color: map-get($blue-grey, lighten-2);
 }
 
 .bg-blue-grey-15 {
-    background-color: map-get($warning, darken-2);
+    background-color: map-get($blue-grey, darken-2);
 }
 
 .bg-blue-grey-16 {
-    background-color: map-get($warning, accent-4);
+    background-color: map-get($blue-grey, accent-4);
 }
 
 .bg-blue-grey-17 {
-    background-color: map-get($pink, lighten-1);
+    background-color: map-get($blue-grey, lighten-1);
     color: rgb(255 255 255);
 }
 
 .bg-blue-grey-18 {
-    background-color: map-get($pink, darken-1);
+    background-color: map-get($blue-grey, darken-1);
     color: rgb(255 255 255);
 }
 
 .bg-blue-grey-19 {
-    background-color: map-get($pink, lighten-4);
+    background-color: map-get($blue-grey, lighten-4);
     color: rgb(255 255 255);
 }
 
 .bg-blue-grey-20 {
-    background-color: map-get($pink, accent-1);
+    background-color: map-get($blue-grey, accent-1);
     color: rgb(255 255 255);
 }
 
 .bg-blue-grey-21 {
-    background-color: map-get($pink, accent-4);
+    background-color: map-get($blue-grey, accent-4);
     color: rgb(255 255 255);
 }
 
 .bg-blue-grey-22 {
-    background-color: map-get($pink, lighten-2);
+    background-color: map-get($blue-grey, lighten-2);
     color: rgb(255 255 255);
 }
 
 .bg-blue-grey-23 {
-    background-color: map-get($pink, darken-3);
+    background-color: map-get($blue-grey, darken-3);
     color: rgb(255 255 255);
 }
 
 .bg-blue-grey-24 {
-    background-color: map-get($pink, darken-4);
+    background-color: map-get($blue-grey, darken-4);
     color: rgb(255 255 255);
 }
 
-// pink bages
+// pink badges
 
 .bg-pink {
     color: rgb(255 255 255);
@@ -454,7 +454,7 @@
 }
 
 .bg-cyan-8 {
-    background-color: map-get($cyan, lighten-4);
+    background-color: map-get($cyan, lighten-2);
 }
 
 .bg-cyan-9 {
@@ -466,3 +466,13 @@
     background-color: map-get($cyan, lighten-3);
     color: rgb(255 255 255);
 }
+
+.bg-cyan-default {
+    background-color: map-get($cyan, lighten-3);
+    color: rgb(255 255 255);
+}
+
+.bg-cyan-default-change {
+    background-color: map-get($cyan, darken-1);
+    color: rgb(255 255 255);
+}

package/scss/custom-bootstrap/_type.scss

@@ -80,7 +80,7 @@ blockquote.float-end {
 .description,
 .card-description,
 .footer-big p {
-    color: color('gray');
+    color: $gray-600;
 }
 
 .text-warning {
@@ -107,6 +107,12 @@ blockquote.float-end {
     color: map-get($info, base) !important;
 }
 
+.required-icon {
+    color: #ff586b;
+    padding-left: 2px;
+    font-size: 15px;
+}
+
 // small
 .font-small-1 {
     font-size: 0.7rem !important;

package/scss/dashboard/_bootstrap-social.scss

@@ -153,7 +153,7 @@ $bs-height-xs: (floor($font-size-sm * 1.2) + $padding-small-vertical + 1) !defau
 }
 
 .btn-foursquare {
-    @include btn-social($fourSquare);
+    @include btn-social($four-square);
 }
 
 .btn-github {
@@ -165,7 +165,7 @@ $bs-height-xs: (floor($font-size-sm * 1.2) + $padding-small-vertical + 1) !defau
 }
 
 .btn-instagram {
-    @include btn-social($instaGram);
+    @include btn-social($instagram);
 }
 
 .btn-linkedin {
@@ -173,7 +173,7 @@ $bs-height-xs: (floor($font-size-sm * 1.2) + $padding-small-vertical + 1) !defau
 }
 
 .btn-microsoft {
-    @include btn-social($micrSoft);
+    @include btn-social($microsoft);
 }
 
 .btn-odnoklassniki {
@@ -181,7 +181,7 @@ $bs-height-xs: (floor($font-size-sm * 1.2) + $padding-small-vertical + 1) !defau
 }
 
 .btn-openid {
-    @include btn-social($openId);
+    @include btn-social($open-id);
 }
 
 .btn-pinterest {
@@ -193,7 +193,7 @@ $bs-height-xs: (floor($font-size-sm * 1.2) + $padding-small-vertical + 1) !defau
 }
 
 .btn-soundcloud {
-    @include btn-social($soundColoud);
+    @include btn-social($soundCloud);
 }
 
 .btn-tumblr {
@@ -238,7 +238,7 @@ $bs-height-xs: (floor($font-size-sm * 1.2) + $padding-small-vertical + 1) !defau
 }
 
 .btn-outline-foursquare {
-    @include btn-social-outline($fourSquare);
+    @include btn-social-outline($four-square);
 }
 
 .btn-outline-github {
@@ -250,7 +250,7 @@ $bs-height-xs: (floor($font-size-sm * 1.2) + $padding-small-vertical + 1) !defau
 }
 
 .btn-outline-instagram {
-    @include btn-social-outline($instaGram);
+    @include btn-social-outline($instagram);
 }
 
 .btn-outline-linkedin {
@@ -258,7 +258,7 @@ $bs-height-xs: (floor($font-size-sm * 1.2) + $padding-small-vertical + 1) !defau
 }
 
 .btn-outline-microsoft {
-    @include btn-social-outline($micrSoft);
+    @include btn-social-outline($microsoft);
 }
 
 .btn-outline-odnoklassniki {
@@ -266,7 +266,7 @@ $bs-height-xs: (floor($font-size-sm * 1.2) + $padding-small-vertical + 1) !defau
 }
 
 .btn-outline-openid {
-    @include btn-social-outline($openId);
+    @include btn-social-outline($open-id);
 }
 
 .btn-outline-pinterest {
@@ -278,7 +278,7 @@ $bs-height-xs: (floor($font-size-sm * 1.2) + $padding-small-vertical + 1) !defau
 }
 
 .btn-outline-soundcloud {
-    @include btn-social-outline($soundColoud);
+    @include btn-social-outline($soundCloud);
 }
 
 .btn-outline-tumblr {
@@ -323,7 +323,7 @@ $bs-height-xs: (floor($font-size-sm * 1.2) + $padding-small-vertical + 1) !defau
 }
 
 .btn-outline-foursquare:hover {
-    @include btn-hover-outline($fourSquare);
+    @include btn-hover-outline($four-square);
 }
 
 .btn-outline-github:hover {
@@ -335,7 +335,7 @@ $bs-height-xs: (floor($font-size-sm * 1.2) + $padding-small-vertical + 1) !defau
 }
 
 .btn-outline-instagram:hover {
-    @include btn-hover-outline($instaGram);
+    @include btn-hover-outline($instagram);
 }
 
 .btn-outline-linkedin:hover {
@@ -343,7 +343,7 @@ $bs-height-xs: (floor($font-size-sm * 1.2) + $padding-small-vertical + 1) !defau
 }
 
 .btn-outline-microsoft:hover {
-    @include btn-hover-outline($micrSoft);
+    @include btn-hover-outline($microsoft);
 }
 
 .btn-outline-odnoklassniki:hover {
@@ -351,7 +351,7 @@ $bs-height-xs: (floor($font-size-sm * 1.2) + $padding-small-vertical + 1) !defau
 }
 
 .btn-outline-openid:hover {
-    @include btn-hover-outline($openId);
+    @include btn-hover-outline($open-id);
 }
 
 .btn-outline-pinterest:hover {
@@ -363,7 +363,7 @@ $bs-height-xs: (floor($font-size-sm * 1.2) + $padding-small-vertical + 1) !defau
 }
 
 .btn-outline-soundcloud:hover {
-    @include btn-hover-outline($soundColoud);
+    @include btn-hover-outline($soundCloud);
 }
 
 .btn-outline-tumblr:hover {
@@ -408,7 +408,7 @@ $bs-height-xs: (floor($font-size-sm * 1.2) + $padding-small-vertical + 1) !defau
 }
 
 .btn-foursquare-flat {
-    @include btn-social-flat($fourSquare);
+    @include btn-social-flat($four-square);
 }
 
 .btn-github-flat {
@@ -420,7 +420,7 @@ $bs-height-xs: (floor($font-size-sm * 1.2) + $padding-small-vertical + 1) !defau
 }
 
 .btn-instagram-flat {
-    @include btn-social-flat($instaGram);
+    @include btn-social-flat($instagram);
 }
 
 .btn-linkedin-flat {
@@ -428,7 +428,7 @@ $bs-height-xs: (floor($font-size-sm * 1.2) + $padding-small-vertical + 1) !defau
 }
 
 .btn-microsoft-flat {
-    @include btn-social-flat($micrSoft);
+    @include btn-social-flat($microsoft);
 }
 
 .btn-odnoklassniki-flat {
@@ -436,7 +436,7 @@ $bs-height-xs: (floor($font-size-sm * 1.2) + $padding-small-vertical + 1) !defau
 }
 
 .btn-openid-flat {
-    @include btn-social-flat($openId);
+    @include btn-social-flat($open-id);
 }
 
 .btn-pinterest-flat {
@@ -448,7 +448,7 @@ $bs-height-xs: (floor($font-size-sm * 1.2) + $padding-small-vertical + 1) !defau
 }
 
 .btn-soundcloud-flat {
-    @include btn-social-flat($soundColoud);
+    @include btn-social-flat($soundCloud);
 }
 
 .btn-tumblr-flat {
@@ -517,7 +517,7 @@ $bs-height-xs: (floor($font-size-sm * 1.2) + $padding-small-vertical + 1) !defau
 .btn-foursquare-flat:focus,
 .btn-foursquare-flat:active:focus,
 .btn-foursquare-flat:active:hover {
-    @include btn-social-flat-active($fourSquare);
+    @include btn-social-flat-active($four-square);
 }
 
 .btn-github-flat.active,
@@ -541,7 +541,7 @@ $bs-height-xs: (floor($font-size-sm * 1.2) + $padding-small-vertical + 1) !defau
 .btn-instagram-flat:focus,
 .btn-instagram-flat:active:focus,
 .btn-instagram-flat:active:hover {
-    @include btn-social-flat-active($instaGram);
+    @include btn-social-flat-active($instagram);
 }
 
 .btn-linkedin-flat.active,
@@ -557,7 +557,7 @@ $bs-height-xs: (floor($font-size-sm * 1.2) + $padding-small-vertical + 1) !defau
 .btn-microsoft-flat:focus,
 .btn-microsoft-flat:active:focus,
 .btn-microsoft-flat:active:hover {
-    @include btn-social-flat-active($micrSoft);
+    @include btn-social-flat-active($microsoft);
 }
 
 .btn-odnoklassniki-flat.active,
@@ -573,7 +573,7 @@ $bs-height-xs: (floor($font-size-sm * 1.2) + $padding-small-vertical + 1) !defau
 .btn-openid-flat:focus,
 .btn-openid-flat:active:focus,
 .btn-openid-flat:active:hover {
-    @include btn-social-flat-active($openId);
+    @include btn-social-flat-active($open-id);
 }
 
 .btn-pinterest-flat.active,
@@ -597,7 +597,7 @@ $bs-height-xs: (floor($font-size-sm * 1.2) + $padding-small-vertical + 1) !defau
 .btn-soundcloud-flat:focus,
 .btn-soundcloud-flat:active:focus,
 .btn-soundcloud-flat:active:hover {
-    @include btn-social-flat-active($soundColoud);
+    @include btn-social-flat-active($soundCloud);
 }
 
 .btn-tumblr-flat.active,

package/scss/dashboard/_coming-soon.scss

@@ -4,7 +4,7 @@
 // ================================================================================================
 
 /* ========== Coming Soon Background Image ========= */
-.comingsoonVideo .app-content .coming-soon-content {
+.coming-soon-video .app-content .coming-soon-content {
     z-index: 99;
 }
 

package/scss/dashboard/_components.scss

@@ -74,7 +74,7 @@
     color: map-get($default, base) !important;
 }
 
-// Toastrs
+// Toast
 
 .toast-success {
     background-color: map-get($success, base) !important;

package/scss/dashboard/_email.scss

@@ -1,11 +1,11 @@
 // Variables
-$sideber-border: rgb(228 231 237);
-$sideber-width: 500px;
+$sidebar-border: rgb(228 231 237);
+$sidebar-width: 500px;
 
 .email-application {
     .email-app-sidebar {
         background: rgb(255 255 255);
-        border-right: 1px solid $sideber-border;
+        border-right: 1px solid $sidebar-border;
         height: calc(100vh - 150px);
         position: fixed;
         width: 250px;
@@ -57,11 +57,11 @@ $sideber-width: 500px;
 
     .email-app-menu {
         .mb-3-compose {
-            border-bottom: 1px solid $sideber-border;
+            border-bottom: 1px solid $sidebar-border;
         }
 
         .list-group-messages {
-            border-bottom: 1px solid $sideber-border;
+            border-bottom: 1px solid $sidebar-border;
 
             a {
                 font-size: 1.1rem;
@@ -118,7 +118,7 @@ $sideber-width: 500px;
 
         .email-app-options,
         .email-app-title {
-            border-bottom: 1px solid $sideber-border;
+            border-bottom: 1px solid $sidebar-border;
         }
     }
 
@@ -128,7 +128,7 @@ $sideber-width: 500px;
         z-index: 999;
 
         fieldset {
-            border-bottom: 1px solid $sideber-border;
+            border-bottom: 1px solid $sidebar-border;
         }
     }
 }