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(alert): clean up alert css

Browse Source 
Removed borders from radio and checkbox items in an alert, increased
the font size of the md message, transformed md button to uppercase,
fixed padding

fixes #5133
This commit is contained in:
Brandy Carney
2016-01-22 15:12:37 -05:00
parent b424866b19
commit ce44ffb149
2 changed files with 14 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
ionic/components/alert/alert.md.scss
View File

@@ -10,12 +10,13 @@ $alert-md-background-color: #fafafa !default;
$alert-md-box-shadow: 0px 16px 20px rgba(0, 0, 0, 0.4) !default;
$alert-md-head-text-align: left !default;
$alert-md-head-padding: 24px 24px 10px 24px !default;
$alert-md-head-padding: 24px 24px 20px 24px !default;
$alert-md-title-font-size: 20px !default;
$alert-md-sub-title-font-size: 15px !default;
$alert-md-title-font-size: 22px !default;
$alert-md-sub-title-font-size: 16px !default;
$alert-md-message-padding: 10px 24px 24px 24px !default;
$alert-md-message-font-size: 15px !default;
$alert-md-message-padding: 0 24px 24px 24px !default;
$alert-md-message-text-color: rgba(0,0,0,.5) !default;
$alert-md-input-border-color: #dedede !default;
@@ -64,6 +65,10 @@ $alert-md-buttons-justify-content: flex-end !default;
color: $alert-md-message-text-color;
}
.alert-message {
font-size: $alert-md-message-font-size;
}
// Material Design Alert Input
// --------------------------------------------------
@@ -87,7 +92,7 @@ $alert-md-buttons-justify-content: flex-end !default;
.alert-checkbox-group {
position: relative;
border-top: 1px solid $alert-md-input-border-color;
border-bottom: 1px solid $alert-md-input-border-color;
border-bottom: 1px solid $alert-md-input-border-color;
max-height: 240px;
overflow: auto;
}
@@ -214,6 +219,7 @@ $alert-md-buttons-justify-content: flex-end !default;
font-weight: 500;
color: $alert-md-button-text-color;
background-color: $alert-md-button-background-color;
text-transform: uppercase;
&.activated {
opacity: 1;

5
ionic/components/alert/test/basic/index.ts
View File

@@ -16,8 +16,9 @@ class E2EPage {
doAlert() {
let alert = Alert.create({
title: 'Alert!',
subTitle: 'Subtitle!!!',
title: 'Alert',
subTitle: 'Subtitle',
message: 'This is an alert message.',
buttons: ['OK']
});