Skip to content

Instantly share code, notes, and snippets.

@erolj
Created July 11, 2020 10:01
Show Gist options
  • Save erolj/1cbd9d7fea9ebfbe91f29bb1a5796234 to your computer and use it in GitHub Desktop.
Save erolj/1cbd9d7fea9ebfbe91f29bb1a5796234 to your computer and use it in GitHub Desktop.
Belajar-Sass__Trik padding.
/* SCSS Code */
@mixin padding($name, $num, $unit) {
@if $name == "bottom" or $name == "b" {
.pb-#{$num} {
padding-bottom: $num + $unit;
}
}
@if $name == "top" or $name == "t" {
.pt-#{$num} {
padding-top: $num + $unit;
}
}
@if $name == "y" {
.py-#{$num} {
padding: {
top: $num + $unit;
bottom: $num + $unit;
}
}
}
}
@include padding(top, 6, rem);
@include padding(b, 6, rem);
@include padding(y, 6, px);
/* CSS Results */
pt-6 {
padding-top: 6rem;
}
pb-6 {
padding-bottom: 6rem;
}
py-6 {
padding-top: 6px;
padding-bottom: 6px;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment