Skip to content

Commit ba9f268

Browse files
johanibjohanib
committed
Upgrade npm packages, sass, fontawesome
Javascript package maintenance. Updated some packages. Most notable, are sass and fontawesome. Updated sass from 1.66.1 > 1.93.2. This is the biggest change, specifically: `@import and global built-in functions (i.e. un-namespaced builtins) are deprecated, and Sass is moving toward requiring @use / @forward and module-based builtins`.
1 parent 9e554ea commit ba9f268

File tree

99 files changed

+2967
-3067
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

99 files changed

+2967
-3067
lines changed

‎theme/base/stylesheets/application.scss‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -3,10 +3,10 @@
33
Anything which does not get added here (or imported in one of the imports) does not get compiled.
44
******************************************************************/
55

6-
@import 'helpers';
7-
@import 'shared';
8-
@import 'components';
9-
@import 'pages/consent';
10-
@import 'pages/form';
11-
@import 'pages/wayf';
12-
@import 'pages/logout';
6+
@use 'helpers';
7+
@use 'shared';
8+
@use 'components';
9+
@use 'pages/consent';
10+
@use 'pages/form';
11+
@use 'pages/wayf';
12+
@use 'pages/logout';

‎theme/base/stylesheets/classes.scss‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,18 +2,18 @@
22
Generic reusable classes.
33
Page-specific classes do not belong here.
44
******************************************************************/
5-
@import 'variables';
6-
@import 'breakpoints';
7-
@import 'mixins';
5+
@use 'variables';
6+
@use 'breakpoints';
7+
@use 'mixins';
88

99
.visually-hidden {
10-
@include visually-hidden;
10+
@include mixins.visually-hidden;
1111
}
1212

