@carefirst/library 6.2.3 → 6.2.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/fesm2022/carefirst-library.mjs +4 -4
  2. package/fesm2022/carefirst-library.mjs.map +1 -1
  3. package/package.json +1 -1
  4. package/public/styles/app.scss +7 -6
  5. package/public/styles/colors.scss +11 -9
  6. package/public/styles/font.scss +2 -2
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@carefirst/library",
3
- "version": "6.2.3",
3
+ "version": "6.2.6",
4
4
  "author": "FCS Dev Team",
5
5
  "private": false,
6
6
  "peerDependencies": {
package/public/styles/app.scss CHANGED
@@ -147,15 +147,16 @@ cf-badge:has(div.stretch) {
147
147
  /*===============================================
148
148
  ============== Opacity Background ==============
149
149
  ===============================================*/
150
- @mixin opacity($percentage) {
151
- background-color: color-mix(in srgb, var(--cf-app-color-accent) $percentage, var(--cf-app-color-white)) !important;
152
- border: 1px solid var(--cf-app-color-accent) !important;
153
- }
154
150
 
155
151
  .accent-background-opacity-25 {
156
- @include opacity(25%);
152
+ background-color: var(--cf-app-color-accent-25) !important;
157
153
  }
158
154
 
159
155
  .accent-background-opacity-50 {
160
- @include opacity(50%);
156
+ background-color: var(--cf-app-color-accent-50) !important;
157
+ }
158
+
159
+ //--- Add .accent-border to add a border to the element with the accent color opacity background
160
+ [class^='accent-background-opacity-'].accent-border {
161
+ border: 1px solid var(--cf-app-color-accent) !important;
161
162
  }
package/public/styles/colors.scss CHANGED
@@ -2,21 +2,23 @@
2
2
  /*===================================================================
3
3
  ================== Care First Theme CSS variables ===================
4
4
  ===================================================================*/
5
- --cf-app-color-primary: #000;
5
+ --cf-app-color-primary: #242424;
6
6
  --cf-app-color-secondary: #80858a;
7
+ --cf-app-color-white: #fcfcfc;
7
8
  --cf-app-color-off-white: #fcfaf9;
8
- --cf-app-color-white: #fff;
9
- --cf-app-color-accent: #3fa3db;
10
9
  --cf-app-background-dark: #252525;
10
+ --cf-app-color-accent: #3fa3db;
11
+ --cf-app-color-accent-25: color-mix(in srgb, var(--cf-app-color-accent) 25%, #fff);
12
+ --cf-app-color-accent-50: color-mix(in srgb, var(--cf-app-color-accent) 50%, #fff);
11
13
  //--- System Colors
12
- --cf-app-system-color-success-100: #63ad0e;
14
+ --cf-app-system-color-success-100: #61C453;
15
+ --cf-app-system-color-success-50: #c1f4bb;
13
16
  --cf-app-system-color-success-25: #e6ffe3;
14
- --cf-app-system-color-success-50: #e1eee4;
15
- --cf-app-system-color-error-100: #ff003c;
16
- --cf-app-system-color-error-50: #f6d0d9;
17
+ --cf-app-system-color-error-100: #ff3a69;
18
+ --cf-app-system-color-error-50: #ffc4D2;
17
19
  --cf-app-system-color-error-25: #ffd8e1;
18
- --cf-app-system-color-warning-100: #ffc000;
19
- --cf-app-system-color-warning-50: #fae0ab;
20
+ --cf-app-system-color-warning-100: #ffc71f;
21
+ --cf-app-system-color-warning-50: #fde18c;
20
22
  --cf-app-system-color-warning-25: #fdedc2;
21
23
  //--- Greys
22
24
  --cf-app-system-color-grey-background: #f4f4f4;
package/public/styles/font.scss CHANGED
@@ -77,9 +77,9 @@
77
77
  ===============================================*/
78
78
 
79
79
  :root {
80
- --cf-app-text-color-default: #000;
80
+ --cf-app-text-color-default: #242424;
81
81
  --cf-app-text-color-light: #fff;
82
- --cf-app-text-color-grey: #80858a;
82
+ --cf-app-text-color-grey: #6B6B6B;
83
83
  --cf-app-text-color-dark-green: #118600;
84
84
  --cf-app-text-color-dark-red: #d60032;
85
85
  --cf-app-text-color-dark-yellow: #c39406;