javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-19 19:57:22 +08:00
Code Issues Packages Projects Releases Wiki Activity

style(sass): move font smooth to mixin and remove webkit properties

Browse Source 
autoprefixer is adding the backdrop-filter for us now
This commit is contained in:
Brandy Carney
2018-03-28 17:57:00 -04:00
parent 54558c92af
commit 88752dea51
22 changed files with 22 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
core/src/components/action-sheet/action-sheet.ios.scss
View File

@ -50,7 +50,6 @@
background: $action-sheet-ios-translucent-background-color;
backdrop-filter: $action-sheet-ios-translucent-filter;
-webkit-backdrop-filter: $action-sheet-ios-translucent-filter;
}

4
core/src/components/action-sheet/action-sheet.scss
View File

@ -4,6 +4,7 @@
// --------------------------------------------------
ion-action-sheet {
@include font-smoothing();
@include position(0, 0, 0, 0);
position: fixed;
@ -11,9 +12,6 @@ ion-action-sheet {
display: block;
touch-action: none;
font-smoothing: antialiased;
-webkit-font-smoothing: antialiased;
}
.action-sheet-wrapper {

1
core/src/components/alert/alert.ios.scss
View File

@ -29,7 +29,6 @@
background: $alert-ios-translucent-background-color;
backdrop-filter: $alert-ios-translucent-filter;
-webkit-backdrop-filter: $alert-ios-translucent-filter;
}

4
core/src/components/alert/alert.scss
View File

@ -4,6 +4,7 @@
// --------------------------------------------------
ion-alert {
@include font-smoothing();
@include position(0, 0, 0, 0);
position: fixed;
@ -18,9 +19,6 @@ ion-alert {
touch-action: none;
contain: strict;
font-smoothing: antialiased;
-webkit-font-smoothing: antialiased;
}
ion-alert.alert-top {

5
core/src/components/app/fonts/ionicons.scss
View File

@ -20,6 +20,8 @@ $ionicons-font-path: $font-path !default;
}
ion-icon {
@include font-smoothing();
display: inline-block;
font-family: "Ionicons";
@ -31,9 +33,6 @@ ion-icon {
text-transform: none;
speak: none;
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
@include rtl() {
&[aria-label^="arrow"]::before,
&[flip-rtl]::before {

4
core/src/components/back-button/back-button.scss
View File

@ -13,6 +13,7 @@
}
.back-button button {
@include font-smoothing();
@include text-align(center);
@include appearance(none);
@ -39,9 +40,6 @@
font-kerning: none;
user-select: none;
font-smoothing: antialiased;
-webkit-font-smoothing: antialiased;
display: flex;
flex-flow: row nowrap;

4
core/src/components/badge/badge.scss
View File

@ -4,6 +4,7 @@
// --------------------------------------------------
ion-badge {
@include font-smoothing();
@include padding($badge-ios-padding-top, $badge-ios-padding-end, $badge-ios-padding-bottom, $badge-ios-padding-start);
@include text-align(center);
@ -19,9 +20,6 @@ ion-badge {
white-space: nowrap;
vertical-align: baseline;
font-smoothing: antialiased;
-webkit-font-smoothing: antialiased;
contain: content;
}

4
core/src/components/button/button.scss
View File

@ -4,6 +4,7 @@
// --------------------------------------------------
.button {
@include font-smoothing();
@include text-align(center);
@include appearance(none);
@ -30,9 +31,6 @@
user-select: none;
contain: content;
font-smoothing: antialiased;
-webkit-font-smoothing: antialiased;
}
.button:active,

1
core/src/components/card-header/card-header.ios.scss
View File

@ -11,6 +11,5 @@
.card-header-translucent-ios {
background-color: $card-ios-header-translucent-background-color;
-webkit-backdrop-filter: $card-ios-header-translucent-filter;
backdrop-filter: $card-ios-header-translucent-filter;
}

5
core/src/components/chip/chip.scss
View File

@ -4,6 +4,8 @@
// --------------------------------------------------
ion-chip {
@include font-smoothing();
box-sizing: border-box;
display: inline-flex;
@ -12,9 +14,6 @@ ion-chip {
font-weight: normal;
vertical-align: middle;
-webkit-font-smoothing: antialiased;
font-smoothing: antialiased;
}
ion-chip > ion-icon {

1
core/src/components/fab-button/fab-button.ios.scss
View File

@ -53,7 +53,6 @@
.fab-translucent-ios {
background-color: $fab-ios-translucent-background-color;
-webkit-backdrop-filter: $fab-ios-translucent-filter;
backdrop-filter: $fab-ios-translucent-filter;
}

1
core/src/components/footer/footer.ios.scss
View File

@ -5,6 +5,5 @@
// --------------------------------------------------
.footer-translucent-ios {
-webkit-backdrop-filter: $footer-ios-translucent-filter;
backdrop-filter: $footer-ios-translucent-filter;
}

1
core/src/components/header/header.ios.scss
View File

@ -5,6 +5,5 @@
// --------------------------------------------------
.header-translucent-ios {
-webkit-backdrop-filter: $header-ios-translucent-filter;
backdrop-filter: $header-ios-translucent-filter;
}

1
core/src/components/loading/loading.ios.scss
View File

@ -29,7 +29,6 @@
background-color: $loading-ios-translucent-background-color;
backdrop-filter: $loading-ios-translucent-filter;
-webkit-backdrop-filter: $loading-ios-translucent-filter;
}

4
core/src/components/picker/picker.scss
View File

@ -4,6 +4,7 @@
// --------------------------------------------------
ion-picker {
@include font-smoothing();
@include position(0, null, null, 0);
position: absolute;
@ -14,9 +15,6 @@ ion-picker {
height: $picker-width;
contain: strict;
-webkit-font-smoothing: antialiased;
font-smoothing: antialiased;
}
.picker-toolbar {

1
core/src/components/popover/popover.ios.scss
View File

@ -62,6 +62,5 @@
.popover-translucent-ios .popover-arrow::after {
background: $popover-ios-translucent-background-color;
-webkit-backdrop-filter: $popover-ios-translucent-filter;
backdrop-filter: $popover-ios-translucent-filter;
}

5
core/src/components/segment/segment.scss
View File

@ -4,6 +4,8 @@
// --------------------------------------------------
ion-segment {
@include font-smoothing();
display: flex;
flex: 1;
@ -11,7 +13,4 @@ ion-segment {
justify-content: center;
width: 100%;
font-smoothing: antialiased;
-webkit-font-smoothing: antialiased;
}

1
core/src/components/tabbar/tabbar.ios.scss
View File

@ -32,7 +32,6 @@
// background-color: color-mod($tabbar-ios-background-color, a($alpha-ios-highest));
background-color: $tabbar-ios-translucent-background-color;
-webkit-backdrop-filter: $tabbar-ios-translucent-filter;
backdrop-filter: $tabbar-ios-translucent-filter;
}

1
core/src/components/toast/toast.ios.scss
View File

@ -27,7 +27,6 @@
background: $toast-ios-translucent-background-color;
backdrop-filter: $toast-ios-translucent-filter;
-webkit-backdrop-filter: $toast-ios-translucent-filter;
}
.toast-ios .toast-wrapper.toast-top {

1
core/src/components/toolbar/toolbar.ios.scss
View File

@ -67,7 +67,6 @@
}
.toolbar-translucent-ios .toolbar-background-ios {
-webkit-backdrop-filter: $toolbar-ios-translucent-filter;
backdrop-filter: $toolbar-ios-translucent-filter;
}

5
core/src/components/toolbar/toolbar.scss
View File

@ -4,6 +4,8 @@
// --------------------------------------------------
ion-toolbar {
@include font-smoothing();
box-sizing: border-box;
position: relative;
z-index: $z-index-toolbar;
@ -17,9 +19,6 @@ ion-toolbar {
width: 100%;
-webkit-font-smoothing: antialiased;
font-smoothing: antialiased;
contain: content;
}

8
core/src/themes/ionic.mixins.scss
View File

@ -8,6 +8,14 @@
appearance: $val;
}
// Font smoothing
// --------------------------------------------------
@mixin font-smoothing() {
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
}
// Input Placeholder
// --------------------------------------------------