1313
.container {
1414
width: 40rem;
1515

16-
@include screen('mobile') {
16+
@include breakpoints.screen('mobile') {
1717
width: 100%;
1818
}
1919
}
@@ -28,7 +28,7 @@
2828

2929
.modal__content {
3030
background-color: inherit;
31-
font-weight: $normal;
31+
font-weight: variables.$normal;
3232
padding: 1rem;
3333

3434
> h3 {

‎theme/base/stylesheets/components.scss‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1-
@import 'components/footer';
2-
@import 'components/noscript';
3-
@import 'components/spinner';
4-
@import 'components/success';
5-
@import 'components/warning';
6-
@import 'components/ribbon';
1+
@use 'components/footer';
2+
@use 'components/noscript';
3+
@use 'components/spinner';
4+
@use 'components/success';
5+
@use 'components/warning';
6+
@use 'components/ribbon';

‎theme/base/stylesheets/components/attribute.scss‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
@import './attributeName';
22
@import './attributeValue';
3+
@use "../../../skeune/stylesheets/mixins-skeune" as mixins-skeune;
34

45
.consent__attribute {
56
@include display-grid;
@@ -38,7 +39,7 @@
3839
}
3940

4041
> input[type="checkbox"]:checked.tooltip ~ .attribute__name > label.tooltip {
41-
@include closeTooltip;
42+
@include mixins-skeune.closeTooltip;
4243
background-position: left 17px bottom 11px;
4344
}
4445

‎theme/base/stylesheets/components/footer.scss‎

Lines changed: 20 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,49 +1,54 @@
1+
@use "../breakpoints";
2+
@use "../functions";
3+
@use "../mixins";
4+
@use "../variables";
5+
16
footer.footer__general {
2-
background-color: $darkishBlue;
3-
color: $loginBlue;
4-
margin: 1rem 1rem calculateRem(11px) 1rem;
7+
background-color: variables.$darkishBlue;
8+
color: variables.$loginBlue;
9+
margin: 1rem 1rem functions.calculateRem(11px) 1rem;
510

611
> .footer__menu {
7-
@include display-grid;
8-
@include grid-template-columns(33% 1% 32% 1% 33%);
9-
font-size: $f-normal;
10-
font-weight: $bolder;
12+
@include mixins.display-grid;
13+
@include mixins.grid-template-columns(33% 1% 32% 1% 33%);
14+
font-size: variables.$f-normal;
15+
font-weight: variables.$bolder;
1116
line-height: 1.5;
1217
list-style: none;
1318
padding: 0;
1419

15-
@include screen('mobile') {
20+
@include breakpoints.screen('mobile') {
1621
display: flex;
1722
justify-content: space-between;
1823
}
1924

2025
> .footer__item {
2126
&:first-of-type {
22-
@include grid-position(1, 2, 1, 2);
27+
@include mixins.grid-position(1, 2, 1, 2);
2328
}
2429

2530
&:nth-of-type(2) {
26-
@include grid-position(1, 2, 3, 4);
31+
@include mixins.grid-position(1, 2, 3, 4);
2732
text-align: center;
2833
}
2934

3035
&:last-of-type {
31-
@include grid-position(1, 2, 5, 6);
36+
@include mixins.grid-position(1, 2, 5, 6);
3237
text-align: right;
3338
}
3439
}
3540

3641
a {
37-
color: $greenishBlue;
42+
color: variables.$greenishBlue;
3843

3944
&.selected,
4045
&:hover,
4146
&:focus{
42-
color: $white;
47+
color: variables.$white;
4348
}
4449

4550
&:focus {
46-
box-shadow: 0 0 0 3px $white;
51+
box-shadow: 0 0 0 3px variables.$white;
4752
}
4853
}
4954

@@ -66,7 +71,7 @@ footer.footer__general {
6671
}
6772

6873
&:not(:first-of-type) {
69-
border-left: 1px solid $white;
74+
border-left: 1px solid variables.$white;
7075
padding-left: 5px;
7176
}
7277
}

‎theme/base/stylesheets/components/noscript.scss‎

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,16 @@
1+
@use "../breakpoints";
2+
@use "../../../skeune/stylesheets/mixins-skeune" as mixins;
3+
14
noscript {
25
> .noScript {
3-
@include warning;
6+
@include mixins.warning;
47
margin: 1rem 2rem;
58

6-
@include screen('mobile') {
9+
@include breakpoints.screen('mobile') {
710
margin: 1rem 1rem;
811
}
912

10-
@include screen('smallMobile') {
13+
@include breakpoints.screen('smallMobile') {
1114
margin: 1rem .5rem;
1215
}
1316

‎theme/base/stylesheets/components/old-not-converted/button.scss‎

Lines changed: 14 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,30 +1,33 @@
1+
@use "sass:color";
2+
@use "../../variables";
3+
14
.c-button {
2-
background: $darkBlue;
5+
background: variables.$darkBlue;
36
border: 1px solid transparent;
47
border-radius: 10rem;
5-
color: $white;
8+
color: variables.$white;
69
cursor: pointer;
710
display: inline-block;
8-
font-size: $f-normal;
11+
font-size: variables.$f-normal;
912
line-height: 1rem;
1013
padding: .5em 1rem;
1114
text-decoration: none;
1215
white-space: nowrap;
1316

1417
&:hover {
15-
background: darken($darkBlue, 10);
18+
background: color.adjust(variables.$darkBlue, $lightness: -10%);
1619
text-decoration: underline;
1720
}
1821

1922
&.outline {
20-
background: $white;
21-
border: 1px solid $borderDark;
22-
color: $darkBlue;
23+
background: variables.$white;
24+
border: 1px solid variables.$borderDark;
25+
color: variables.$darkBlue;
2326

2427
&.white {
25-
background: $white;
26-
border: 1px solid $darkBlue;
27-
color: $darkBlue;
28+
background: variables.$white;
29+
border: 1px solid variables.$darkBlue;
30+
color: variables.$darkBlue;
2831
}
2932
}
3033

@@ -63,6 +66,6 @@
6366

6467
&.c-button-link {
6568
background: transparent;
66-
color: darken($darkBlue,10);
69+
color: color.adjust(variables.$darkBlue,$lightness: -10%);
6770
}
6871
}

‎theme/base/stylesheets/components/old-not-converted/container.scss‎

Lines changed: 13 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,29 @@
1+
@use "../../variables";
2+
@use "../../breakpoints";
3+
14
.l-container {
25
margin: 0 auto;
3-
max-width: $containerWidth;
6+
max-width: variables.$containerWidth;
47
padding: .5rem;
58
z-index: 0;
69

7-
@include screen('tabletAndBigger') {
10+
@include breakpoints.screen('tabletAndBigger') {
811
margin: 0 auto 3rem;
912
padding: 0 2rem;
1013
}
1114

1215
&.wide {
13-
max-width: $containerWidth*1.5;
16+
max-width: variables.$containerWidth*1.5;
1417
width: auto;
1518
}
1619
}
1720

1821
.mod-content{
19-
background-color: $white;
22+
background-color: variables.$white;
2023
line-height: 1.5;
2124
padding: 2rem;
2225

23-
@include screen('mobile') {
26+
@include breakpoints.screen('mobile') {
2427
padding: .5rem;
2528
}
2629

@@ -47,7 +50,7 @@
4750

4851
header {
4952
align-items: center;
50-
border-bottom: 1px solid $lightGrey;
53+
border-bottom: 1px solid variables.$lightGrey;
5154
display: flex;
5255
flex-direction: row;
5356
flex-wrap: nowrap;
@@ -56,15 +59,15 @@
5659

5760
h1 {
5861
font-size: 200%;
59-
font-weight: $boldest;
62+
font-weight: variables.$boldest;
6063
}
6164
}
6265

6366
h1 {
6467
flex-basis: 100%;
6568
flex-grow: 2;
6669
font-size: 200%;
67-
font-weight: $normal;
70+
font-weight: variables.$normal;
6871
line-height: calculateRem(40px);
6972
margin: 0;
7073
}
@@ -82,6 +85,6 @@
8285

8386
.box {
8487
background: #fff;
85-
border-radius: $borderRadius;
86-
box-shadow: 0 1px $borderRadius rgba(black,.2);
88+
border-radius: variables.$borderRadius;
89+
box-shadow: 0 1px variables.$borderRadius rgba(black,.2);
8790
}

‎theme/base/stylesheets/components/old-not-converted/content.scss‎

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,10 @@
1+
@use "../../variables";
2+
@use "../../breakpoints";
3+
14
.mod-content {
25
padding: 2rem;
36

4-
@include screen('mobile') {
7+
@include breakpoints.screen('mobile') {
58
padding: .5rem;
69
}
710

@@ -27,8 +30,8 @@
2730
}
2831

2932
h3 {
30-
font-size: $f-normal;
31-
color: $mediumGrey;
33+
font-size: variables.$f-normal;
34+
color: variables.$mediumGrey;
3235
line-height: 25px;
3336
}
3437

‎theme/base/stylesheets/components/old-not-converted/error-page/background.scss‎

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,19 @@
1+
@use "../../../variables" as vars;
2+
@use "../../../mixins" as mixins;
3+
@use "../../../breakpoints" as breakpoints;
4+
15
.background {
2-
$list: $blue, $lightBlue2;
3-
@include gradient(to bottom, $list);
4-
background: $mediumBlue;
6+
$list: vars.$blue, vars.$lightBlue2;
7+
@include mixins.gradient(to bottom, $list);
8+
background: vars.$mediumBlue;
59
bottom: 0;
610
height: 100%;
711
overflow: hidden;
812
position: fixed;
913
width: 100%;
1014
z-index: -1;
1115

12-
@include screen('mobile') {
16+
@include breakpoints.screen('mobile') {
1317
display: none;
1418
}
1519

0 commit comments

Comments
 (0)