diff --git a/scss/ionic-ios7/ionic-ios7.scss b/scss/ionic-ios7/ionic-ios7.scss
index 1c6df019d0..4cf967eb0c 100644
--- a/scss/ionic-ios7/ionic-ios7.scss
+++ b/scss/ionic-ios7/ionic-ios7.scss
@@ -9,8 +9,6 @@
// Base
"../ionic/reset",
"../ionic/scaffolding",
- "../ionic/platform",
- "../ionic/util",
"../ionic/type",
// Nav
@@ -38,3 +36,6 @@
// Animations
"../ionic/animations";
+
+ // Util
+ "../ionic/util";
diff --git a/scss/ionic/_button.scss b/scss/ionic/_button.scss
index 0b5780a009..7f39195206 100644
--- a/scss/ionic/_button.scss
+++ b/scss/ionic/_button.scss
@@ -1,11 +1,10 @@
.button {
position: relative;
- display: block;
+ display: inline-block;
- //margin: $button-block-margin;
+ margin: 0;
padding: $button-padding;
- width: 100%;
border-width: 0;
border-style: solid;
@@ -22,8 +21,6 @@
cursor: pointer;
&.button-icon {
- display: inline-block;
- margin: 0;
padding: $button-clear-padding;
width: auto;
border: none;
@@ -32,10 +29,7 @@
&.button-clear {
@include transition(opacity .1s);
- display: inline-block;
- margin: 0;
padding: $button-clear-padding;
- width: auto;
border: none;
background: none;
box-shadow: none;
@@ -88,9 +82,6 @@
&.button-outline {
@include transition(opacity .1s);
- display: inline-block;
- margin: 0;
- width: auto;
background: none;
box-shadow: none;
}
@@ -105,26 +96,17 @@
}
}
- &.button-inline {
- display: inline-block;
- margin: 0;
- width: auto;
- }
-
- &.button-block {
- display: block;
- margin: $button-block-margin;
- }
-
}
a.button {
text-decoration: none;
}
+.margin.button,
.margin .button,
.padding .button {
border-right-width: $button-border-width;
border-left-width: $button-border-width;
border-radius: $button-border-radius;
}
+
diff --git a/scss/ionic/_util.scss b/scss/ionic/_util.scss
index 134f8c07f0..a460276bcc 100644
--- a/scss/ionic/_util.scss
+++ b/scss/ionic/_util.scss
@@ -2,7 +2,25 @@
.hide {
display: none !important;
}
+.show {
+ display: block !important;
+}
+.inline {
+ display: inline-block;
+}
+
+.block {
+ display: block;
+ clear: both;
+ &:after {
+ display: block;
+ visibility: hidden;
+ clear: both;
+ height: 0;
+ content: ".";
+ }
+}
// Content Padding
// -------------------------------
@@ -11,29 +29,23 @@
padding: $content-padding;
}
+.padding-top,
.padding-vertical {
padding-top: $content-padding;
- padding-bottom: $content-padding;
}
+.padding-right,
.padding-horizontal {
- padding-left: $content-padding;
padding-right: $content-padding;
}
-.padding-top {
- padding-top: $content-padding;
-}
-
-.padding-right {
- padding-right: $content-padding;
-}
-
-.padding-bottom {
+.padding-bottom,
+.padding-vertical {
padding-bottom: $content-padding;
}
-.padding-left {
+.padding-left,
+.padding-horizontal {
padding-left: $content-padding;
}
@@ -45,29 +57,23 @@
margin: $inset-margin;
}
+.margin-top,
.margin-vertical {
margin-top: $inset-margin;
- margin-bottom: $inset-margin;
}
+.margin-right,
.margin-horizontal {
- margin-left: $inset-margin;
margin-right: $inset-margin;
}
-.margin-top {
- margin-top: $inset-margin;
-}
-
-.margin-right {
- margin-right: $inset-margin;
-}
-
-.margin-bottom {
+.margin-bottom,
+.margin-vertical {
margin-bottom: $inset-margin;
}
-.margin-left {
+.margin-left,
+.margin-horizontal {
margin-left: $inset-margin;
}
diff --git a/scss/ionic/ionic-scoped.scss b/scss/ionic/ionic-scoped.scss
index e7a72c2c7f..db7533fd38 100644
--- a/scss/ionic/ionic-scoped.scss
+++ b/scss/ionic/ionic-scoped.scss
@@ -12,7 +12,6 @@
// Base
"reset",
"scaffolding",
- "util",
"type",
// Action Sheet
@@ -45,6 +44,8 @@
// Animations
"animations",
+ // Util
+ "util",
"platform";
}
\ No newline at end of file
diff --git a/scss/ionic/ionic.scss b/scss/ionic/ionic.scss
index d3587f980a..ccb9fdd7b3 100644
--- a/scss/ionic/ionic.scss
+++ b/scss/ionic/ionic.scss
@@ -10,7 +10,6 @@
// Base
"reset",
"scaffolding",
- "util",
"type",
// Action Sheet
@@ -45,4 +44,6 @@
// Animations
"animations",
+ // Util
+ "util",
"platform";
diff --git a/test/buttons.html b/test/buttons.html
index dcd012f54f..fba400fcb3 100644
--- a/test/buttons.html
+++ b/test/buttons.html
@@ -18,19 +18,7 @@
- Default (Block w/out padding)
+ Block w/out padding
- Default
- Secondary
- Primary
- Info
- Success
- Warning
- Danger
- Dark
+ Default
+ Secondary
+ Primary
+ Info
+ Success
+ Warning
+ Danger
+ Dark
- Default (Block w/out padding and parent .margin)
+ Block w/out parent padding but parent .margin
- Default
- Secondary
- Primary
- Info
- Success
- Warning
- Danger
- Dark
+ Default
+ Secondary
+ Primary
+ Info
+ Success
+ Warning
+ Danger
+ Dark
+
+
+ <a> .block .margin set on each button and nothing on the parent
+
+ Default
+ Secondary
+ Primary
+ Info
+ Success
+ Warning
+ Danger
+ Dark
+
+
+ <button> .block .margin set on each button and nothing on the parent
+
+
+
+
+
+
+
+
+
+
+
+
+ Homepage