@stenajs-webui/theme 17.1.2 → 17.2.0
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.
- package/CHANGELOG.md +13 -0
- package/dist/index.es.js +1 -1
- package/dist/index.js +1 -1
- package/package.json +2 -2
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,16 @@
|
|
|
1
|
+
# v17.2.0 (Tue Jun 28 2022)
|
|
2
|
+
|
|
3
|
+
#### 🚀 Enhancement
|
|
4
|
+
|
|
5
|
+
- Change color of blue-600 to match with "Hav" [#470](https://github.com/StenaIT/stenajs-webui/pull/470) (david.zetterdahl@stenaline.com [@LordDz](https://github.com/LordDz))
|
|
6
|
+
|
|
7
|
+
#### Authors: 2
|
|
8
|
+
|
|
9
|
+
- David ([@LordDz](https://github.com/LordDz))
|
|
10
|
+
- David Zetterdahl (david.zetterdahl@stenaline.com)
|
|
11
|
+
|
|
12
|
+
---
|
|
13
|
+
|
|
1
14
|
# v17.0.0 (Fri Jun 17 2022)
|
|
2
15
|
|
|
3
16
|
#### 🔩 Dependency Updates
|
package/dist/index.es.js
CHANGED
|
@@ -28,7 +28,7 @@ function styleInject(css, ref) {
|
|
|
28
28
|
var css_248z$2 = ":root {\n font-size: 62.5%;\n}\n";
|
|
29
29
|
styleInject(css_248z$2);
|
|
30
30
|
|
|
31
|
-
var css_248z$1 = ":root {\n /* Colors */\n --lhds-color-blue-100: #e1eefa;\n --lhds-color-blue-200: #afd0f1;\n --lhds-color-blue-300: #6ca9e6;\n --lhds-color-blue-400: #3a8cdd;\n --lhds-color-blue-50: #f2f8fd;\n --lhds-color-blue-500: #2378cd;\n --lhds-color-blue-600: #
|
|
31
|
+
var css_248z$1 = ":root {\n /* Colors */\n --lhds-color-blue-100: #e1eefa;\n --lhds-color-blue-200: #afd0f1;\n --lhds-color-blue-300: #6ca9e6;\n --lhds-color-blue-400: #3a8cdd;\n --lhds-color-blue-50: #f2f8fd;\n --lhds-color-blue-500: #2378cd;\n --lhds-color-blue-600: #1a5a9a;\n --lhds-color-blue-700: #18518a;\n --lhds-color-blue-800: #143e62;\n --lhds-color-blue-900: #0f304d;\n\n --lhds-color-green-100: #d1efc1;\n --lhds-color-green-200: #aee492;\n --lhds-color-green-300: #8ad861;\n --lhds-color-green-400: #6cce38;\n --lhds-color-green-50: #f4fbf0;\n --lhds-color-green-500: #60bd2f;\n --lhds-color-green-600: #509e27;\n --lhds-color-green-700: #407e1f;\n --lhds-color-green-800: #305f18;\n --lhds-color-green-900: #284f14;\n\n --lhds-color-orange-100: #ffeac4;\n --lhds-color-orange-200: #ffd589;\n --lhds-color-orange-300: #ffc04e;\n --lhds-color-orange-400: #ffb633;\n --lhds-color-orange-50: #fff8eb;\n --lhds-color-orange-500: #ffa400;\n --lhds-color-orange-600: #eb9700;\n --lhds-color-orange-700: #d88b00;\n --lhds-color-orange-800: #b17200;\n --lhds-color-orange-900: #895800;\n\n --lhds-color-purple-100: #f5d6e9;\n --lhds-color-purple-200: #edb6d8;\n --lhds-color-purple-300: #e287be;\n --lhds-color-purple-400: #d758a5;\n --lhds-color-purple-50: #fdf6fa;\n --lhds-color-purple-500: #cf3894;\n --lhds-color-purple-600: #a42874;\n --lhds-color-purple-700: #85205d;\n --lhds-color-purple-800: #651847;\n --lhds-color-purple-900: #58153e;\n\n --lhds-color-red-100: #ffdde4;\n --lhds-color-red-200: #ff899f;\n --lhds-color-red-300: #ff4e70;\n --lhds-color-red-400: #f1002e;\n --lhds-color-red-50: #fff1f4;\n --lhds-color-red-500: #d70029;\n --lhds-color-red-600: #b00022;\n --lhds-color-red-700: #8a0019;\n --lhds-color-red-800: #710015;\n --lhds-color-red-900: #570010;\n\n --lhds-color-turquoise-100: #daf8f4;\n --lhds-color-turquoise-200: #b9f2e9;\n --lhds-color-turquoise-300: #87e8da;\n --lhds-color-turquoise-400: #46dcc6;\n --lhds-color-turquoise-50: #eafbf9;\n --lhds-color-turquoise-500: #28d2b9;\n --lhds-color-turquoise-600: #24bda6;\n --lhds-color-turquoise-700: #1c9280;\n --lhds-color-turquoise-800: #156f62;\n --lhds-color-turquoise-900: #125f53;\n\n --lhds-color-ui-100: #fafafb;\n --lhds-color-ui-200: #efeff2;\n --lhds-color-ui-300: #e4e5e9;\n --lhds-color-ui-400: #ced0d7;\n --lhds-color-ui-50: #ffffff;\n --lhds-color-ui-500: #989cab;\n --lhds-color-ui-600: #5c6171;\n --lhds-color-ui-700: #424551;\n --lhds-color-ui-800: #282931;\n --lhds-color-ui-900: #0d0e10;\n}\n";
|
|
32
32
|
styleInject(css_248z$1);
|
|
33
33
|
|
|
34
34
|
var css_248z = ":root {\n /* Generic colors */\n --swui-white: #fff;\n --swui-hidden: rgba(0, 0, 0, 0);\n --swui-primary-action-color: var(--lhds-color-blue-500);\n --swui-primary-action-color-hover: var(--lhds-color-blue-600);\n --swui-primary-action-color-hover-light: var(--lhds-color-blue-100);\n --swui-primary-action-color-focus: var(--lhds-color-blue-700);\n --swui-primary-action-color-focus-light: var(--lhds-color-blue-100);\n --swui-primary-action-color-active: var(--lhds-color-blue-800);\n --swui-primary-action-color-disabled: var(--lhds-color-ui-300);\n --swui-separator-color: var(--lhds-color-ui-300);\n --swui-handle-bg-enabled-color: var(--swui-white);\n --swui-handle-bg-disabled-color: var(--lhds-color-ui-400);\n --swui-modal-border-color: var(--lhds-color-ui-400);\n --swui-overlay-bg-color: rgba(13, 14, 16, 0.5);\n\n /* State colors */\n --swui-state-error-color: var(--lhds-color-red-300);\n --swui-state-error-light-color: var(--lhds-color-red-50);\n --swui-state-alert-color: var(--lhds-color-orange-400);\n --swui-state-alert-light-color: var(--lhds-color-orange-50);\n --swui-state-success-color: var(--lhds-color-green-600);\n --swui-state-success-light-color: var(--lhds-color-green-50);\n --swui-state-modified-color: var(--lhds-color-blue-500);\n --swui-state-modified-light-color: var(--lhds-color-blue-200);\n --swui-state-loading-color: var(--lhds-color-ui-400);\n --swui-state-loading-light-color: var(--lhds-color-ui-100);\n\n /* Fonts */\n --swui-font-primary: \"Stena Sans\", \"Open Sans\", Arial, sans-serif;\n --swui-font-weight-text: 400;\n --swui-font-weight-text-bold: 500;\n --swui-font-weight-link: 400;\n --swui-font-buttons: var(--swui-font-primary);\n --swui-font-input: var(--swui-font-primary);\n --swui-font-size-inputs: 1.4rem;\n --swui-font-size-large: 1.6rem;\n --swui-line-height-large: 2.4rem;\n --swui-font-size-medium: 1.4rem;\n --swui-line-height-medium: 1.6rem;\n --swui-font-size-small: 1.2rem;\n --swui-line-height-small: 1.6rem;\n --swui-font-size-smaller: 1rem;\n --swui-line-height-smaller: 1.6rem;\n --swui-font-weight-inputs: 400;\n\n /* Text */\n --swui-text-primary-color: var(--lhds-color-ui-900);\n --swui-text-action-color: var(--lhds-color-blue-600);\n --swui-text-action-color-hover: var(--lhds-color-blue-500);\n --swui-text-action-color-focus: var(--lhds-color-blue-500);\n --swui-text-action-color-active: var(--lhds-color-blue-700);\n --swui-text-primary-color-light: var(--lhds-color-ui-400);\n --swui-text-disabled-color: var(--lhds-color-ui-500);\n --swui-text-disabled-color-light: var(--lhds-color-ui-300);\n --swui-text-darkmode-primary-color: var(--lhds-color-ui-400);\n --swui-text-darkmode-disabled-color: var(--lhds-color-ui-300);\n --swui-text-letter-spacing: 0;\n\n /* Animation speeds */\n --swui-animation-time-fast: 0.1s;\n --swui-animation-time-medium: 0.25s;\n --swui-animation-time-slow: 0.5s;\n\n /* Form fields */\n --swui-field-text-color: #424551;\n --swui-field-text-color-disabled: var(--lhds-color-ui-700);\n --swui-field-text-spacing: 6px;\n --swui-field-letter-spacing: 0;\n --swui-field-text-line-height: 2rem;\n --swui-field-bg-enabled: var(--swui-white);\n --swui-field-bg-disabled: #e8e4ea;\n --swui-field-border-color: #bbc1e1;\n --swui-field-border-color-hover: #275efe;\n --swui-field-border-color-disabled: #b1b1b1;\n --swui-field-shadow-color: rgba(0, 0, 0, 0.15);\n --swui-field-box-size-large: 32px;\n --swui-field-box-size-medium: 24px;\n --swui-field-box-size-small: 16px;\n --swui-field-border-radius: 4px;\n --swui-field-icon-color: var(--swui-text-primary-color);\n --swui-field-icon-size: 13px;\n --swui-field-indicator-active-color: var(--swui-white);\n --swui-field-indicator-inactive-color: var(--swui-hidden);\n --swui-field-placeholder-color: var(--lhds-color-ui-500);\n\n /* Borders */\n --swui-border-radius: 4px;\n\n /* Shadows */\n --swui-shadow-modal: rgba(0, 0, 0, 0.2) 0px 0px 10px 4px;\n --swui-shadow-popover: 0 2px 4px -1px rgba(20, 62, 98, 0.15),\n 0 1px 10px 0 rgba(0, 0, 0, 0.12);\n --swui-shadow-box: rgba(0, 0, 0, 0.15) 0 2px 4px 0;\n --swui-field-focus-shadow: inset 0px 0px 3pt 0pt rgba(0, 0, 100, 0.3);\n --swui-field-focus-shadow-inverted: inset 0px 0px 3pt 0pt\n var(--lhds-color-blue-50);\n\n /* Metrics */\n --swui-metrics-indent: 8px;\n --swui-metrics-spacing: 8px;\n --swui-metrics-space: 8px;\n}\n";
|
package/dist/index.js
CHANGED
|
@@ -32,7 +32,7 @@ function styleInject(css, ref) {
|
|
|
32
32
|
var css_248z$2 = ":root {\n font-size: 62.5%;\n}\n";
|
|
33
33
|
styleInject(css_248z$2);
|
|
34
34
|
|
|
35
|
-
var css_248z$1 = ":root {\n /* Colors */\n --lhds-color-blue-100: #e1eefa;\n --lhds-color-blue-200: #afd0f1;\n --lhds-color-blue-300: #6ca9e6;\n --lhds-color-blue-400: #3a8cdd;\n --lhds-color-blue-50: #f2f8fd;\n --lhds-color-blue-500: #2378cd;\n --lhds-color-blue-600: #
|
|
35
|
+
var css_248z$1 = ":root {\n /* Colors */\n --lhds-color-blue-100: #e1eefa;\n --lhds-color-blue-200: #afd0f1;\n --lhds-color-blue-300: #6ca9e6;\n --lhds-color-blue-400: #3a8cdd;\n --lhds-color-blue-50: #f2f8fd;\n --lhds-color-blue-500: #2378cd;\n --lhds-color-blue-600: #1a5a9a;\n --lhds-color-blue-700: #18518a;\n --lhds-color-blue-800: #143e62;\n --lhds-color-blue-900: #0f304d;\n\n --lhds-color-green-100: #d1efc1;\n --lhds-color-green-200: #aee492;\n --lhds-color-green-300: #8ad861;\n --lhds-color-green-400: #6cce38;\n --lhds-color-green-50: #f4fbf0;\n --lhds-color-green-500: #60bd2f;\n --lhds-color-green-600: #509e27;\n --lhds-color-green-700: #407e1f;\n --lhds-color-green-800: #305f18;\n --lhds-color-green-900: #284f14;\n\n --lhds-color-orange-100: #ffeac4;\n --lhds-color-orange-200: #ffd589;\n --lhds-color-orange-300: #ffc04e;\n --lhds-color-orange-400: #ffb633;\n --lhds-color-orange-50: #fff8eb;\n --lhds-color-orange-500: #ffa400;\n --lhds-color-orange-600: #eb9700;\n --lhds-color-orange-700: #d88b00;\n --lhds-color-orange-800: #b17200;\n --lhds-color-orange-900: #895800;\n\n --lhds-color-purple-100: #f5d6e9;\n --lhds-color-purple-200: #edb6d8;\n --lhds-color-purple-300: #e287be;\n --lhds-color-purple-400: #d758a5;\n --lhds-color-purple-50: #fdf6fa;\n --lhds-color-purple-500: #cf3894;\n --lhds-color-purple-600: #a42874;\n --lhds-color-purple-700: #85205d;\n --lhds-color-purple-800: #651847;\n --lhds-color-purple-900: #58153e;\n\n --lhds-color-red-100: #ffdde4;\n --lhds-color-red-200: #ff899f;\n --lhds-color-red-300: #ff4e70;\n --lhds-color-red-400: #f1002e;\n --lhds-color-red-50: #fff1f4;\n --lhds-color-red-500: #d70029;\n --lhds-color-red-600: #b00022;\n --lhds-color-red-700: #8a0019;\n --lhds-color-red-800: #710015;\n --lhds-color-red-900: #570010;\n\n --lhds-color-turquoise-100: #daf8f4;\n --lhds-color-turquoise-200: #b9f2e9;\n --lhds-color-turquoise-300: #87e8da;\n --lhds-color-turquoise-400: #46dcc6;\n --lhds-color-turquoise-50: #eafbf9;\n --lhds-color-turquoise-500: #28d2b9;\n --lhds-color-turquoise-600: #24bda6;\n --lhds-color-turquoise-700: #1c9280;\n --lhds-color-turquoise-800: #156f62;\n --lhds-color-turquoise-900: #125f53;\n\n --lhds-color-ui-100: #fafafb;\n --lhds-color-ui-200: #efeff2;\n --lhds-color-ui-300: #e4e5e9;\n --lhds-color-ui-400: #ced0d7;\n --lhds-color-ui-50: #ffffff;\n --lhds-color-ui-500: #989cab;\n --lhds-color-ui-600: #5c6171;\n --lhds-color-ui-700: #424551;\n --lhds-color-ui-800: #282931;\n --lhds-color-ui-900: #0d0e10;\n}\n";
|
|
36
36
|
styleInject(css_248z$1);
|
|
37
37
|
|
|
38
38
|
var css_248z = ":root {\n /* Generic colors */\n --swui-white: #fff;\n --swui-hidden: rgba(0, 0, 0, 0);\n --swui-primary-action-color: var(--lhds-color-blue-500);\n --swui-primary-action-color-hover: var(--lhds-color-blue-600);\n --swui-primary-action-color-hover-light: var(--lhds-color-blue-100);\n --swui-primary-action-color-focus: var(--lhds-color-blue-700);\n --swui-primary-action-color-focus-light: var(--lhds-color-blue-100);\n --swui-primary-action-color-active: var(--lhds-color-blue-800);\n --swui-primary-action-color-disabled: var(--lhds-color-ui-300);\n --swui-separator-color: var(--lhds-color-ui-300);\n --swui-handle-bg-enabled-color: var(--swui-white);\n --swui-handle-bg-disabled-color: var(--lhds-color-ui-400);\n --swui-modal-border-color: var(--lhds-color-ui-400);\n --swui-overlay-bg-color: rgba(13, 14, 16, 0.5);\n\n /* State colors */\n --swui-state-error-color: var(--lhds-color-red-300);\n --swui-state-error-light-color: var(--lhds-color-red-50);\n --swui-state-alert-color: var(--lhds-color-orange-400);\n --swui-state-alert-light-color: var(--lhds-color-orange-50);\n --swui-state-success-color: var(--lhds-color-green-600);\n --swui-state-success-light-color: var(--lhds-color-green-50);\n --swui-state-modified-color: var(--lhds-color-blue-500);\n --swui-state-modified-light-color: var(--lhds-color-blue-200);\n --swui-state-loading-color: var(--lhds-color-ui-400);\n --swui-state-loading-light-color: var(--lhds-color-ui-100);\n\n /* Fonts */\n --swui-font-primary: \"Stena Sans\", \"Open Sans\", Arial, sans-serif;\n --swui-font-weight-text: 400;\n --swui-font-weight-text-bold: 500;\n --swui-font-weight-link: 400;\n --swui-font-buttons: var(--swui-font-primary);\n --swui-font-input: var(--swui-font-primary);\n --swui-font-size-inputs: 1.4rem;\n --swui-font-size-large: 1.6rem;\n --swui-line-height-large: 2.4rem;\n --swui-font-size-medium: 1.4rem;\n --swui-line-height-medium: 1.6rem;\n --swui-font-size-small: 1.2rem;\n --swui-line-height-small: 1.6rem;\n --swui-font-size-smaller: 1rem;\n --swui-line-height-smaller: 1.6rem;\n --swui-font-weight-inputs: 400;\n\n /* Text */\n --swui-text-primary-color: var(--lhds-color-ui-900);\n --swui-text-action-color: var(--lhds-color-blue-600);\n --swui-text-action-color-hover: var(--lhds-color-blue-500);\n --swui-text-action-color-focus: var(--lhds-color-blue-500);\n --swui-text-action-color-active: var(--lhds-color-blue-700);\n --swui-text-primary-color-light: var(--lhds-color-ui-400);\n --swui-text-disabled-color: var(--lhds-color-ui-500);\n --swui-text-disabled-color-light: var(--lhds-color-ui-300);\n --swui-text-darkmode-primary-color: var(--lhds-color-ui-400);\n --swui-text-darkmode-disabled-color: var(--lhds-color-ui-300);\n --swui-text-letter-spacing: 0;\n\n /* Animation speeds */\n --swui-animation-time-fast: 0.1s;\n --swui-animation-time-medium: 0.25s;\n --swui-animation-time-slow: 0.5s;\n\n /* Form fields */\n --swui-field-text-color: #424551;\n --swui-field-text-color-disabled: var(--lhds-color-ui-700);\n --swui-field-text-spacing: 6px;\n --swui-field-letter-spacing: 0;\n --swui-field-text-line-height: 2rem;\n --swui-field-bg-enabled: var(--swui-white);\n --swui-field-bg-disabled: #e8e4ea;\n --swui-field-border-color: #bbc1e1;\n --swui-field-border-color-hover: #275efe;\n --swui-field-border-color-disabled: #b1b1b1;\n --swui-field-shadow-color: rgba(0, 0, 0, 0.15);\n --swui-field-box-size-large: 32px;\n --swui-field-box-size-medium: 24px;\n --swui-field-box-size-small: 16px;\n --swui-field-border-radius: 4px;\n --swui-field-icon-color: var(--swui-text-primary-color);\n --swui-field-icon-size: 13px;\n --swui-field-indicator-active-color: var(--swui-white);\n --swui-field-indicator-inactive-color: var(--swui-hidden);\n --swui-field-placeholder-color: var(--lhds-color-ui-500);\n\n /* Borders */\n --swui-border-radius: 4px;\n\n /* Shadows */\n --swui-shadow-modal: rgba(0, 0, 0, 0.2) 0px 0px 10px 4px;\n --swui-shadow-popover: 0 2px 4px -1px rgba(20, 62, 98, 0.15),\n 0 1px 10px 0 rgba(0, 0, 0, 0.12);\n --swui-shadow-box: rgba(0, 0, 0, 0.15) 0 2px 4px 0;\n --swui-field-focus-shadow: inset 0px 0px 3pt 0pt rgba(0, 0, 100, 0.3);\n --swui-field-focus-shadow-inverted: inset 0px 0px 3pt 0pt\n var(--lhds-color-blue-50);\n\n /* Metrics */\n --swui-metrics-indent: 8px;\n --swui-metrics-spacing: 8px;\n --swui-metrics-space: 8px;\n}\n";
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@stenajs-webui/theme",
|
|
3
|
-
"version": "17.
|
|
3
|
+
"version": "17.2.0",
|
|
4
4
|
"description": "",
|
|
5
5
|
"author": "mattias800",
|
|
6
6
|
"license": "MIT",
|
|
@@ -42,5 +42,5 @@
|
|
|
42
42
|
"files": [
|
|
43
43
|
"dist"
|
|
44
44
|
],
|
|
45
|
-
"gitHead": "
|
|
45
|
+
"gitHead": "8c26e5b9dd68b64361ddb44da0dfb863cabbab87"
|
|
46
46
|
}
|