@sb1/ffe-cards 20.3.0 → 20.4.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.
Files changed (4) hide show
  1. package/css/cards.css +31 -36
  2. package/less/components.less +13 -4
  3. package/less/stippled-card.less +10 -2
  4. package/package.json +2 -2
package/css/cards.css CHANGED
@@ -139,40 +139,6 @@
139
139
  --ffe-v-cards-common-card-background-color: var(--ffe-farge-koksgraa);
140
140
  }
141
141
  }
142
- .ffe-card-body__title {
143
- line-height: 1.25rem;font-size: var(--ffe-fontsize-h5);
144
- }
145
- .ffe-card-body__subtext {
146
- color: var(--ffe-g-text-color);font-family: var(--ffe-g-font);font-weight: normal;font-variant-numeric: tabular-nums;line-height: 1.25rem;margin: 0;
147
- }
148
- .ffe-card-body__subtext {
149
- font-size: var(--ffe-fontsize-small-text);
150
- }
151
- .ffe-card-body__title {
152
- color: var(--ffe-g-heading-color);font-weight: normal;margin-bottom: var(--ffe-spacing-xs);margin-top: 0;text-wrap: balance;overflow-wrap: anywhere;
153
- }
154
- .ffe-card-body__title {
155
- font-family: var(--ffe-g-font-heading-small);font-variant-numeric: tabular-nums;
156
- }
157
- @media (min-width: 480px) {
158
- .ffe-card-body__title {
159
- line-height: 1.5rem;
160
- }
161
- .ffe-card-body__title {
162
- margin-bottom: var(--ffe-spacing-sm);
163
- }
164
- .ffe-card-body__subtext {
165
- line-height: 1.25rem;
166
- }
167
- }
168
- @media (min-width: 1024px) {
169
- .ffe-card-body__title {
170
- margin-bottom: var(--ffe-spacing-md);
171
- }
172
- }
173
- .ffe-card-body__subtext {
174
- overflow-wrap: anywhere;
175
- }
176
142
  .ffe-card-body__card-name {
177
143
  margin: 0 0 var(--ffe-spacing-2xs) 0;
178
144
  }
@@ -180,10 +146,23 @@
180
146
  margin: var(--ffe-spacing-2xs) 0 0 0;
181
147
  }
182
148
  .ffe-card-body__subtext {
149
+ font-family: var(--ffe-g-font);
150
+ font-weight: normal;
151
+ font-variant-numeric: tabular-nums;
152
+ line-height: 1.25rem;
153
+ font-size: var(--ffe-fontsize-small-text);
183
154
  color: var(--ffe-v-cards-subtext-color);
184
155
  margin: var(--ffe-spacing-2xs) 0 0 0;
185
156
  }
186
157
  .ffe-card-body__title {
158
+ font-family: var(--ffe-g-font-heading-small);
159
+ font-variant-numeric: tabular-nums;
160
+ color: var(--ffe-g-heading-color);
161
+ font-weight: normal;
162
+ text-wrap: balance;
163
+ overflow-wrap: anywhere;
164
+ line-height: 1.25rem;
165
+ font-size: var(--ffe-fontsize-h5);
187
166
  margin: 0;
188
167
  }
189
168
  .ffe-card-body__title--overflow-ellipsis {
@@ -616,8 +595,9 @@
616
595
  border: 2px dashed var(--ffe-v-cards-stippled-border-color);
617
596
  -webkit-box-shadow: none;
618
597
  box-shadow: none;
619
- display: grid;
620
- grid-template-columns: auto 1fr;
598
+ display: -webkit-box;
599
+ display: -ms-flexbox;
600
+ display: flex;
621
601
  -webkit-box-align: center;
622
602
  -ms-flex-align: center;
623
603
  align-items: center;
@@ -684,8 +664,23 @@
684
664
  .ffe-stippled-card--no-margin {
685
665
  margin: 0;
686
666
  }
667
+ .ffe-stippled-card__content {
668
+ -webkit-box-flex: 1;
669
+ -ms-flex-positive: 1;
670
+ flex-grow: 1;
671
+ }
672
+ .ffe-stippled-card__img {
673
+ -ms-flex-negative: 0;
674
+ flex-shrink: 0;
675
+ -webkit-box-flex: 0;
676
+ -ms-flex-positive: 0;
677
+ flex-grow: 0;
678
+ }
687
679
  .ffe-stippled-card__img--icon {
688
680
  margin: 0 var(--ffe-spacing-md);
681
+ display: -webkit-box;
682
+ display: -ms-flexbox;
683
+ display: flex;
689
684
  }
690
685
  .ffe-stippled-card--condensed {
691
686
  padding: var(--ffe-spacing-sm);
package/less/components.less CHANGED
@@ -10,15 +10,24 @@
10
10
  }
11
11
 
12
12
  &__subtext {
13
- &:extend(.ffe-small-text);
14
-
13
+ font-family: var(--ffe-g-font);
14
+ font-weight: normal;
15
+ font-variant-numeric: tabular-nums;
16
+ line-height: 1.25rem;
17
+ font-size: var(--ffe-fontsize-small-text);
15
18
  color: var(--ffe-v-cards-subtext-color);
16
19
  margin: var(--ffe-spacing-2xs) 0 0 0;
17
20
  }
18
21
 
19
22
  &__title {
20
- &:extend(.ffe-h5);
21
-
23
+ font-family: var(--ffe-g-font-heading-small);
24
+ font-variant-numeric: tabular-nums;
25
+ color: var(--ffe-g-heading-color);
26
+ font-weight: normal;
27
+ text-wrap: balance;
28
+ overflow-wrap: anywhere;
29
+ line-height: 1.25rem;
30
+ font-size: var(--ffe-fontsize-h5);
22
31
  margin: 0;
23
32
 
24
33
  &--overflow-ellipsis {
package/less/stippled-card.less CHANGED
@@ -25,15 +25,23 @@
25
25
  background: transparent;
26
26
  border: 2px dashed var(--ffe-v-cards-stippled-border-color);
27
27
  box-shadow: none;
28
- display: grid;
29
- grid-template-columns: auto 1fr;
28
+ display: flex;
30
29
  align-items: center;
31
30
  padding: var(--ffe-spacing-md);
32
31
  gap: var(--ffe-spacing-md);
33
32
  }
34
33
 
34
+ .ffe-stippled-card__content {
35
+ flex-grow: 1;
36
+ }
37
+ .ffe-stippled-card__img {
38
+ flex-shrink: 0;
39
+ flex-grow: 0;
40
+ }
41
+
35
42
  .ffe-stippled-card__img--icon {
36
43
  margin: 0 var(--ffe-spacing-md);
44
+ display: flex;
37
45
  }
38
46
 
39
47
  .ffe-stippled-card--condensed {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sb1/ffe-cards",
3
- "version": "20.3.0",
3
+ "version": "20.4.1",
4
4
  "description": "Kort for bruk i oversikter",
5
5
  "license": "MIT",
6
6
  "author": "SpareBank 1",
@@ -26,5 +26,5 @@
26
26
  "publishConfig": {
27
27
  "access": "public"
28
28
  },
29
- "gitHead": "55ee3d40abaef9433c55aa993889e67c3f5c5abd"
29
+ "gitHead": "7110be1a43ed8022465ccb49a09d1efb0bab7687"
30
30
  }