list/item/button/card css overhaul · ModusCreateOrg/ionic@069ac65 · GitHub
Skip to content

Commit 069ac65

Browse files
adamdbradleyadamdbradley
committed
list/item/button/card css overhaul
1 parent cb48d67 commit 069ac65

36 files changed

Lines changed: 357 additions & 410 deletions

File tree

‎.gitignore‎

Lines changed: 8 additions & 3 deletions

‎ionic/components/app/app.ts‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -87,11 +87,11 @@ export class IonicApp {
8787

8888
let platformVersion = versions[platformName];
8989
if (platformVersion) {
90-
// platform-ios_8
91-
platformClass += '_' + platformVersion.major;
90+
// platform-ios9
91+
platformClass += platformVersion.major;
9292
bodyEle.classList.add(platformClass);
9393

94-
// platform-ios_8_3
94+
// platform-ios9_3
9595
bodyEle.classList.add(platformClass + '_' + platformVersion.minor);
9696
}
9797
});

‎ionic/components/badge/badge.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ $badge-font-weight: bold !default;
77
$badge-border-radius: 10px !default;
88

99

10-
.badge {
10+
item-badge {
1111
display: inline-block;
1212

1313
padding: 3px 8px;

‎ionic/components/button/button-icon.scss‎

Lines changed: 6 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -7,20 +7,21 @@ button,
77
[button] {
88

99
&.icon-left icon {
10-
margin-left: -0.6rem;
11-
padding-right: 0.6rem;
10+
margin-left: -0.2em;
11+
padding-right: 0.4em;
1212
}
1313

1414
&.icon-right icon {
15-
margin-right: -0.6rem;
16-
padding-left: 0.6rem;
15+
margin-right: -0.2em;
16+
padding-left: 0.3em;
1717
}
1818

1919
&.icon-only {
2020
padding: 0;
21+
min-width: 0.9em;
2122

2223
icon {
23-
padding: 0 1.6rem;
24+
padding: 0 0.9em;
2425
}
2526
}
2627

@@ -29,11 +30,6 @@ button,
2930
border: none;
3031
}
3132

32-
&[large] icon {
33-
margin-left: 0;
34-
margin-right: 0;
35-
}
36-
3733
&[small] icon {
3834
margin-left: 0;
3935
margin-right: 0;

‎ionic/components/button/button-size.scss‎

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -3,27 +3,25 @@
33
// --------------------------------------------------
44

55
$button-large-font-size: 2rem !default;
6-
$button-large-height: 5.4rem !default;
7-
$button-large-padding: 1.4rem !default;
6+
$button-large-height: 2.8em !default;
7+
$button-large-padding: 1.0em !default;
88

99
$button-small-font-size: 1.3rem !default;
10-
$button-small-height: 2.8rem !default;
11-
$button-small-padding: 1.1rem !default;
10+
$button-small-height: 2.1em !default;
11+
$button-small-padding: 0.9em !default;
1212

1313

1414
button,
1515
[button] {
1616

1717
&[large] {
1818
padding: 0 $button-large-padding;
19-
min-width: ($button-large-padding * 4);
2019
min-height: $button-large-height;
2120
font-size: $button-large-font-size;
2221
}
2322

2423
&[small] {
2524
padding: 0 $button-small-padding;
26-
min-width: ($button-small-padding * 3);
2725
min-height: $button-small-height;
2826
font-size: $button-small-font-size;
2927
}

‎ionic/components/button/button.scss‎

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,12 @@
44

55
$button-font-size: 1.6rem !default;
66
$button-margin: 0.4rem 0 !default;
7-
$button-padding: 0 2rem !default;
8-
$button-height: 4.4rem !default;
9-
$button-border-width: 1px !default;
7+
$button-padding: 0 1em !default;
8+
$button-height: 2.8em !default;
109
$button-border-radius: 4px !default;
1110

12-
$button-round-border-radius: 64px !default;
1311
$button-round-padding: 0 2.6rem !default;
12+
$button-round-border-radius: 64px !default;
1413

1514
$button-color: color(primary) !default;
1615
$button-color-activated: darken-or-lighten($button-color) !default;

‎ionic/components/button/modes/material.scss‎

Lines changed: 1 addition & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44

55
$button-md-font-size: 1.4rem !default;
66
$button-md-min-height: 3.6rem !default;
7-
$button-md-padding: 0 1.6rem !default;
7+
$button-md-padding: 0 1.2em !default;
88
$button-md-box-shadow: 0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12) !default;
99
$button-md-box-shadow-active: 0 4px 5px 0 rgba(0, 0, 0, 0.14),0 1px 10px 0 rgba(0, 0, 0, 0.12),0 2px 4px -1px rgba(0, 0, 0, 0.2); //0 1px 3px 0 rgba(0, 0, 0, 0.3); //0 2px 5px 0 rgba(0, 0, 0, 0.26) !default;
1010
$button-md-border-radius: 2px !default;
@@ -72,14 +72,12 @@ $button-md-clear-active-bg-color: rgba(158, 158, 158, 0.2);
7272

7373
&[large] {
7474
padding: 0 $button-large-padding;
75-
min-width: ($button-large-padding * 4);
7675
min-height: $button-large-height;
7776
font-size: $button-large-font-size;
7877
}
7978

8079
&[small] {
8180
padding: 0 $button-small-padding;
82-
min-width: ($button-small-padding * 3);
8381
min-height: $button-small-height;
8482
font-size: $button-small-font-size;
8583
}
@@ -90,10 +88,6 @@ $button-md-clear-active-bg-color: rgba(158, 158, 158, 0.2);
9088

9189
&.icon-only {
9290
padding: 0;
93-
94-
icon {
95-
padding: 0 1.6rem;
96-
}
9791
}
9892

9993
// Generate iOS Checkbox Auxiliary Colors

‎ionic/components/card/card.scss‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,12 @@
33
// --------------------------------------------------
44

55

6-
.card {
6+
ion-card {
77
display: block;
88
}
99

10-
.card img {
10+
ion-card img {
11+
display: block;
1112
width: 100%;
1213
}
1314

‎ionic/components/card/card.ts‎

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -8,10 +8,7 @@ import * as util from 'ionic/util';
88

99

1010
@IonicDirective({
11-
selector: 'ion-card',
12-
host: {
13-
'class': 'list'
14-
}
11+
selector: 'ion-card'
1512
})
1613
export class Card extends Ion {
1714
constructor(elementRef: ElementRef, ionicConfig: IonicConfig) {

‎ionic/components/card/modes/ios.scss‎

Lines changed: 38 additions & 18 deletions

0 commit comments

Comments
 (0)