Skip to content

Commit 4e85892

Browse files
iroybotlinioiroybotlinio
committed
chore: continued refactoring (block elements)
1 parent 561aac4 commit 4e85892

File tree

8 files changed

+54
-90
lines changed

8 files changed

+54
-90
lines changed

‎scss/block/_html.scss‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,4 @@
11
/** SASS for the <html> HTML element
2-
*
3-
* Found in scss/components/_loading.scss#10: `#{$parent-selector} [aria-busy="true"]:not(input, select, textarea, html, form) {`
42
*
53
* Add your styles here
6-
*/
4+
*/

‎scss/block/_inline-frame.scss‎

Lines changed: 15 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,21 @@
11
/** SASS for the <iframe> HTML element
22
*
3-
* Found in scss/content/_embedded.scss#15: `#{$parent-selector} :where(audio, canvas, iframe, img, svg, video) {`
43
* Found in scss/content/_embedded.scss#31: `// Remove the border on iframes in all browsers (opinionated)`
54
* Found in scss/content/_embedded.scss#32: `#{$parent-selector} :where(iframe) {`
65
*
76
* Add your styles here
8-
*/
7+
*/
8+
@use "sass:map";
9+
@use "../settings" as *;
10+
11+
@if map.get($modules, "content/embedded") {
12+
// Change the alignment on media elements in all browsers (opinionated)
13+
#{$parent-selector} :where(audio, canvas, iframe, img, svg, video) {
14+
vertical-align: middle;
15+
}
16+
17+
// Remove the border on iframes in all browsers (opinionated)
18+
#{$parent-selector} :where(iframe) {
19+
border-style: none;
20+
}
21+
}

‎scss/block/_inserted-text.scss‎

Lines changed: 10 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,13 @@
11
/** SASS for the <ins> HTML element
2-
*
3-
* Found in scss/components/_dropdown.scss#39: `// inside a nav`
4-
* Found in scss/components/_dropdown.scss#47: `// inside container type accordion`
5-
* Found in scss/components/_dropdown.scss#123: `// Dropdown inside a nav`
6-
* Found in scss/components/_dropdown.scss#237: `// inside container type accordion`
7-
* Found in scss/components/_dropdown.scss#260: `// inside container type accordion`
8-
* Found in scss/components/_dropdown.scss#269: `inset: 0;`
9-
* Found in scss/content/_embedded.scss#36: `// 1. Remove the border on images inside links in IE 10.`
10-
* Found in scss/content/_typography.scss#168: `#{$parent-selector} ins {`
11-
* Found in scss/content/_typography.scss#169: `color: var(#{$css-var-prefix}ins-color);`
12-
* Found in scss/forms/_basics.scss#455: `color: var(#{$css-var-prefix}ins-color);`
13-
* Found in scss/forms/_basics.scss#465: `// Styles for Input inside a label`
142
*
153
* Add your styles here
16-
*/
4+
*/
5+
@use "sass:map";
6+
@use "../settings" as *;
7+
8+
@if map.get($modules, "content/typography") {
9+
#{$parent-selector} ins {
10+
color: var(#{$css-var-prefix}ins-color);
11+
text-decoration: none;
12+
}
13+
}

‎scss/block/_legend.scss‎

