remove nesting for consistency

This commit is contained in:
Stacy Kvernmo 2023-03-23 21:30:45 -05:00
parent 6ffe0933ba
commit 5d130b6143
8 changed files with 40 additions and 83 deletions

View File

@ -7,10 +7,8 @@
background: var(--alert-bg, var(--sl-color--highlight));
color: var(--sl-color--white);
font-size: var(--sl-font-size--small);
padding-bottom: var(--alert-padding-block, var(--sl-gutter--minus));
padding-top: var(--alert-padding-block, var(--sl-gutter--minus));
text-align: var(--alert-align, center);
p,

View File

@ -21,17 +21,13 @@
@include breakpoints.sl-breakpoint--large {
ul {
display: flex;
margin: {
right: var(--sl-gutter--half-negative);
left: var(--sl-gutter--half-negative);
}
margin-left: var(--sl-gutter--half-negative);
margin-right: var(--sl-gutter--half-negative);
}
li {
padding: {
right: var(--sl-gutter--half);
left: var(--sl-gutter--half);
}
padding-left: var(--sl-gutter--half);
padding-right: var(--sl-gutter--half);
}
}
}
@ -118,10 +114,8 @@
}
.sl-c-description-list--horizontal {
margin: {
right: var(--sl-gutter--negative);
left: var(--sl-gutter--negative);
}
margin-left: var(--sl-gutter--negative);
margin-right: var(--sl-gutter--negative);
&,
> div {

View File

@ -22,10 +22,7 @@
&-responsive {
margin-bottom: var(--sl-gutter--sesqui);
width: 100%;
overflow: {
x: auto;
y: hidden;
}
overflow: auto hidden;
table {
margin-bottom: 0;

View File

@ -2,22 +2,15 @@
@use '../functions';
.sl-l-container {
margin: {
right: auto;
left: auto;
}
padding: {
right: var(--sl-gutter);
left: var(--sl-gutter);
}
margin-left: auto;
margin-right: auto;
max-width: functions.sl-px-to-rem(1920px);
padding-left: var(--sl-gutter);
padding-right: var(--sl-gutter);
@include breakpoints.sl-breakpoint--small {
padding: {
right: var(--sl-gutter--double);
left: var(--sl-gutter--double);
}
padding-left: var(--sl-gutter--double);
padding-right: var(--sl-gutter--double);
}
&--small {

View File

@ -122,43 +122,31 @@
}
&--gutters {
margin: {
right: var(--sl-gutter--negative);
left: var(--sl-gutter--negative);
}
margin-left: var(--sl-gutter--negative);
margin-right: var(--sl-gutter--negative);
> .sl-l-grid__column {
padding: {
right: var(--sl-gutter);
left: var(--sl-gutter);
}
padding-left: var(--sl-gutter);
padding-right: var(--sl-gutter);
}
&-large {
margin: {
right: var(--sl-gutter--double-negative);
left: var(--sl-gutter--double-negative);
}
margin-left: var(--sl-gutter--double-negative);
margin-right: var(--sl-gutter--double-negative);
> .sl-l-grid__column {
padding: {
right: var(--sl-gutter--double);
left: var(--sl-gutter--double);
}
padding-left: var(--sl-gutter--double);
padding-right: var(--sl-gutter--double);
}
}
&-small {
margin: {
right: var(--sl-gutter--half-negative);
left: var(--sl-gutter--half-negative);
}
margin-left: var(--sl-gutter--half-negative);
margin-right: var(--sl-gutter--half-negative);
> .sl-l-grid__column {
padding: {
right: var(--sl-gutter--half);
left: var(--sl-gutter--half);
}
padding-left: var(--sl-gutter--half);
padding-right: var(--sl-gutter--half);
}
}
}

View File

@ -21,19 +21,15 @@
&__body {
flex: 1 0 auto;
flex-direction: row;
margin: {
right: var(--sl-gutter--double-negative);
left: var(--sl-gutter--double-negative);
}
margin-left: var(--sl-gutter--double-negative);
margin-right: var(--sl-gutter--double-negative);
}
&__main,
&__navigation,
&__complementary {
padding: {
right: var(--sl-gutter--double);
left: var(--sl-gutter--double);
}
padding-left: var(--sl-gutter--double);
padding-right: var(--sl-gutter--double);
}
&__main {

View File

@ -1,18 +1,14 @@
.sl-l-section {
margin: {
top: var(--sl-gutter--triple);
bottom: var(--sl-gutter--triple);
}
padding: {
top: var(--sl-gutter--triple);
bottom: var(--sl-gutter--triple);
}
margin-bottom: var(--section-bottom-margin, var(--sl-gutter--triple));
margin-top: var(--section-top-margin, var(--sl-gutter--triple));
padding-bottom: var(--sl-gutter--triple);
padding-top: var(--sl-gutter--triple);
&:first-child {
margin-top: 0;
--section-top-margin: 0;
}
&:last-child {
margin-bottom: 0;
--section-bottom-margin: 0;
}
}

View File

@ -213,20 +213,15 @@ pre {
img {
display: block;
margin: {
right: auto;
left: auto;
}
max-width: 100%;
height: auto;
margin-left: auto;
margin-right: auto;
max-width: 100%;
}
hr {
margin: {
top: var(--sl-gutter--triple);
bottom: var(--sl-gutter--triple);
}
margin-bottom: var(--sl-gutter--triple);
margin-top: var(--sl-gutter--triple);
}
dd {