2021-01-13 18:58:23 -05:00

64 lines
1.1 KiB
SCSS

/* Features */
.features {
@include vendor('display', 'flex');
@include vendor('flex-wrap', 'wrap');
border-bottom: solid _size(border-width);
margin-bottom: (_size(element-margin));
> section {
@include padding(4.5em, 3em);
border-top: solid _size(border-width);
width: 50%;
.icon {
font-size: 2.5em;
margin-bottom: _size(element-margin);
}
h3 {
margin-bottom: (_size(element-margin) * 0.35);
}
&:nth-child(even) {
border-left-style: solid;
border-left-width: _size(border-width);
}
}
@include breakpoint('<=medium') {
> section {
@include padding(3em, 2em);
}
}
@include breakpoint('<=small') {
> section {
@include padding(2em, 2em);
}
}
@include breakpoint('<=xsmall') {
> section {
@include padding(2em, 1.5em);
width: 100%;
&:nth-child(even) {
border-left: 0;
}
}
}
}
@mixin color-features($p: null) {
.features {
border-color: _palette($p, border-bg);
> section {
border-color: _palette($p, border-bg);
}
}
}
@include color-features;