Skip to content

Commit 0c11857

Browse files
refactor: Sass migration (#227)
I migrated Sass (the CSS extension) to a newer version that uses the updated file import rules and introduces namespaces. The old version was deprecated and generated a lot of warnings in the console. Due to warnings, I also updated the usage of the `end` option to the recommended `flex-end`.
1 parent 4b50376 commit 0c11857

File tree

20 files changed

+117
-117
lines changed

20 files changed

+117
-117
lines changed

frontend/app/dataTableView/DataTableView.module.scss

Lines changed: 14 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
1-
@import "@/src/colors.module.scss";
1+
@use "../../src/colors.module.scss";
22

33
.selectDropdown{
44
background: transparent;
5-
color: $main-color;
6-
border: 1px $main-color solid;
5+
color: colors.$main-color;
6+
border: 1px colors.$main-color solid;
77
border-radius: 5px;
88
height: 30px;
99
padding: 0rem 0.5rem;
@@ -14,26 +14,26 @@
1414
}
1515

1616
.languageSelected{
17-
border: 1px $main-color solid;
18-
color: $main-color;
17+
border: 1px colors.$main-color solid;
18+
color: colors.$main-color;
1919
border-radius: 5px;
2020
padding: 0.25rem 0.5rem;
2121

2222
:hover{
2323
cursor: pointer;
24-
background: $main-color-dimmed;;
24+
background: colors.$main-color-dimmed;;
2525
}
2626
}
2727

2828
.languageNotSelected{
29-
border: 1px $main-color-dimmed solid;
30-
color: $main-color-dimmed;
29+
border: 1px colors.$main-color-dimmed solid;
30+
color: colors.$main-color-dimmed;
3131
border-radius: 5px;
3232
padding: 0.25rem 0.5rem;
3333

3434
:hover{
3535
cursor: pointer;
36-
background: $main-color-dimmed;
36+
background: colors.$main-color-dimmed;
3737
}
3838
}
3939

@@ -63,9 +63,9 @@
6363

6464
.pageSelector{
6565
border: none;
66-
border: 1px $main-color solid;
66+
border: 1px colors.$main-color solid;
6767
background: transparent;
68-
color: $main-color;
68+
color: colors.$main-color;
6969
border-radius: 5px;
7070
height: 30px;
7171
padding: 0 0.5rem;
@@ -74,7 +74,7 @@
7474

7575
.metricsTable{
7676
max-width: 100%;
77-
border: 1px solid $main-borders-color;
77+
border: 1px solid colors.$main-borders-color;
7878
border-collapse: collapse;
7979
}
8080

@@ -84,13 +84,13 @@
8484
}
8585

8686
.cell{
87-
border-left: 1px solid $main-borders-color;
87+
border-left: 1px solid colors.$main-borders-color;
8888
padding: 0.25rem;
8989
max-width: 14%;
9090
}
9191

9292
.rowHeader{
93-
border-left: 1px solid $main-borders-color;
93+
border-left: 1px solid colors.$main-borders-color;
9494
}
9595

9696
.refreshOptions{

frontend/app/home/home.module.scss

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

33
.coordinators {
44
ul {

frontend/app/logs/flower/Flower.module.scss

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
1-
@import "@/src/colors.module.scss";
1+
@use "../../../src/colors.module.scss";
22

33
.refreshButton {
44
background: none;
5-
color: $main-color;
6-
border: 1px $main-color solid;
5+
color: colors.$main-color;
6+
border: 1px colors.$main-color solid;
77
width: 30px;
88
height: 30px;
99
min-width: 30px;
@@ -19,14 +19,14 @@
1919
}
2020

2121
&:hover {
22-
background: $button-super-light;
22+
background: colors.$button-super-light;
2323
}
2424
}
2525

2626
.selectDropdown{
2727
background: transparent;
28-
color: $main-color;
29-
border: 1px $main-color solid;
28+
color: colors.$main-color;
29+
border: 1px colors.$main-color solid;
3030
border-radius: 5px;
3131
height: 30px;
3232
padding: 0rem 0.5rem;
@@ -46,7 +46,7 @@
4646

4747
.logsTable{
4848
max-width: 100%;
49-
border: 1px solid $main-borders-color;
49+
border: 1px solid colors.$main-borders-color;
5050
border-collapse: collapse;
5151
}
5252

@@ -56,13 +56,13 @@
5656
}
5757

5858
.cell{
59-
border-left: 1px solid $main-borders-color;
59+
border-left: 1px solid colors.$main-borders-color;
6060
padding: 0.25rem;
6161
max-width: 14%;
6262
}
6363

6464
.rowHeader{
65-
border-left: 1px solid $main-borders-color;
65+
border-left: 1px solid colors.$main-borders-color;
6666
padding: 0.1rem;
6767
}
6868

frontend/app/presentationMode/PresentationMode.module.scss

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

33
.fullscreenWrapper {
44
position: relative;
@@ -11,8 +11,8 @@
1111

1212
.optionsRow .saveButton{
1313
background: transparent;
14-
color: $main-color;
15-
border: 1px $main-color solid;
14+
color: colors.$main-color;
15+
border: 1px colors.$main-color solid;
1616
padding: 0.5rem 1rem;
1717
width: max-content;
1818
height: 30px;
@@ -21,8 +21,8 @@
2121

2222
.selectDropdown{
2323
background: transparent;
24-
color: $main-color;
25-
border: 1px $main-color solid;
24+
color: colors.$main-color;
25+
border: 1px colors.$main-color solid;
2626
border-radius: 5px;
2727
height: 30px;
2828
padding: 0rem 0.5rem;

frontend/app/services/django/Django.module.scss

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

33
.list{
44
line-height: 1.6;
@@ -8,12 +8,12 @@
88
display: grid;
99
grid-template-columns: auto 1fr;
1010
grid-column-gap: 0.5rem;
11-
border-left: 1px solid $main-borders-color;
11+
border-left: 1px solid colors.$main-borders-color;
1212
padding-left: 0.5rem;
1313
}
1414

1515
.errorMessage{
16-
color: $error;
16+
color: colors.$error;
1717
margin-top: 2rem;
1818
margin-bottom: 2rem;
1919
}

frontend/app/services/flower/Flower.module.scss

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,17 @@
1-
@import "@/src/colors.module.scss";
1+
@use "../../../src/colors.module.scss";
22

33
.list{
44
line-height: 1.5;
55
list-style: none;
66
}
77

88
.subObject{
9-
border-left: 1px solid $main-borders-color;
9+
border-left: 1px solid colors.$main-borders-color;
1010
padding-left: 1.5rem;
1111
}
1212

1313
.errorMessage{
14-
color: $error;
14+
color: colors.$error;
1515
margin-top: 2rem;
1616
margin-bottom: 2rem;
1717
}
@@ -23,8 +23,8 @@
2323

2424
.selectDropdown{
2525
background: transparent;
26-
color: $main-color;
27-
border: 1px $main-color solid;
26+
color: colors.$main-color;
27+
border: 1px colors.$main-color solid;
2828
border-radius: 5px;
2929
height: 30px;
3030
padding: 0rem 0.5rem;
@@ -38,7 +38,7 @@
3838
display: flex;
3939
justify-content: flex-start;
4040
align-items: center;
41-
border: 1px solid $main-borders-color;
41+
border: 1px solid colors.$main-borders-color;
4242
border-radius: 1rem;
4343
gap: 1rem;
4444
padding: 0.5rem;

frontend/app/users/user.module.scss

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
@import '@/src/colors.module.scss';
1+
@use '../../src/colors.module.scss';
22

33
.personIcon{
44
display: flex;
@@ -23,7 +23,7 @@
2323
align-items: center;
2424

2525
svg{
26-
color: $confirm;
26+
color: colors.$confirm;
2727
width: 1.5rem;
2828
height: 1.5rem;
2929
}
@@ -34,7 +34,7 @@
3434
align-items: center;
3535

3636
svg{
37-
color: $error;
37+
color: colors.$error;
3838
width: 1.5rem;
3939
height: 1.5rem;
4040
}

frontend/app/users/users.module.scss

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
1-
@import '@/src/colors.module.scss';
1+
@use '../../src/colors.module.scss';
22

33
.usersWrapper {
44
.actionsRow{
55
.pageSelector{
66
border: none;
7-
border: 1px $main-color solid;
7+
border: 1px colors.$main-color solid;
88
background: transparent;
9-
color: $main-color;
9+
color: colors.$main-color;
1010
border-radius: 5px;
1111
height: 30px;
1212
padding: 0 0.5rem;
@@ -15,7 +15,7 @@
1515
}
1616

1717
.errorMessage{
18-
color: $error;
18+
color: colors.$error;
1919
margin-top: 2rem;
2020
margin-bottom: 2rem;
2121
}

frontend/src/App.module.scss

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
1-
@import "colors.module";
1+
@use "colors.module";
22
.App {
33
display: flex;
44
flex-direction: column;
55
width: 100vw;
66
height: 100vh;
7-
background: $background-color;
8-
color: $button-font-color;
7+
background: colors.$background-color;
8+
color: colors.$button-font-color;
99
}
1010

1111
.ContentNav {
@@ -26,16 +26,16 @@
2626
&::-webkit-scrollbar {
2727
width: 8px;
2828
border-radius: 3px;
29-
background: $background-color;
29+
background: colors.$background-color;
3030
}
3131

3232
&::-webkit-scrollbar-thumb {
33-
background: $main-borders-color;
33+
background: colors.$main-borders-color;
3434
border-radius: 4px;
3535
}
3636

3737
&::-webkit-scrollbar-thumb:hover {
38-
background: $frege-color;
38+
background: colors.$frege-color;
3939
}
4040
}
4141

frontend/src/components/FullScreenDashboards/FullscreenDashboards.module.scss

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

33
.widgetsGridWrapper{
44
width: 100%;
@@ -12,12 +12,12 @@
1212
border: none;
1313

1414
path {
15-
color: $hub-color;
15+
color: colors.$hub-color;
1616
}
1717
}
1818

1919
.widget {
20-
background: $widget-color;
20+
background: colors.$widget-color;
2121
display: flex;
2222
flex-direction: column;
2323
align-items: center;

0 commit comments

Comments
 (0)