- .left-items ::content label {
diff --git a/src/mm-radio/mm-radio.scss b/src/mm-radio/mm-radio.scss
index d68f4e7f..dc47bf5a 100644
--- a/src/mm-radio/mm-radio.scss
+++ b/src/mm-radio/mm-radio.scss
@@ -40,7 +40,7 @@
border-radius:50%;
background: $color-F0;
box-shadow: inset 1px 1px 2px rgba(0,0,0,0.125);
- @include background-image(linear-gradient(bottom, $color-F0 0%, $color-A9 100%));
+ background-image: linear-gradient(to top, $color-F0 0%, $color-A9 100%);
width: 16px;
height: 16px;
position: relative;
@@ -52,20 +52,20 @@
border-radius:50%;
background-color: #97caf2;
box-shadow: inset 0 0 0 1px rgba(255,255,255,.33);
- @include background-image(linear-gradient(bottom, $color-D24 0%, $color-D25 100%));
+ background-image: linear-gradient(to top, $color-D24 0%, $color-D25 100%);
width:12px;
height:12px;
position: absolute;
left: 50%;
top: 50%;
- @include transform(translate(-50%, -50%));
+ transform: translate(-50%, -50%);
display: none;
}
}
:host(:active) #radio {
box-shadow: inset 1px 1px 2px rgba(0,0,0,.18);
- @include background-image(linear-gradient(top, #bfbfbf 0%, #f2f2f2 100%));
+ background-image: linear-gradient(to bottom, #bfbfbf 0%, #f2f2f2 100%);
}
#label {
diff --git a/src/mm-spinner/mm-spinner.scss b/src/mm-spinner/mm-spinner.scss
index 7048589d..bf334148 100644
--- a/src/mm-spinner/mm-spinner.scss
+++ b/src/mm-spinner/mm-spinner.scss
@@ -11,17 +11,17 @@
display: inline-block;
vertical-align: middle;
overflow: hidden;
- @include animation-name(fadeIn);
- @include animation-duration(1s);
- @include animation-timing-function(ease);
+ animation-name: fadeIn;
+ animation-duration: 1s;
+ animation-timing-function: ease;
}
-@include keyframes(spin) {
- 0% { @include transform(rotate(0deg)); }
- 100% { @include transform(rotate(360deg)); }
+@keyframes spin {
+ 0% { transform: rotate(0deg); }
+ 100% { transform: rotate(360deg); }
}
-@include keyframes(fadeIn) {
+@keyframes fadeIn {
from { opacity: 0; }
to { opacity: 1; }
}
\ No newline at end of file
diff --git a/src/mm-tabs/mm-tabs.scss b/src/mm-tabs/mm-tabs.scss
index 08344f6a..5e4e4b16 100644
--- a/src/mm-tabs/mm-tabs.scss
+++ b/src/mm-tabs/mm-tabs.scss
@@ -17,17 +17,17 @@
}
#tabBar {
- @include display(flex);
- @include align-items(stretch);
+ display: flex;
+ align-items: stretch;
box-sizing: border-box;
margin: 0;
padding: 0;
li {
- @include display(flex);
- @include flex-direction(row);
- @include justify-content(center);
- @include align-items(center);
+ display: flex;
+ flex-direction: row;
+ justify-content: center;
+ align-items: center;
background: linear-gradient(#fff, $color-A12);
border: 1px solid $color-A20;
color: $color-A5;
@@ -66,7 +66,7 @@
}
#tabBar.left {
- @include flex-direction(column);
+ flex-direction: column;
float: left;
margin-left: 10px;
@@ -76,8 +76,8 @@
}
li {
- @include justify-content(flex-start);
- @include flex-wrap(nowrap);
+ justify-content: flex-start;
+ flex-wrap: nowrap;
border-right: 0;
border-top-left-radius: 3px;
border-bottom-left-radius: 3px;
diff --git a/src/shared/sass/_button.scss b/src/shared/sass/_button.scss
index 385fc056..6f696fa8 100644
--- a/src/shared/sass/_button.scss
+++ b/src/shared/sass/_button.scss
@@ -8,10 +8,10 @@
.button {
box-sizing: border-box;
- @include user-select(none);
- @include display(flex);
- @include align-items(center);
- @include justify-content(start);
+ user-select: none;
+ display: flex;
+ align-items: center;
+ justify-content: start;
@include buttonFont();
text-transform: capitalize;
border: 1px solid;
@@ -71,7 +71,7 @@
color: $color-A2;
border-color: $color-A8;
background: $color-F0;
- @include background-image(linear-gradient($color-F0, $color-A19));
+ background-image: linear-gradient($color-F0, $color-A19);
}
&.secondary:hover {
@@ -141,7 +141,7 @@
:host([_layout=vgroup-center]),
:host([_layout=vgroup-left]) {
.button {
- @include justify-content(center);
+ justify-content: center;
}
}
diff --git a/src/shared/sass/_dropdown.scss b/src/shared/sass/_dropdown.scss
index c6561c36..52c0a2c7 100644
--- a/src/shared/sass/_dropdown.scss
+++ b/src/shared/sass/_dropdown.scss
@@ -29,9 +29,9 @@
}
.button .left-items {
- @include display(flex);
- @include align-items(center);
- @include justify-content(start);
+ display: flex;
+ align-items: center;
+ justify-content: start;
height: 100%;
}
@@ -45,11 +45,11 @@
}
#caratIcon.closed {
- @include transform(scaleY(1));
+ transform: scaleY(1);
}
#caratIcon.opened {
- @include transform(scaleY(-1));
+ transform: scaleY(-1);
}
.scroll-container {
diff --git a/src/shared/sass/_grid.scss b/src/shared/sass/_grid.scss
index a300fa8b..35d197f5 100644
--- a/src/shared/sass/_grid.scss
+++ b/src/shared/sass/_grid.scss
@@ -37,12 +37,12 @@
mm-icon {
cursor: pointer;
- @include transform(rotate(-90deg));
+ transform: rotate(-90deg);
}
&.expanded {
mm-icon {
- @include transform(rotate(0deg));
+ transform: rotate(0deg);
}
}
}
diff --git a/src/shared/sass/_mixins.scss b/src/shared/sass/_mixins.scss
index 621d5d11..dc52007b 100644
--- a/src/shared/sass/_mixins.scss
+++ b/src/shared/sass/_mixins.scss
@@ -32,7 +32,7 @@
// button selected state
@mixin buttonSelected($gradientColor1, $gradientColor2, $boxShadowColor) {
- @include background-image(linear-gradient($gradientColor1, $gradientColor2));
+ background-image: linear-gradient($gradientColor1, $gradientColor2);
box-shadow: inset 0 5px 1px $boxShadowColor;
}
diff --git a/src/shared/sass/_textinput.scss b/src/shared/sass/_textinput.scss
index 3a0d399a..3a074d2e 100644
--- a/src/shared/sass/_textinput.scss
+++ b/src/shared/sass/_textinput.scss
@@ -25,7 +25,7 @@
margin:0;
resize:none;
- @include placeholder {
+ &::placeholder {
font-family: 'Arimo', sans-serif;
@include fontSmoothing();
font-style: italic;
@@ -40,7 +40,7 @@
.text-input.monospace {
font-family: monospace;
- @include placeholder {
+ &::placeholder {
font-family: monospace;
}
}