Commit 175b04754c28dbb7e6d51553697f3a203934447a

Authored by Igor Kulikov
Committed by GitHub
2 parents 1c0c78b4 36ce6b8b

Merge pull request #1074 from tagliala/add-autoprefixer

Add autoprefixer
@@ -251,7 +251,7 @@ @@ -251,7 +251,7 @@
251 "fill", 251 "fill",
252 "stroke" 252 "stroke"
253 ], 253 ],
254 - "property-no-vendor-prefix": null, 254 + "property-no-vendor-prefix": true,
255 "rule-empty-line-before": ["always", { 255 "rule-empty-line-before": ["always", {
256 "except": ["first-nested"], 256 "except": ["first-nested"],
257 "ignore": ["after-comment"] 257 "ignore": ["after-comment"]
@@ -272,7 +272,7 @@ @@ -272,7 +272,7 @@
272 "selector-max-type": 5, 272 "selector-max-type": 5,
273 "selector-max-universal": 1, 273 "selector-max-universal": 1,
274 "selector-no-qualifying-type": null, 274 "selector-no-qualifying-type": null,
275 - "selector-no-vendor-prefix": null, 275 + "selector-no-vendor-prefix": true,
276 "selector-type-no-unknown": [true, { 276 "selector-type-no-unknown": [true, {
277 "ignoreTypes": [ 277 "ignoreTypes": [
278 "/^md-/", 278 "/^md-/",
@@ -287,6 +287,6 @@ @@ -287,6 +287,6 @@
287 "value-list-comma-newline-after": "always-multi-line", 287 "value-list-comma-newline-after": "always-multi-line",
288 "value-list-comma-newline-before": "never-multi-line", 288 "value-list-comma-newline-before": "never-multi-line",
289 "value-list-comma-space-after": "always-single-line", 289 "value-list-comma-space-after": "always-single-line",
290 - "value-no-vendor-prefix": null 290 + "value-no-vendor-prefix": true
291 } 291 }
292 } 292 }
@@ -119,7 +119,7 @@ @@ -119,7 +119,7 @@
119 "ng-annotate-loader": "^0.1.1", 119 "ng-annotate-loader": "^0.1.1",
120 "ngtemplate-loader": "^1.3.1", 120 "ngtemplate-loader": "^1.3.1",
121 "node-sass": "^4.5.3", 121 "node-sass": "^4.5.3",
122 - "postcss-loader": "^0.13.0", 122 + "postcss-loader": "^3.0.0",
123 "raw-loader": "^0.5.1", 123 "raw-loader": "^0.5.1",
124 "react-hot-loader": "^3.0.0-beta.6", 124 "react-hot-loader": "^3.0.0-beta.6",
125 "sass-loader": "^4.0.2", 125 "sass-loader": "^4.0.2",
@@ -145,5 +145,19 @@ @@ -145,5 +145,19 @@
145 "node_modules", 145 "node_modules",
146 "target" 146 "target"
147 ] 147 ]
  148 + },
  149 + "browserslist": [
  150 + "> 0.5%",
  151 + "last 2 versions",
  152 + "Firefox ESR",
  153 + "not ie <= 10",
  154 + "not ie_mob <= 10",
  155 + "not bb <= 10",
  156 + "not op_mob <= 12.1"
  157 + ],
  158 + "postcss": {
  159 + "plugins": {
  160 + "autoprefixer": true
  161 + }
148 } 162 }
149 } 163 }
@@ -22,7 +22,7 @@ div.tb-widget { @@ -22,7 +22,7 @@ div.tb-widget {
22 overflow: hidden; 22 overflow: hidden;
23 outline: none; 23 outline: none;
24 24
25 - @include transition(all .2s ease-in-out); 25 + transition: all .2s ease-in-out;
26 26
27 .tb-widget-title { 27 .tb-widget-title {
28 max-height: 60px; 28 max-height: 60px;
@@ -99,7 +99,7 @@ md-content.tb-dashboard-content { @@ -99,7 +99,7 @@ md-content.tb-dashboard-content {
99 outline: none; 99 outline: none;
100 100
101 .gridster-item { 101 .gridster-item {
102 - @include transition(none); 102 + transition: none;
103 } 103 }
104 } 104 }
105 105
@@ -20,7 +20,7 @@ @@ -20,7 +20,7 @@
20 } 20 }
21 21
22 .tb-card-item { 22 .tb-card-item {
23 - @include transition(all .2s ease-in-out); 23 + transition: all .2s ease-in-out;
24 24
25 md-card-content { 25 md-card-content {
26 max-height: 53px; 26 max-height: 53px;
@@ -46,7 +46,7 @@ @@ -46,7 +46,7 @@
46 .tb-current-item { 46 .tb-current-item {
47 opacity: .5; 47 opacity: .5;
48 48
49 - @include transform(scale(1.05)); 49 + transform: scale(1.05);
50 } 50 }
51 51
52 #tb-vertical-container { 52 #tb-vertical-container {
@@ -16,7 +16,7 @@ @@ -16,7 +16,7 @@
16 @import "~compass-sass-mixins/lib/compass"; 16 @import "~compass-sass-mixins/lib/compass";
17 17
18 .md-button-toggle .md-toggle-icon.tb-toggled { 18 .md-button-toggle .md-toggle-icon.tb-toggled {
19 - @include transform(rotateZ(180deg)); 19 + transform: rotateZ(180deg);
20 } 20 }
21 21
22 .tb-menu-toggle-list.ng-hide { 22 .tb-menu-toggle-list.ng-hide {
@@ -28,7 +28,7 @@ @@ -28,7 +28,7 @@
28 z-index: 1; 28 z-index: 1;
29 overflow: hidden; 29 overflow: hidden;
30 30
31 - @include transition(.75s cubic-bezier(.35, 0, .25, 1)); 31 + transition: .75s cubic-bezier(.35, 0, .25, 1);
32 32
33 - @include transition-property(height); 33 + transition-property: height;
34 } 34 }
@@ -28,7 +28,7 @@ $input-label-float-scale: .75 !default; @@ -28,7 +28,7 @@ $input-label-float-scale: .75 !default;
28 line-height: 12px; 28 line-height: 12px;
29 color: rgb(244, 67, 54); 29 color: rgb(244, 67, 54);
30 30
31 - @include transition(all 450ms cubic-bezier(.23, 1, .32, 1) 0ms); 31 + transition: all 450ms cubic-bezier(.23, 1, .32, 1) 0ms;
32 } 32 }
33 33
34 .tb-container { 34 .tb-container {
@@ -77,13 +77,12 @@ label.tb-label { @@ -77,13 +77,12 @@ label.tb-label {
77 bottom: 100%; 77 bottom: 100%;
78 left: 0; 78 left: 0;
79 color: rgba(0, 0, 0, .54); 79 color: rgba(0, 0, 0, .54);
80 - transform-origin: left top;  
81 - -webkit-font-smoothing: antialiased;  
82 80
83 - @include transform(translate3d(0, $input-label-float-offset, 0) scale($input-label-float-scale)); 81 + transition: transform $swift-ease-out-timing-function $swift-ease-out-duration, width $swift-ease-out-timing-function $swift-ease-out-duration;
84 82
85 - @include transition(transform $swift-ease-out-timing-function $swift-ease-out-duration,  
86 - width $swift-ease-out-timing-function $swift-ease-out-duration); 83 + transform: translate3d(0, $input-label-float-offset, 0) scale($input-label-float-scale);
  84 + transform-origin: left top;
  85 + -webkit-font-smoothing: antialiased;
87 86
88 &.tb-focused { 87 &.tb-focused {
89 color: rgb(96, 125, 139); 88 color: rgb(96, 125, 139);
@@ -53,7 +53,7 @@ @@ -53,7 +53,7 @@
53 margin: auto 0 auto auto; 53 margin: auto 0 auto auto;
54 background-size: 100% auto; 54 background-size: 100% auto;
55 55
56 - @include transition(transform .3s, ease-in-out); 56 + transition: transform .3s, ease-in-out;
57 } 57 }
58 58
59 .tb-side-menu .md-button { 59 .tb-side-menu .md-button {
@@ -16,12 +16,12 @@ @@ -16,12 +16,12 @@
16 16
17 .tb-dashboard-assigned-customers { 17 .tb-dashboard-assigned-customers {
18 display: block; 18 display: block;
19 - display: -webkit-box; 19 + display: -webkit-box; /* stylelint-disable-line value-no-vendor-prefix */
20 height: 34px; 20 height: 34px;
21 margin-bottom: 4px; 21 margin-bottom: 4px;
22 overflow: hidden; 22 overflow: hidden;
23 text-overflow: ellipsis; 23 text-overflow: ellipsis;
24 -webkit-line-clamp: 2; 24 -webkit-line-clamp: 2;
25 - -webkit-box-orient: vertical; 25 + -webkit-box-orient: vertical; /* stylelint-disable-line property-no-vendor-prefix */
26 } 26 }
27 27
@@ -31,7 +31,7 @@ tb-dashboard-toolbar { @@ -31,7 +31,7 @@ tb-dashboard-toolbar {
31 &.md-fab { 31 &.md-fab {
32 opacity: 1; 32 opacity: 1;
33 33
34 - @include transition(opacity .3s cubic-bezier(.55,0,.55,.2)); 34 + transition: opacity .3s cubic-bezier(.55, 0, .55, .2);
35 35
36 .md-fab-toolbar-background { 36 .md-fab-toolbar-background {
37 background-color: $primary-default !important; 37 background-color: $primary-default !important;
@@ -50,7 +50,7 @@ tb-dashboard-toolbar { @@ -50,7 +50,7 @@ tb-dashboard-toolbar {
50 line-height: 36px; 50 line-height: 36px;
51 opacity: .5; 51 opacity: .5;
52 52
53 - @include transition(opacity .3s cubic-bezier(.55,0,.55,.2) .2s); 53 + transition: opacity .3s cubic-bezier(.55, 0, .55, .2) .2s;
54 54
55 md-icon { 55 md-icon {
56 position: absolute; 56 position: absolute;
@@ -75,13 +75,13 @@ section.tb-dashboard-toolbar { @@ -75,13 +75,13 @@ section.tb-dashboard-toolbar {
75 75
76 &.tb-dashboard-toolbar-opened { 76 &.tb-dashboard-toolbar-opened {
77 right: 0; 77 right: 0;
78 - // @include transition(right .3s cubic-bezier(.55,0,.55,.2)); 78 + // transition: right .3s cubic-bezier(.55, 0, .55, .2);
79 } 79 }
80 80
81 &.tb-dashboard-toolbar-closed { 81 &.tb-dashboard-toolbar-closed {
82 right: 18px; 82 right: 18px;
83 83
84 - @include transition(right .3s cubic-bezier(.55,0,.55,.2) .2s); 84 + transition: right .3s cubic-bezier(.55, 0, .55, .2) .2s;
85 } 85 }
86 } 86 }
87 87
@@ -102,14 +102,14 @@ section.tb-dashboard-toolbar { @@ -102,14 +102,14 @@ section.tb-dashboard-toolbar {
102 margin-top: $toolbar-height; 102 margin-top: $toolbar-height;
103 } 103 }
104 104
105 - @include transition(margin-top .3s cubic-bezier(.55,0,.55,.2)); 105 + transition: margin-top .3s cubic-bezier(.55, 0, .55, .2);
106 } 106 }
107 } 107 }
108 108
109 &.tb-dashboard-toolbar-closed { 109 &.tb-dashboard-toolbar-closed {
110 margin-top: 0; 110 margin-top: 0;
111 111
112 - @include transition(margin-top .3s cubic-bezier(.55,0,.55,.2) .2s); 112 + transition: margin-top .3s cubic-bezier(.55, 0, .55, .2) .2s;
113 } 113 }
114 114
115 .tb-dashboard-layouts { 115 .tb-dashboard-layouts {
@@ -42,7 +42,7 @@ @@ -42,7 +42,7 @@
42 border: none; 42 border: none;
43 opacity: .75; 43 opacity: .75;
44 44
45 - @include transition(opacity .35s); 45 + transition: opacity .35s;
46 } 46 }
47 47
48 a:hover, 48 a:hover,
@@ -84,9 +84,6 @@ @@ -84,9 +84,6 @@
84 84
85 .tb-panel-title { 85 .tb-panel-title {
86 min-width: 150px; 86 min-width: 150px;
87 - -webkit-user-select: none;  
88 - -moz-user-select: none;  
89 - -ms-user-select: none;  
90 user-select: none; 87 user-select: none;
91 } 88 }
92 89
@@ -163,10 +160,6 @@ @@ -163,10 +160,6 @@
163 .fc-canvas { 160 .fc-canvas {
164 min-width: 100%; 161 min-width: 100%;
165 min-height: 100%; 162 min-height: 100%;
166 - -webkit-user-select: none;  
167 - -khtml-user-select: none;  
168 - -moz-user-select: none;  
169 - -ms-user-select: none;  
170 user-select: none; 163 user-select: none;
171 outline: none; 164 outline: none;
172 -webkit-touch-callout: none; 165 -webkit-touch-callout: none;
@@ -441,13 +434,7 @@ @@ -441,13 +434,7 @@
441 } 434 }
442 435
443 .fc-noselect { 436 .fc-noselect {
444 - -webkit-touch-callout: none; /* iOS Safari */  
445 - -webkit-user-select: none; /* Safari */  
446 - -khtml-user-select: none; /* Konqueror HTML */  
447 - -moz-user-select: none; /* Firefox */  
448 - -ms-user-select: none; /* Internet Explorer/Edge */  
449 - user-select: none; /* Non-prefixed version, currently  
450 - supported by Chrome and Opera */ 437 + user-select: none;
451 } 438 }
452 439
453 .fc-edge-label { 440 .fc-edge-label {
@@ -495,7 +482,6 @@ @@ -495,7 +482,6 @@
495 font-weight: 600; 482 font-weight: 600;
496 text-align: center; 483 text-align: center;
497 white-space: nowrap; 484 white-space: nowrap;
498 - -webkit-transform: translate(-50%, -50%);  
499 transform: translate(-50%, -50%); 485 transform: translate(-50%, -50%);
500 486
501 span { 487 span {
@@ -29,7 +29,7 @@ md-dialog.tb-node-script-test-dialog { @@ -29,7 +29,7 @@ md-dialog.tb-node-script-test-dialog {
29 } 29 }
30 30
31 .tb-split { 31 .tb-split {
32 - @include box-sizing(border-box); 32 + box-sizing: border-box;
33 overflow-x: hidden; 33 overflow-x: hidden;
34 overflow-y: auto; 34 overflow-y: auto;
35 } 35 }
@@ -37,8 +37,6 @@ $background-color: #e6e7e8 !default; @@ -37,8 +37,6 @@ $background-color: #e6e7e8 !default;
37 position: relative; 37 position: relative;
38 38
39 &[draggable] { 39 &[draggable] {
40 - -moz-user-select: none;  
41 - -webkit-user-select: none;  
42 user-select: none; 40 user-select: none;
43 } 41 }
44 42
@@ -60,19 +60,11 @@ $background-color: #e6e7e8 !default; @@ -60,19 +60,11 @@ $background-color: #e6e7e8 !default;
60 .led { 60 .led {
61 position: relative; 61 position: relative;
62 cursor: pointer; 62 cursor: pointer;
63 - background-image: -owg-radial-gradient(50% 50%, circle closest-corner, transparent, rgba(0, 0, 0, .25));  
64 - background-image: -webkit-radial-gradient(50% 50%, circle closest-corner, transparent, rgba(0, 0, 0, .25));  
65 - background-image: -moz-radial-gradient(50% 50%, circle closest-corner, transparent, rgba(0, 0, 0, .25));  
66 - background-image: -o-radial-gradient(50% 50%, circle closest-corner, transparent, rgba(0, 0, 0, .25));  
67 background-image: radial-gradient(50% 50%, circle closest-corner, transparent, rgba(0, 0, 0, .25)); 63 background-image: radial-gradient(50% 50%, circle closest-corner, transparent, rgba(0, 0, 0, .25));
68 border-radius: 50%; 64 border-radius: 50%;
69 transition: background-color .5s, box-shadow .5s; 65 transition: background-color .5s, box-shadow .5s;
70 66
71 &.disabled { 67 &.disabled {
72 - background-image: -owg-radial-gradient(50% 50%, circle closest-corner, rgba(255, 255, 255, .5), rgba(0, 0, 0, .1));  
73 - background-image: -webkit-radial-gradient(50% 50%, circle closest-corner, rgba(255, 255, 255, .5), rgba(0, 0, 0, .1));  
74 - background-image: -moz-radial-gradient(50% 50%, circle closest-corner, rgba(255, 255, 255, .5), rgba(0, 0, 0, .1));  
75 - background-image: -o-radial-gradient(50% 50%, circle closest-corner, rgba(255, 255, 255, .5), rgba(0, 0, 0, .1));  
76 background-image: radial-gradient(50% 50%, circle closest-corner, rgba(255, 255, 255, .5), rgba(0, 0, 0, .1)); 68 background-image: radial-gradient(50% 50%, circle closest-corner, rgba(255, 255, 255, .5), rgba(0, 0, 0, .1));
77 } 69 }
78 } 70 }
@@ -59,6 +59,8 @@ $background-color: #e6e7e8 !default; @@ -59,6 +59,8 @@ $background-color: #e6e7e8 !default;
59 59
60 .switch { 60 .switch {
61 position: relative; 61 position: relative;
  62 +
  63 + box-sizing: border-box;
62 width: 260px; 64 width: 260px;
63 min-width: 260px; 65 min-width: 260px;
64 height: 260px; 66 height: 260px;
@@ -69,21 +71,14 @@ $background-color: #e6e7e8 !default; @@ -69,21 +71,14 @@ $background-color: #e6e7e8 !default;
69 71
70 color: #424242; 72 color: #424242;
71 cursor: pointer; 73 cursor: pointer;
72 - -pie-background: -pie-linear-gradient(270deg, #bbb, #ddd);  
73 background: #ddd; 74 background: #ddd;
74 - background: -owg-linear-gradient(270deg, #bbb, #ddd);  
75 - background: -webkit-linear-gradient(270deg, #bbb, #ddd);  
76 - background: -moz-linear-gradient(270deg, #bbb, #ddd);  
77 - background: -o-linear-gradient(270deg, #bbb, #ddd);  
78 background: linear-gradient(180deg, #bbb, #ddd); 75 background: linear-gradient(180deg, #bbb, #ddd);
79 border-radius: 130px; 76 border-radius: 130px;
80 77
81 - @include box-sizing(border-box);  
82 -  
83 - @include box-shadow(  
84 - 0 0 0 8px rgba(0,0,0,.1)  
85 - ,0 0 3px 1px rgba(0,0,0,.1)  
86 - ,inset 0 8px 3px -8px rgba(255,255,255,.4)); 78 + box-shadow:
  79 + 0 0 0 8px rgba(0, 0, 0, .1),
  80 + 0 0 3px 1px rgba(0, 0, 0, .1),
  81 + inset 0 8px 3px -8px rgba(255, 255, 255, .4);
87 82
88 input { 83 input {
89 display: none; 84 display: none;
@@ -95,7 +90,7 @@ $background-color: #e6e7e8 !default; @@ -95,7 +90,7 @@ $background-color: #e6e7e8 !default;
95 width: 100%; 90 width: 100%;
96 text-align: center; 91 text-align: center;
97 92
98 - @include text-shadow(1px 1px 4px #4a4a4a); 93 + text-shadow: 1px 1px 4px #4a4a4a;
99 } 94 }
100 95
101 .on { 96 .on {
@@ -103,15 +98,15 @@ $background-color: #e6e7e8 !default; @@ -103,15 +98,15 @@ $background-color: #e6e7e8 !default;
103 font-family: sans-serif; 98 font-family: sans-serif;
104 color: #444; 99 color: #444;
105 100
106 - @include transition(all .1s); 101 + transition: all .1s;
107 } 102 }
108 103
109 .off { 104 .off {
110 bottom: 5px; 105 bottom: 5px;
111 106
112 - @include transition(all .1s); 107 + transition: all .1s;
113 108
114 - @include transform(scaleY(.85)); 109 + transform: scaleY(.85);
115 } 110 }
116 111
117 .but { 112 .but {
@@ -125,90 +120,82 @@ $background-color: #e6e7e8 !default; @@ -125,90 +120,82 @@ $background-color: #e6e7e8 !default;
125 border-bottom-width: 0; 120 border-bottom-width: 0;
126 border-radius: 400px 400px 400px 400px / 400px 400px 300px 300px; 121 border-radius: 400px 400px 400px 400px / 400px 400px 300px 300px;
127 122
128 - @include box-shadow(inset 8px 6px 5px -7px #a2a2a2,  
129 - inset -8px 6px 5px -7px #a2a2a2,  
130 - inset 0 -3px 2px -2px rgba(200, 200, 200, .5),  
131 - 0 3px 3px -2px #fff,  
132 - inset 0 -230px 60px -200px rgba(255, 255, 255, .2),  
133 - inset 0 220px 40px -200px rgba(0, 0, 0, .3)); 123 + box-shadow:
  124 + inset 8px 6px 5px -7px #a2a2a2,
  125 + inset -8px 6px 5px -7px #a2a2a2,
  126 + inset 0 -3px 2px -2px rgba(200, 200, 200, .5),
  127 + 0 3px 3px -2px #fff,
  128 + inset 0 -230px 60px -200px rgba(255, 255, 255, .2),
  129 + inset 0 220px 40px -200px rgba(0, 0, 0, .3);
134 130
135 - @include transition(all .2s); 131 + transition: all .2s;
136 } 132 }
137 133
138 .back { 134 .back {
  135 +
  136 + box-sizing: border-box;
139 width: 210px; 137 width: 210px;
140 height: 210px; 138 height: 210px;
141 padding: 4px 4px; 139 padding: 4px 4px;
142 cursor: pointer; 140 cursor: pointer;
143 background-color: #888787; 141 background-color: #888787;
144 - background-image: -owg-linear-gradient(0deg, transparent 30%, transparent 70%), -owg-linear-gradient(90deg, rgba(150, 150, 150, 0) 30%, rgba(150, 150, 150, .2) 50%, rgba(150, 150, 150, 0) 70%);  
145 - background-image: -webkit-linear-gradient(0deg, transparent 30%, transparent 70%), -webkit-linear-gradient(90deg, rgba(150, 150, 150, 0) 30%, rgba(150, 150, 150, .2) 50%, rgba(150, 150, 150, 0) 70%);  
146 - background-image: -moz-linear-gradient(0deg, transparent 30%, transparent 70%), -moz-linear-gradient(90deg, rgba(150, 150, 150, 0) 30%, rgba(150, 150, 150, .2) 50%, rgba(150, 150, 150, 0) 70%);  
147 - background-image: -o-linear-gradient(0deg, transparent 30%, transparent 70%), -o-linear-gradient(90deg, rgba(150, 150, 150, 0) 30%, rgba(150, 150, 150, .2) 50%, rgba(150, 150, 150, 0) 70%);  
148 background-image: linear-gradient(-90deg, transparent 30%, transparent 70%), linear-gradient(0deg, rgba(150, 150, 150, 0) 30%, rgba(150, 150, 150, .2) 50%, rgba(150, 150, 150, 0) 70%); 142 background-image: linear-gradient(-90deg, transparent 30%, transparent 70%), linear-gradient(0deg, rgba(150, 150, 150, 0) 30%, rgba(150, 150, 150, .2) 50%, rgba(150, 150, 150, 0) 70%);
149 border-radius: 105px; 143 border-radius: 105px;
150 144
151 - @include box-shadow(30px 30px 30px -20px rgba(58, 58, 58, .3),  
152 - -30px 30px 30px -20px rgba(58, 58, 58, .3),  
153 - 0 30px 30px 0 rgba(16, 16, 16, .3),  
154 - inset 0 -1px 0 0 #484848);  
155 -  
156 - @include box-sizing(border-box); 145 + box-shadow:
  146 + 30px 30px 30px -20px rgba(58, 58, 58, .3),
  147 + -30px 30px 30px -20px rgba(58, 58, 58, .3),
  148 + 0 30px 30px 0 rgba(16, 16, 16, .3),
  149 + inset 0 -1px 0 0 #484848;
157 150
158 - @include transition(all .2s); 151 + transition: all .2s;
159 } 152 }
160 153
161 154
162 input:checked + .back .on, 155 input:checked + .back .on,
163 input:checked + .back .off{ 156 input:checked + .back .off{
164 - @include text-shadow(1px 1px 4px #4a4a4a); 157 + text-shadow: 1px 1px 4px #4a4a4a;
165 } 158 }
166 159
167 input:checked + .back .on{ 160 input:checked + .back .on{
168 top: 10px; 161 top: 10px;
169 color: #4c4c4c; 162 color: #4c4c4c;
170 163
171 - @include transform(scaleY(.85)); 164 + transform: scaleY(.85);
172 } 165 }
173 166
174 input:checked + .back .off{ 167 input:checked + .back .off{
175 bottom: 5px; 168 bottom: 5px;
176 color: #444; 169 color: #444;
177 170
178 - @include transform(scaleY(1)); 171 + transform: scaleY(1);
179 } 172 }
180 173
181 input:checked + .back .but{ 174 input:checked + .back .but{
182 margin-top: 20px; 175 margin-top: 20px;
183 background: #dcdcdc; 176 background: #dcdcdc;
184 - background-image: -owg-radial-gradient(50% 15%, circle closest-corner, rgba(0, 0, 0, .3), transparent);  
185 - background-image: -webkit-radial-gradient(50% 15%, circle closest-corner, rgba(0, 0, 0, .3), transparent);  
186 - background-image: -moz-radial-gradient(50% 15%, circle closest-corner, rgba(0, 0, 0, .3), transparent);  
187 - background-image: -o-radial-gradient(50% 15%, circle closest-corner, rgba(0, 0, 0, .3), transparent);  
188 background-image: radial-gradient(50% 15%, circle closest-corner, rgba(0, 0, 0, .3), transparent); 177 background-image: radial-gradient(50% 15%, circle closest-corner, rgba(0, 0, 0, .3), transparent);
189 border-radius: 400px 400px 400px 400px / 300px 300px 400px 400px; 178 border-radius: 400px 400px 400px 400px / 300px 300px 400px 400px;
190 179
191 - @include box-shadow(inset 8px -4px 5px -7px #a9a9a9,  
192 - inset -8px -4px 5px -7px #808080,  
193 - 0 -3px 8px -4px rgba(50, 50, 50, .4),  
194 - inset 0 3px 4px -2px #9c9c9c,  
195 - inset 0 280px 40px -200px rgba(0, 0, 0, .2),  
196 - inset 0 -200px 40px -200px rgba(180, 180, 180, .2)); 180 + box-shadow:
  181 + inset 8px -4px 5px -7px #a9a9a9,
  182 + inset -8px -4px 5px -7px #808080,
  183 + 0 -3px 8px -4px rgba(50, 50, 50, .4),
  184 + inset 0 3px 4px -2px #9c9c9c,
  185 + inset 0 280px 40px -200px rgba(0, 0, 0, .2),
  186 + inset 0 -200px 40px -200px rgba(180, 180, 180, .2);
197 } 187 }
198 188
199 input:checked + .back{ 189 input:checked + .back{
200 padding: 2px 4px; 190 padding: 2px 4px;
201 191
202 - background-image: -owg-linear-gradient(90deg, #868686 30%, transparent 70%), -owg-linear-gradient(180deg, rgba(115, 115, 115, 0) 0%, rgba(255, 255, 255, .74) 50%, rgba(105, 105, 105, 0) 100%);  
203 - background-image: -webkit-linear-gradient(90deg, #868686 30%, transparent 70%), -webkit-linear-gradient(180deg, rgba(115, 115, 115, 0) 0%, rgba(255, 255, 255, .74) 50%, rgba(105, 105, 105, 0) 100%);  
204 - background-image: -moz-linear-gradient(90deg, #868686 30%, transparent 70%), -moz-linear-gradient(180deg, rgba(115, 115, 115, 0) 0%, rgba(255, 255, 255, .74) 50%, rgba(105, 105, 105, 0) 100%);  
205 - background-image: -o-linear-gradient(90deg, #868686 30%, transparent 70%), -o-linear-gradient(180deg, rgba(115, 115, 115, 0) 0%, rgba(255, 255, 255, .74) 50%, rgba(105, 105, 105, 0) 100%);  
206 background-image: linear-gradient(0deg, #868686 30%, transparent 70%), linear-gradient(90deg, rgba(115, 115, 115, 0) 0%, rgba(255, 255, 255, .74) 50%, rgba(105, 105, 105, 0) 100%); 192 background-image: linear-gradient(0deg, #868686 30%, transparent 70%), linear-gradient(90deg, rgba(115, 115, 115, 0) 0%, rgba(255, 255, 255, .74) 50%, rgba(105, 105, 105, 0) 100%);
207 193
208 - @include box-shadow(30px 30px 30px -20px rgba(49, 49, 49, .1),  
209 - -30px 30px 30px -20px rgba(111, 111, 111, .1),  
210 - 0 30px 30px 0 rgba(0, 0, 0, .2),  
211 - inset 0 1px 2px 0 rgba(167, 167, 167, .6)); 194 + box-shadow:
  195 + 30px 30px 30px -20px rgba(49, 49, 49, .1),
  196 + -30px 30px 30px -20px rgba(111, 111, 111, .1),
  197 + 0 30px 30px 0 rgba(0, 0, 0, .2),
  198 + inset 0 1px 2px 0 rgba(167, 167, 167, .6);
212 } 199 }
213 } 200 }
214 } 201 }
@@ -19,7 +19,7 @@ $edit-toolbar-height: 40px !default; @@ -19,7 +19,7 @@ $edit-toolbar-height: 40px !default;
19 19
20 .tb-editor { 20 .tb-editor {
21 .tb-split { 21 .tb-split {
22 - @include box-sizing(border-box); 22 + box-sizing: border-box;
23 overflow-x: hidden; 23 overflow-x: hidden;
24 overflow-y: auto; 24 overflow-y: auto;
25 } 25 }
@@ -15,34 +15,34 @@ @@ -15,34 +15,34 @@
15 */ 15 */
16 @import "~compass-sass-mixins/lib/animate"; 16 @import "~compass-sass-mixins/lib/animate";
17 17
18 -@include keyframes(tbMoveFromTopFade) { 18 +@keyframes tbMoveFromTopFade {
19 from { 19 from {
20 opacity: 0; 20 opacity: 0;
21 21
22 - @include transform(translate(0, -100%)); 22 + transform: translate(0, -100%);
23 } 23 }
24 } 24 }
25 25
26 -@include keyframes(tbMoveToTopFade) { 26 +@keyframes tbMoveToTopFade {
27 to { 27 to {
28 opacity: 0; 28 opacity: 0;
29 29
30 - @include transform(translate(0, -100%)); 30 + transform: translate(0, -100%);
31 } 31 }
32 } 32 }
33 33
34 -@include keyframes(tbMoveFromBottomFade) { 34 +@keyframes tbMoveFromBottomFade {
35 from { 35 from {
36 opacity: 0; 36 opacity: 0;
37 37
38 - @include transform(translate(0, 100%)); 38 + transform: translate(0, 100%);
39 } 39 }
40 } 40 }
41 41
42 -@include keyframes(tbMoveToBottomFade) { 42 +@keyframes tbMoveToBottomFade {
43 to { 43 to {
44 opacity: 0; 44 opacity: 0;
45 45
46 - @include transform(translate(0, 150%)); 46 + transform: translate(0, 150%);
47 } 47 }
48 } 48 }
@@ -42,7 +42,7 @@ textarea { @@ -42,7 +42,7 @@ textarea {
42 word-wrap: normal; 42 word-wrap: normal;
43 white-space: nowrap; 43 white-space: nowrap;
44 direction: ltr; 44 direction: ltr;
45 - -webkit-font-feature-settings: "liga"; 45 + -webkit-font-feature-settings: "liga"; /* stylelint-disable-line property-no-vendor-prefix */
46 } 46 }
47 47
48 a { 48 a {
@@ -51,7 +51,7 @@ a { @@ -51,7 +51,7 @@ a {
51 text-decoration: none; 51 text-decoration: none;
52 border-bottom: 1px solid rgba(64, 84, 178, .25); 52 border-bottom: 1px solid rgba(64, 84, 178, .25);
53 53
54 - @include transition(border-bottom .35s); 54 + transition: border-bottom .35s;
55 } 55 }
56 56
57 a:hover, 57 a:hover,
@@ -258,13 +258,7 @@ label { @@ -258,13 +258,7 @@ label {
258 } 258 }
259 259
260 .tb-noselect { 260 .tb-noselect {
261 - -webkit-touch-callout: none; /* iOS Safari */  
262 - -webkit-user-select: none; /* Safari */  
263 - -khtml-user-select: none; /* Konqueror HTML */  
264 - -moz-user-select: none; /* Firefox */  
265 - -ms-user-select: none; /* Internet Explorer/Edge */  
266 - user-select: none; /* Non-prefixed version, currently  
267 - supported by Chrome and Opera */ 261 + user-select: none;
268 } 262 }
269 263
270 .tb-readonly-label { 264 .tb-readonly-label {
@@ -556,7 +550,7 @@ $previewSize: 100px !default; @@ -556,7 +550,7 @@ $previewSize: 100px !default;
556 } 550 }
557 551
558 .tb-error-message.ng-animate { 552 .tb-error-message.ng-animate {
559 - @include transition(all .3s cubic-bezier(.55, 0, .55, .2)); 553 + transition: all .3s cubic-bezier(.55, 0, .55, .2);
560 } 554 }
561 555
562 .tb-error-message.ng-enter-prepare, 556 .tb-error-message.ng-enter-prepare,
@@ -652,13 +646,13 @@ section.tb-top-header-buttons { @@ -652,13 +646,13 @@ section.tb-top-header-buttons {
652 } 646 }
653 647
654 .tb-header-buttons .tb-btn-header { 648 .tb-header-buttons .tb-btn-header {
655 - @include animation(tbMoveFromTopFade .3s ease both);  
656 position: relative !important; 649 position: relative !important;
657 display: inline-block !important; 650 display: inline-block !important;
  651 + animation: tbMoveFromTopFade .3s ease both;
658 } 652 }
659 653
660 .tb-header-buttons .tb-btn-header.ng-hide { 654 .tb-header-buttons .tb-btn-header.ng-hide {
661 - @include animation(tbMoveToTopFade .3s ease both); 655 + animation: tbMoveToTopFade .3s ease both;
662 } 656 }
663 657
664 /*********************** 658 /***********************
@@ -674,19 +668,19 @@ section.tb-footer-buttons { @@ -674,19 +668,19 @@ section.tb-footer-buttons {
674 } 668 }
675 669
676 .tb-footer-buttons .tb-btn-footer { 670 .tb-footer-buttons .tb-btn-footer {
677 - @include animation(tbMoveFromBottomFade .3s ease both);  
678 position: relative !important; 671 position: relative !important;
679 display: inline-block !important; 672 display: inline-block !important;
  673 + animation: tbMoveFromBottomFade .3s ease both;
680 } 674 }
681 675
682 .tb-footer-buttons .tb-btn-footer.ng-hide { 676 .tb-footer-buttons .tb-btn-footer.ng-hide {
683 - @include animation(tbMoveToBottomFade .3s ease both); 677 + animation: tbMoveToBottomFade .3s ease both;
684 } 678 }
685 679
686 ._md-toast-open-bottom .tb-footer-buttons { 680 ._md-toast-open-bottom .tb-footer-buttons {
687 - @include transition(all .4s cubic-bezier(.25, .8, .25, 1)); 681 + transition: all .4s cubic-bezier(.25, .8, .25, 1);
688 682
689 - @include transform(translate3d(0, -42px, 0)); 683 + transform: translate3d(0, -42px, 0);
690 } 684 }
691 685
692 /*********************** 686 /***********************
@@ -15,6 +15,7 @@ @@ -15,6 +15,7 @@
15 */ 15 */
16 @import "~compass-sass-mixins/lib/compass"; 16 @import "~compass-sass-mixins/lib/compass";
17 17
  18 +/* stylelint-disable selector-no-vendor-prefix */
18 @mixin input-placeholder { 19 @mixin input-placeholder {
19 // replaces compass/css/user-interface/input-placeholder() 20 // replaces compass/css/user-interface/input-placeholder()
20 21
@@ -36,6 +37,7 @@ @@ -36,6 +37,7 @@
36 @content; 37 @content;
37 } 38 }
38 } 39 }
  40 +/* stylelint-enable selector-no-vendor-prefix */
39 41
40 @mixin line-clamp($numLines: 1, $lineHeight: 1.412) { 42 @mixin line-clamp($numLines: 1, $lineHeight: 1.412) {
41 position: relative; 43 position: relative;