Lines changed: 25 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,4 +6,28 @@
66
* Found in scss/forms/_basics.scss#144: `#{$parent-selector} fieldset legend {`
77
*
88
* Add your styles here
9-
*/
9+
*/
10+
@use "sass:map";
11+
@use "../settings" as *;
12+
13+
@if map.get($modules, "forms/basics") {
14+
// 1. Correct the text wrapping in Edge and IE
15+
// 2. Correct the color inheritance from `fieldset` elements in IE
16+
// 3. Remove the padding so developers are not caught out when they zero out
17+
// `fieldset` elements in all browsers
18+
#{$parent-selector} legend {
19+
max-width: 100%; // 1
20+
padding: 0; // 3
21+
color: inherit; // 2
22+
white-space: normal; // 1
23+
}
24+
25+
// Label & legend
26+
#{$parent-selector} fieldset legend {
27+
display: block;
28+
margin-bottom: calc(var(#{$css-var-prefix}spacing) * 0.375);
29+
color: var(#{$css-var-prefix}color);
30+
font-weight: var(#{$css-var-prefix}form-label-font-weight, var(#{$css-var-prefix}font-weight));
31+
margin-bottom: calc(var(#{$css-var-prefix}spacing) * 0.5);
32+
}
33+
}

‎scss/block/_list-item.scss‎

Lines changed: 1 addition & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -1,46 +1,5 @@
11
/** SASS for the <li> HTML element
22
*
3-
* Found in scss/colors/_index.scss#248: `$lime-950: #101203;`
4-
* Found in scss/colors/_index.scss#249: `$lime-900: #191d03;`
5-
* Found in scss/colors/_index.scss#250: `$lime-850: #202902;`
6-
* Found in scss/colors/_index.scss#251: `$lime-800: #273500;`
7-
* Found in scss/colors/_index.scss#252: `$lime-750: #304100;`
8-
* Found in scss/colors/_index.scss#253: `$lime-700: #394d00;`
9-
* Found in scss/colors/_index.scss#254: `$lime-650: #435a00;`
10-
* Found in scss/colors/_index.scss#255: `$lime-600: #4d6600;`
11-
* Found in scss/colors/_index.scss#256: `$lime-550: #577400;`
12-
* Found in scss/colors/_index.scss#257: `$lime-500: #628100;`
13-
* Found in scss/colors/_index.scss#258: `$lime-450: #6c8f00;`
14-
* Found in scss/colors/_index.scss#259: `$lime-400: #779c00;`
15-
* Found in scss/colors/_index.scss#260: `$lime-350: #82ab00;`
16-
* Found in scss/colors/_index.scss#261: `$lime-300: #8eb901;`
17-
* Found in scss/colors/_index.scss#262: `$lime-250: #99c801;`
18-
* Found in scss/colors/_index.scss#263: `$lime-200: #a5d601;`
19-
* Found in scss/colors/_index.scss#264: `$lime-150: #b2e51a;`
20-
* Found in scss/colors/_index.scss#265: `$lime-100: #c1f335;`
21-
* Found in scss/colors/_index.scss#266: `$lime-50: #defc85;`
22-
* Found in scss/colors/_index.scss#267: `$lime: $lime-200;`
23-
* Found in scss/colors/_index.scss#688: `lime: (`
24-
* Found in scss/colors/_index.scss#689: `950: $lime-950,`
25-
* Found in scss/colors/_index.scss#690: `900: $lime-900,`
26-
* Found in scss/colors/_index.scss#691: `850: $lime-850,`
27-
* Found in scss/colors/_index.scss#692: `800: $lime-800,`
28-
* Found in scss/colors/_index.scss#693: `750: $lime-750,`
29-
* Found in scss/colors/_index.scss#694: `700: $lime-700,`
30-
* Found in scss/colors/_index.scss#695: `650: $lime-650,`
31-
* Found in scss/colors/_index.scss#696: `600: $lime-600,`
32-
* Found in scss/colors/_index.scss#697: `550: $lime-550,`
33-
* Found in scss/colors/_index.scss#698: `500: $lime-500,`
34-
* Found in scss/colors/_index.scss#699: `450: $lime-450,`
35-
* Found in scss/colors/_index.scss#700: `400: $lime-400,`
36-
* Found in scss/colors/_index.scss#701: `350: $lime-350,`
37-
* Found in scss/colors/_index.scss#702: `300: $lime-300,`
38-
* Found in scss/colors/_index.scss#703: `250: $lime-250,`
39-
* Found in scss/colors/_index.scss#704: `200: $lime-200,`
40-
* Found in scss/colors/_index.scss#705: `150: $lime-150,`
41-
* Found in scss/colors/_index.scss#706: `100: $lime-100,`
42-
* Found in scss/colors/_index.scss#707: `50: $lime-50,`
43-
* Found in scss/colors/_index.scss#708: `main: $lime,`
443
* Found in scss/components/_accordion.scss#14: `line-height: 1rem;`
454
* Found in scss/components/_accordion.scss#15: `list-style-type: none;`
465
* Found in scss/components/_accordion.scss#35: `&::-moz-list-bullet {`
@@ -338,4 +297,4 @@
338297
* Found in scss/utilities/_reduce-motion.scss#15: `// 3. Remove timed scrolling behaviors when motion is reduced (opinionated)`
339298
*
340299
* Add your styles here
341-
*/
300+
*/

‎scss/content/_embedded.scss‎

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -21,11 +21,6 @@
2121
display: inline-block;
2222
}
2323

24-
// Remove the border on iframes in all browsers (opinionated)
25-
#{$parent-selector} :where(iframe) {
26-
border-style: none;
27-
}
28-
2924
// 1. Remove the border on images inside links in IE 10.
3025
// 2. Responsive by default
3126
#{$parent-selector} img {

‎scss/content/_typography.scss‎

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -67,12 +67,6 @@
6767
vertical-align: baseline;
6868
}
6969

70-
// Ins
71-
#{$parent-selector} ins {
72-
color: var(#{$css-var-prefix}ins-color);
73-
text-decoration: none;
74-
}
75-
7670
// selection
7771
#{$parent-selector} ::selection {
7872
background-color: var(#{$css-var-prefix}text-selection-color);

‎scss/forms/_basics.scss‎

Lines changed: 2 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -36,17 +36,6 @@
3636
text-transform: none;
3737
}
3838

39-
// 1. Correct the text wrapping in Edge and IE
40-
// 2. Correct the color inheritance from `fieldset` elements in IE
41-
// 3. Remove the padding so developers are not caught out when they zero out
42-
// `fieldset` elements in all browsers
43-
#{$parent-selector} legend {
44-
max-width: 100%; // 1
45-
padding: 0; // 3
46-
color: inherit; // 2
47-
white-space: normal; // 1
48-
}
49-
5039
// 1. Remove the default vertical scrollbar in IE
5140
#{$parent-selector} textarea {
5241
overflow: auto; // 1
@@ -123,19 +112,14 @@
123112
);
124113
}
125114

126-
// Label & legend
127-
#{$parent-selector} label,
128-
#{$parent-selector} fieldset legend {
115+
// Label
116+
#{$parent-selector} label {
129117
display: block;
130118
margin-bottom: calc(var(#{$css-var-prefix}spacing) * 0.375);
131119
color: var(#{$css-var-prefix}color);
132120
font-weight: var(#{$css-var-prefix}form-label-font-weight, var(#{$css-var-prefix}font-weight));
133121
}
134122

135-
#{$parent-selector} fieldset legend {
136-
margin-bottom: calc(var(#{$css-var-prefix}spacing) * 0.5);
137-
}
138-
139123
// Blocks, 100%
140124
#{$parent-selector} input:not([type="checkbox"], [type="radio"]),
141125
#{$parent-selector} button[type="submit"],

0 commit comments

Comments
 (0)