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

refactor(sass): update windows action sheet sass to use variables

Browse Source 
remove unused styles

references #5651
This commit is contained in:
Brandy Carney
2016-03-03 15:31:38 -05:00
parent 62c7199fd1
commit a51268cd6c
2 changed files with 22 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
ionic/components/action-sheet/action-sheet.wp.scss
View File

@ -5,9 +5,9 @@
// --------------------------------------------------
$action-sheet-wp-text-align: left !default;
$action-sheet-wp-background-color: #ffffff !default;
$action-sheet-wp-background: #ffffff !default;
$action-sheet-wp-box-shadow: 0px -1px 0px rgba(0,0,0,0.2) !default;
$action-sheet-wp-group-margin-bottom: 8px !default;
$action-sheet-wp-title-padding: 19px 16px 17px !default;
$action-sheet-wp-title-font-size: 2.0rem !default;
@ -19,10 +19,15 @@ $action-sheet-wp-button-text-color: #4D4D4D !default;
$action-sheet-wp-button-font-size: 1.5rem !default;
$action-sheet-wp-button-padding: 0 16px !default;
$action-sheet-wp-button-text-align: $action-sheet-wp-text-align !default;
$action-sheet-wp-button-background-active-color: $list-wp-activated-background-color !default;
$action-sheet-wp-button-background: transparent !default;
$action-sheet-wp-button-background-activated: $list-wp-activated-background-color !default;
$action-sheet-wp-icon-min-width: 24px !default;
$action-sheet-wp-icon-text-align: center !default;
$action-sheet-wp-icon-vertical-align: middle !default;
$action-sheet-wp-icon-font-size: 2.4rem !default;
$action-sheet-wp-icon-margin: 0 28px 0 0 !default;
$action-sheet-wp-icon-margin: 0 16px 0 0 !default;
.action-sheet-wrapper {
box-shadow: $action-sheet-wp-box-shadow;
@ -36,44 +41,34 @@ $action-sheet-wp-icon-margin: 0 28px 0 0 !default;
}
.action-sheet-button {
position: relative;
overflow: hidden;
padding: $action-sheet-wp-button-padding;
min-height: $action-sheet-wp-button-height;
font-size: $action-sheet-wp-button-font-size;
font-weight: normal;
color: $action-sheet-wp-button-text-color;
background-color: transparent;
background: $action-sheet-wp-button-background;
text-align: $action-sheet-wp-button-text-align;
&.activated {
background: $action-sheet-wp-button-background-active-color;
border-radius: 0;
box-shadow: none;
background: $action-sheet-wp-button-background-activated;
}
}
.action-sheet-icon {
display: inline-block;
margin: $action-sheet-wp-icon-margin;
min-width: 24px;
text-align: center;
vertical-align: middle;
min-width: $action-sheet-wp-icon-min-width;
text-align: $action-sheet-wp-icon-text-align;
vertical-align: $action-sheet-wp-icon-vertical-align;
font-size: $action-sheet-wp-icon-font-size;
}
.action-sheet-group {
overflow: hidden;
margin: 0;
border-radius: 0;
background-color: $action-sheet-wp-background-color;
background: $action-sheet-wp-background;
&:last-child .action-sheet-button {
margin-bottom: 8px;
margin-bottom: $action-sheet-wp-group-margin-bottom;
}
}
.action-sheet-cancel {
background-color: $action-sheet-wp-background-color;
border: none;
background: $action-sheet-wp-button-background;
}

10
ionic/components/action-sheet/test/basic/index.ts
View File

@ -18,7 +18,7 @@ class E2EPage {
{
text: 'Delete',
role: 'destructive',
icon: this.platform.is('android') ? 'trash' : null,
icon: !this.platform.is('ios') ? 'trash' : null,
handler: () => {
console.log('Delete clicked');
this.result = 'Deleted';
@ -26,7 +26,7 @@ class E2EPage {
},
{
text: 'Share',
icon: this.platform.is('android') ? 'share' : null,
icon: !this.platform.is('ios') ? 'share' : null,
handler: () => {
console.log('Share clicked');
this.result = 'Shared';
@ -34,7 +34,7 @@ class E2EPage {
},
{
text: 'Play',
icon: this.platform.is('android') ? 'arrow-dropright-circle' : null,
icon: !this.platform.is('ios') ? 'arrow-dropright-circle' : null,
handler: () => {
let modal = Modal.create(ModalPage);
this.nav.present(modal);
@ -45,7 +45,7 @@ class E2EPage {
},
{
text: 'Favorite',
icon: this.platform.is('android') ? 'heart' : null,
icon: !this.platform.is('ios') ? 'heart' : null,
handler: () => {
console.log('Favorite clicked');
this.result = 'Favorited';
@ -54,7 +54,7 @@ class E2EPage {
{
text: 'Cancel',
role: 'cancel', // will always sort to be on the bottom
icon: this.platform.is('android') ? 'close' : null,
icon: !this.platform.is('ios') ? 'close' : null,
handler: () => {
console.log('Cancel clicked');
this.result = 'Canceled';