fix: scss uses logical properties

This commit is contained in:
drmason13 2024-08-31 10:28:35 +01:00
parent 6dc6489e69
commit f91ef15cef
21 changed files with 112 additions and 112 deletions

View file

@ -88,7 +88,7 @@
#{$parent-selector} [type="submit"],
#{$parent-selector} [type="reset"],
#{$parent-selector} [type="button"] {
margin-bottom: var(#{$css-var-prefix}spacing);
margin-block-end: var(#{$css-var-prefix}spacing);
}
// .secondary, .contrast & .outline

View file

@ -53,7 +53,7 @@
#{$parent-selector} pre {
display: block;
margin-bottom: var(#{$css-var-prefix}spacing);
margin-block-end: var(#{$css-var-prefix}spacing);
overflow-x: auto;
> code {

View file

@ -17,7 +17,7 @@
height: 0; // 2
margin: var(#{$css-var-prefix}typography-spacing-vertical) 0;
border: 0;
border-top: 1px solid var(#{$css-var-prefix}muted-border-color);
border-block-start: 1px solid var(#{$css-var-prefix}muted-border-color);
color: inherit; // 1
}

View file

@ -27,7 +27,7 @@
#{$parent-selector} th,
#{$parent-selector} td {
padding: calc(var(#{$css-var-prefix}spacing) / 2) var(#{$css-var-prefix}spacing);
border-bottom: var(#{$css-var-prefix}border-width)
border-block-end: var(#{$css-var-prefix}border-width)
solid
var(#{$css-var-prefix}table-border-color);
background-color: var(#{$css-var-prefix}background-color);
@ -41,10 +41,10 @@
#{$parent-selector} tfoot {
th,
td {
border-top: var(#{$css-var-prefix}border-width)
border-block-start: var(#{$css-var-prefix}border-width)
solid
var(#{$css-var-prefix}table-border-color);
border-bottom: 0;
border-block-end: 0;
}
}

View file

@ -43,8 +43,8 @@
#{$parent-selector} pre,
#{$parent-selector} table,
#{$parent-selector} ul {
margin-top: 0;
margin-bottom: var(#{$css-var-prefix}typography-spacing-vertical);
margin-block-start: 0;
margin-block-end: var(#{$css-var-prefix}typography-spacing-vertical);
color: var(#{$css-var-prefix}color);
font-style: normal;
font-weight: var(#{$css-var-prefix}font-weight);
@ -57,8 +57,8 @@
#{$parent-selector} h4,
#{$parent-selector} h5,
#{$parent-selector} h6 {
margin-top: 0;
margin-bottom: var(#{$css-var-prefix}typography-spacing-vertical);
margin-block-start: 0;
margin-block-end: var(#{$css-var-prefix}typography-spacing-vertical);
color: var(#{$css-var-prefix}color);
font-weight: var(#{$css-var-prefix}font-weight);
font-size: var(#{$css-var-prefix}font-size);
@ -89,22 +89,22 @@
#{$parent-selector}
:where(article, address, blockquote, dl, figure, form, ol, p, pre, table, ul) {
~ :is(h1, h2, h3, h4, h5, h6) {
margin-top: var(#{$css-var-prefix}typography-spacing-top);
margin-block-start: var(#{$css-var-prefix}typography-spacing-top);
}
}
// Paragraphs
#{$parent-selector} p {
margin-bottom: var(#{$css-var-prefix}typography-spacing-vertical);
margin-block-end: var(#{$css-var-prefix}typography-spacing-vertical);
}
// Heading group
#{$parent-selector} hgroup {
margin-bottom: var(#{$css-var-prefix}typography-spacing-vertical);
margin-block-end: var(#{$css-var-prefix}typography-spacing-vertical);
> * {
margin-top: 0;
margin-bottom: 0;
margin-block-start: 0;
margin-block-end: 0;
}
> *:not(:first-child):last-child {
@ -117,7 +117,7 @@
// Lists
#{$parent-selector} :where(ol, ul) {
li {
margin-bottom: calc(var(#{$css-var-prefix}typography-spacing-vertical) * 0.25);
margin-block-end: calc(var(#{$css-var-prefix}typography-spacing-vertical) * 0.25);
}
}
@ -125,7 +125,7 @@
// 1. Remove the margin on nested lists in Chrome, Edge, IE, and Safari
#{$parent-selector} :where(dl, ol, ul) :where(dl, ol, ul) {
margin: 0; // 1
margin-top: calc(var(#{$css-var-prefix}typography-spacing-vertical) * 0.25);
margin-block-start: calc(var(#{$css-var-prefix}typography-spacing-vertical) * 0.25);
}
#{$parent-selector} ul li {
@ -145,13 +145,13 @@
display: block;
margin: var(#{$css-var-prefix}typography-spacing-vertical) 0;
padding: var(#{$css-var-prefix}spacing);
border-right: none;
border-left: 0.25rem solid var(#{$css-var-prefix}blockquote-border-color);
border-inline-end: none;
border-inline-start: 0.25rem solid var(#{$css-var-prefix}blockquote-border-color);
border-inline-start: 0.25rem solid var(#{$css-var-prefix}blockquote-border-color);
border-inline-end: none;
footer {
margin-top: calc(var(#{$css-var-prefix}typography-spacing-vertical) * 0.5);
margin-block-start: calc(var(#{$css-var-prefix}typography-spacing-vertical) * 0.5);
color: var(#{$css-var-prefix}blockquote-footer-color);
}
}
@ -159,7 +159,7 @@
// Abbreviations
// 1. Remove underline decoration in Chrome, Edge, IE, Opera, and Safari
#{$parent-selector} abbr[title] {
border-bottom: 1px dotted;
border-block-end: 1px dotted;
text-decoration: none; // 1
cursor: help;
}