diff --git a/ionic/components/popup/modes/ios.scss b/ionic/components/popup/modes/ios.scss index 7fc74783cb..13267449c5 100644 --- a/ionic/components/popup/modes/ios.scss +++ b/ionic/components/popup/modes/ios.scss @@ -2,22 +2,27 @@ // iOS Popups // -------------------------------------------------- -$popup-ios-max-width: 270px !default; -$popup-ios-background: rgba(0,0,0,0) !default; -$popup-ios-border-radius: 13px !default; -$popup-ios-background-color: #f8f8f8 !default; +$popup-ios-max-width: 270px !default; +$popup-ios-background: rgba(0,0,0,0) !default; +$popup-ios-border-radius: 13px !default; +$popup-ios-background-color: #f8f8f8 !default; -$popup-ios-head-text-align: center !default; -$popup-ios-title-font-size: 17px !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-body-text-align: center !default; -$popup-ios-body-font-size: 13px !default; +$popup-ios-head-text-align: center !default; +$popup-ios-title-font-size: 17px !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-body-text-align: center !default; +$popup-ios-body-font-size: 13px !default; -$popup-ios-button-text-color: color(primary) !default; -$popup-ios-button-min-height: 44px !default; -$popup-ios-button-font-size: 17px !default; +$popup-ios-prompt-input-background-color: #fff !default; +$popup-ios-prompt-input-border: 1px solid #ccc !default; +$popup-ios-prompt-input-border-radius: 4px !default; + +$popup-ios-button-min-height: 44px !default; +$popup-ios-button-font-size: 17px !default; +$popup-ios-button-border-color: #c8c7cc !default; +$popup-ios-button-activated-background-color: #e9e9e9 !default; ion-popup { @@ -55,11 +60,12 @@ ion-popup { } .prompt-input { - background-color: #fff; padding: 6px; margin-top: 24px; - border-radius: 4px; - border: 1px solid #ccc; + + background-color: $popup-ios-prompt-input-background-color; + border: $popup-ios-prompt-input-border; + border-radius: $popup-ios-prompt-input-border-radius; -webkit-appearance: none; } @@ -72,11 +78,11 @@ ion-popup { border-radius: 0; font-size: $popup-ios-button-font-size; min-height: $popup-ios-button-min-height; - border-right: 1px solid #c8c7cc; + border-right: 1px solid $popup-ios-button-border-color; &.activated { opacity: 1; - background-color: #DEDEDE; + background-color: $popup-ios-button-activated-background-color; } &:hover:not(.disable-hover) { @@ -88,7 +94,7 @@ ion-popup { top: 0; right: 0; left: 0; - border-top: 1px solid #c8c7cc; + border-top: 1px solid $popup-ios-button-border-color; content: ''; pointer-events: none; }