@sb1/ffe-core 21.1.0 → 22.1.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 (8) hide show
  1. package/css/colors.css +0 -1
  2. package/less/colors.less +0 -1
  3. package/less/ffe.less +1 -0
  4. package/less/typography.less +2 -1
  5. package/less/waves.less +87 -0
  6. package/lib/colors.d.ts +0 -1
  7. package/lib/colors.js +1 -2
  8. package/package.json +2 -2
package/css/colors.css CHANGED
@@ -64,7 +64,6 @@
64
64
  --ffe-farge-lyng-70: #ab7487;
65
65
  --ffe-farge-lyng-30: #dbc4cb;
66
66
  --ffe-farge-baer: #e44244;
67
- --ffe-farge-baer-wcag: #e12d2f;
68
67
  --ffe-farge-baer-70: #ec7b7c;
69
68
  --ffe-farge-baer-30: #f7c6c7;
70
69
  --ffe-farge-skog: #285949;
package/less/colors.less CHANGED
@@ -92,7 +92,6 @@
92
92
  @ffe-farge-lyng-70: tint(@ffe-farge-lyng, 30%);
93
93
  @ffe-farge-lyng-30: tint(@ffe-farge-lyng, 70%);
94
94
  @ffe-farge-baer: #e44244;
95
- @ffe-farge-baer-wcag: #e12d2f;
96
95
  @ffe-farge-baer-70: tint(@ffe-farge-baer, 30%);
97
96
  @ffe-farge-baer-30: tint(@ffe-farge-baer, 70%);
98
97
  @ffe-farge-skog: #285949;
package/less/ffe.less CHANGED
@@ -8,3 +8,4 @@
8
8
  @import 'motion';
9
9
  @import 'accessibility';
10
10
  @import 'themes';
11
+ @import 'waves';
package/less/typography.less CHANGED
@@ -214,7 +214,7 @@
214
214
  }
215
215
 
216
216
  &--error {
217
- color: @ffe-farge-baer-wcag;
217
+ color: @ffe-farge-baer;
218
218
  .native & {
219
219
  @media (prefers-color-scheme: dark) {
220
220
  color: @ffe-farge-baer;
@@ -303,6 +303,7 @@
303
303
  font-family: 'SpareBank1-regular', 'MuseoSans-500', arial, sans-serif;
304
304
  font-variant-numeric: tabular-nums;
305
305
  margin-top: 0;
306
+ margin-bottom: 1em;
306
307
  }
307
308
 
308
309
  .ffe-lead-paragraph {
package/less/waves.less ADDED
@@ -0,0 +1,87 @@
1
+ @import 'colors';
2
+
3
+ .ffe-wave {
4
+ min-height: 1000px;
5
+ mask-repeat: repeat-x;
6
+ mask-size: 469px;
7
+ mask-position: 431px;
8
+
9
+ @media (min-width: @breakpoint-sm) {
10
+ mask-size: 875px;
11
+ mask-position: 897px;
12
+ }
13
+
14
+ @media (min-width: @breakpoint-md) {
15
+ mask-size: 2000px;
16
+ mask-position: 1806px;
17
+ }
18
+ }
19
+
20
+ .ffe-wave--rotate {
21
+ rotate: 180deg;
22
+ }
23
+
24
+ .ffe-wave--small {
25
+ mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 479.9 148' 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");
26
+ }
27
+
28
+ .ffe-wave--medium {
29
+ mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='1 0 482.8 148' 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");
30
+ }
31
+
32
+ .ffe-wave--large {
33
+ mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 480.8 148' 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");
34
+ }
35
+
36
+ // Tilgjengelige farger
37
+ .ffe-wave--bg-hvit {
38
+ background-color: @ffe-farge-hvit;
39
+ }
40
+
41
+ .ffe-wave--bg-frost-30 {
42
+ background-color: @ffe-farge-frost-30;
43
+ }
44
+
45
+ .ffe-wave--bg-sand-30 {
46
+ background-color: @ffe-farge-sand-30;
47
+ }
48
+
49
+ .ffe-wave--bg-sand-70 {
50
+ background-color: @ffe-farge-sand-70;
51
+ }
52
+
53
+ .ffe-wave--bg-syrin-30 {
54
+ background-color: @ffe-farge-syrin-30;
55
+ }
56
+
57
+ .ffe-wave--bg-syrin-70 {
58
+ background-color: @ffe-farge-syrin-70;
59
+ }
60
+
61
+ .ffe-wave--bg-vann {
62
+ background-color: @ffe-farge-vann;
63
+ }
64
+
65
+ .ffe-wave--bg-vann-30 {
66
+ background-color: @ffe-farge-vann-30;
67
+ }
68
+
69
+ .ffe-wave--bg-fjell {
70
+ background-color: @ffe-farge-fjell;
71
+ }
72
+
73
+ .ffe-wave--dm-bg-svart {
74
+ .native & {
75
+ @media (prefers-color-scheme: dark) {
76
+ background-color: @ffe-farge-svart;
77
+ }
78
+ }
79
+ }
80
+
81
+ .ffe-wave--dm-bg-natt {
82
+ .native & {
83
+ @media (prefers-color-scheme: dark) {
84
+ background-color: @ffe-farge-natt;
85
+ }
86
+ }
87
+ }
package/lib/colors.d.ts CHANGED
@@ -63,7 +63,6 @@ export declare const fargeLyng = "#873953";
63
63
  export declare const fargeLyng70 = "#ab7487";
64
64
  export declare const fargeLyng30 = "#dbc4cb";
65
65
  export declare const fargeBaer = "#e44244";
66
- export declare const fargeBaerWcag = "#e12d2f";
67
66
  export declare const fargeBaer70 = "#ec7b7c";
68
67
  export declare const fargeBaer30 = "#f7c6c7";
69
68
  export declare const fargeSkog = "#285949";
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.fargeBaerWcag = 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.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;
5
5
  exports.blueRoyal = '#002776';
6
6
  exports.blueCobalt = '#005aa4';
7
7
  exports.blueAzure = '#0071cd';
@@ -67,7 +67,6 @@ exports.fargeLyng = '#873953';
67
67
  exports.fargeLyng70 = '#ab7487';
68
68
  exports.fargeLyng30 = '#dbc4cb';
69
69
  exports.fargeBaer = '#e44244';
70
- exports.fargeBaerWcag = '#e12d2f';
71
70
  exports.fargeBaer70 = '#ec7b7c';
72
71
  exports.fargeBaer30 = '#f7c6c7';
73
72
  exports.fargeSkog = '#285949';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sb1/ffe-core",
3
- "version": "21.1.0",
3
+ "version": "22.1.0",
4
4
  "description": "Rammeverk for Felles Front End",
5
5
  "license": "MIT",
6
6
  "author": "SpareBank 1",
@@ -31,5 +31,5 @@
31
31
  "publishConfig": {
32
32
  "access": "public"
33
33
  },
34
- "gitHead": "0633720a43cf2dfdfae9ff36c72a19ba7f49de81"
34
+ "gitHead": "35f1eac68c249adc523d35b439175624cdf79da6"
35
35
  }