Skip to content

Instantly share code, notes, and snippets.

@0xadri

0xadri/SassMeister-input.scss

Created February 15, 2016 05:34
Show Gist options
  • Save 0xadri/a00fd6c009c09458439d to your computer and use it in GitHub Desktop.
Save 0xadri/a00fd6c009c09458439d to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. 0xadri created this gist Feb 15, 2016.
    29 changes: 29 additions & 0 deletions SassMeister-input.scss
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,29 @@
    // ----
    // libsass (v3.2.5)
    // ----

    @mixin padding($side, $size) {
    $padding-size : 0;
    @if $size == 'xs' { $padding-size : 5px; }
    @else if $size == 's' { $padding-size : 10px; }
    @else if $size == 'm' { $padding-size : 15px; }
    @else if $size == 'l' { $padding-size : 20px; }

    @if $side == 'all' {
    .padding--#{$size} {
    padding: $padding-size !important;
    }
    } @else {
    .padding-#{$side}--#{$size} {
    padding-#{$side}: $padding-size !important;
    }
    }
    }

    $sides-list: all top right bottom left;
    $sizes-list: none xs s m l;
    @each $current-side in $sides-list {
    @each $current-size in $sizes-list {
    @include padding($current-side,$current-size);
    }
    }
    99 changes: 99 additions & 0 deletions SassMeister-output.css
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,99 @@
    .padding--none {
    padding: 0 !important;
    }

    .padding--xs {
    padding: 5px !important;
    }

    .padding--s {
    padding: 10px !important;
    }

    .padding--m {
    padding: 15px !important;
    }

    .padding--l {
    padding: 20px !important;
    }

    .padding-top--none {
    padding-top: 0 !important;
    }

    .padding-top--xs {
    padding-top: 5px !important;
    }

    .padding-top--s {
    padding-top: 10px !important;
    }

    .padding-top--m {
    padding-top: 15px !important;
    }

    .padding-top--l {
    padding-top: 20px !important;
    }

    .padding-right--none {
    padding-right: 0 !important;
    }

    .padding-right--xs {
    padding-right: 5px !important;
    }

    .padding-right--s {
    padding-right: 10px !important;
    }

    .padding-right--m {
    padding-right: 15px !important;
    }

    .padding-right--l {
    padding-right: 20px !important;
    }

    .padding-bottom--none {
    padding-bottom: 0 !important;
    }

    .padding-bottom--xs {
    padding-bottom: 5px !important;
    }

    .padding-bottom--s {
    padding-bottom: 10px !important;
    }

    .padding-bottom--m {
    padding-bottom: 15px !important;
    }

    .padding-bottom--l {
    padding-bottom: 20px !important;
    }

    .padding-left--none {
    padding-left: 0 !important;
    }

    .padding-left--xs {
    padding-left: 5px !important;
    }

    .padding-left--s {
    padding-left: 10px !important;
    }

    .padding-left--m {
    padding-left: 15px !important;
    }

    .padding-left--l {
    padding-left: 20px !important;
    }