@sb1/ffe-core 23.0.1 → 25.0.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.
Files changed (6) hide show
  1. package/css/colors.css +0 -1
  2. package/less/colors.less +0 -1
  3. package/less/waves.less +21 -49
  4. package/lib/colors.d.ts +0 -1
  5. package/lib/colors.js +1 -2
  6. package/package.json +33 -33
package/css/colors.css CHANGED
@@ -80,7 +80,6 @@
80
80
  --ffe-farge-koksgraa: #323232;
81
81
  --ffe-farge-moerkgraa: #676767;
82
82
  --ffe-farge-graa: #adadad;
83
- --ffe-farge-graa-wcag: #949494;
84
83
  --ffe-farge-lysgraa: #d8d8d8;
85
84
  --ffe-farge-moerkvarmgraa: #848383;
86
85
  --ffe-farge-varmgraa: #9b9797;
package/less/colors.less CHANGED
@@ -110,7 +110,6 @@
110
110
  @ffe-farge-koksgraa: #323232;
111
111
  @ffe-farge-moerkgraa: #676767;
112
112
  @ffe-farge-graa: #adadad;
113
- @ffe-farge-graa-wcag: #949494;
114
113
  @ffe-farge-lysgraa: #d8d8d8;
115
114
  @ffe-farge-moerkvarmgraa: #848383;
116
115
  @ffe-farge-varmgraa: #9b9797;
package/less/waves.less CHANGED
@@ -11,94 +11,66 @@
11
11
  }
12
12
 
