@rypen-dev/shared-components 6.1.2 → 6.1.4

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 (3) hide show
  1. package/package.json +1 -1
  2. package/scss/_variables.scss +4 -4
  3. package/scss/vendor/_foundation-settings.scss +4 -2
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@rypen-dev/shared-components",
3
3
  "description": "Shared styles and Vuejs ui components for Rypen projects. Starting with version 6, this package is built with Webpack 5 and Vue 3.",
4
- "version": "6.1.2",
4
+ "version": "6.1.4",
5
5
  "main": "./dist/index.js",
6
6
  "scripts": {
7
7
  "build": "webpack --config ./webpack.config.js",
package/scss/_variables.scss CHANGED
@@ -24,14 +24,14 @@ $accent-dark-blue: #3D68AD; // new for studio
24
24
 
25
25
  $secondary-purple: #8d7bcd; // highlight purple
26
26
  $tertiary-purple: #b1a0e0; // highlight purple 2
27
- $shadow-purple: color.adjust(#4e2c6b, $alpha: -84%); // grape 16
27
+ $shadow-purple: color.adjust(#4e2c6b, $alpha: -0.84); // grape 16
28
28
 
29
29
  $light-gray: #f7f7f7 !default; // light gray
30
30
  $medium-gray: #dcd6e8 !default; // pale grey
31
31
  $middle-gray: #eaeaea !default;
32
32
  $dark-gray: #767676 !default;
33
- $gray-overlay: color.adjust($black, $alpha: -97%) !default;
34
- $gray-underlay: color.adjust($medium-gray, $alpha: -50%) !default;
33
+ $gray-overlay: color.adjust($black, $alpha: -0.97) !default;
34
+ $gray-underlay: color.adjust($medium-gray, $alpha: -0.5) !default;
35
35
  $text-gray: #c2c1c8 !default;
36
36
  $border-gray: #e4e4e4 !default;
37
37
  $shadow-color: $shadow-purple !default;
@@ -77,7 +77,7 @@ $navigation-link-highlight: $warning !default;
77
77
  $navigation-divider-color: $medium-gray !default;
78
78
 
79
79
  $call-to-action-color: $alert !default;
80
- $call-to-action-color-active: color.scale($alert, $lightness: -20%) !default;
80
+ $call-to-action-color-active: color.adjust($alert, $lightness: -0.2) !default;
81
81
  $default-button-bg-color: $white !default;
82
82
  $default-button-hover-bg-color: $primary !default;
83
83
  $button-hover-bg-color: $white !default;
package/scss/vendor/_foundation-settings.scss CHANGED
@@ -1,6 +1,8 @@
1
1
   /// <reference path="../variables" />
2
2
  @use '../variables' as *;
3
3
 
4
+ @use "sass:color";
5
+
4
6
  // Foundation for Sites Settings
5
7
  // -----------------------------
6
8
  //
@@ -177,7 +179,7 @@ $paragraph-margin-bottom: 1rem;
177
179
  $paragraph-text-rendering: optimizeLegibility;
178
180
  $enable-code-inline: true;
179
181
  $anchor-color: $primary-color;
180
- $anchor-color-hover: scale-color($anchor-color, $lightness: -14%);
182
+ $anchor-color-hover: color.adjust($anchor-color, $lightness: -0.14);
181
183
  $anchor-text-decoration: none;
182
184
  $anchor-text-decoration-hover: none;
183
185
  $hr-width: $global-width;
@@ -304,7 +306,7 @@ $button-padding: 0.85em 1em;
304
306
  $button-margin: 0 0 $global-margin 0;
305
307
  $button-fill: solid;
306
308
  $button-background: $primary-color;
307
- $button-background-hover: scale-color($button-background, $lightness: -15%);
309
+ $button-background-hover: color.adjust($button-background, $lightness: -0.15);
308
310
  $button-color: $white;
309
311
  $button-color-alt: $white;
310
312
  $button-radius: $global-button-radius;