@posiwise/core-styles 1.0.0 → 1.0.2

package/scss/variables/_app-colors-variables.scss

@@ -13,7 +13,7 @@ $black-color: (
 
 //////////////////////////////////////////////////////////////////
 // Main branding colors
-// Thse are the only ones that should be used in the dashboard
+// These are the only ones that should be used in the dashboard
 //////////////////////////////////////////////////////////////////
 
 $primary: (
@@ -491,6 +491,12 @@ $colors: (
     'blue-grey': $blue-grey
 );
 
+$branding-colors: (
+    'branding-1': var(--first),
+    'branding-2': var(--second),
+    'branding-3': var(--third)
+);
+
 // Map variable
 $gradient-colors: (
     gradient-indigo-light-blue: (

package/scss/variables/_branding-variables.scss

@@ -4,6 +4,7 @@
     --third: rgb(255 171 0);
     --text: rgb(34 34 34);
     --tabs_bg: rgb(23 105 225);
+    --tabs_sub_bg: rgb(70, 136, 236);
     --tabs_text: rgb(255 255 255);
     --titles: rgb(34 34 34);
     --sidebar_bg: rgb(0, 48, 63);
@@ -17,15 +18,15 @@
 
 // TO DO: We need to make sure that we use the same (then only one) font all over the public pages.
 // There are too many family definitions.
-// So, in css we should use someting like '$mainFontFamily' everywhere, so that when we change the $mainFontFamily here it will be updated all over the public pages.
+// So, in css we should use something like '$mainFontFamily' everywhere, so that when we change the $mainFontFamily here it will be updated all over the public pages.
 
 $mainFontFamily: 'Roboto', sans-serif;
 
 // Following are unused but left as a reminder
-$familyLato: 'Lato', 'Helvetica Neue', arial, sans-serif;
-$familyRubkik: 'Rubik', 'Segoe UI', 'Roboto', 'Helvetica Neue', arial, sans-serif;
-$familyHelvetica: 'Helvetica Neue', helvetica, arial, sans-serif;
-$familyMontserrat: 'Montserrat', sans-serif;
+$family-lato: 'Lato', 'Helvetica Neue', arial, sans-serif;
+$family-rubkik: 'Rubik', 'Segoe UI', 'Roboto', 'Helvetica Neue', arial, sans-serif;
+$family-helvetica: 'Helvetica Neue', helvetica, arial, sans-serif;
+$family-montserrat: 'Montserrat', sans-serif;
 $familyRoboto: 'Roboto', sans-serif;
 
 //////////////////////////////////////////
@@ -73,16 +74,17 @@ $register-btn-color: rgb(46 50 56);
 /*       DIVs styling begin here        */
 //////////////////////////////////////////
 
-// Div backgrounds colros
+// Div backgrounds colors
 $bg-color-lightest: rgb(255 255 255);
 $bg-color-light: rgb(248 248 248);
 $bg-color-main: rgb(248 248 248);
 $bg-color-dark: rgb(48 48 48);
 $bg-color-darkest: rgb(24 24 24);
-$bg-color-hilight: rgb(255 171 0);
+$bg-color-highlight: rgb(255 171 0);
 
 /* tabs */
 $tabs-bg: var(--tabs_bg);
+$tabs-sub-bg: var(--tabs_sub_bg);
 $tabs-text: var(--tabs_text);
 
 /* titles */

package/scss/variables/_generic-variables.scss

@@ -14,7 +14,7 @@ $social-behance: rgb(23 105 255);
 
 // New variables for social
 $reddit: rgb(239 247 255);
-$soundColoud: rgb(255 85 0);
+$soundCloud: rgb(255 85 0);
 $tumblr: rgb(44 71 98);
 $vimeo: rgb(26 183 234);
 $vkFlat: rgb(88 126 163);
@@ -23,11 +23,11 @@ $btn-adn: rgb(216 122 104);
 $bitbucket: rgb(32 80 129);
 $dropBox: rgb(16 135 221);
 $flicker: rgb(255 0 132);
-$fourSquare: rgb(249 72 119);
+$four-square: rgb(249 72 119);
 $github: rgb(68 68 68);
-$instaGram: rgb(63 114 155);
+$instagram: rgb(63 114 155);
 $linkedIn: rgb(0 123 182);
-$micrSoft: rgb(38 114 236);
+$microsoft: rgb(38 114 236);
 $odnoklassniki: rgb(244 115 28);
-$openId: rgb(247 147 30);
+$open-id: rgb(247 147 30);
 $pinterest: rgb(203 32 39);

package/scss/variables/_primeng-variables.scss

@@ -9,23 +9,23 @@ $anchorHover: rgb(26 81 168);
 $anchorActive: rgb(20 64 134);
 
 /* Prime page input field border color  */
-$uiinputText: rgb(196 196 196);
+$ui-input-text: rgb(196 196 196);
 
-/* Prime autocomplete tocken background color & color */
+/* Prime autocomplete token background color & color */
 $tabColor: rgb(241 241 241);
-$autoCompletebk: rgb(246 246 246);
+$auto-complete-bk: rgb(246 246 246);
 
 /* color */
 $autoColor: rgb(101 101 101);
 
-/* Prime autocomplete tocken icon background color */
-$autoCompleteicon: rgb(160 157 157);
+/* Prime autocomplete token icon background color */
+$autoCompleteIcon: rgb(160 157 157);
 
-/* Prime page error message backgroundm color , border color and color */
-$growlerrorMsg: rgb(255 132 116);
+/* Prime page error message background color , border color and color */
+$growl-error-msg: rgb(255 132 116);
 
 /* border */
-$growlerrorMsgbdr: rgb(255 51 24);
+$growl-error-msg-bdr: rgb(255 51 24);
 
 /* color */
 $growlColor: rgb(55 9 9);
@@ -40,22 +40,22 @@ $toastIconClose: rgb(77 59 10);
 $toastIcon2: rgb(218 25 0);
 
 /* prime success message color and background color  */
-$toastmsgSuccess: rgb(33 33 33);
+$toast-msg-success: rgb(33 33 33);
 
 /* background-color */
-$toastmsgScessbg: map-get($primary, base);
+$toast-msg-success-bg: map-get($primary, base);
 
 /* prime warning message color and border color  */
-$toastmsgWarning: rgb(255 240 210);
+$toast-msg-warning: rgb(255 240 210);
 
 /* border */
-$toastmsgWarnbdr: rgb(255 214 107);
+$toast-msg-Warn-bdr: rgb(255 214 107);
 
 /* prime tabview icons, close button */
 $titleBarIcon: rgb(111 111 111);
 
 /* Prime page button border and carousel link  */
-$carouselPagelink: rgb(50 50 50);
+$carousel-page-link: rgb(50 50 50);
 
 /* Prime page tab view  */
 $tabView: rgb(209 209 209);
@@ -64,7 +64,7 @@ $tabView: rgb(209 209 209);
 $paginationHover: rgb(234 234 234);
 
 /* Prime add on button background color  */
-$inputGroundaddon: rgb(244 244 244);
+$input-ground-addon: rgb(244 244 244);
 
 /* Placeholder Color  */
 $placeHolder: rgb(102 102 102);
@@ -88,16 +88,16 @@ $datePickerBorder: rgb(166 166 166);
 $invalidInput: rgb(168 0 0);
 
 /* Auto complete input field background color */
-$autoCompletegrp: rgb(216 218 226);
+$auto-complete-grp: rgb(216 218 226);
 
-/* Today's date and hightlight column */
+/* Today's date and highlight column */
 $dateHighLight: rgb(208 208 208);
 
 /* Switch slider focus background-color and background and hove color */
 $enabledFocus: rgb(37 110 197);
 
 /* background and hover color  */
-$inputSwitchSldr: rgb(66 136 220);
+$input-switch-sldr: rgb(66 136 220);
 
 /* Warning button background-color and border-color */
 $buttonWarning: rgb(255 186 1);
@@ -109,16 +109,16 @@ $buttonSetColor: rgb(52 168 53);
 $buttonInfo: rgb(0 91 159);
 
 /* Focus */
-$buttonInfofocus: rgb(0 136 243);
+$button-info-focus: rgb(0 136 243);
 
 /* Hover */
-$buttonInfohover: rgb(17 111 191);
+$button-info-hover: rgb(17 111 191);
 
 /* State Default button color  */
 $buttonState: rgb(0 122 217);
 
 /* switch slider, data table background-color and image rounded border-color  */
-$inputswitchSlider: rgb(230 230 230);
+$input-switch-slider: rgb(230 230 230);
 
 /* Rating start color  */
 $piStart: rgb(255 140 0);
@@ -139,52 +139,52 @@ $toastInfo: rgb(7 26 56);
 $toastIconInfo: rgb(96 176 255);
 
 /* Prime toast success icon color  */
-$toastIconSuccess: rgb(86 160 86);
+$toast-icon-success: rgb(86 160 86);
 
-/* Breadcrum, multi item step number, galleries nav previous and next and pagination text color */
-$galleriaNavText: rgb(115 115 115);
+/* Breadcrumb, multi item step number, galleries nav previous and next and pagination text color */
+$galleria-nav-text: rgb(115 115 115);
 
 /* Prime sub-header border right color  */
-$primeSeprator: rgb(226 229 236);
+$prime-separator: rgb(226 229 236);
 
 /* Bar hover and also is being used in default theme function     */
-$barHover: rgb(153 153 153);
+$bar-hover: rgb(153 153 153);
 
-/* Prime sceondary button background and border color  */
+/* Prime secondary button background and border color  */
 $primeSecondaryButton: rgb(243 243 243);
 
-/* Prime success button hover effect, focus and active backgroud color */
+/* Prime success button hover effect, focus and active background color */
 $primeStateButtonSuccess: rgb(16 125 17);
 
 /* focus */
-$primeStateButtonfocus: rgb(58 187 59);
+$prime-state-button-focus: rgb(58 187 59);
 
 /* active */
-$primeStateButtonactive: rgb(12 107 13);
+$prime-state-button-active: rgb(12 107 13);
 
-/* Prime warning button hover effect, focus and active backgroud color */
-$primeStateButtonwarning: rgb(237 153 11);
+/* Prime warning button hover effect, focus and active background color */
+$prime-state-button-warning: rgb(237 153 11);
 
 /* focus */
-$primeButtonwarningFocus: rgb(255 193 27);
+$prime-button-warning-focus: rgb(255 193 27);
 
 /* active */
-$primeButtonwarningactive: rgb(211 139 16);
+$prime-button-warning-active: rgb(211 139 16);
 
-/* Prime Danger button hover effect, focus and active backgroud color */
-$primeButtonDangeractive: rgb(233 18 36);
+/* Prime Danger button hover effect, focus and active background color */
+$prime-button-danger-active: rgb(233 18 36);
 
 /* hover */
-$primeButtonSethover: rgb(192 17 32);
+$prime-button-set-hover: rgb(192 17 32);
 
 /* Active */
-$primeButtonSetactive: rgb(169 0 0);
+$prime-button-set-active: rgb(169 0 0);
 
 /* focus */
 $primeButtonSetFocus: rgb(238 38 55);
 
 /* Hover background-color color for not selected and highlight columns of tree-table  */
-$satetHover: rgb(224 224 224);
+$satet-hover: rgb(224 224 224);
 
 /* Prime toggle icon color  */
 $nodeToggle: rgb(13 38 69);