@sb1/ffe-core 102.0.6 → 102.0.8

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 (3) hide show
  1. package/css/ffe.css +10 -9
  2. package/less/typography.less +11 -11
  3. package/package.json +3 -3
package/css/ffe.css CHANGED
@@ -1484,7 +1484,9 @@ html,
1484
1484
  font-size: var(--ffe-fontsize-small-text);
1485
1485
  }
1486
1486
  .ffe-small-text--underline {
1487
- border-bottom: var(--ffe-g-border-width) solid currentColor;
1487
+ text-decoration: underline;
1488
+ text-decoration-thickness: var(--ffe-g-border-width);
1489
+ text-underline-offset: 0.2em;
1488
1490
  }
1489
1491
  .ffe-micro-text {
1490
1492
  font-size: var(--ffe-fontsize-micro-text);
@@ -1609,23 +1611,22 @@ html,
1609
1611
  margin: 0;
1610
1612
  }
1611
1613
  .ffe-link-text {
1612
- border-bottom: var(--ffe-g-border-width) solid var(--ffe-color-foreground-interactive-link);
1613
1614
  color: var(--ffe-color-foreground-interactive-link);
1614
1615
  cursor: pointer;
1615
- text-decoration: none;
1616
- word-wrap: break-all;
1617
- line-height: 1em;
1616
+ text-decoration: underline;
1617
+ text-decoration-color: var(--ffe-color-foreground-interactive-link);
1618
+ text-decoration-thickness: var(--ffe-g-border-width);
1619
+ text-underline-offset: 0.2em;
1618
1620
  transition: all var(--ffe-transition-duration) var(--ffe-ease);
1619
1621
  }
1620
1622
  @media (hover: hover) and (pointer: fine) {
1621
1623
  .ffe-link-text:hover {
1622
- border-bottom-color: var(--ffe-color-foreground-interactive-link-hover);
1623
1624
  color: var(--ffe-color-foreground-interactive-link-hover);
1624
- text-decoration: none;
1625
+ text-decoration-color: var(--ffe-color-foreground-interactive-link-hover);
1625
1626
  }
1626
1627
  }
1627
1628
  .ffe-link-text--no-underline {
1628
- border-bottom: none;
1629
+ text-decoration: none;
1629
1630
  }
1630
1631
  .ffe-link-text:active {
1631
1632
  color: var(--ffe-color-foreground-interactive-link-pressed);
@@ -1635,7 +1636,7 @@ html,
1635
1636
  border-radius: 1px;
1636
1637
  box-shadow: 0 0 0 2px var(--ffe-color-border-interactive-focus);
1637
1638
  outline: none;
1638
- border-bottom-color: transparent;
1639
+ text-decoration-color: transparent;
1639
1640
  }
1640
1641
  .ffe-link-icon {
1641
1642
  color: var(--ffe-color-foreground-interactive-link);
package/less/typography.less CHANGED
@@ -44,7 +44,9 @@
44
44
  font-size: var(--ffe-fontsize-small-text);
45
45
 
46
46
  &--underline {
47
- border-bottom: var(--ffe-g-border-width) solid currentColor;
47
+ text-decoration: underline;
48
+ text-decoration-thickness: var(--ffe-g-border-width);
49
+ text-underline-offset: 0.2em;
48
50
  }
49
51
  }
50
52
 
@@ -161,27 +163,25 @@
161
163
  }
162
164
 
163
165
  .ffe-link-text {
164
- border-bottom: var(--ffe-g-border-width) solid
165
- var(--ffe-color-foreground-interactive-link);
166
166
  color: var(--ffe-color-foreground-interactive-link);
167
167
  cursor: pointer;
168
- text-decoration: none;
169
- word-wrap: break-all;
170
- line-height: 1em;
168
+ text-decoration: underline;
169
+ text-decoration-color: var(--ffe-color-foreground-interactive-link);
170
+ text-decoration-thickness: var(--ffe-g-border-width);
171
+ text-underline-offset: 0.2em;
171
172
  transition: all var(--ffe-transition-duration) var(--ffe-ease);
172
173
 
173
174
  @media (hover: hover) and (pointer: fine) {
174
175
  &:hover {
175
- border-bottom-color: var(
176
+ color: var(--ffe-color-foreground-interactive-link-hover);
177
+ text-decoration-color: var(
176
178
  --ffe-color-foreground-interactive-link-hover
177
179
  );
178
- color: var(--ffe-color-foreground-interactive-link-hover);
179
- text-decoration: none;
180
180
  }
181
181
  }
182
182
 
183
183
  &--no-underline {
184
- border-bottom: none;
184
+ text-decoration: none;
185
185
  }
186
186
 
187
187
  &:active {
@@ -193,7 +193,7 @@
193
193
  border-radius: 1px;
194
194
  box-shadow: 0 0 0 2px var(--ffe-color-border-interactive-focus);
195
195
  outline: none;
196
- border-bottom-color: transparent;
196
+ text-decoration-color: transparent;
197
197
  }
198
198
  }
199
199
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sb1/ffe-core",
3
- "version": "102.0.6",
3
+ "version": "102.0.8",
4
4
  "description": "Rammeverk for Felles Front End",
5
5
  "license": "MIT",
6
6
  "author": "SpareBank 1",
@@ -37,7 +37,7 @@
37
37
  "build-colors": "./scripts/build-colors.cjs"
38
38
  },
39
39
  "devDependencies": {
40
- "@sb1/ffe-buildtool": "^102.0.6",
40
+ "@sb1/ffe-buildtool": "^102.0.8",
41
41
  "case": "^1.6.3",
42
42
  "less": "^4.9.1",
43
43
  "postcss": "^8.5.31"
@@ -45,5 +45,5 @@
45
45
  "publishConfig": {
46
46
  "access": "public"
47
47
  },
48
- "gitHead": "512d8c1ca541c7b67397056b2a2f8efe9e099377"
48
+ "gitHead": "ae1c2258103f4e712f7c39aa7ecd09722cc2dd8c"
49
49
  }