Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- /**
- space
- -----
- Spacing between elements as multiple of 5
- **/
- //.font-size-10, .font-size-36
- $fontamounts: (
- 8,
- 9,
- 10,
- 11,
- 12,
- 13,
- 14,
- 16,
- 18,
- 20,
- 24,
- 28,
- 36
- ); // Adjust this to include the pixel amounts you need.
- @each $fontsize in $fontamounts {
- .font-size-#{$fontsize} {
- font-size: #{$fontsize}px;
- }
- }
- // .padding-0 , .padding-1, .padding-3 ... .padding-50, .margin-0, .margin-1,...., .margin-50
- $spaceamounts: (
- 0,
- 5,
- 10,
- 15,
- 20,
- 25,
- 30,
- 35,
- 40,
- 45,
- 50,
- 60,
- 75,
- 100,
- 125,
- 150,
- 175,
- 200
- ); // Adjust this to include the pixel amounts you need.
- @each $space in $spaceamounts {
- .margin-#{$space} {
- margin: #{$space}px !important;
- }
- .margin-t-#{$space} {
- margin-top: #{$space}px !important;
- }
- .margin-b-#{$space} {
- margin-bottom: #{$space}px !important;
- }
- .padding-#{$space} {
- padding: #{$space}px !important;
- }
- .padding-x-#{$space} {
- padding-right: #{$space}px !important;
- padding-left: #{$space}px !important;
- }
- .padding-y-#{$space} {
- padding-top: #{$space}px !important;
- padding-bottom: #{$space}px !important;
- }
- .padding-t-#{$space} {
- padding-top: #{$space}px !important;
- }
- .padding-b-#{$space} {
- padding-bottom: #{$space}px !important;
- }
- .padding-l-#{$space} {
- padding-left: #{$space}px !important;
- }
- .padding-r-#{$space} {
- padding-right: #{$space}px !important;
- }
- .gap-#{$space} {
- height: #{$space}px !important;
- clear: both;
- }
- }
- $radiusamounts: (0, 2, 4, 8, 16); // Adjust this to include the pixel amounts you need.
- @each $radius in $radiusamounts {
- .r-#{$radius} {
- border-radius: #{$radius}px !important;
- }
- }
- .pointer {
- cursor: pointer;
- }
- .display-contents {
- display: contents !important;
- }
Add Comment
Please, Sign In to add comment