ionic/src/util/mixins.scss at feature/material-inputs · CssFormWork/ionic · 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

// Appearance
// --------------------------------------------------

@mixin appearance($val) {
  -webkit-appearance: $val;
  -moz-appearance: $val;
}


// Calc
// --------------------------------------------------

@mixin calc($property, $expression) {
  #{$property}: -webkit-calc(#{$expression});
  #{$property}: calc(#{$expression});
}


// Input Placeholder
// --------------------------------------------------

@mixin placeholder($color: #999, $text-indent: 0) {
  &::-moz-placeholder { // Firefox 19+
    color: $color;
  }

  &:-ms-input-placeholder {
    color: $color;
  }

  &::-webkit-input-placeholder {
    // Safari placeholder margin issue
    text-indent: $text-indent;
    color: $color;
  }
}


// SVG Background Image Mixin
// --------------------------------------------------

@mixin svg-background-image($svg) {
  $url: url-encode($svg);
  background-image: url("data:image/svg+xml;charset=utf-8,#{$url}");
}


// User Select None
// --------------------------------------------------

@mixin user-select-none() {
  user-select: none;
}