~maas-committers/maas/trunk

« back to all changes in this revision

Viewing changes to src/maasserver/static/scss/maas/components/_spacing.scss

Adding all assets and new theme files

Show diffs side-by-side

added added

removed removed

Lines of Context:
1
 
////
2
 
/// @author       Web Team at Canonical Ltd
3
 
/// @link         http://ubuntudesign.github.io/vanilla-framework/docs/#mixin-vf-forms
4
 
/// @since        0.0.3
5
 
////
6
 
 
7
 
$base-spacing-unit: 20px !default;
8
 
 
9
 
/// Spacing
10
 
/// @group Spacing
11
 
@mixin maas-spacing {
12
 
  @include spacing(margin, $base-spacing-unit);
13
 
  @include spacing(padding, $base-spacing-unit);
14
 
}
15
 
 
16
 
@mixin spacing($spacing, $spacing-unit) {
17
 
  // scss-lint:disable ImportantRule
18
 
  $directions:                    top right bottom left;
19
 
  $sizes:                         (tiny: $spacing-unit / 4, small: $spacing-unit / 2, large: $spacing-unit * 2, huge: $spacing-unit * 4);
20
 
 
21
 
  .u-#{$spacing} {
22
 
    #{$spacing}: $spacing-unit;
23
 
 
24
 
    &--none {
25
 
      #{$spacing}: none !important;
26
 
    }
27
 
 
28
 
    @each $size, $division in $sizes {
29
 
      &--#{$size} {
30
 
        #{$spacing}: $division !important;
31
 
      }
32
 
    }
33
 
 
34
 
    @each $direction in $directions {
35
 
      &--#{$direction} {
36
 
        #{$spacing}-#{$direction}: $spacing-unit !important;
37
 
 
38
 
        &-none {
39
 
          #{$spacing}-#{$direction}: none !important;
40
 
        }
41
 
 
42
 
        @each $size, $division in $sizes {
43
 
          &-#{$size} {
44
 
            #{$spacing}-#{$direction}: $division !important;
45
 
          }
46
 
        }
47
 
      }
48
 
    }
49
 
  }
50
 
  // scss-lint:enable ImportantRule
51
 
}
52
 
 
53
 
@include maas-spacing;