13
13
  &__wave {
14
- min-height: 130px;
15
14
  mask-repeat: repeat-x;
16
- mask-size: 469px;
17
- mask-position: 431px;
18
- }
19
-
20
- &--flip &__wave {
21
- rotate: 180deg;
22
- }
23
-
24
- &--small &__wave {
25
15
  min-height: 60px;
26
16
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 479.9 60' style='enable-background:new 0 0 479.9 148' xml:space='preserve'%3E%3Cpath d='M0 530V0c60.7 0 91.6 13.8 121.4 27.1 30.4 13.6 59.1 26.4 118.1 26.4s87.7-12.8 118.1-26.4C387.4 13.8 418.2 0 478.9 0s91.6 13.8 121.4 27.1c30.4 13.6 59.1 26.4 118.1 26.4s87.7-12.8 118.1-26.4C866.3 13.8 897.1 0 957.8 0s91.6 13.8 121.4 27.1c30.4 13.6 59.1 26.4 118.1 26.4s87.7-12.8 118.1-26.4C1345.2 13.8 1376 0 1436.7 0c60.7 0 91.6 13.8 121.4 27.1 30.4 13.6 59.1 26.4 118.1 26.4s87.7-12.8 118.1-26.4C1824.1 13.8 1854.9 0 1915.7 0v530'/%3E%3C/svg%3E");
27
- mask-size: 469px;
17
+ mask-size: 480px;
28
18
 
29
19
  @media (min-width: @breakpoint-sm) {
30
- min-height: 113px;
31
- mask-size: 870px;
32
- mask-position: 774px;
33
- }
34
-
35
- @media (min-width: @breakpoint-md) {
36
- min-height: 121px;
37
- mask-size: 957;
38
- mask-position: 877px;
20
+ min-height: 119px;
21
+ mask-position: 812px;
22
+ mask-size: 950px;
39
23
  }
40
- }
41
-
42
- &--medium &__wave {
43
- min-height: 95px;
44
- mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='1 0 482.8 95' style='enable-background:new 0 0 482.8 148' xml:space='preserve'%3E%3Cpath d='M0 595V0c61.3 0 92.3 21.7 122.4 42.7 30.4 21.2 59.1 41.2 118.1 41.2 59 0 87.7-20.1 118.1-41.2C388.6 21.7 419.7 0 481 0s92.3 21.7 122.4 42.7c30.4 21.2 59.1 41.2 118.1 41.2 58.9 0 87.7-20.1 118.1-41.2 29.9-21 61-42.7 122.2-42.7 61.3 0 92.3 21.7 122.4 42.7 30.4 21.2 59.1 41.2 118.1 41.2 58.9 0 87.7-20.1 118.1-41.2 30-20.9 61.1-42.7 122.4-42.7 61.3 0 92.3 21.7 122.4 42.7 30.4 21.2 59.1 41.2 118.1 41.2s87.7-20.1 118.1-41.2C1831.6 21.7 1862.7 0 1924 0v595'/%3E%3C/svg%3E");
45
24
 
46
- @media (min-width: @breakpoint-sm) {
47
- min-height: 148px;
48
- mask-size: 740px;
49
- mask-position: 774px;
25
+ @media (min-width: @breakpoint-lg) {
26
+ min-height: 251px;
27
+ mask-position: 1931px;
28
+ mask-size: 2004px;
50
29
  }
51
- }
52
-
53
- &--large &__wave {
54
- mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 480.8 112' style='enable-background:new 0 0 480.8 148' xml:space='preserve'%3E%3Cpath d='M0 537V0c61.4 0 92.5 27.8 122.5 54.6 30.2 27 58.8 52.6 117.1 52.6 58.4 0 86.9-25.5 117.1-52.6C386.8 27.8 417.8 0 479.3 0c61.4 0 92.5 27.8 122.5 54.6 30.2 27 58.8 52.6 117.1 52.6 58.4 0 86.9-25.5 117.1-52.6C866.1 27.8 897.1 0 958.6 0c61.4 0 92.5 27.8 122.5 54.6 30.2 27 58.8 52.6 117.1 52.6 58.4 0 86.9-25.5 117.1-52.6 30-26.9 61.1-54.6 122.5-54.6s92.5 27.8 122.5 54.6c30.2 27 58.8 52.6 117.1 52.6 58.4 0 86.9-25.5 117.1-52.6C1824.5 27.7 1855.6 0 1917 0v537'/%3E%3C/svg%3E");
55
- min-height: 112px;
56
30
 
57
- @media (min-width: @breakpoint-sm) {
58
- min-height: 150px;
59
- mask-size: 651px;
60
- mask-position: 616px;
31
+ &--flip {
32
+ rotate: 180deg;
61
33
  }
62
34
  }
63
35
 
64
36
  // Tilgjengelige farger
65
- &--bg-hvit &__wave {
37
+ &--bg-hvit {
66
38
  background-color: @ffe-farge-hvit;
67
39
  }
68
40
 
69
- &--bg-frost-30 &__wave {
41
+ &--bg-frost-30 {
70
42
  background-color: @ffe-farge-frost-30;
71
43
  }
72
44
 
73
- &--bg-sand-30 &__wave {
45
+ &--bg-sand-30 {
74
46
  background-color: @ffe-farge-sand-30;
75
47
  }
76
48
 
77
- &--bg-sand-70 &__wave {
49
+ &--bg-sand-70 {
78
50
  background-color: @ffe-farge-sand-70;
79
51
  }
80
52
 
81
- &--bg-syrin-30 &__wave {
53
+ &--bg-syrin-30 {
82
54
  background-color: @ffe-farge-syrin-30;
83
55
  }
84
56
 
85
- &--bg-syrin-70 &__wave {
57
+ &--bg-syrin-70 {
86
58
  background-color: @ffe-farge-syrin-70;
87
59
  }
88
60
 
89
- &--bg-vann &__wave {
61
+ &--bg-vann {
90
62
  background-color: @ffe-farge-vann;
91
63
  }
92
64
 
93
- &--bg-vann-30 &__wave {
65
+ &--bg-vann-30 {
94
66
  background-color: @ffe-farge-vann-30;
95
67
  }
96
68
 
97
- .ffe-wave--bg-fjell &__wave {
69
+ &--bg-fjell {
98
70
  background-color: @ffe-farge-fjell;
99
71
  }
100
72
 
101
- .ffe-wave--dm-bg-svart &__wave {
73
+ &--dm-bg-svart {
102
74
  .native & {
103
75
  @media (prefers-color-scheme: dark) {
104
76
  background-color: @ffe-farge-svart;
@@ -106,7 +78,7 @@
106
78
  }
107
79
  }
108
80
 
109
- .ffe-wave--dm-bg-natt &__wave {
81
+ &--dm-bg-natt {
110
82
  .native & {
111
83
  @media (prefers-color-scheme: dark) {
112
84
  background-color: @ffe-farge-natt;
package/lib/colors.d.ts CHANGED
@@ -79,7 +79,6 @@ export declare const fargeSvart = "#020a0a";
79
79
  export declare const fargeKoksgraa = "#323232";
80
80
  export declare const fargeMoerkgraa = "#676767";
81
81
  export declare const fargeGraa = "#adadad";
82
- export declare const fargeGraaWcag = "#949494";
83
82
  export declare const fargeLysgraa = "#d8d8d8";
84
83
  export declare const fargeMoerkvarmgraa = "#848383";
85
84
  export declare const fargeVarmgraa = "#9b9797";
package/lib/colors.js CHANGED
@@ -1,7 +1,7 @@
1
1
  "use strict";
2
2
  exports.__esModule = true;
3
3
  exports.fargeSyrin70 = exports.fargeSyrin = exports.fargeFrost30 = exports.fargeFrost70 = exports.fargeFrost = exports.fargeSand30 = exports.fargeSand70 = exports.fargeSand = exports.fargeVann30 = exports.fargeVann70 = exports.fargeVann = exports.fargeFjell30 = exports.fargeFjell70 = exports.fargeFjell = exports.redDarkmode = exports.blueAzureDarkmode = exports.greyCloudDarkmode = exports.greySilverDarkmode = exports.greyDarkmode = exports.greyCharcoalDarkmode = exports.whiteDarkmode = exports.blackDarkmode = exports.sandIvory = exports.blueDeepSky = exports.black = exports.greyWarm = exports.greyCharcoal = exports.greySilver = exports.greyCloud = exports.grey = exports.white = exports.sand = exports.purpleViolet = exports.purpleMagenta = exports.purple = exports.red = exports.orangeSalmon = exports.orangeFire = exports.orange = exports.greenMint = exports.greenEmerald = exports.greenShamrock = exports.green = exports.blueFocus = exports.blueIce = exports.bluePale = exports.blueSky = exports.blueAzure = exports.blueCobalt = exports.blueRoyal = void 0;
4
- exports.fargeHvit = exports.fargeLysvarmgraa = exports.fargeVarmgraa = exports.fargeMoerkvarmgraa = exports.fargeLysgraa = exports.fargeGraaWcag = exports.fargeGraa = exports.fargeMoerkgraa = exports.fargeKoksgraa = exports.fargeSvart = exports.fargeNatt = exports.fargeSol30 = exports.fargeSol70 = exports.fargeSol = exports.fargeMulte30 = exports.fargeMulte70 = exports.fargeMulte = exports.fargeSkog30 = exports.fargeSkog70 = exports.fargeSkog = exports.fargeBaer30 = exports.fargeBaer70 = exports.fargeBaer = exports.fargeLyng30 = exports.fargeLyng70 = exports.fargeLyng = exports.fargeNordlys30 = exports.fargeNordlys70 = exports.fargeNordlysWcag = exports.fargeNordlys = exports.fargeVillblomst30 = exports.fargeVillblomst70 = exports.fargeVillblomst = exports.fargeMyrull30 = exports.fargeMyrull70 = exports.fargeMyrull = exports.fargeSyrin30 = void 0;
4
+ exports.fargeHvit = exports.fargeLysvarmgraa = exports.fargeVarmgraa = exports.fargeMoerkvarmgraa = exports.fargeLysgraa = exports.fargeGraa = exports.fargeMoerkgraa = exports.fargeKoksgraa = exports.fargeSvart = exports.fargeNatt = exports.fargeSol30 = exports.fargeSol70 = exports.fargeSol = exports.fargeMulte30 = exports.fargeMulte70 = exports.fargeMulte = exports.fargeSkog30 = exports.fargeSkog70 = exports.fargeSkog = exports.fargeBaer30 = exports.fargeBaer70 = exports.fargeBaer = exports.fargeLyng30 = exports.fargeLyng70 = exports.fargeLyng = exports.fargeNordlys30 = exports.fargeNordlys70 = exports.fargeNordlysWcag = exports.fargeNordlys = exports.fargeVillblomst30 = exports.fargeVillblomst70 = exports.fargeVillblomst = exports.fargeMyrull30 = exports.fargeMyrull70 = exports.fargeMyrull = exports.fargeSyrin30 = void 0;
5
5
  exports.blueRoyal = '#002776';
6
6
  exports.blueCobalt = '#005aa4';
7
7
  exports.blueAzure = '#0071cd';
@@ -83,7 +83,6 @@ exports.fargeSvart = '#020a0a';
83
83
  exports.fargeKoksgraa = '#323232';
84
84
  exports.fargeMoerkgraa = '#676767';
85
85
  exports.fargeGraa = '#adadad';
86
- exports.fargeGraaWcag = '#949494';
87
86
  exports.fargeLysgraa = '#d8d8d8';
88
87
  exports.fargeMoerkvarmgraa = '#848383';
89
88
  exports.fargeVarmgraa = '#9b9797';
package/package.json CHANGED
@@ -1,35 +1,35 @@
1
1
  {
2
- "name": "@sb1/ffe-core",
3
- "version": "23.0.1",
4
- "description": "Rammeverk for Felles Front End",
5
- "license": "MIT",
6
- "author": "SpareBank 1",
7
- "files": [
8
- "lib",
9
- "less",
10
- "css"
11
- ],
12
- "main": "lib/index.js",
13
- "types": "lib/index.d.ts",
14
- "repository": {
15
- "type": "git",
16
- "url": "ssh://git@github.com:SpareBank1/designsystem.git"
17
- },
18
- "scripts": {
19
- "lint": "stylelint less/*.less",
20
- "test": "npm run lint",
21
- "clean": "rm -rf css/ gen-src/ lib/",
22
- "build": "./scripts/build.js tokens.config.js && ./scripts/build-custom-mq.js less/breakpoints.less css/custom-media-queries.css && tsc gen-src/index.ts --declaration --outDir lib"
23
- },
24
- "devDependencies": {
25
- "case": "^1.5.5",
26
- "less": "^4.1.2",
27
- "postcss": "^8.3.6",
28
- "stylelint": "^13.0.0",
29
- "typescript": "^4.6.4"
30
- },
31
- "publishConfig": {
32
- "access": "public"
33
- },
34
- "gitHead": "6b569f310458cf252746dc4d67068201eb8267e7"
2
+ "name": "@sb1/ffe-core",
3
+ "version": "25.0.0",
4
+ "description": "Rammeverk for Felles Front End",
5
+ "license": "MIT",
6
+ "author": "SpareBank 1",
7
+ "files": [
8
+ "lib",
9
+ "less",
10
+ "css"
11
+ ],
12
+ "main": "lib/index.js",
13
+ "types": "lib/index.d.ts",
14
+ "repository": {
15
+ "type": "git",
16
+ "url": "ssh://git@github.com:SpareBank1/designsystem.git"
17
+ },
18
+ "scripts": {
19
+ "lint": "stylelint less/*.less",
20
+ "test": "npm run lint",
21
+ "clean": "rm -rf css/ gen-src/ lib/",
22
+ "build": "./scripts/build.js tokens.config.js && ./scripts/build-custom-mq.js less/breakpoints.less css/custom-media-queries.css && tsc gen-src/index.ts --declaration --outDir lib"
23
+ },
24
+ "devDependencies": {
25
+ "case": "^1.5.5",
26
+ "less": "^4.1.2",
27
+ "postcss": "^8.3.6",
28
+ "stylelint": "^13.0.0",
29
+ "typescript": "^4.6.4"
30
+ },
31
+ "publishConfig": {
32
+ "access": "public"
33
+ },
34
+ "gitHead": "98d9ceeaa9bebcd35d5a730227aac61fd28937cf"
35
35
  }