shido/src/less/utility-classes/padding.less

Build fast with Shido, a CSS framework for building custom designs without any annoying style or component you have to fight to override.

each(@breakpoints-min, .(@px, @breakpoint) {
  @media (min-width: @px) {
    each(range(0, @s-max-padding, @s-increment-mp), .(@loop) {
      @pad: @loop * 1px;

      .@{breakpoint}\:pad-bt-@{loop} {
        padding-bottom: @pad;
        padding-top: @pad;
      }
      .@{breakpoint}\:pad-lr-@{loop} {
        padding-left: @pad;
        padding-right: @pad;
      }
      .@{breakpoint}\:pad-bottom-@{loop} {
        padding-bottom: @pad;
      }
      .@{breakpoint}\:pad-left-@{loop} {
        padding-left: @pad;
      }
      .@{breakpoint}\:pad-right-@{loop} {
        padding-right: @pad;
      }
      .@{breakpoint}\:pad-top-@{loop} {
        padding-top: @pad;
      }
      .@{breakpoint}\:pad-all-@{loop} {
        padding-bottom: @pad;
        padding-left: @pad;
        padding-right: @pad;
        padding-top: @pad;
      }
    })
  }
})