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

.button-full updates

Browse Source
This commit is contained in:
Adam Bradley
2013-10-16 13:45:56 -05:00
parent ebab110ffa
commit 073b30c818
6 changed files with 78 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
dist/css/ionic-ios7.css vendored
View File

@@ -346,6 +346,14 @@ body, .ionic-body {
width: 100%;
height: 100%; }
.content:before,
.content:after {
content: "\00a0";
/* No-break space character */
display: block;
overflow: hidden;
height: 0; }
/* Hack to force all relatively and absolutely positioned elements still render while scrolling
Note: This is a bug for "-webkit-overflow-scrolling: touch" (via ratchet) */
.content > * {
@@ -1751,19 +1759,25 @@ input[type="checkbox"][readonly] {
background: none;
box-shadow: none;
text-shadow: 0px 0px 10px white; }
.button.block {
.button.block, .button.button-full {
margin-top: 10px;
margin-bottom: 10px; }
.padding > .button.block:first-child {
margin-top: 0; }
.button-full,
.button-full > .button {
display: block;
margin-right: 0;
margin-left: 0;
border-right-width: 0;
border-left-width: 0;
border-radius: 0; }
button.block {
button.block,
button.button-full,
.button-full > button.button {
width: 100%; }
a.button {

16
dist/css/ionic-scoped.css vendored
View File

@@ -1089,6 +1089,13 @@
left: 0;
width: 100%;
height: 100%; }
.ionic .content:before,
.ionic .content:after {
content: "\00a0";
/* No-break space character */
display: block;
overflow: hidden;
height: 0; }
.ionic .content > * {
-webkit-transform: translateZ(0px);
transform: translateZ(0px); }
@@ -2397,17 +2404,22 @@
background: none;
box-shadow: none;
text-shadow: 0px 0px 10px white; }
.ionic .button.block {
.ionic .button.block, .ionic .button.button-full {
margin-top: 10px;
margin-bottom: 10px; }
.ionic .padding > .button.block:first-child {
margin-top: 0; }
.ionic .button-full,
.ionic .button-full > .button {
display: block;
margin-right: 0;
margin-left: 0;
border-right-width: 0;
border-left-width: 0;
border-radius: 0; }
.ionic button.block {
.ionic button.block,
.ionic button.button-full,
.ionic .button-full > button.button {
width: 100%; }
.ionic a.button {
text-decoration: none; }

18
dist/css/ionic.css vendored
View File

@@ -1410,6 +1410,14 @@ body, .ionic-body {
width: 100%;
height: 100%; }
.content:before,
.content:after {
content: "\00a0";
/* No-break space character */
display: block;
overflow: hidden;
height: 0; }
/* Hack to force all relatively and absolutely positioned elements still render while scrolling
Note: This is a bug for "-webkit-overflow-scrolling: touch" (via ratchet) */
.content > * {
@@ -2876,19 +2884,25 @@ input[type="checkbox"][readonly] {
background: none;
box-shadow: none;
text-shadow: 0px 0px 10px white; }
.button.block {
.button.block, .button.button-full {
margin-top: 10px;
margin-bottom: 10px; }
.padding > .button.block:first-child {
margin-top: 0; }
.button-full,
.button-full > .button {
display: block;
margin-right: 0;
margin-left: 0;
border-right-width: 0;
border-left-width: 0;
border-radius: 0; }
button.block {
button.block,
button.button-full,
.button-full > button.button {
width: 100%; }
a.button {

11
scss/ionic/_button.scss
View File

@@ -95,15 +95,20 @@
}
}
&.block {
&.block, &.button-full {
margin-top: $button-block-margin;
margin-bottom: $button-block-margin;
}
}
.padding > .button.block:first-child {
margin-top: 0;
}
.button-full,
.button-full > .button {
display: block;
margin-right: 0;
margin-left: 0;
border-right-width: 0;
@@ -111,7 +116,9 @@
border-radius: 0;
}
button.block {
button.block,
button.button-full,
.button-full > button.button {
width: 100%;
}

8
scss/ionic/_scaffolding.scss
View File

@@ -55,7 +55,13 @@ body, .ionic-body {
height: 100%;
}
.content {
.content:before,
.content:after {
// Uncollapse content margin if child elements DO have an margin
content: "\00a0"; /* No-break space character */
display: block;
overflow: hidden;
height: 0;
}
/* Hack to force all relatively and absolutely positioned elements still render while scrolling
Note: This is a bug for "-webkit-overflow-scrolling: touch" (via ratchet) */

32
test/buttons.html
View File

@@ -243,28 +243,28 @@
<h3>a.block (.button-full on the parent)</h3>
<p class="button-full">
<a class="button block button-default">.button-default</a>
<a class="button block button-secondary">.button-secondary</a>
<a class="button block button-primary">.button-primary</a>
<a class="button block button-info">.button-info</a>
<a class="button block button-success">.button-success</a>
<a class="button block button-warning">.button-warning</a>
<a class="button block button-danger">.button-danger</a>
<a class="button block button-dark">.button-dark</a>
<a class="button button-default">.button-default</a>
<a class="button button-secondary">.button-secondary</a>
<a class="button button-primary">.button-primary</a>
<a class="button button-info">.button-info</a>
<a class="button button-success">.button-success</a>
<a class="button button-warning">.button-warning</a>
<a class="button button-danger">.button-danger</a>
<a class="button button-dark">.button-dark</a>
</p>
<hr>
<h3>button.block.button-full on each button and nothing on the parent</h3>
<p>
<button class="button block button-full button-default">.button-default</button>
<button class="button block button-full button-secondary">.button-secondary</button>
<button class="button block button-full button-primary">.button-primary</button>
<button class="button block button-full button-info">.button-info</button>
<button class="button block button-full button-success">.button-success</button>
<button class="button block button-full button-warning">.button-warning</button>
<button class="button block button-full button-danger">.button-danger</button>
<button class="button block button-full button-dark">.button-dark</button>
<button class="button button-full button-default">.button-default</button>
<button class="button button-full button-secondary">.button-secondary</button>
<button class="button button-full button-primary">.button-primary</button>
<button class="button button-full button-info">.button-info</button>
<button class="button button-full button-success">.button-success</button>
<button class="button button-full button-warning">.button-warning</button>
<button class="button button-full button-danger">.button-danger</button>
<button class="button button-full button-dark">.button-dark</button>
</p>
<hr>