mirror of
https://github.com/danog/sass-site.git
synced 2024-11-26 20:14:53 +01:00
remove nesting for consistency
This commit is contained in:
parent
6ffe0933ba
commit
5d130b6143
@ -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,
|
||||
|
@ -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 {
|
||||
|
@ -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;
|
||||
|
@ -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 {
|
||||
|
@ -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);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -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 {
|
||||
|
@ -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;
|
||||
}
|
||||
}
|
||||
|
@ -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 {
|
||||
|
Loading…
Reference in New Issue
Block a user