Skip to content

Commit fd3c23d

Browse files
oharstaoharsta
committed
Migrated to new SASS use
1 parent 96e81b0 commit fd3c23d

37 files changed

+157
-155
lines changed

‎client/src/components/BreadCrumb.scss‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,18 @@
1-
@import "../styles/vars.scss";
1+
@use "../styles/vars.scss";
22

33
.sds--breadcrumb {
44
margin: 0 auto;
55
color: black;
6-
background-color: $background;
6+
background-color: vars.$background;
77
padding-top: 10px;
88

9-
@media (max-width: $medium) {
9+
@media (max-width: vars.$medium) {
1010
padding: 10px 15px 0 15px;
1111
}
1212

1313
ol.sds--breadcrumb--list {
1414
min-height: 32px;
15-
max-width: $max-width;
15+
max-width: vars.$max-width;
1616
margin: 0 auto 0 auto;
1717
position: relative;
1818
transition: margin 150ms ease-in-out;
@@ -37,7 +37,7 @@
3737
margin-left: auto;
3838
font-weight: bold;
3939

40-
@media (max-width: $medium) {
40+
@media (max-width: vars.$medium) {
4141
display: none;
4242
}
4343

‎client/src/components/ClipBoardCopy.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
@import "../styles/vars";
1+
@use "../styles/vars";
22

33
section.copy-to-clipboard {
44
border-radius: 4px;

‎client/src/components/CreatableField.scss‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
@import "../styles/vars.scss";
1+
@use "../styles/vars.scss";
22

33
div.creatable-field {
44
display: flex;
@@ -19,7 +19,7 @@ div.creatable-field {
1919
flex-wrap: wrap;
2020
width: 100%;
2121
border: 1px solid var(--sds--color--gray--400);
22-
border-radius: $br;
22+
border-radius: vars.$br;
2323
font-size: 16px;
2424

2525
&:focus-within {
@@ -56,7 +56,7 @@ div.creatable-field {
5656

5757
div.creatable-tag {
5858
border: 1px solid var(--sds--color--gray--200);
59-
border-radius: $br;
59+
border-radius: vars.$br;
6060
margin: 5px;
6161
display: inline-block;
6262
position: relative;

‎client/src/components/DateField.scss‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
@import "../styles/vars.scss";
1+
@use "../styles/vars.scss";
22

33
.date-field {
44
display: flex;
@@ -29,7 +29,7 @@
2929
display: flex;
3030
width: 240px;
3131
position: relative;
32-
border-radius: $br;
32+
border-radius: vars.$br;
3333

3434
&:focus {
3535
outline: none;
@@ -57,7 +57,7 @@
5757
input[type="text"] {
5858
display: block;
5959
width: 100%;
60-
border-radius: $br;
60+
border-radius: vars.$br;
6161
border: 1px solid var(--sds--color--gray--400);
6262
line-height: 33px;
6363
padding: 16px;
@@ -71,7 +71,7 @@
7171

7272
&[disabled] {
7373
cursor: not-allowed;
74-
background-color: $background;
74+
background-color: vars.$background;
7575
}
7676
}
7777

‎client/src/components/EmailField.scss‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
@import "../styles/vars.scss";
1+
@use "../styles/vars.scss";
22

33
div.email-field {
44
display: flex;
@@ -19,7 +19,7 @@ div.email-field {
1919
flex-wrap: wrap;
2020
width: 100%;
2121
border: 1px solid var(--sds--color--gray--400);
22-
border-radius: $br;
22+
border-radius: vars.$br;
2323
font-size: 16px;
2424

2525
&:focus-within {
@@ -50,7 +50,7 @@ div.email-field {
5050

5151
div.email-tag {
5252
border: 1px solid var(--sds--color--gray--200);
53-
border-radius: $br;
53+
border-radius: vars.$br;
5454
margin: 10px 5px 0 5px;
5555
display: inline-block;
5656
position: relative;

‎client/src/components/Entities.scss‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
1-
@import "../styles/vars";
1+
@use "../styles/vars";
22

33
.mod-entities {
44

5-
max-width: $max-width;
5+
max-width: vars.$max-width;
66
width: 100%;
77
margin: 0 auto;
88

9-
@media (max-width: $medium) {
9+
@media (max-width: vars.$medium) {
1010
padding: 0 15px;
1111
}
1212

@@ -22,22 +22,22 @@
2222
min-height: 40px;
2323
justify-content: flex-end;
2424

25-
@media (max-width: $medium) {
25+
@media (max-width: vars.$medium) {
2626
flex-direction: column;
2727
align-items: normal;
2828
}
2929

3030
button {
3131
margin-left: 25px;
32-
@media (max-width: $medium) {
32+
@media (max-width: vars.$medium) {
3333
margin-left: 0;
3434
margin-top: 15px
3535
}
3636
}
3737

3838
h2 {
3939
margin-right: auto;
40-
@media (max-width: $medium) {
40+
@media (max-width: vars.$medium) {
4141
margin-bottom: 15px
4242
}
4343

@@ -56,7 +56,7 @@
5656
.search-filter {
5757
display: flex;
5858
width: 290px;
59-
@media (max-width: $medium) {
59+
@media (max-width: vars.$medium) {
6060
flex-direction: column;
6161
margin: 15px 0;
6262
}
@@ -76,7 +76,7 @@
7676
position: relative;
7777
display: flex;
7878

79-
@media (max-width: $medium) {
79+
@media (max-width: vars.$medium) {
8080
margin-left: 0;
8181
margin-top: 20px;
8282

@@ -89,7 +89,7 @@
8989
flex-grow: 2;
9090
min-width: 360px;
9191

92-
@media (max-width: $medium) {
92+
@media (max-width: vars.$medium) {
9393
min-width: 0;
9494
}
9595
}

‎client/src/components/Header.scss‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
@import "../styles/vars.scss";
1+
@use "../styles/vars.scss";
22

33
.header-container {
44

@@ -14,9 +14,9 @@
1414
align-items: center;
1515
width: 100%;
1616
margin: 0 auto;
17-
max-width: $max-width;
17+
max-width: vars.$max-width;
1818

19-
@media (max-width: $medium) {
19+
@media (max-width: vars.$medium) {
2020
padding: 0 15px;
2121
}
2222

‎client/src/components/Impersonating.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
@import "../styles/vars.scss";
1+
@use "../styles/vars.scss";
22

33
.impersonator {
44
background-color: var(--sds--color--yellow--200);

‎client/src/components/InputField.scss‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
1-
@import "../styles/vars.scss";
2-
@import "../styles/mixins";
1+
@use "../styles/vars.scss";
2+
@use "../styles/mixins";
33

44
.input-field {
5-
@include input-field;
5+
@include mixins.input-field;
66

77
display: flex;
88
position: relative;
@@ -13,7 +13,7 @@
1313
width: 100%;
1414
border: 1px solid var(--sds--color--gray--300);
1515
padding: 6px 12px;
16-
border-radius: $br;
16+
border-radius: vars.$br;
1717
font-size: 16px;
1818
height: 48px;
1919
color: black;

‎client/src/components/LandingInfo.scss‎

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,17 @@
1-
@import "../styles/vars.scss";
1+
@use "../styles/vars.scss";
22

33
.mod-login-container {
4-
@media (max-width: $medium) {
4+
@media (max-width: vars.$medium) {
55
padding: 0 15px;
66
}
77
background-color: white;
88

99
&.bottom {
10-
background-color: $background;
10+
background-color: vars.$background;
1111
}
1212

1313
.mod-login {
14-
@media (max-width: $medium) {
14+
@media (max-width: vars.$medium) {
1515
flex-direction: column;
1616
width: 100%;
1717
}
@@ -22,7 +22,7 @@
2222

2323
&.reversed {
2424
flex-direction: row-reverse;
25-
@media (max-width: $medium) {
25+
@media (max-width: vars.$medium) {
2626
flex-direction: column;
2727
}
2828
}
@@ -50,14 +50,14 @@
5050
font-size: 22px;
5151
}
5252

53-
@media (max-width: $medium) {
53+
@media (max-width: vars.$medium) {
5454
width: auto;
5555
margin: 25px auto;
5656
}
5757

5858
&.info {
5959
width: 50%;
60-
@media (max-width: $medium) {
60+
@media (max-width: vars.$medium) {
6161
width: auto;
6262
margin: 25px auto;
6363
}
@@ -67,7 +67,7 @@
6767

6868
.header-right {
6969
width: 50%;
70-
@media (max-width: $medium) {
70+
@media (max-width: vars.$medium) {
7171
width: auto;
7272
margin: 25px auto;
7373
}
@@ -76,7 +76,7 @@
7676
width: 310px;
7777
height: auto;
7878

79-
@media (max-width: $medium) {
79+
@media (max-width: vars.$medium) {
8080
width: 180px;
8181
}
8282

@@ -85,7 +85,7 @@
8585
&.info {
8686
display: flex;
8787
width: 55%;
88-
@media (max-width: $medium) {
88+
@media (max-width: vars.$medium) {
8989
width: auto;
9090
margin: 25px auto;
9191
}
@@ -99,7 +99,7 @@
9999
margin: 0 40px 0 0;
100100
}
101101

102-
@media (max-width: $medium) {
102+
@media (max-width: vars.$medium) {
103103
width: 180px;
104104
}
105105

0 commit comments

Comments
 (0)