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

fix(popup): Some variables were missing the default flag, also styled iOS more and got rid of some overrides

Browse Source 
References #183
This commit is contained in:
Brandy Carney
2015-10-01 11:38:34 -04:00
parent 7c70da2212
commit 73597c0b42
3 changed files with 37 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
ionic/components/popup/modes/ios.scss
View File

@@ -2,13 +2,15 @@
// iOS Popups
// --------------------------------------------------
$popup-ios-max-width: 280px !default;
$popup-ios-max-width: 84% !default;
$popup-ios-background: rgba(0,0,0,0) !default;
$popup-ios-border-radius: 13px !default;
$popup-ios-background-color: #f8f8f8 !default;
$popup-ios-background-color: rgba(255,255,255,0.85) !default;
$popup-ios-head-text-align: center !default;
$popup-ios-title-font-size: 15px !default;
$popup-ios-sub-title-font-size: 14px !default;
$popup-ios-sub-title-text-color: #666 !default;
$popup-ios-body-text-color: inherit !default;
$popup-ios-button-text-color: color(primary) !default;
@@ -26,26 +28,37 @@ ion-popup {
}
.popup-head {
padding: 10px;
text-align: $popup-ios-head-text-align;
padding-top: 24px;
}
.popup-title {
margin-top: 10px;
font-size: $popup-ios-title-font-size;
}
.popup-sub-title {
font-size: $popup-ios-sub-title-font-size;
color: $popup-ios-sub-title-text-color;
}
.popup-body {
padding: 10px;
padding: 10px 20px;
color: $popup-ios-body-text-color;
}
.prompt-input {
margin-top: 5px;
}
.popup-buttons {
padding: 0;
padding-bottom: 10px;
min-height: 0;
button {
background-color: transparent;
color: $popup-ios-button-text-color;
@extend button[clear];
flex: 1;
min-height: $popup-ios-button-min-height;
&:last-child {

35
ionic/components/popup/modes/md.scss
View File

@@ -10,12 +10,17 @@ $popup-md-box-shadow: 0px 16px 20px rgba(0, 0, 0, 0.4) !defa
$popup-md-head-text-align: left !default;
$popup-md-title-font-size: 20px !default;
$popup-md-sub-title-font-size: 15px !default;
$popup-md-body-text-color: rgba(0,0,0,.5) !default;
$popup-md-button-min-height: 36px !default;
$popup-md-prompt-input-text-color: #000000;
$popup-md-prompt-input-border-color: #dedede !default;
$popup-md-prompt-input-text-color: #000000 !default;
$popup-md-prompt-input-highlight-color: map-get($colors, primary) !default;
$popup-md-prompt-input-placeholder-color: #b9b9b9;
$popup-md-prompt-input-placeholder-color: #b9b9b9 !default;
$popup-md-prompt-input-margin-top: 5px !default;
$popup-md-prompt-input-margin-bottom: 5px !default;
ion-popup {
@@ -39,31 +44,23 @@ ion-popup {
font-size: $popup-md-title-font-size;
}
.popup-sub-title {
font-size: $popup-md-sub-title-font-size;
}
.popup-body {
padding: 10px 24px 24px 24px;
color: $popup-md-body-text-color;
}
.prompt-input {
border-bottom: 1px solid #dedede;
border-bottom: 1px solid $popup-md-prompt-input-border-color;
color: $popup-md-prompt-input-text-color;
&::-webkit-input-placeholder {
color: $popup-md-prompt-input-placeholder-color;
}
&:-moz-placeholder { /* Firefox 18- */
color: $popup-md-prompt-input-placeholder-color;
}
&::-moz-placeholder { /* Firefox 19+ */
color: $popup-md-prompt-input-placeholder-color;
}
&:-ms-input-placeholder {
color: $popup-md-prompt-input-placeholder-color;
}
margin: $popup-md-prompt-input-margin-top 0 $popup-md-prompt-input-margin-bottom 0;
&:focus {
border-bottom: 2px solid $popup-md-prompt-input-highlight-color;
margin-bottom: 4px;
margin-bottom: $popup-md-prompt-input-margin-bottom - 1;
}
}
@@ -73,10 +70,6 @@ ion-popup {
button {
@extend button[clear];
-webkit-box-flex: initial;
-webkit-flex: intiial;
-ms-flex: initial;
flex: initial;
min-height: $popup-md-button-min-height;
}

13
ionic/components/popup/popup.scss
View File

@@ -6,8 +6,6 @@ $popup-min-width: 250px !default;
$popup-max-width: 100% !default;
$popup-max-height: 90% !default;
$popup-sub-title-font-size: 15px !default;
$popup-button-line-height: 20px !default;
$popup-button-font-size: 14px !default;
$popup-button-margin-right: 8px !default;
@@ -41,10 +39,6 @@ ion-popup {
}
}
.popup-head {
padding: 15px 10px;
}
.popup-title {
margin: 0;
padding: 0;
@@ -54,23 +48,23 @@ ion-popup {
margin: 5px 0 0 0;
padding: 0;
font-weight: normal;
font-size: $popup-sub-title-font-size;
}
.popup-body {
overflow: auto;
// TODO is this needed?
// TODO is this needed, it is never empty
&:empty {
padding: 0;
}
}
.prompt-input {
@include placeholder();
border: 0;
background: inherit;
padding: 10px 0;
margin: 5px 0;
}
.popup-buttons {
@@ -78,7 +72,6 @@ ion-popup {
flex-direction: row;
button {
flex: 1;
display: block;
margin: 0;
line-height: $popup-button-line-height;