@progressio_resources/gravity-design-system 2.0.5 → 2.0.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 (5) hide show
  1. package/package.json +1 -1
  2. package/src/lib/styles/_functions.scss +3 -0
  3. package/src/lib/styles/foundations/colors/tokens/_hero.tokens.scss +5 -0
  4. package/src/lib/styles/foundations/elevation/_hero.elevation.scss +4 -4
  5. package/src/lib/styles/foundations/spacing/_spacing.scss +1 -0
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@progressio_resources/gravity-design-system",
3
3
  "description": "Gravity Design System",
4
- "version": "2.0.5",
4
+ "version": "2.0.6",
5
5
  "license": "SEE LICENSE IN LIBRARY-LICENSE",
6
6
  "peerDependencies": {
7
7
  "@angular/common": "^16.2.12",
package/src/lib/styles/_functions.scss ADDED
@@ -0,0 +1,3 @@
1
+ @function to-rgb($value) {
2
+ @return red($value), green($value), blue($value);
3
+ }
package/src/lib/styles/foundations/colors/tokens/_hero.tokens.scss CHANGED
@@ -1,4 +1,5 @@
1
1
  @import "../themes/hero.theme";
2
+ @import "../../../functions";
2
3
 
3
4
  .hero-light-theme {
4
5
  // button-primary
@@ -227,6 +228,8 @@
227
228
 
228
229
  // shadow
229
230
  --shadow-primary: #{$shadow-primary-light};
231
+ --shadow-primary-rgba: #{to-rgb($shadow-primary-light)};
232
+ --shadow-opacity: 0.22;
230
233
  }
231
234
 
232
235
  .hero-dark-theme {
@@ -456,4 +459,6 @@
456
459
 
457
460
  // shadow
458
461
  --shadow-primary: #{$shadow-primary-dark};
462
+ --shadow-primary-rgba: #{to-rgb($shadow-primary-dark)};
463
+ --shadow-opacity: 1;
459
464
  }
package/src/lib/styles/foundations/elevation/_hero.elevation.scss CHANGED
@@ -10,13 +10,13 @@ $elevations: (
10
10
  }
11
11
 
12
12
  .elevation-xs {
13
- box-shadow: 0 1px 4px 0 rgba(var(--shadow-primary), 0.22);
13
+ box-shadow: 0 1px 4px 0 rgba(var(--shadow-primary-rgba), var(--shadow-opacity));
14
14
  }
15
15
 
16
16
  .elevation-sm {
17
- box-shadow: 0 4px 10px 0 rgba(var(--shadow-primary), 0.22);
17
+ box-shadow: 0 4px 10px 0 rgba(var(--shadow-primary-rgba), var(--shadow-opacity));
18
18
  }
19
19
 
20
- .elevation-xs {
21
- box-shadow: 0 8px 35px 0 rgba(var(--shadow-primary), 0.22);
20
+ .elevation-md {
21
+ box-shadow: 0 8px 35px 0 rgba(var(--shadow-primary-rgba), var(--shadow-opacity));
22
22
  }
package/src/lib/styles/foundations/spacing/_spacing.scss CHANGED
@@ -16,6 +16,7 @@ $spacing-values: (
16
16
  @each $scss-type in $scss-types {
17
17
  @each $size in $spacing-sizes {
18
18
  @each $spacing-type in $spacing-types {
19
+ //.gravity-{{padding,margin}}-{{top,bottom,left,right,block,inline}}-{{xs,sm,md,lg,xl,xxl,xxxl,xxxxl}}
19
20
  .gravity-#{$scss-type}#{$spacing-type}-#{$size} {
20
21
  #{$scss-type}#{$spacing-type}: map-get($spacing-values, $size);
21
22
  }