Skip to content

Commit bb498c4

Browse files
frjofrjo
authored
Indent all scss files with 2 and not 4 spaces. (#4448)
1 parent f3a906e commit bb498c4

Some content is hidden

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

52 files changed

+3806
-3806
lines changed

‎.editorconfig

+1-1
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ indent_style = space
1010
insert_final_newline = true
1111
trim_trailing_whitespace = true
1212

13-
[*.{yml,yaml,js,json,css}]
13+
[*.{yml,yaml,js,json,css,scss}]
1414
indent_size = 2
1515

1616
[*.md]

‎hypha/static_src/sass/abstracts/_functions.scss

+25-25
Original file line numberDiff line numberDiff line change
@@ -9,41 +9,41 @@
99

1010
// Strip the unit from the given value and return the value
1111
@function strip-unit($value) {
12-
@return math.div($value, ($value * 0 + 1));
12+
@return math.div($value, ($value * 0 + 1));
1313
}
1414

1515
// Return an em unit based on the pixel value and context
1616
@function rem($px, $context: variables.$base-font-size) {
17-
@return #{strip-unit(math.div($px, strip-unit($context)))}rem;
17+
@return #{strip-unit(math.div($px, strip-unit($context)))}rem;
1818
}
1919

2020
// Returns the opposite direction of each direction in a list
2121
// @param {List} $directions - List of initial directions
2222
// @return {List} - List of opposite directions
2323
@function opposite-direction($directions) {
24-
$opposite-directions: ();
25-
$direction-map: (
26-
"top": "bottom",
27-
"right": "left",
28-
"bottom": "top",
29-
"left": "right",
30-
"center": "center",
31-
"ltr": "rtl",
32-
"rtl": "ltr",
33-
);
34-
35-
@each $direction in $directions {
36-
$direction: string.to-lower-case($direction);
37-
38-
@if map.has-key($direction-map, $direction) {
39-
$opposite-directions: list.append(
40-
$opposite-directions,
41-
string.unquote(map.get($direction-map, $direction))
42-
);
43-
} @else {
44-
@warn 'No opposite direction can be found for `#{$direction}`. Direction omitted.';
45-
}
24+
$opposite-directions: ();
25+
$direction-map: (
26+
"top": "bottom",
27+
"right": "left",
28+
"bottom": "top",
29+
"left": "right",
30+
"center": "center",
31+
"ltr": "rtl",
32+
"rtl": "ltr",
33+
);
34+
35+
@each $direction in $directions {
36+
$direction: string.to-lower-case($direction);
37+
38+
@if map.has-key($direction-map, $direction) {
39+
$opposite-directions: list.append(
40+
$opposite-directions,
41+
string.unquote(map.get($direction-map, $direction))
42+
);
43+
} @else {
44+
@warn 'No opposite direction can be found for `#{$direction}`. Direction omitted.';
4645
}
46+
}
4747

48-
@return $opposite-directions;
48+
@return $opposite-directions;
4949
}

‎hypha/static_src/sass/abstracts/_mixins.scss

+108-108
Original file line numberDiff line numberDiff line change
@@ -7,155 +7,155 @@
77

88
// Media queries
99
@mixin media-query($queries...) {
10-
@each $query in $queries {
11-
@each $breakpoint in variables.$breakpoints {
12-
$name: list.nth($breakpoint, 1);
13-
$declaration: list.nth($breakpoint, 2);
14-
15-
@if $query == $name and $declaration {
16-
@media only screen and #{$declaration} {
17-
@content;
18-
}
19-
}
10+
@each $query in $queries {
11+
@each $breakpoint in variables.$breakpoints {
12+
$name: list.nth($breakpoint, 1);
13+
$declaration: list.nth($breakpoint, 2);
14+
15+
@if $query == $name and $declaration {
16+
@media only screen and #{$declaration} {
17+
@content;
2018
}
19+
}
2120
}
21+
}
2222
}
2323

2424
// Button mixin
2525
@mixin button($bg, $hover-bg) {
26-
padding: 0.5em 2rem;
27-
font-weight: variables.$weight--bold;
28-
color: variables.$color--white;
29-
text-align: center;
30-
background: $bg;
31-
border: 1px solid variables.$color--white;
32-
transition: color, background, border, variables.$transition;
33-
display: flex;
34-
align-items: center;
35-
justify-content: center;
36-
37-
&:hover,
38-
&:focus,
39-
&:active {
40-
cursor: pointer;
41-
background: $hover-bg;
42-
}
26+
padding: 0.5em 2rem;
27+
font-weight: variables.$weight--bold;
28+
color: variables.$color--white;
29+
text-align: center;
30+
background: $bg;
31+
border: 1px solid variables.$color--white;
32+
transition: color, background, border, variables.$transition;
33+
display: flex;
34+
align-items: center;
35+
justify-content: center;
36+
37+
&:hover,
38+
&:focus,
39+
&:active {
40+
cursor: pointer;
41+
background: $hover-bg;
42+
}
4343
}
4444

4545
// Narrow button mixin
4646
@mixin button--narrow {
47-
padding: 0.25rem 0.75rem;
48-
font-size: 15px;
49-
vertical-align: middle;
47+
padding: 0.25rem 0.75rem;
48+
font-size: 15px;
49+
vertical-align: middle;
5050

51-
@include media-query(lg) {
52-
& {
53-
padding: 0.25rem 0.75rem;
54-
}
51+
@include media-query(lg) {
52+
& {
53+
padding: 0.25rem 0.75rem;
5554
}
55+
}
5656
}
5757

5858
// Small button mixin
5959
@mixin button--small {
60-
padding: 2px;
61-
font-size: 12px;
60+
padding: 2px;
61+
font-size: 12px;
6262

63-
@include media-query(lg) {
64-
& {
65-
padding: 3px 5px;
66-
}
63+
@include media-query(lg) {
64+
& {
65+
padding: 3px 5px;
6766
}
67+
}
6868
}
6969

7070
// Wide button mixin
7171
@mixin button--wide {
72-
@include media-query(lg) {
73-
& {
74-
padding: 0.5em 80px;
75-
}
72+
@include media-query(lg) {
73+
& {
74+
padding: 0.5em 80px;
7675
}
76+
}
7777
}
7878

7979
// Viewport sized typography mixin that takes a min and max pixel-based value
8080
@mixin responsive-font-sizes($min, $max) {
81-
$minbreakpoint: 640;
82-
$maxbreakpoint: 1280;
83-
$minsize: functions.strip-unit($min);
84-
$maxsize: functions.strip-unit($max);
85-
$minrem: functions.rem($min);
86-
$maxrem: functions.rem($max);
87-
$slope: math.div($maxsize - $minsize, $maxbreakpoint - $minbreakpoint);
88-
$intersection: functions.rem($minsize - $slope * $minbreakpoint);
89-
90-
font-size: clamp($minrem, calc($intersection + $slope * 100vw), $maxrem);
81+
$minbreakpoint: 640;
82+
$maxbreakpoint: 1280;
83+
$minsize: functions.strip-unit($min);
84+
$maxsize: functions.strip-unit($max);
85+
$minrem: functions.rem($min);
86+
$maxrem: functions.rem($max);
87+
$slope: math.div($maxsize - $minsize, $maxbreakpoint - $minbreakpoint);
88+
$intersection: functions.rem($minsize - $slope * $minbreakpoint);
89+
90+
font-size: clamp($minrem, calc($intersection + $slope * 100vw), $maxrem);
9191
}
9292

9393
// Triangle mixin
9494
// @param {Direction} $direction - Triangle direction, either `top`, `right`, `bottom` or `left`
9595
// @param {Color} $color [currentcolor] - Triangle color
9696
// @param {Length} $size [1em] - Triangle size
9797
@mixin triangle($direction, $color: currentcolor, $size: 0.33rem) {
98-
@if not list.index(top right bottom left, $direction) {
99-
@error 'Direction must be either `top`, `right`, `bottom` or `left`.';
100-
}
98+
@if not list.index(top right bottom left, $direction) {
99+
@error 'Direction must be either `top`, `right`, `bottom` or `left`.';
100+
}
101+
102+
width: 0;
103+
height: 0;
104+
content: "";
105+
border-#{functions.opposite-direction($direction)}: ($size * 1.5) solid
106+
$color;
107+
108+
$perpendicular-borders: $size solid transparent;
109+
110+
@if $direction == top or $direction == bottom {
111+
border-inline-end: $perpendicular-borders;
112+
border-inline-start: $perpendicular-borders;
113+
} @else if $direction == right or $direction == left {
114+
border-block-start: $perpendicular-borders;
115+
border-block-end: $perpendicular-borders;
116+
}
117+
}
101118

102-
width: 0;
103-
height: 0;
104-
content: "";
105-
border-#{functions.opposite-direction($direction)}: ($size * 1.5) solid
106-
$color;
119+
@mixin table-ordering-styles {
120+
thead {
121+
th {
122+
// ordering
123+
&.desc,
124+
&.asc {
125+
position: relative;
126+
color: variables.$color--dark-grey;
127+
128+
&::after {
129+
position: absolute;
130+
inset-block-start: 50%;
131+
margin-inline-start: 3px;
132+
}
107133

108-
$perpendicular-borders: $size solid transparent;
134+
a {
135+
color: inherit;
136+
}
137+
}
109138

110-
@if $direction == top or $direction == bottom {
111-
border-inline-end: $perpendicular-borders;
112-
border-inline-start: $perpendicular-borders;
113-
} @else if $direction == right or $direction == left {
114-
border-block-start: $perpendicular-borders;
115-
border-block-end: $perpendicular-borders;
116-
}
117-
}
139+
&.desc {
140+
&::after {
141+
@include triangle(top);
142+
}
143+
}
118144

119-
@mixin table-ordering-styles {
120-
thead {
121-
th {
122-
// ordering
123-
&.desc,
124-
&.asc {
125-
position: relative;
126-
color: variables.$color--dark-grey;
127-
128-
&::after {
129-
position: absolute;
130-
inset-block-start: 50%;
131-
margin-inline-start: 3px;
132-
}
133-
134-
a {
135-
color: inherit;
136-
}
137-
}
138-
139-
&.desc {
140-
&::after {
141-
@include triangle(top);
142-
}
143-
}
144-
145-
&.asc {
146-
&::after {
147-
@include triangle(bottom);
148-
}
149-
}
145+
&.asc {
146+
&::after {
147+
@include triangle(bottom);
150148
}
149+
}
151150
}
151+
}
152152
}
153153

154154
@mixin table-checkbox {
155-
input[type="checkbox"] {
156-
margin: 0 auto;
157-
display: block;
158-
width: 1.1rem;
159-
height: 1.1rem;
160-
}
155+
input[type="checkbox"] {
156+
margin: 0 auto;
157+
display: block;
158+
width: 1.1rem;
159+
height: 1.1rem;
160+
}
161161
}

‎hypha/static_src/sass/abstracts/_variables.scss

+5-5
Original file line numberDiff line numberDiff line change
@@ -96,9 +96,9 @@ $input-box-max-width: 465px;
9696

9797
// Breakpoints
9898
$breakpoints: (
99-
"sm" "(min-width: 640px)",
100-
"md" "(min-width: 768px)",
101-
"lg" "(min-width: 1024px)",
102-
"xl" "(min-width: 1280px)",
103-
"2xl" "(min-width: 1536px)"
99+
"sm" "(min-width: 640px)",
100+
"md" "(min-width: 768px)",
101+
"lg" "(min-width: 1024px)",
102+
"xl" "(min-width: 1280px)",
103+
"2xl" "(min-width: 1536px)"
104104
);

0 commit comments

Comments
 (0)