Global spacing

This commit is contained in:
reverend 2020-08-23 11:35:47 +02:00
parent 1b57714c0e
commit d1b681d3c7
4 changed files with 72 additions and 0 deletions

View File

@ -0,0 +1,61 @@
@mixin RV-Spacing__Outer--small {
margin: $-spacing-small;
}
@mixin RV-Spacing__Outer--medium {
margin: $-spacing-medium;
}
@mixin RV-Spacing__Outer--large {
margin: $-spacing-large;
}
@mixin RV-Spacing__Inner--small {
padding: $-spacing-small;
gap: $-spacing-small;
}
@mixin RV-Spacing__Inner--medium {
padding: $-spacing-medium;
gap: $-spacing-medium;
}
@mixin RV-Spacing__Inner--large {
padding: $-spacing-large;
gap: $-spacing-large;
}
@mixin RV-Spacing {
&__Outer{
&--small {
@include RV-Spacing__Outer--small;
}
&--medium {
@include RV-Spacing__Outer--medium;
}
&--large {
@include RV-Spacing__Outer--large;
}
}
&__Inner{
&--small {
@include RV-Spacing__Inner--small;
}
&--medium {
@include RV-Spacing__Inner--medium;
}
&--large {
@include RV-Spacing__Inner--large;
}
}
}
.RV-Spacing {
@include RV-Spacing;
}

View File

@ -0,0 +1,5 @@
{
"context": {
}
}

View File

View File

@ -1,2 +1,8 @@
// Padding and Margin sizes
$-spacing-small: 10px;
$-spacing-medium: 25px;
$-spacing-large: 35px;
@import './pink.css'; @import './pink.css';
@import './components'; @import './components';