utilities.transform/_utilities.transform.scss at master · iotacss/utilities.transform · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
//  Transform Utility


// Options

$iota-utils-transform                 : true;

$iota-utils-transform-namespace       : '' !default;
$iota-utils-transform-capitalize-name : 'capitalize' !default;
$iota-utils-transform-uppercase-name  : 'uppercase' !default;
$iota-utils-transform-lowercase-name  : 'lowercase' !default;

$iota-utils-transform-res             : false !default;
$iota-utils-transform-breakpoints     : $iota-global-breakpoints !default;


// Helper local variables

$iota-utils-transform-var-transform : $iota-global-utilities-namespace + $iota-utils-transform-namespace;


// Transform Utilities

.#{$iota-utils-transform-var-transform + $iota-utils-transform-capitalize-name} {
  text-transform: capitalize !important;
}

.#{$iota-utils-transform-var-transform + $iota-utils-transform-uppercase-name} {
  text-transform: uppercase !important;
}

.#{$iota-utils-transform-var-transform + $iota-utils-transform-lowercase-name} {
  text-transform: lowercase !important;
}


// Responsive Transform Utilities

@if ($iota-utils-transform-res == true) {

  @each $breakpoint-name, $breakpoint-size in $iota-utils-transform-breakpoints {

    @media #{$breakpoint-size} {

      .#{$iota-utils-transform-var-transform + $iota-utils-transform-capitalize-name + $iota-global-breakpoint-separator + $breakpoint-name} {
        text-transform: capitalize !important;
      }

      .#{$iota-utils-transform-var-transform + $iota-utils-transform-uppercase-name + $iota-global-breakpoint-separator + $breakpoint-name} {
        text-transform: uppercase !important;
      }

      .#{$iota-utils-transform-var-transform + $iota-utils-transform-lowercase-name + $iota-global-breakpoint-separator + $breakpoint-name} {
        text-transform: lowercase !important;
      }

    }

  }

}