@sb1/ffe-cards 14.0.17 → 14.1.1

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/less/cards.less CHANGED
@@ -1,3 +1,4 @@
1
+ @import 'theme';
1
2
  @import 'card-base';
2
3
  @import 'text-card';
3
4
  @import 'icon-card';
@@ -1,8 +1,8 @@
1
1
  .common-card-styling() {
2
2
  &:extend(.ffe-body-text);
3
3
 
4
- background: @ffe-farge-hvit;
5
- box-shadow: 0 1px 4px 0 rgba(38, 38, 38, 0.3);
4
+ background: var(--ffe-v-cards-common-card-background-color);
5
+ box-shadow: 0 1px 4px 0 var(--ffe-v-cards-common-card-box-shadow-color);
6
6
  margin: 0 0 @ffe-spacing-xs;
7
7
  border: 2px solid transparent;
8
8
  border-radius: 5px;
@@ -13,39 +13,28 @@
13
13
  text-decoration: none;
14
14
  .native & {
15
15
  @media (prefers-color-scheme: dark) {
16
- box-shadow: 0 0 0 1px @ffe-farge-moerkgraa;
17
- background: @ffe-farge-svart;
18
- color: @ffe-farge-hvit;
16
+ box-shadow: 0 0 0 1px
17
+ var(--ffe-v-cards-common-card-box-shadow-color);
18
+ color: var(--ffe-farge-hvit);
19
19
  }
20
20
  }
21
21
 
22
22
  &:visited {
23
23
  .native & {
24
24
  @media (prefers-color-scheme: dark) {
25
- color: @ffe-farge-hvit;
25
+ color: var(--ffe-farge-hvit);
26
26
  }
27
27
  }
28
28
  }
29
29
 
30
30
  &:focus {
31
- box-shadow: 0 0 0 2px @ffe-farge-vann;
32
-
33
- .native & {
34
- @media (prefers-color-scheme: dark) {
35
- box-shadow: 0 0 0 2px @ffe-farge-vann-70;
36
- }
37
- }
31
+ box-shadow: 0 0 0 2px var(--ffe-g-primary-color);
38
32
  }
39
33
 
40
34
  &:focus,
41
35
  &:active,
42
36
  &:hover {
43
- border-color: @ffe-farge-vann;
44
- .native & {
45
- @media (prefers-color-scheme: dark) {
46
- border-color: @ffe-farge-vann-70;
47
- }
48
- }
37
+ border-color: var(--ffe-g-primary-color);
49
38
  }
50
39
 
51
40
  @media (min-width: @breakpoint-md) {
@@ -10,13 +10,7 @@
10
10
  &__subtext {
11
11
  &:extend(.ffe-small-text);
12
12
 
13
- color: @ffe-farge-moerkgraa;
14
- .native & {
15
- @media (prefers-color-scheme: dark) {
16
- color: @ffe-farge-graa;
17
- }
18
- }
19
-
13
+ color: var(--ffe-v-cards-text-color);
20
14
  margin: @ffe-spacing-2xs 0 0 0;
21
15
  }
22
16
 
@@ -12,16 +12,11 @@
12
12
 
13
13
  &__icon {
14
14
  align-self: center;
15
- fill: @ffe-farge-fjell;
15
+ fill: var(--ffe-g-secondary-color);
16
16
  min-width: 40px;
17
17
  width: 40px;
18
18
  height: 40px;
19
19
  margin: 0 @ffe-spacing-lg 0 @ffe-spacing-xs;
20
- .native & {
21
- @media (prefers-color-scheme: dark) {
22
- fill: @ffe-farge-vann-70;
23
- }
24
- }
25
20
  }
26
21
 
27
22
  &__body {
@@ -68,21 +63,11 @@
68
63
 
69
64
  .ffe-icon-card--grey-charcoal {
70
65
  .ffe-icon-card__icon {
71
- fill: @ffe-farge-moerkgraa;
72
- .native & {
73
- @media (prefers-color-scheme: dark) {
74
- fill: @ffe-farge-graa;
75
- }
76
- }
66
+ fill: var(--ffe-v-cards-text-color);
77
67
  }
78
68
 
79
69
  .ffe-card-body__title,
80
70
  .ffe-icon-card__body {
81
- color: @ffe-farge-moerkgraa;
82
- .native & {
83
- @media (prefers-color-scheme: dark) {
84
- color: @ffe-farge-graa;
85
- }
86
- }
71
+ color: var(--ffe-v-cards-text-color);
87
72
  }
88
73
  }
@@ -15,7 +15,7 @@
15
15
  &:hover {
16
16
  .ffe-image-card__image-overlay,
17
17
  .ffe-image-card__body {
18
- border-color: @ffe-farge-vann;
18
+ border-color: var(--ffe-v-cards-image-card-border-hover-color);
19
19
  }
20
20
  }
21
21
 
@@ -0,0 +1,16 @@
1
+ :root {
2
+ --ffe-v-cards-common-card-background-color: var(--ffe-farge-hvit);
3
+ --ffe-v-cards-common-card-box-shadow-color: var(--ffe-farge-graa);
4
+ --ffe-v-cards-text-color: var(--ffe-farge-moerkgraa);
5
+ --ffe-v-cards-image-card-border-hover-color: var(--ffe-farge-vann);
6
+
7
+ @media (prefers-color-scheme: dark) {
8
+ .native {
9
+ --ffe-v-cards-common-card-background-color: var(--ffe-farge-svart);
10
+ --ffe-v-cards-common-card-box-shadow-color: var(
11
+ --ffe-farge-moerkgraa
12
+ );
13
+ --ffe-v-cards-text-color: var(--ffe-farge-graa);
14
+ }
15
+ }
16
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sb1/ffe-cards",
3
- "version": "14.0.17",
3
+ "version": "14.1.1",
4
4
  "description": "Kort for bruk i oversikter",
5
5
  "license": "MIT",
6
6
  "author": "SpareBank 1",
@@ -17,7 +17,7 @@
17
17
  },
18
18
  "devDependencies": {
19
19
  "@sb1/ffe-buildtool": "^0.5.0",
20
- "@sb1/ffe-core": "^26.1.0"
20
+ "@sb1/ffe-core": "^26.1.1"
21
21
  },
22
22
  "peerDependencies": {
23
23
  "@sb1/ffe-core": "*"
@@ -25,5 +25,5 @@
25
25
  "publishConfig": {
26
26
  "access": "public"
27
27
  },
28
- "gitHead": "2d84d7d8af7cdf628ae70a2c75e2f692081acf27"
28
+ "gitHead": "9221438cd6f3e829240ba1994ff1b8c32d50e36a"
29
29
  }