mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-11-07 06:57:02 +08:00
asdf
This commit is contained in:
0
dist/css/fonts/ionicons.eot
vendored
Normal file → Executable file
0
dist/css/fonts/ionicons.eot
vendored
Normal file → Executable file
4
dist/css/fonts/ionicons.svg
vendored
Normal file → Executable file
4
dist/css/fonts/ionicons.svg
vendored
Normal file → Executable file
@ -11,8 +11,8 @@
|
|||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
"licenseURL": "http://opensource.org/licenses/MIT",
|
"licenseURL": "http://opensource.org/licenses/MIT",
|
||||||
"version": "Version 1.2.3",
|
"version": "Version 1.2.3",
|
||||||
"fontId": "Ionicons",
|
"fontId": "ionicons",
|
||||||
"psName": "Ionicons",
|
"psName": "ionicons",
|
||||||
"subFamily": "Regular",
|
"subFamily": "Regular",
|
||||||
"fullName": "Ionicons",
|
"fullName": "Ionicons",
|
||||||
"description": "Generated by IcoMoon"
|
"description": "Generated by IcoMoon"
|
||||||
|
|||||||
|
Before Width: | Height: | Size: 248 KiB After Width: | Height: | Size: 248 KiB |
0
dist/css/fonts/ionicons.ttf
vendored
Normal file → Executable file
0
dist/css/fonts/ionicons.ttf
vendored
Normal file → Executable file
0
dist/css/fonts/ionicons.woff
vendored
Normal file → Executable file
0
dist/css/fonts/ionicons.woff
vendored
Normal file → Executable file
257
dist/css/ionic-ios7.css
vendored
257
dist/css/ionic-ios7.css
vendored
@ -16,7 +16,7 @@ h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
|||||||
a, abbr, acronym, address, big, cite, code,
|
a, abbr, acronym, address, big, cite, code,
|
||||||
del, dfn, em, img, ins, kbd, q, s, samp,
|
del, dfn, em, img, ins, kbd, q, s, samp,
|
||||||
small, strike, strong, sub, sup, tt, var,
|
small, strike, strong, sub, sup, tt, var,
|
||||||
b, u, i, center,
|
b, u, center,
|
||||||
dl, dt, dd, ol, ul, li,
|
dl, dt, dd, ol, ul, li,
|
||||||
fieldset, form, label, legend,
|
fieldset, form, label, legend,
|
||||||
table, caption, tbody, tfoot, thead, tr, th, td,
|
table, caption, tbody, tfoot, thead, tr, th, td,
|
||||||
@ -182,7 +182,7 @@ sub {
|
|||||||
fieldset {
|
fieldset {
|
||||||
margin: 0 2px;
|
margin: 0 2px;
|
||||||
padding: 0.35em 0.625em 0.75em;
|
padding: 0.35em 0.625em 0.75em;
|
||||||
border: 1px solid silver; }
|
border: 1px solid #c0c0c0; }
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 1. Correct `color` not being inherited in IE 8/9.
|
* 1. Correct `color` not being inherited in IE 8/9.
|
||||||
@ -556,8 +556,8 @@ a.subdued {
|
|||||||
border-style: solid;
|
border-style: solid;
|
||||||
border-top: 1px solid transparent;
|
border-top: 1px solid transparent;
|
||||||
border-bottom: 1px solid #dddddd;
|
border-bottom: 1px solid #dddddd;
|
||||||
background-size: 0;
|
background-color: white;
|
||||||
background-color: white; }
|
background-size: 0; }
|
||||||
@media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
|
@media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
|
||||||
.bar {
|
.bar {
|
||||||
border-top: none !important;
|
border-top: none !important;
|
||||||
@ -646,20 +646,17 @@ a.subdued {
|
|||||||
.bar .title a {
|
.bar .title a {
|
||||||
color: inherit; }
|
color: inherit; }
|
||||||
.bar > .button {
|
.bar > .button {
|
||||||
box-flex: 1;
|
|
||||||
-webkit-box-flex: 0;
|
|
||||||
-moz-box-flex: 0;
|
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
margin: 0;
|
padding: 0 8px;
|
||||||
padding: 2px 8px 0 8px;
|
min-height: 31px;
|
||||||
min-height: 33px;
|
|
||||||
background-color: transparent;
|
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
line-height: 28px; }
|
line-height: 30px; }
|
||||||
.bar > .button i, .bar > .button .icon {
|
.bar > .button i, .bar > .button .icon {
|
||||||
margin-top: 1px; }
|
font-size: 24px;
|
||||||
.bar .button-bar {
|
line-height: 29px; }
|
||||||
line-height: 18px; }
|
.bar .button-bar > .button {
|
||||||
|
min-height: 31px;
|
||||||
|
line-height: 31px; }
|
||||||
.bar .button-bar + .button, .bar .button + .button-bar {
|
.bar .button-bar + .button, .bar .button + .button-bar {
|
||||||
margin-left: 5px; }
|
margin-left: 5px; }
|
||||||
.bar .title + .button:last-child,
|
.bar .title + .button:last-child,
|
||||||
@ -835,9 +832,17 @@ a.subdued {
|
|||||||
* A navigation bar with any number of tab items supported.
|
* A navigation bar with any number of tab items supported.
|
||||||
*/
|
*/
|
||||||
.tabs {
|
.tabs {
|
||||||
box-orient: horizontal;
|
display: -webkit-box;
|
||||||
|
display: -webkit-flex;
|
||||||
|
display: -moz-flex;
|
||||||
|
display: -ms-flexbox;
|
||||||
|
display: flex;
|
||||||
|
-webkit-box-direction: normal;
|
||||||
-webkit-box-orient: horizontal;
|
-webkit-box-orient: horizontal;
|
||||||
-moz-box-orient: horizontal;
|
-webkit-flex-direction: horizontal;
|
||||||
|
-moz-flex-direction: horizontal;
|
||||||
|
-ms-flex-direction: horizontal;
|
||||||
|
flex-direction: horizontal;
|
||||||
background-color: white;
|
background-color: white;
|
||||||
background-image: linear-gradient(0deg, #dddddd, #dddddd 50%, transparent 50%);
|
background-image: linear-gradient(0deg, #dddddd, #dddddd 50%, transparent 50%);
|
||||||
border-color: #dddddd;
|
border-color: #dddddd;
|
||||||
@ -845,8 +850,6 @@ a.subdued {
|
|||||||
position: fixed;
|
position: fixed;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
z-index: 5;
|
z-index: 5;
|
||||||
display: -webkit-box;
|
|
||||||
display: box;
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 49px;
|
height: 49px;
|
||||||
border-style: solid;
|
border-style: solid;
|
||||||
@ -906,13 +909,16 @@ a.subdued {
|
|||||||
top: 44px; }
|
top: 44px; }
|
||||||
|
|
||||||
.tab-item {
|
.tab-item {
|
||||||
box-flex: 1;
|
|
||||||
-webkit-box-flex: 1;
|
-webkit-box-flex: 1;
|
||||||
|
-webkit-flex: 1;
|
||||||
-moz-box-flex: 1;
|
-moz-box-flex: 1;
|
||||||
display: block;
|
-moz-flex: 1;
|
||||||
|
-ms-flex: 1;
|
||||||
|
flex: 1;
|
||||||
|
display: inline-block;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
width: 0;
|
margin: auto;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
color: inherit;
|
color: inherit;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
@ -970,6 +976,16 @@ a.subdued {
|
|||||||
.tab-item.active.tab-item-dark, .tab-item:active.tab-item-dark {
|
.tab-item.active.tab-item-dark, .tab-item:active.tab-item-dark {
|
||||||
color: #444444; }
|
color: #444444; }
|
||||||
|
|
||||||
|
.item.tabs {
|
||||||
|
display: -webkit-box;
|
||||||
|
display: -webkit-flex;
|
||||||
|
display: -moz-flex;
|
||||||
|
display: -ms-flexbox;
|
||||||
|
display: flex;
|
||||||
|
padding: 0; }
|
||||||
|
.item.tabs i, .item.tabs .icon {
|
||||||
|
position: relative; }
|
||||||
|
|
||||||
.menu {
|
.menu {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 0;
|
||||||
@ -1198,7 +1214,9 @@ a.item {
|
|||||||
font-size: 32px; }
|
font-size: 32px; }
|
||||||
|
|
||||||
.item .fill-icon {
|
.item .fill-icon {
|
||||||
font-size: 28px; }
|
font-size: 28px;
|
||||||
|
min-width: 30px;
|
||||||
|
min-height: 30px; }
|
||||||
|
|
||||||
.item-icon-left {
|
.item-icon-left {
|
||||||
padding-left: 45px; }
|
padding-left: 45px; }
|
||||||
@ -1273,23 +1291,23 @@ button.item-icon-right:after {
|
|||||||
border-radius: 4px; }
|
border-radius: 4px; }
|
||||||
|
|
||||||
.item-thumbnail-left {
|
.item-thumbnail-left {
|
||||||
padding-left: 95px;
|
padding-left: 105px;
|
||||||
min-height: 80px; }
|
min-height: 100px; }
|
||||||
.item-thumbnail-left img:first-child, .item-thumbnail-left .item-image {
|
.item-thumbnail-left img:first-child, .item-thumbnail-left .item-image {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 10px;
|
||||||
left: 0;
|
left: 10px;
|
||||||
max-width: 80px;
|
max-width: 80px;
|
||||||
max-height: 80px;
|
max-height: 80px;
|
||||||
width: 100%; }
|
width: 100%; }
|
||||||
|
|
||||||
.item-thumbnail-right {
|
.item-thumbnail-right {
|
||||||
padding-right: 95px;
|
padding-right: 105px;
|
||||||
min-height: 80px; }
|
min-height: 100px; }
|
||||||
.item-thumbnail-right img:first-child, .item-thumbnail-right .item-image {
|
.item-thumbnail-right img:first-child, .item-thumbnail-right .item-image {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 10px;
|
||||||
right: 0;
|
right: 10px;
|
||||||
max-width: 80px;
|
max-width: 80px;
|
||||||
max-height: 80px;
|
max-height: 80px;
|
||||||
width: 100%; }
|
width: 100%; }
|
||||||
@ -1313,12 +1331,18 @@ button.item-icon-right:after {
|
|||||||
.item-divider {
|
.item-divider {
|
||||||
margin: -1px;
|
margin: -1px;
|
||||||
padding: 5px 15px;
|
padding: 5px 15px;
|
||||||
|
min-height: 30px;
|
||||||
border: none;
|
border: none;
|
||||||
background-color: whitesmoke;
|
background-color: whitesmoke;
|
||||||
box-shadow: inset 0 0 1px #666666;
|
box-shadow: inset 0 0 1px #666666;
|
||||||
color: #222222;
|
color: #222222;
|
||||||
font-weight: bold; }
|
font-weight: bold; }
|
||||||
|
|
||||||
|
.item-note {
|
||||||
|
float: right;
|
||||||
|
color: #aaa;
|
||||||
|
font-size: 14px; }
|
||||||
|
|
||||||
.item-sliding {
|
.item-sliding {
|
||||||
-webkit-transition: -webkit-transform 0.1s ease-in-out; }
|
-webkit-transition: -webkit-transform 0.1s ease-in-out; }
|
||||||
|
|
||||||
@ -1424,11 +1448,6 @@ button.item-icon-right:after {
|
|||||||
padding-right: 1px;
|
padding-right: 1px;
|
||||||
padding-left: 1px; }
|
padding-left: 1px; }
|
||||||
|
|
||||||
.item-label-right {
|
|
||||||
float: right;
|
|
||||||
color: #aaa;
|
|
||||||
font-size: 14px; }
|
|
||||||
|
|
||||||
/*
|
/*
|
||||||
A card and list-inset are close to the same thing, except a card as a box shadow.
|
A card and list-inset are close to the same thing, except a card as a box shadow.
|
||||||
*/
|
*/
|
||||||
@ -1663,7 +1682,7 @@ input[type="file"] {
|
|||||||
line-height: 34px; }
|
line-height: 34px; }
|
||||||
|
|
||||||
select {
|
select {
|
||||||
border: 1px solid #cccccc;
|
border: 1px solid #ccc;
|
||||||
background-color: white; }
|
background-color: white; }
|
||||||
|
|
||||||
select[multiple],
|
select[multiple],
|
||||||
@ -1735,7 +1754,7 @@ input[type="checkbox"][readonly] {
|
|||||||
right: 20px;
|
right: 20px;
|
||||||
transition: 0.2s ease;
|
transition: 0.2s ease;
|
||||||
transition-property: left, right;
|
transition-property: left, right;
|
||||||
transition-delay: 0s, 0.05s; }
|
transition-delay: 0s, .05s; }
|
||||||
|
|
||||||
.toggle :checked + .track {
|
.toggle :checked + .track {
|
||||||
/* When the toggle is "on" */
|
/* When the toggle is "on" */
|
||||||
@ -1750,7 +1769,7 @@ input[type="checkbox"][readonly] {
|
|||||||
right: 0;
|
right: 0;
|
||||||
left: 20px;
|
left: 20px;
|
||||||
-webkit-transform: none;
|
-webkit-transform: none;
|
||||||
transition-delay: 0.05s, 0s; }
|
transition-delay: .05s, 0s; }
|
||||||
|
|
||||||
.item-radio {
|
.item-radio {
|
||||||
padding: 0; }
|
padding: 0; }
|
||||||
@ -1814,8 +1833,9 @@ input[type="range"] {
|
|||||||
position: relative;
|
position: relative;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 10px 12px 7px 12px;
|
padding: 0 12px;
|
||||||
min-height: 44px;
|
padding-top: 1px;
|
||||||
|
min-height: 42px;
|
||||||
border-width: 1px;
|
border-width: 1px;
|
||||||
border-style: solid;
|
border-style: solid;
|
||||||
border-radius: 2px;
|
border-radius: 2px;
|
||||||
@ -1824,24 +1844,24 @@ input[type="range"] {
|
|||||||
text-align: center;
|
text-align: center;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
line-height: 23px;
|
line-height: 41px;
|
||||||
cursor: pointer; }
|
cursor: pointer; }
|
||||||
.button i, .button .icon {
|
.button i, .button .icon {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
padding: 0;
|
padding: 0 0 1px 0;
|
||||||
vertical-align: inherit;
|
vertical-align: inherit;
|
||||||
font-size: 24px;
|
font-size: 24px;
|
||||||
line-height: 22px; }
|
line-height: 40px; }
|
||||||
.button.button-icon {
|
.button.button-icon {
|
||||||
padding: 12px 6px;
|
padding: 2px 4px;
|
||||||
background: none; }
|
background: none; }
|
||||||
.button.button-icon i, .button.button-icon .icon {
|
.button.button-icon i, .button.button-icon .icon {
|
||||||
font-size: 32px; }
|
font-size: 32px; }
|
||||||
.button.button-clear {
|
.button.button-clear {
|
||||||
-webkit-transition: opacity 0.1s;
|
-webkit-transition: opacity 0.1s;
|
||||||
transition: opacity 0.1s;
|
transition: opacity 0.1s;
|
||||||
padding: 12px 6px;
|
padding: 0 6px;
|
||||||
max-height: 44px;
|
max-height: 42px;
|
||||||
border: none;
|
border: none;
|
||||||
background: none;
|
background: none;
|
||||||
box-shadow: none; }
|
box-shadow: none; }
|
||||||
@ -2034,26 +2054,28 @@ input[type="range"] {
|
|||||||
.button.button-icon:active, .button.button-icon.active {
|
.button.button-icon:active, .button.button-icon.active {
|
||||||
background: none;
|
background: none;
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
text-shadow: 0px 0px 10px white; }
|
text-shadow: 0px 0px 10px #fff; }
|
||||||
.button.block, .button.button-full {
|
.button.block, .button.button-full {
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
margin-bottom: 10px; }
|
margin-bottom: 10px; }
|
||||||
|
|
||||||
.button-small {
|
.button-small {
|
||||||
padding: 1px 8px 1px 8px;
|
padding: 0 4px;
|
||||||
min-height: 32px;
|
min-height: 28px;
|
||||||
line-height: 29px;
|
font-size: 12px;
|
||||||
font-size: 12px; }
|
line-height: 27px; }
|
||||||
.button-small i, .button-small .icon {
|
.button-small i, .button-small .icon {
|
||||||
font-size: 20px;
|
font-size: 16px;
|
||||||
line-height: 26px; }
|
line-height: 26px; }
|
||||||
|
|
||||||
.button-large {
|
.button-large {
|
||||||
padding: 12px 18px 12px 18px;
|
padding: 0 12px;
|
||||||
min-height: 52px;
|
min-height: 54px;
|
||||||
font-size: 24px; }
|
font-size: 18px;
|
||||||
|
line-height: 53px; }
|
||||||
.button-large i, .button-large .icon {
|
.button-large i, .button-large .icon {
|
||||||
font-size: 32px; }
|
font-size: 32px;
|
||||||
|
line-height: 52px; }
|
||||||
|
|
||||||
.padding > .button.block:first-child {
|
.padding > .button.block:first-child {
|
||||||
margin-top: 0; }
|
margin-top: 0; }
|
||||||
@ -2076,45 +2098,45 @@ a.button {
|
|||||||
text-decoration: none; }
|
text-decoration: none; }
|
||||||
|
|
||||||
.button-bar {
|
.button-bar {
|
||||||
box-flex: 1;
|
|
||||||
-webkit-box-flex: 1;
|
|
||||||
-moz-box-flex: 1;
|
|
||||||
box-orient: horizontal;
|
|
||||||
-webkit-box-orient: horizontal;
|
|
||||||
-moz-box-orient: horizontal;
|
|
||||||
display: -webkit-box;
|
display: -webkit-box;
|
||||||
display: box; }
|
display: -webkit-flex;
|
||||||
|
display: -moz-flex;
|
||||||
|
display: -ms-flexbox;
|
||||||
|
display: flex;
|
||||||
|
-webkit-box-flex: 1;
|
||||||
|
-webkit-flex: 1;
|
||||||
|
-moz-box-flex: 1;
|
||||||
|
-moz-flex: 1;
|
||||||
|
-ms-flex: 1;
|
||||||
|
flex: 1;
|
||||||
|
-webkit-box-direction: normal;
|
||||||
|
-webkit-box-orient: horizontal;
|
||||||
|
-webkit-flex-direction: horizontal;
|
||||||
|
-moz-flex-direction: horizontal;
|
||||||
|
-ms-flex-direction: horizontal;
|
||||||
|
flex-direction: horizontal; }
|
||||||
|
|
||||||
.button-bar > .button {
|
.button-bar > .button {
|
||||||
box-flex: 1;
|
|
||||||
-webkit-box-flex: 1;
|
-webkit-box-flex: 1;
|
||||||
|
-webkit-flex: 1;
|
||||||
-moz-box-flex: 1;
|
-moz-box-flex: 1;
|
||||||
display: block;
|
-moz-flex: 1;
|
||||||
|
-ms-flex: 1;
|
||||||
|
flex: 1;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
padding: 8px 16px;
|
padding: 0 16px;
|
||||||
width: 0;
|
width: 0;
|
||||||
border-width: 1px 0px 1px 1px;
|
border-width: 1px 0px 1px 1px;
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
white-space: nowrap;
|
white-space: nowrap; }
|
||||||
line-height: 15px; }
|
|
||||||
.button-bar > .button:first-child {
|
.button-bar > .button:first-child {
|
||||||
border-radius: 2px 0px 0px 2px; }
|
border-radius: 2px 0px 0px 2px; }
|
||||||
.button-bar > .button:last-child {
|
.button-bar > .button:last-child {
|
||||||
border-right-width: 1px;
|
border-right-width: 1px;
|
||||||
border-radius: 0px 2px 2px 0px; }
|
border-radius: 0px 2px 2px 0px; }
|
||||||
|
|
||||||
.buttons {
|
|
||||||
box-flex: 1;
|
|
||||||
-webkit-box-flex: 1;
|
|
||||||
-moz-box-flex: 1;
|
|
||||||
box-orient: horizontal;
|
|
||||||
-webkit-box-orient: horizontal;
|
|
||||||
-moz-box-orient: horizontal;
|
|
||||||
display: -webkit-box;
|
|
||||||
display: box; }
|
|
||||||
|
|
||||||
.badge {
|
.badge {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
min-width: 10px;
|
min-width: 10px;
|
||||||
@ -2349,6 +2371,45 @@ a.button {
|
|||||||
-webkit-transform: rotate(360deg);
|
-webkit-transform: rotate(360deg);
|
||||||
transform: rotate(360deg); } }
|
transform: rotate(360deg); } }
|
||||||
|
|
||||||
|
i.icon-default, .icon.icon-default {
|
||||||
|
color: white; }
|
||||||
|
|
||||||
|
i.icon-secondary, .icon.icon-secondary {
|
||||||
|
color: gainsboro; }
|
||||||
|
|
||||||
|
i.icon-primary, .icon.icon-primary {
|
||||||
|
color: #4a87ee; }
|
||||||
|
|
||||||
|
i.icon-info, .icon.icon-info {
|
||||||
|
color: #43cee6; }
|
||||||
|
|
||||||
|
i.icon-success, .icon.icon-success {
|
||||||
|
color: #66cc33; }
|
||||||
|
|
||||||
|
i.icon-warning, .icon.icon-warning {
|
||||||
|
color: #f0b840; }
|
||||||
|
|
||||||
|
i.icon-danger, .icon.icon-danger {
|
||||||
|
color: #ef4e3a; }
|
||||||
|
|
||||||
|
i.icon-dark, .icon.icon-dark {
|
||||||
|
color: #444444; }
|
||||||
|
|
||||||
|
i.icon-gray-darker, .icon.icon-gray-darker {
|
||||||
|
color: #222222; }
|
||||||
|
|
||||||
|
i.icon-gray-dark, .icon.icon-gray-dark {
|
||||||
|
color: #333333; }
|
||||||
|
|
||||||
|
i.icon-gray, .icon.icon-gray {
|
||||||
|
color: #555555; }
|
||||||
|
|
||||||
|
i.icon-gray-light, .icon.icon-gray-light {
|
||||||
|
color: #999999; }
|
||||||
|
|
||||||
|
i.icon-gray-lighter, .icon.icon-gray-lighter {
|
||||||
|
color: #999999; }
|
||||||
|
|
||||||
.fill-icon {
|
.fill-icon {
|
||||||
color: white !important; }
|
color: white !important; }
|
||||||
.fill-icon:before {
|
.fill-icon:before {
|
||||||
@ -2356,31 +2417,31 @@ a.button {
|
|||||||
position: relative;
|
position: relative;
|
||||||
border-radius: 6px;
|
border-radius: 6px;
|
||||||
padding: 1px; }
|
padding: 1px; }
|
||||||
.fill-icon.brand-default:before {
|
.fill-icon.icon-default:before {
|
||||||
background: white; }
|
background: white; }
|
||||||
.fill-icon.brand-secondary:before {
|
.fill-icon.icon-secondary:before {
|
||||||
background: whitesmoke; }
|
background: whitesmoke; }
|
||||||
.fill-icon.brand-primary:before {
|
.fill-icon.icon-primary:before {
|
||||||
background: #4a87ee; }
|
background: #4a87ee; }
|
||||||
.fill-icon.brand-info:before {
|
.fill-icon.icon-info:before {
|
||||||
background: #43cee6; }
|
background: #43cee6; }
|
||||||
.fill-icon.brand-success:before {
|
.fill-icon.icon-success:before {
|
||||||
background: #66cc33; }
|
background: #66cc33; }
|
||||||
.fill-icon.brand-warning:before {
|
.fill-icon.icon-warning:before {
|
||||||
background: #f0b840; }
|
background: #f0b840; }
|
||||||
.fill-icon.brand-danger:before {
|
.fill-icon.icon-danger:before {
|
||||||
background: #ef4e3a; }
|
background: #ef4e3a; }
|
||||||
.fill-icon.brand-dark:before {
|
.fill-icon.icon-dark:before {
|
||||||
background: #444444; }
|
background: #444444; }
|
||||||
.fill-icon.gray-darker:before {
|
.fill-icon.icon-gray-darker:before {
|
||||||
background: #222222; }
|
background: #222222; }
|
||||||
.fill-icon.gray-dark:before {
|
.fill-icon.icon-gray-dark:before {
|
||||||
background: #333333; }
|
background: #333333; }
|
||||||
.fill-icon.gray:before {
|
.fill-icon.icon-gray:before {
|
||||||
background: #555555; }
|
background: #555555; }
|
||||||
.fill-icon.gray-light:before {
|
.fill-icon.icon-gray-light:before {
|
||||||
background: #999999; }
|
background: #999999; }
|
||||||
.fill-icon.gray-lighter:before {
|
.fill-icon.icon-gray-lighter:before {
|
||||||
background: #eeeeee; }
|
background: #eeeeee; }
|
||||||
|
|
||||||
.icon-loading {
|
.icon-loading {
|
||||||
@ -2392,9 +2453,9 @@ a.button {
|
|||||||
line-height: 1;
|
line-height: 1;
|
||||||
-webkit-font-smoothing: antialiased;
|
-webkit-font-smoothing: antialiased;
|
||||||
-moz-osx-font-smoothing: grayscale;
|
-moz-osx-font-smoothing: grayscale;
|
||||||
-webkit-animation: spin 0.75s linear infinite;
|
-webkit-animation: spin .75s linear infinite;
|
||||||
-moz-animation: spin 0.75s linear infinite;
|
-moz-animation: spin .75s linear infinite;
|
||||||
animation: spin 0.75s linear infinite; }
|
animation: spin .75s linear infinite; }
|
||||||
.icon-loading:before {
|
.icon-loading:before {
|
||||||
content: "\e144"; }
|
content: "\e144"; }
|
||||||
|
|
||||||
@ -2407,9 +2468,9 @@ a.button {
|
|||||||
line-height: 1;
|
line-height: 1;
|
||||||
-webkit-font-smoothing: antialiased;
|
-webkit-font-smoothing: antialiased;
|
||||||
-moz-osx-font-smoothing: grayscale;
|
-moz-osx-font-smoothing: grayscale;
|
||||||
-webkit-animation: spin 0.75s linear infinite;
|
-webkit-animation: spin .75s linear infinite;
|
||||||
-moz-animation: spin 0.75s linear infinite;
|
-moz-animation: spin .75s linear infinite;
|
||||||
animation: spin 0.75s linear infinite; }
|
animation: spin .75s linear infinite; }
|
||||||
.icon-refreshing:before {
|
.icon-refreshing:before {
|
||||||
content: "\e144"; }
|
content: "\e144"; }
|
||||||
|
|
||||||
|
|||||||
254
dist/css/ionic-scoped.css
vendored
254
dist/css/ionic-scoped.css
vendored
@ -213,12 +213,12 @@
|
|||||||
transform: rotate(360deg); } }
|
transform: rotate(360deg); } }
|
||||||
}
|
}
|
||||||
.ionic i, .ionic .icon {
|
.ionic i, .ionic .icon {
|
||||||
font-family: 'ionicons';
|
font-family: 'ionicons' !important;
|
||||||
speak: none;
|
speak: none !important;
|
||||||
font-style: normal;
|
font-style: normal !important;
|
||||||
font-weight: normal;
|
font-weight: normal !important;
|
||||||
font-variant: normal;
|
font-variant: normal !important;
|
||||||
text-transform: none;
|
text-transform: none !important;
|
||||||
line-height: 1;
|
line-height: 1;
|
||||||
/* Better Font Rendering =========== */
|
/* Better Font Rendering =========== */
|
||||||
-webkit-font-smoothing: antialiased;
|
-webkit-font-smoothing: antialiased;
|
||||||
@ -1108,7 +1108,7 @@
|
|||||||
.ionic a, .ionic abbr, .ionic acronym, .ionic address, .ionic big, .ionic cite, .ionic code,
|
.ionic a, .ionic abbr, .ionic acronym, .ionic address, .ionic big, .ionic cite, .ionic code,
|
||||||
.ionic del, .ionic dfn, .ionic em, .ionic img, .ionic ins, .ionic kbd, .ionic q, .ionic s, .ionic samp,
|
.ionic del, .ionic dfn, .ionic em, .ionic img, .ionic ins, .ionic kbd, .ionic q, .ionic s, .ionic samp,
|
||||||
.ionic small, .ionic strike, .ionic strong, .ionic sub, .ionic sup, .ionic tt, .ionic var,
|
.ionic small, .ionic strike, .ionic strong, .ionic sub, .ionic sup, .ionic tt, .ionic var,
|
||||||
.ionic b, .ionic u, .ionic i, .ionic center,
|
.ionic b, .ionic u, .ionic center,
|
||||||
.ionic dl, .ionic dt, .ionic dd, .ionic ol, .ionic ul, .ionic li,
|
.ionic dl, .ionic dt, .ionic dd, .ionic ol, .ionic ul, .ionic li,
|
||||||
.ionic fieldset, .ionic form, .ionic label, .ionic legend,
|
.ionic fieldset, .ionic form, .ionic label, .ionic legend,
|
||||||
.ionic table, .ionic caption, .ionic tbody, .ionic tfoot, .ionic thead, .ionic tr, .ionic th, .ionic td,
|
.ionic table, .ionic caption, .ionic tbody, .ionic tfoot, .ionic thead, .ionic tr, .ionic th, .ionic td,
|
||||||
@ -1195,7 +1195,7 @@
|
|||||||
.ionic fieldset {
|
.ionic fieldset {
|
||||||
margin: 0 2px;
|
margin: 0 2px;
|
||||||
padding: 0.35em 0.625em 0.75em;
|
padding: 0.35em 0.625em 0.75em;
|
||||||
border: 1px solid silver; }
|
border: 1px solid #c0c0c0; }
|
||||||
.ionic legend {
|
.ionic legend {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
/* 2 */
|
/* 2 */
|
||||||
@ -1489,8 +1489,8 @@
|
|||||||
border-style: solid;
|
border-style: solid;
|
||||||
border-top: 1px solid transparent;
|
border-top: 1px solid transparent;
|
||||||
border-bottom: 1px solid #dddddd;
|
border-bottom: 1px solid #dddddd;
|
||||||
background-size: 0;
|
background-color: white;
|
||||||
background-color: white; }
|
background-size: 0; }
|
||||||
@media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
|
@media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
|
||||||
.ionic .bar {
|
.ionic .bar {
|
||||||
border-top: none !important;
|
border-top: none !important;
|
||||||
@ -1579,20 +1579,17 @@
|
|||||||
.ionic .bar .title a {
|
.ionic .bar .title a {
|
||||||
color: inherit; }
|
color: inherit; }
|
||||||
.ionic .bar > .button {
|
.ionic .bar > .button {
|
||||||
box-flex: 1;
|
|
||||||
-webkit-box-flex: 0;
|
|
||||||
-moz-box-flex: 0;
|
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
margin: 0;
|
padding: 0 8px;
|
||||||
padding: 2px 8px 0 8px;
|
min-height: 31px;
|
||||||
min-height: 33px;
|
|
||||||
background-color: transparent;
|
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
line-height: 28px; }
|
line-height: 30px; }
|
||||||
.ionic .bar > .button i, .ionic .bar > .button .icon {
|
.ionic .bar > .button i, .ionic .bar > .button .icon {
|
||||||
margin-top: 1px; }
|
font-size: 24px;
|
||||||
.ionic .bar .button-bar {
|
line-height: 29px; }
|
||||||
line-height: 18px; }
|
.ionic .bar .button-bar > .button {
|
||||||
|
min-height: 31px;
|
||||||
|
line-height: 31px; }
|
||||||
.ionic .bar .button-bar + .button, .ionic .bar .button + .button-bar {
|
.ionic .bar .button-bar + .button, .ionic .bar .button + .button-bar {
|
||||||
margin-left: 5px; }
|
margin-left: 5px; }
|
||||||
.ionic .bar .title + .button:last-child,
|
.ionic .bar .title + .button:last-child,
|
||||||
@ -1749,9 +1746,17 @@
|
|||||||
bottom: 44px;
|
bottom: 44px;
|
||||||
display: block; }
|
display: block; }
|
||||||
.ionic .tabs {
|
.ionic .tabs {
|
||||||
box-orient: horizontal;
|
display: -webkit-box;
|
||||||
|
display: -webkit-flex;
|
||||||
|
display: -moz-flex;
|
||||||
|
display: -ms-flexbox;
|
||||||
|
display: flex;
|
||||||
|
-webkit-box-direction: normal;
|
||||||
-webkit-box-orient: horizontal;
|
-webkit-box-orient: horizontal;
|
||||||
-moz-box-orient: horizontal;
|
-webkit-flex-direction: horizontal;
|
||||||
|
-moz-flex-direction: horizontal;
|
||||||
|
-ms-flex-direction: horizontal;
|
||||||
|
flex-direction: horizontal;
|
||||||
background-color: white;
|
background-color: white;
|
||||||
background-image: linear-gradient(0deg, #dddddd, #dddddd 50%, transparent 50%);
|
background-image: linear-gradient(0deg, #dddddd, #dddddd 50%, transparent 50%);
|
||||||
border-color: #dddddd;
|
border-color: #dddddd;
|
||||||
@ -1759,8 +1764,6 @@
|
|||||||
position: fixed;
|
position: fixed;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
z-index: 5;
|
z-index: 5;
|
||||||
display: -webkit-box;
|
|
||||||
display: box;
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 49px;
|
height: 49px;
|
||||||
border-style: solid;
|
border-style: solid;
|
||||||
@ -1818,13 +1821,16 @@
|
|||||||
.ionic .tabs-top {
|
.ionic .tabs-top {
|
||||||
top: 44px; }
|
top: 44px; }
|
||||||
.ionic .tab-item {
|
.ionic .tab-item {
|
||||||
box-flex: 1;
|
|
||||||
-webkit-box-flex: 1;
|
-webkit-box-flex: 1;
|
||||||
|
-webkit-flex: 1;
|
||||||
-moz-box-flex: 1;
|
-moz-box-flex: 1;
|
||||||
display: block;
|
-moz-flex: 1;
|
||||||
|
-ms-flex: 1;
|
||||||
|
flex: 1;
|
||||||
|
display: inline-block;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
width: 0;
|
margin: auto;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
color: inherit;
|
color: inherit;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
@ -1874,6 +1880,15 @@
|
|||||||
color: #f0b840; }
|
color: #f0b840; }
|
||||||
.ionic .tab-item.active.tab-item-dark, .ionic .tab-item:active.tab-item-dark {
|
.ionic .tab-item.active.tab-item-dark, .ionic .tab-item:active.tab-item-dark {
|
||||||
color: #444444; }
|
color: #444444; }
|
||||||
|
.ionic .item.tabs {
|
||||||
|
display: -webkit-box;
|
||||||
|
display: -webkit-flex;
|
||||||
|
display: -moz-flex;
|
||||||
|
display: -ms-flexbox;
|
||||||
|
display: flex;
|
||||||
|
padding: 0; }
|
||||||
|
.ionic .item.tabs i, .ionic .item.tabs .icon {
|
||||||
|
position: relative; }
|
||||||
.ionic .menu {
|
.ionic .menu {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 0;
|
||||||
@ -2086,7 +2101,9 @@
|
|||||||
height: 100%;
|
height: 100%;
|
||||||
font-size: 32px; }
|
font-size: 32px; }
|
||||||
.ionic .item .fill-icon {
|
.ionic .item .fill-icon {
|
||||||
font-size: 28px; }
|
font-size: 28px;
|
||||||
|
min-width: 30px;
|
||||||
|
min-height: 30px; }
|
||||||
.ionic .item-icon-left {
|
.ionic .item-icon-left {
|
||||||
padding-left: 45px; }
|
padding-left: 45px; }
|
||||||
.ionic .item-icon-left i, .ionic .item-icon-left .icon {
|
.ionic .item-icon-left i, .ionic .item-icon-left .icon {
|
||||||
@ -2151,22 +2168,22 @@
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
border-radius: 4px; }
|
border-radius: 4px; }
|
||||||
.ionic .item-thumbnail-left {
|
.ionic .item-thumbnail-left {
|
||||||
padding-left: 95px;
|
padding-left: 105px;
|
||||||
min-height: 80px; }
|
min-height: 100px; }
|
||||||
.ionic .item-thumbnail-left img:first-child, .ionic .item-thumbnail-left .item-image {
|
.ionic .item-thumbnail-left img:first-child, .ionic .item-thumbnail-left .item-image {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 10px;
|
||||||
left: 0;
|
left: 10px;
|
||||||
max-width: 80px;
|
max-width: 80px;
|
||||||
max-height: 80px;
|
max-height: 80px;
|
||||||
width: 100%; }
|
width: 100%; }
|
||||||
.ionic .item-thumbnail-right {
|
.ionic .item-thumbnail-right {
|
||||||
padding-right: 95px;
|
padding-right: 105px;
|
||||||
min-height: 80px; }
|
min-height: 100px; }
|
||||||
.ionic .item-thumbnail-right img:first-child, .ionic .item-thumbnail-right .item-image {
|
.ionic .item-thumbnail-right img:first-child, .ionic .item-thumbnail-right .item-image {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 10px;
|
||||||
right: 0;
|
right: 10px;
|
||||||
max-width: 80px;
|
max-width: 80px;
|
||||||
max-height: 80px;
|
max-height: 80px;
|
||||||
width: 100%; }
|
width: 100%; }
|
||||||
@ -2187,11 +2204,16 @@
|
|||||||
.ionic .item-divider {
|
.ionic .item-divider {
|
||||||
margin: -1px;
|
margin: -1px;
|
||||||
padding: 5px 15px;
|
padding: 5px 15px;
|
||||||
|
min-height: 30px;
|
||||||
border: none;
|
border: none;
|
||||||
background-color: whitesmoke;
|
background-color: whitesmoke;
|
||||||
box-shadow: inset 0 0 1px #666666;
|
box-shadow: inset 0 0 1px #666666;
|
||||||
color: #222222;
|
color: #222222;
|
||||||
font-weight: bold; }
|
font-weight: bold; }
|
||||||
|
.ionic .item-note {
|
||||||
|
float: right;
|
||||||
|
color: #aaa;
|
||||||
|
font-size: 14px; }
|
||||||
.ionic .item-sliding {
|
.ionic .item-sliding {
|
||||||
-webkit-transition: -webkit-transform 0.1s ease-in-out; }
|
-webkit-transition: -webkit-transform 0.1s ease-in-out; }
|
||||||
.ionic .item-reordering {
|
.ionic .item-reordering {
|
||||||
@ -2274,10 +2296,6 @@
|
|||||||
.ionic .card.list .list-item {
|
.ionic .card.list .list-item {
|
||||||
padding-right: 1px;
|
padding-right: 1px;
|
||||||
padding-left: 1px; }
|
padding-left: 1px; }
|
||||||
.ionic .item-label-right {
|
|
||||||
float: right;
|
|
||||||
color: #aaa;
|
|
||||||
font-size: 14px; }
|
|
||||||
.ionic .card,
|
.ionic .card,
|
||||||
.ionic .list-inset {
|
.ionic .list-inset {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
@ -2487,7 +2505,7 @@
|
|||||||
.ionic input[type="file"] {
|
.ionic input[type="file"] {
|
||||||
line-height: 34px; }
|
line-height: 34px; }
|
||||||
.ionic select {
|
.ionic select {
|
||||||
border: 1px solid #cccccc;
|
border: 1px solid #ccc;
|
||||||
background-color: white; }
|
background-color: white; }
|
||||||
.ionic select[multiple],
|
.ionic select[multiple],
|
||||||
.ionic select[size] {
|
.ionic select[size] {
|
||||||
@ -2536,7 +2554,7 @@
|
|||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
background: white;
|
background: white;
|
||||||
content: ' ';
|
content: ' ';
|
||||||
transition: background-color 0.1s ease-in-out; }
|
transition: background-color .1s ease-in-out; }
|
||||||
.ionic .checkbox input:after {
|
.ionic .checkbox input:after {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 34%;
|
top: 34%;
|
||||||
@ -2549,7 +2567,7 @@
|
|||||||
border-right: 0;
|
border-right: 0;
|
||||||
content: ' ';
|
content: ' ';
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
transition: opacity 0.05s ease-in-out;
|
transition: opacity .05s ease-in-out;
|
||||||
-webkit-transform: rotate(-45deg);
|
-webkit-transform: rotate(-45deg);
|
||||||
transform: rotate(-45deg); }
|
transform: rotate(-45deg); }
|
||||||
.ionic .checkbox input:checked:before {
|
.ionic .checkbox input:checked:before {
|
||||||
@ -2680,8 +2698,9 @@
|
|||||||
position: relative;
|
position: relative;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 10px 12px 7px 12px;
|
padding: 0 12px;
|
||||||
min-height: 44px;
|
padding-top: 1px;
|
||||||
|
min-height: 42px;
|
||||||
border-width: 1px;
|
border-width: 1px;
|
||||||
border-style: solid;
|
border-style: solid;
|
||||||
border-radius: 2px;
|
border-radius: 2px;
|
||||||
@ -2690,24 +2709,24 @@
|
|||||||
text-align: center;
|
text-align: center;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
line-height: 23px;
|
line-height: 41px;
|
||||||
cursor: pointer; }
|
cursor: pointer; }
|
||||||
.ionic .button i, .ionic .button .icon {
|
.ionic .button i, .ionic .button .icon {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
padding: 0;
|
padding: 0 0 1px 0;
|
||||||
vertical-align: inherit;
|
vertical-align: inherit;
|
||||||
font-size: 24px;
|
font-size: 24px;
|
||||||
line-height: 22px; }
|
line-height: 40px; }
|
||||||
.ionic .button.button-icon {
|
.ionic .button.button-icon {
|
||||||
padding: 12px 6px;
|
padding: 2px 4px;
|
||||||
background: none; }
|
background: none; }
|
||||||
.ionic .button.button-icon i, .ionic .button.button-icon .icon {
|
.ionic .button.button-icon i, .ionic .button.button-icon .icon {
|
||||||
font-size: 32px; }
|
font-size: 32px; }
|
||||||
.ionic .button.button-clear {
|
.ionic .button.button-clear {
|
||||||
-webkit-transition: opacity 0.1s;
|
-webkit-transition: opacity 0.1s;
|
||||||
transition: opacity 0.1s;
|
transition: opacity 0.1s;
|
||||||
padding: 12px 6px;
|
padding: 0 6px;
|
||||||
max-height: 44px;
|
max-height: 42px;
|
||||||
border: none;
|
border: none;
|
||||||
background: none;
|
background: none;
|
||||||
box-shadow: none; }
|
box-shadow: none; }
|
||||||
@ -2900,24 +2919,26 @@
|
|||||||
.ionic .button.button-icon:active, .ionic .button.button-icon.active {
|
.ionic .button.button-icon:active, .ionic .button.button-icon.active {
|
||||||
background: none;
|
background: none;
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
text-shadow: 0px 0px 10px white; }
|
text-shadow: 0px 0px 10px #fff; }
|
||||||
.ionic .button.block, .ionic .button.button-full {
|
.ionic .button.block, .ionic .button.button-full {
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
margin-bottom: 10px; }
|
margin-bottom: 10px; }
|
||||||
.ionic .button-small {
|
.ionic .button-small {
|
||||||
padding: 1px 8px 1px 8px;
|
padding: 0 4px;
|
||||||
min-height: 32px;
|
min-height: 28px;
|
||||||
line-height: 29px;
|
font-size: 12px;
|
||||||
font-size: 12px; }
|
line-height: 27px; }
|
||||||
.ionic .button-small i, .ionic .button-small .icon {
|
.ionic .button-small i, .ionic .button-small .icon {
|
||||||
font-size: 20px;
|
font-size: 16px;
|
||||||
line-height: 26px; }
|
line-height: 26px; }
|
||||||
.ionic .button-large {
|
.ionic .button-large {
|
||||||
padding: 12px 18px 12px 18px;
|
padding: 0 12px;
|
||||||
min-height: 52px;
|
min-height: 54px;
|
||||||
font-size: 24px; }
|
font-size: 18px;
|
||||||
|
line-height: 53px; }
|
||||||
.ionic .button-large i, .ionic .button-large .icon {
|
.ionic .button-large i, .ionic .button-large .icon {
|
||||||
font-size: 32px; }
|
font-size: 32px;
|
||||||
|
line-height: 52px; }
|
||||||
.ionic .padding > .button.block:first-child {
|
.ionic .padding > .button.block:first-child {
|
||||||
margin-top: 0; }
|
margin-top: 0; }
|
||||||
.ionic .button-full,
|
.ionic .button-full,
|
||||||
@ -2935,42 +2956,43 @@
|
|||||||
.ionic a.button {
|
.ionic a.button {
|
||||||
text-decoration: none; }
|
text-decoration: none; }
|
||||||
.ionic .button-bar {
|
.ionic .button-bar {
|
||||||
box-flex: 1;
|
|
||||||
-webkit-box-flex: 1;
|
|
||||||
-moz-box-flex: 1;
|
|
||||||
box-orient: horizontal;
|
|
||||||
-webkit-box-orient: horizontal;
|
|
||||||
-moz-box-orient: horizontal;
|
|
||||||
display: -webkit-box;
|
display: -webkit-box;
|
||||||
display: box; }
|
display: -webkit-flex;
|
||||||
.ionic .button-bar > .button {
|
display: -moz-flex;
|
||||||
box-flex: 1;
|
display: -ms-flexbox;
|
||||||
|
display: flex;
|
||||||
-webkit-box-flex: 1;
|
-webkit-box-flex: 1;
|
||||||
|
-webkit-flex: 1;
|
||||||
-moz-box-flex: 1;
|
-moz-box-flex: 1;
|
||||||
display: block;
|
-moz-flex: 1;
|
||||||
|
-ms-flex: 1;
|
||||||
|
flex: 1;
|
||||||
|
-webkit-box-direction: normal;
|
||||||
|
-webkit-box-orient: horizontal;
|
||||||
|
-webkit-flex-direction: horizontal;
|
||||||
|
-moz-flex-direction: horizontal;
|
||||||
|
-ms-flex-direction: horizontal;
|
||||||
|
flex-direction: horizontal; }
|
||||||
|
.ionic .button-bar > .button {
|
||||||
|
-webkit-box-flex: 1;
|
||||||
|
-webkit-flex: 1;
|
||||||
|
-moz-box-flex: 1;
|
||||||
|
-moz-flex: 1;
|
||||||
|
-ms-flex: 1;
|
||||||
|
flex: 1;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
padding: 8px 16px;
|
padding: 0 16px;
|
||||||
width: 0;
|
width: 0;
|
||||||
border-width: 1px 0px 1px 1px;
|
border-width: 1px 0px 1px 1px;
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
white-space: nowrap;
|
white-space: nowrap; }
|
||||||
line-height: 15px; }
|
|
||||||
.ionic .button-bar > .button:first-child {
|
.ionic .button-bar > .button:first-child {
|
||||||
border-radius: 2px 0px 0px 2px; }
|
border-radius: 2px 0px 0px 2px; }
|
||||||
.ionic .button-bar > .button:last-child {
|
.ionic .button-bar > .button:last-child {
|
||||||
border-right-width: 1px;
|
border-right-width: 1px;
|
||||||
border-radius: 0px 2px 2px 0px; }
|
border-radius: 0px 2px 2px 0px; }
|
||||||
.ionic .buttons {
|
|
||||||
box-flex: 1;
|
|
||||||
-webkit-box-flex: 1;
|
|
||||||
-moz-box-flex: 1;
|
|
||||||
box-orient: horizontal;
|
|
||||||
-webkit-box-orient: horizontal;
|
|
||||||
-moz-box-orient: horizontal;
|
|
||||||
display: -webkit-box;
|
|
||||||
display: box; }
|
|
||||||
.ionic .badge {
|
.ionic .badge {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
min-width: 10px;
|
min-width: 10px;
|
||||||
@ -3124,6 +3146,32 @@
|
|||||||
.ionic .fade-in.active {
|
.ionic .fade-in.active {
|
||||||
-webkit-animation: fadeIn 0.3s;
|
-webkit-animation: fadeIn 0.3s;
|
||||||
animation: fadeIn 0.3s; }
|
animation: fadeIn 0.3s; }
|
||||||
|
.ionic i.icon-default, .ionic .icon.icon-default {
|
||||||
|
color: white; }
|
||||||
|
.ionic i.icon-secondary, .ionic .icon.icon-secondary {
|
||||||
|
color: gainsboro; }
|
||||||
|
.ionic i.icon-primary, .ionic .icon.icon-primary {
|
||||||
|
color: #4a87ee; }
|
||||||
|
.ionic i.icon-info, .ionic .icon.icon-info {
|
||||||
|
color: #43cee6; }
|
||||||
|
.ionic i.icon-success, .ionic .icon.icon-success {
|
||||||
|
color: #66cc33; }
|
||||||
|
.ionic i.icon-warning, .ionic .icon.icon-warning {
|
||||||
|
color: #f0b840; }
|
||||||
|
.ionic i.icon-danger, .ionic .icon.icon-danger {
|
||||||
|
color: #ef4e3a; }
|
||||||
|
.ionic i.icon-dark, .ionic .icon.icon-dark {
|
||||||
|
color: #444444; }
|
||||||
|
.ionic i.icon-gray-darker, .ionic .icon.icon-gray-darker {
|
||||||
|
color: #222222; }
|
||||||
|
.ionic i.icon-gray-dark, .ionic .icon.icon-gray-dark {
|
||||||
|
color: #333333; }
|
||||||
|
.ionic i.icon-gray, .ionic .icon.icon-gray {
|
||||||
|
color: #555555; }
|
||||||
|
.ionic i.icon-gray-light, .ionic .icon.icon-gray-light {
|
||||||
|
color: #999999; }
|
||||||
|
.ionic i.icon-gray-lighter, .ionic .icon.icon-gray-lighter {
|
||||||
|
color: #999999; }
|
||||||
.ionic .fill-icon {
|
.ionic .fill-icon {
|
||||||
color: white !important; }
|
color: white !important; }
|
||||||
.ionic .fill-icon:before {
|
.ionic .fill-icon:before {
|
||||||
@ -3131,31 +3179,31 @@
|
|||||||
position: relative;
|
position: relative;
|
||||||
border-radius: 6px;
|
border-radius: 6px;
|
||||||
padding: 1px; }
|
padding: 1px; }
|
||||||
.ionic .fill-icon.brand-default:before {
|
.ionic .fill-icon.icon-default:before {
|
||||||
background: white; }
|
background: white; }
|
||||||
.ionic .fill-icon.brand-secondary:before {
|
.ionic .fill-icon.icon-secondary:before {
|
||||||
background: whitesmoke; }
|
background: whitesmoke; }
|
||||||
.ionic .fill-icon.brand-primary:before {
|
.ionic .fill-icon.icon-primary:before {
|
||||||
background: #4a87ee; }
|
background: #4a87ee; }
|
||||||
.ionic .fill-icon.brand-info:before {
|
.ionic .fill-icon.icon-info:before {
|
||||||
background: #43cee6; }
|
background: #43cee6; }
|
||||||
.ionic .fill-icon.brand-success:before {
|
.ionic .fill-icon.icon-success:before {
|
||||||
background: #66cc33; }
|
background: #66cc33; }
|
||||||
.ionic .fill-icon.brand-warning:before {
|
.ionic .fill-icon.icon-warning:before {
|
||||||
background: #f0b840; }
|
background: #f0b840; }
|
||||||
.ionic .fill-icon.brand-danger:before {
|
.ionic .fill-icon.icon-danger:before {
|
||||||
background: #ef4e3a; }
|
background: #ef4e3a; }
|
||||||
.ionic .fill-icon.brand-dark:before {
|
.ionic .fill-icon.icon-dark:before {
|
||||||
background: #444444; }
|
background: #444444; }
|
||||||
.ionic .fill-icon.gray-darker:before {
|
.ionic .fill-icon.icon-gray-darker:before {
|
||||||
background: #222222; }
|
background: #222222; }
|
||||||
.ionic .fill-icon.gray-dark:before {
|
.ionic .fill-icon.icon-gray-dark:before {
|
||||||
background: #333333; }
|
background: #333333; }
|
||||||
.ionic .fill-icon.gray:before {
|
.ionic .fill-icon.icon-gray:before {
|
||||||
background: #555555; }
|
background: #555555; }
|
||||||
.ionic .fill-icon.gray-light:before {
|
.ionic .fill-icon.icon-gray-light:before {
|
||||||
background: #999999; }
|
background: #999999; }
|
||||||
.ionic .fill-icon.gray-lighter:before {
|
.ionic .fill-icon.icon-gray-lighter:before {
|
||||||
background: #eeeeee; }
|
background: #eeeeee; }
|
||||||
.ionic .icon-loading {
|
.ionic .icon-loading {
|
||||||
font-family: 'ionicons';
|
font-family: 'ionicons';
|
||||||
@ -3166,9 +3214,9 @@
|
|||||||
line-height: 1;
|
line-height: 1;
|
||||||
-webkit-font-smoothing: antialiased;
|
-webkit-font-smoothing: antialiased;
|
||||||
-moz-osx-font-smoothing: grayscale;
|
-moz-osx-font-smoothing: grayscale;
|
||||||
-webkit-animation: spin 0.75s linear infinite;
|
-webkit-animation: spin .75s linear infinite;
|
||||||
-moz-animation: spin 0.75s linear infinite;
|
-moz-animation: spin .75s linear infinite;
|
||||||
animation: spin 0.75s linear infinite; }
|
animation: spin .75s linear infinite; }
|
||||||
.ionic .icon-loading:before {
|
.ionic .icon-loading:before {
|
||||||
content: "\e144"; }
|
content: "\e144"; }
|
||||||
.ionic .icon-refreshing {
|
.ionic .icon-refreshing {
|
||||||
@ -3180,9 +3228,9 @@
|
|||||||
line-height: 1;
|
line-height: 1;
|
||||||
-webkit-font-smoothing: antialiased;
|
-webkit-font-smoothing: antialiased;
|
||||||
-moz-osx-font-smoothing: grayscale;
|
-moz-osx-font-smoothing: grayscale;
|
||||||
-webkit-animation: spin 0.75s linear infinite;
|
-webkit-animation: spin .75s linear infinite;
|
||||||
-moz-animation: spin 0.75s linear infinite;
|
-moz-animation: spin .75s linear infinite;
|
||||||
animation: spin 0.75s linear infinite; }
|
animation: spin .75s linear infinite; }
|
||||||
.ionic .icon-refreshing:before {
|
.ionic .icon-refreshing:before {
|
||||||
content: "\e144"; }
|
content: "\e144"; }
|
||||||
.ionic .hidden,
|
.ionic .hidden,
|
||||||
|
|||||||
269
dist/css/ionic.css
vendored
269
dist/css/ionic.css
vendored
@ -7,12 +7,12 @@
|
|||||||
font-style: normal; }
|
font-style: normal; }
|
||||||
|
|
||||||
i, .icon {
|
i, .icon {
|
||||||
font-family: 'ionicons';
|
font-family: 'ionicons' !important;
|
||||||
speak: none;
|
speak: none !important;
|
||||||
font-style: normal;
|
font-style: normal !important;
|
||||||
font-weight: normal;
|
font-weight: normal !important;
|
||||||
font-variant: normal;
|
font-variant: normal !important;
|
||||||
text-transform: none;
|
text-transform: none !important;
|
||||||
line-height: 1;
|
line-height: 1;
|
||||||
/* Better Font Rendering =========== */
|
/* Better Font Rendering =========== */
|
||||||
-webkit-font-smoothing: antialiased;
|
-webkit-font-smoothing: antialiased;
|
||||||
@ -1355,7 +1355,7 @@ h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
|||||||
a, abbr, acronym, address, big, cite, code,
|
a, abbr, acronym, address, big, cite, code,
|
||||||
del, dfn, em, img, ins, kbd, q, s, samp,
|
del, dfn, em, img, ins, kbd, q, s, samp,
|
||||||
small, strike, strong, sub, sup, tt, var,
|
small, strike, strong, sub, sup, tt, var,
|
||||||
b, u, i, center,
|
b, u, center,
|
||||||
dl, dt, dd, ol, ul, li,
|
dl, dt, dd, ol, ul, li,
|
||||||
fieldset, form, label, legend,
|
fieldset, form, label, legend,
|
||||||
table, caption, tbody, tfoot, thead, tr, th, td,
|
table, caption, tbody, tfoot, thead, tr, th, td,
|
||||||
@ -1521,7 +1521,7 @@ sub {
|
|||||||
fieldset {
|
fieldset {
|
||||||
margin: 0 2px;
|
margin: 0 2px;
|
||||||
padding: 0.35em 0.625em 0.75em;
|
padding: 0.35em 0.625em 0.75em;
|
||||||
border: 1px solid silver; }
|
border: 1px solid #c0c0c0; }
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 1. Correct `color` not being inherited in IE 8/9.
|
* 1. Correct `color` not being inherited in IE 8/9.
|
||||||
@ -1925,8 +1925,8 @@ a.subdued {
|
|||||||
border-style: solid;
|
border-style: solid;
|
||||||
border-top: 1px solid transparent;
|
border-top: 1px solid transparent;
|
||||||
border-bottom: 1px solid #dddddd;
|
border-bottom: 1px solid #dddddd;
|
||||||
background-size: 0;
|
background-color: white;
|
||||||
background-color: white; }
|
background-size: 0; }
|
||||||
@media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
|
@media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
|
||||||
.bar {
|
.bar {
|
||||||
border-top: none !important;
|
border-top: none !important;
|
||||||
@ -2015,20 +2015,17 @@ a.subdued {
|
|||||||
.bar .title a {
|
.bar .title a {
|
||||||
color: inherit; }
|
color: inherit; }
|
||||||
.bar > .button {
|
.bar > .button {
|
||||||
box-flex: 1;
|
|
||||||
-webkit-box-flex: 0;
|
|
||||||
-moz-box-flex: 0;
|
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
margin: 0;
|
padding: 0 8px;
|
||||||
padding: 2px 8px 0 8px;
|
min-height: 31px;
|
||||||
min-height: 33px;
|
|
||||||
background-color: transparent;
|
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
line-height: 28px; }
|
line-height: 30px; }
|
||||||
.bar > .button i, .bar > .button .icon {
|
.bar > .button i, .bar > .button .icon {
|
||||||
margin-top: 1px; }
|
font-size: 24px;
|
||||||
.bar .button-bar {
|
line-height: 29px; }
|
||||||
line-height: 18px; }
|
.bar .button-bar > .button {
|
||||||
|
min-height: 31px;
|
||||||
|
line-height: 31px; }
|
||||||
.bar .button-bar + .button, .bar .button + .button-bar {
|
.bar .button-bar + .button, .bar .button + .button-bar {
|
||||||
margin-left: 5px; }
|
margin-left: 5px; }
|
||||||
.bar .title + .button:last-child,
|
.bar .title + .button:last-child,
|
||||||
@ -2204,9 +2201,17 @@ a.subdued {
|
|||||||
* A navigation bar with any number of tab items supported.
|
* A navigation bar with any number of tab items supported.
|
||||||
*/
|
*/
|
||||||
.tabs {
|
.tabs {
|
||||||
box-orient: horizontal;
|
display: -webkit-box;
|
||||||
|
display: -webkit-flex;
|
||||||
|
display: -moz-flex;
|
||||||
|
display: -ms-flexbox;
|
||||||
|
display: flex;
|
||||||
|
-webkit-box-direction: normal;
|
||||||
-webkit-box-orient: horizontal;
|
-webkit-box-orient: horizontal;
|
||||||
-moz-box-orient: horizontal;
|
-webkit-flex-direction: horizontal;
|
||||||
|
-moz-flex-direction: horizontal;
|
||||||
|
-ms-flex-direction: horizontal;
|
||||||
|
flex-direction: horizontal;
|
||||||
background-color: white;
|
background-color: white;
|
||||||
background-image: linear-gradient(0deg, #dddddd, #dddddd 50%, transparent 50%);
|
background-image: linear-gradient(0deg, #dddddd, #dddddd 50%, transparent 50%);
|
||||||
border-color: #dddddd;
|
border-color: #dddddd;
|
||||||
@ -2214,8 +2219,6 @@ a.subdued {
|
|||||||
position: fixed;
|
position: fixed;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
z-index: 5;
|
z-index: 5;
|
||||||
display: -webkit-box;
|
|
||||||
display: box;
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 49px;
|
height: 49px;
|
||||||
border-style: solid;
|
border-style: solid;
|
||||||
@ -2275,13 +2278,16 @@ a.subdued {
|
|||||||
top: 44px; }
|
top: 44px; }
|
||||||
|
|
||||||
.tab-item {
|
.tab-item {
|
||||||
box-flex: 1;
|
|
||||||
-webkit-box-flex: 1;
|
-webkit-box-flex: 1;
|
||||||
|
-webkit-flex: 1;
|
||||||
-moz-box-flex: 1;
|
-moz-box-flex: 1;
|
||||||
display: block;
|
-moz-flex: 1;
|
||||||
|
-ms-flex: 1;
|
||||||
|
flex: 1;
|
||||||
|
display: inline-block;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
width: 0;
|
margin: auto;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
color: inherit;
|
color: inherit;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
@ -2339,6 +2345,16 @@ a.subdued {
|
|||||||
.tab-item.active.tab-item-dark, .tab-item:active.tab-item-dark {
|
.tab-item.active.tab-item-dark, .tab-item:active.tab-item-dark {
|
||||||
color: #444444; }
|
color: #444444; }
|
||||||
|
|
||||||
|
.item.tabs {
|
||||||
|
display: -webkit-box;
|
||||||
|
display: -webkit-flex;
|
||||||
|
display: -moz-flex;
|
||||||
|
display: -ms-flexbox;
|
||||||
|
display: flex;
|
||||||
|
padding: 0; }
|
||||||
|
.item.tabs i, .item.tabs .icon {
|
||||||
|
position: relative; }
|
||||||
|
|
||||||
.menu {
|
.menu {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 0;
|
||||||
@ -2601,7 +2617,9 @@ a.item {
|
|||||||
font-size: 32px; }
|
font-size: 32px; }
|
||||||
|
|
||||||
.item .fill-icon {
|
.item .fill-icon {
|
||||||
font-size: 28px; }
|
font-size: 28px;
|
||||||
|
min-width: 30px;
|
||||||
|
min-height: 30px; }
|
||||||
|
|
||||||
.item-icon-left {
|
.item-icon-left {
|
||||||
padding-left: 45px; }
|
padding-left: 45px; }
|
||||||
@ -2676,23 +2694,23 @@ button.item-icon-right:after {
|
|||||||
border-radius: 4px; }
|
border-radius: 4px; }
|
||||||
|
|
||||||
.item-thumbnail-left {
|
.item-thumbnail-left {
|
||||||
padding-left: 95px;
|
padding-left: 105px;
|
||||||
min-height: 80px; }
|
min-height: 100px; }
|
||||||
.item-thumbnail-left img:first-child, .item-thumbnail-left .item-image {
|
.item-thumbnail-left img:first-child, .item-thumbnail-left .item-image {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 10px;
|
||||||
left: 0;
|
left: 10px;
|
||||||
max-width: 80px;
|
max-width: 80px;
|
||||||
max-height: 80px;
|
max-height: 80px;
|
||||||
width: 100%; }
|
width: 100%; }
|
||||||
|
|
||||||
.item-thumbnail-right {
|
.item-thumbnail-right {
|
||||||
padding-right: 95px;
|
padding-right: 105px;
|
||||||
min-height: 80px; }
|
min-height: 100px; }
|
||||||
.item-thumbnail-right img:first-child, .item-thumbnail-right .item-image {
|
.item-thumbnail-right img:first-child, .item-thumbnail-right .item-image {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 10px;
|
||||||
right: 0;
|
right: 10px;
|
||||||
max-width: 80px;
|
max-width: 80px;
|
||||||
max-height: 80px;
|
max-height: 80px;
|
||||||
width: 100%; }
|
width: 100%; }
|
||||||
@ -2716,12 +2734,18 @@ button.item-icon-right:after {
|
|||||||
.item-divider {
|
.item-divider {
|
||||||
margin: -1px;
|
margin: -1px;
|
||||||
padding: 5px 15px;
|
padding: 5px 15px;
|
||||||
|
min-height: 30px;
|
||||||
border: none;
|
border: none;
|
||||||
background-color: whitesmoke;
|
background-color: whitesmoke;
|
||||||
box-shadow: inset 0 0 1px #666666;
|
box-shadow: inset 0 0 1px #666666;
|
||||||
color: #222222;
|
color: #222222;
|
||||||
font-weight: bold; }
|
font-weight: bold; }
|
||||||
|
|
||||||
|
.item-note {
|
||||||
|
float: right;
|
||||||
|
color: #aaa;
|
||||||
|
font-size: 14px; }
|
||||||
|
|
||||||
.item-sliding {
|
.item-sliding {
|
||||||
-webkit-transition: -webkit-transform 0.1s ease-in-out; }
|
-webkit-transition: -webkit-transform 0.1s ease-in-out; }
|
||||||
|
|
||||||
@ -2827,11 +2851,6 @@ button.item-icon-right:after {
|
|||||||
padding-right: 1px;
|
padding-right: 1px;
|
||||||
padding-left: 1px; }
|
padding-left: 1px; }
|
||||||
|
|
||||||
.item-label-right {
|
|
||||||
float: right;
|
|
||||||
color: #aaa;
|
|
||||||
font-size: 14px; }
|
|
||||||
|
|
||||||
/*
|
/*
|
||||||
A card and list-inset are close to the same thing, except a card as a box shadow.
|
A card and list-inset are close to the same thing, except a card as a box shadow.
|
||||||
*/
|
*/
|
||||||
@ -3066,7 +3085,7 @@ input[type="file"] {
|
|||||||
line-height: 34px; }
|
line-height: 34px; }
|
||||||
|
|
||||||
select {
|
select {
|
||||||
border: 1px solid #cccccc;
|
border: 1px solid #ccc;
|
||||||
background-color: white; }
|
background-color: white; }
|
||||||
|
|
||||||
select[multiple],
|
select[multiple],
|
||||||
@ -3121,7 +3140,7 @@ input[type="checkbox"][readonly] {
|
|||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
background: white;
|
background: white;
|
||||||
content: ' ';
|
content: ' ';
|
||||||
transition: background-color 0.1s ease-in-out; }
|
transition: background-color .1s ease-in-out; }
|
||||||
|
|
||||||
/* the checkmark within the box */
|
/* the checkmark within the box */
|
||||||
.checkbox input:after {
|
.checkbox input:after {
|
||||||
@ -3136,7 +3155,7 @@ input[type="checkbox"][readonly] {
|
|||||||
border-right: 0;
|
border-right: 0;
|
||||||
content: ' ';
|
content: ' ';
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
transition: opacity 0.05s ease-in-out;
|
transition: opacity .05s ease-in-out;
|
||||||
-webkit-transform: rotate(-45deg);
|
-webkit-transform: rotate(-45deg);
|
||||||
transform: rotate(-45deg); }
|
transform: rotate(-45deg); }
|
||||||
|
|
||||||
@ -3295,8 +3314,9 @@ input[type="range"] {
|
|||||||
position: relative;
|
position: relative;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 10px 12px 7px 12px;
|
padding: 0 12px;
|
||||||
min-height: 44px;
|
padding-top: 1px;
|
||||||
|
min-height: 42px;
|
||||||
border-width: 1px;
|
border-width: 1px;
|
||||||
border-style: solid;
|
border-style: solid;
|
||||||
border-radius: 2px;
|
border-radius: 2px;
|
||||||
@ -3305,24 +3325,24 @@ input[type="range"] {
|
|||||||
text-align: center;
|
text-align: center;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
line-height: 23px;
|
line-height: 41px;
|
||||||
cursor: pointer; }
|
cursor: pointer; }
|
||||||
.button i, .button .icon {
|
.button i, .button .icon {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
padding: 0;
|
padding: 0 0 1px 0;
|
||||||
vertical-align: inherit;
|
vertical-align: inherit;
|
||||||
font-size: 24px;
|
font-size: 24px;
|
||||||
line-height: 22px; }
|
line-height: 40px; }
|
||||||
.button.button-icon {
|
.button.button-icon {
|
||||||
padding: 12px 6px;
|
padding: 2px 4px;
|
||||||
background: none; }
|
background: none; }
|
||||||
.button.button-icon i, .button.button-icon .icon {
|
.button.button-icon i, .button.button-icon .icon {
|
||||||
font-size: 32px; }
|
font-size: 32px; }
|
||||||
.button.button-clear {
|
.button.button-clear {
|
||||||
-webkit-transition: opacity 0.1s;
|
-webkit-transition: opacity 0.1s;
|
||||||
transition: opacity 0.1s;
|
transition: opacity 0.1s;
|
||||||
padding: 12px 6px;
|
padding: 0 6px;
|
||||||
max-height: 44px;
|
max-height: 42px;
|
||||||
border: none;
|
border: none;
|
||||||
background: none;
|
background: none;
|
||||||
box-shadow: none; }
|
box-shadow: none; }
|
||||||
@ -3515,26 +3535,28 @@ input[type="range"] {
|
|||||||
.button.button-icon:active, .button.button-icon.active {
|
.button.button-icon:active, .button.button-icon.active {
|
||||||
background: none;
|
background: none;
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
text-shadow: 0px 0px 10px white; }
|
text-shadow: 0px 0px 10px #fff; }
|
||||||
.button.block, .button.button-full {
|
.button.block, .button.button-full {
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
margin-bottom: 10px; }
|
margin-bottom: 10px; }
|
||||||
|
|
||||||
.button-small {
|
.button-small {
|
||||||
padding: 1px 8px 1px 8px;
|
padding: 0 4px;
|
||||||
min-height: 32px;
|
min-height: 28px;
|
||||||
line-height: 29px;
|
font-size: 12px;
|
||||||
font-size: 12px; }
|
line-height: 27px; }
|
||||||
.button-small i, .button-small .icon {
|
.button-small i, .button-small .icon {
|
||||||
font-size: 20px;
|
font-size: 16px;
|
||||||
line-height: 26px; }
|
line-height: 26px; }
|
||||||
|
|
||||||
.button-large {
|
.button-large {
|
||||||
padding: 12px 18px 12px 18px;
|
padding: 0 12px;
|
||||||
min-height: 52px;
|
min-height: 54px;
|
||||||
font-size: 24px; }
|
font-size: 18px;
|
||||||
|
line-height: 53px; }
|
||||||
.button-large i, .button-large .icon {
|
.button-large i, .button-large .icon {
|
||||||
font-size: 32px; }
|
font-size: 32px;
|
||||||
|
line-height: 52px; }
|
||||||
|
|
||||||
.padding > .button.block:first-child {
|
.padding > .button.block:first-child {
|
||||||
margin-top: 0; }
|
margin-top: 0; }
|
||||||
@ -3557,45 +3579,45 @@ a.button {
|
|||||||
text-decoration: none; }
|
text-decoration: none; }
|
||||||
|
|
||||||
.button-bar {
|
.button-bar {
|
||||||
box-flex: 1;
|
|
||||||
-webkit-box-flex: 1;
|
|
||||||
-moz-box-flex: 1;
|
|
||||||
box-orient: horizontal;
|
|
||||||
-webkit-box-orient: horizontal;
|
|
||||||
-moz-box-orient: horizontal;
|
|
||||||
display: -webkit-box;
|
display: -webkit-box;
|
||||||
display: box; }
|
display: -webkit-flex;
|
||||||
|
display: -moz-flex;
|
||||||
|
display: -ms-flexbox;
|
||||||
|
display: flex;
|
||||||
|
-webkit-box-flex: 1;
|
||||||
|
-webkit-flex: 1;
|
||||||
|
-moz-box-flex: 1;
|
||||||
|
-moz-flex: 1;
|
||||||
|
-ms-flex: 1;
|
||||||
|
flex: 1;
|
||||||
|
-webkit-box-direction: normal;
|
||||||
|
-webkit-box-orient: horizontal;
|
||||||
|
-webkit-flex-direction: horizontal;
|
||||||
|
-moz-flex-direction: horizontal;
|
||||||
|
-ms-flex-direction: horizontal;
|
||||||
|
flex-direction: horizontal; }
|
||||||
|
|
||||||
.button-bar > .button {
|
.button-bar > .button {
|
||||||
box-flex: 1;
|
|
||||||
-webkit-box-flex: 1;
|
-webkit-box-flex: 1;
|
||||||
|
-webkit-flex: 1;
|
||||||
-moz-box-flex: 1;
|
-moz-box-flex: 1;
|
||||||
display: block;
|
-moz-flex: 1;
|
||||||
|
-ms-flex: 1;
|
||||||
|
flex: 1;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
padding: 8px 16px;
|
padding: 0 16px;
|
||||||
width: 0;
|
width: 0;
|
||||||
border-width: 1px 0px 1px 1px;
|
border-width: 1px 0px 1px 1px;
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
white-space: nowrap;
|
white-space: nowrap; }
|
||||||
line-height: 15px; }
|
|
||||||
.button-bar > .button:first-child {
|
.button-bar > .button:first-child {
|
||||||
border-radius: 2px 0px 0px 2px; }
|
border-radius: 2px 0px 0px 2px; }
|
||||||
.button-bar > .button:last-child {
|
.button-bar > .button:last-child {
|
||||||
border-right-width: 1px;
|
border-right-width: 1px;
|
||||||
border-radius: 0px 2px 2px 0px; }
|
border-radius: 0px 2px 2px 0px; }
|
||||||
|
|
||||||
.buttons {
|
|
||||||
box-flex: 1;
|
|
||||||
-webkit-box-flex: 1;
|
|
||||||
-moz-box-flex: 1;
|
|
||||||
box-orient: horizontal;
|
|
||||||
-webkit-box-orient: horizontal;
|
|
||||||
-moz-box-orient: horizontal;
|
|
||||||
display: -webkit-box;
|
|
||||||
display: box; }
|
|
||||||
|
|
||||||
.badge {
|
.badge {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
min-width: 10px;
|
min-width: 10px;
|
||||||
@ -3935,6 +3957,45 @@ a.button {
|
|||||||
-webkit-transform: rotate(360deg);
|
-webkit-transform: rotate(360deg);
|
||||||
transform: rotate(360deg); } }
|
transform: rotate(360deg); } }
|
||||||
|
|
||||||
|
i.icon-default, .icon.icon-default {
|
||||||
|
color: white; }
|
||||||
|
|
||||||
|
i.icon-secondary, .icon.icon-secondary {
|
||||||
|
color: gainsboro; }
|
||||||
|
|
||||||
|
i.icon-primary, .icon.icon-primary {
|
||||||
|
color: #4a87ee; }
|
||||||
|
|
||||||
|
i.icon-info, .icon.icon-info {
|
||||||
|
color: #43cee6; }
|
||||||
|
|
||||||
|
i.icon-success, .icon.icon-success {
|
||||||
|
color: #66cc33; }
|
||||||
|
|
||||||
|
i.icon-warning, .icon.icon-warning {
|
||||||
|
color: #f0b840; }
|
||||||
|
|
||||||
|
i.icon-danger, .icon.icon-danger {
|
||||||
|
color: #ef4e3a; }
|
||||||
|
|
||||||
|
i.icon-dark, .icon.icon-dark {
|
||||||
|
color: #444444; }
|
||||||
|
|
||||||
|
i.icon-gray-darker, .icon.icon-gray-darker {
|
||||||
|
color: #222222; }
|
||||||
|
|
||||||
|
i.icon-gray-dark, .icon.icon-gray-dark {
|
||||||
|
color: #333333; }
|
||||||
|
|
||||||
|
i.icon-gray, .icon.icon-gray {
|
||||||
|
color: #555555; }
|
||||||
|
|
||||||
|
i.icon-gray-light, .icon.icon-gray-light {
|
||||||
|
color: #999999; }
|
||||||
|
|
||||||
|
i.icon-gray-lighter, .icon.icon-gray-lighter {
|
||||||
|
color: #999999; }
|
||||||
|
|
||||||
.fill-icon {
|
.fill-icon {
|
||||||
color: white !important; }
|
color: white !important; }
|
||||||
.fill-icon:before {
|
.fill-icon:before {
|
||||||
@ -3942,31 +4003,31 @@ a.button {
|
|||||||
position: relative;
|
position: relative;
|
||||||
border-radius: 6px;
|
border-radius: 6px;
|
||||||
padding: 1px; }
|
padding: 1px; }
|
||||||
.fill-icon.brand-default:before {
|
.fill-icon.icon-default:before {
|
||||||
background: white; }
|
background: white; }
|
||||||
.fill-icon.brand-secondary:before {
|
.fill-icon.icon-secondary:before {
|
||||||
background: whitesmoke; }
|
background: whitesmoke; }
|
||||||
.fill-icon.brand-primary:before {
|
.fill-icon.icon-primary:before {
|
||||||
background: #4a87ee; }
|
background: #4a87ee; }
|
||||||
.fill-icon.brand-info:before {
|
.fill-icon.icon-info:before {
|
||||||
background: #43cee6; }
|
background: #43cee6; }
|
||||||
.fill-icon.brand-success:before {
|
.fill-icon.icon-success:before {
|
||||||
background: #66cc33; }
|
background: #66cc33; }
|
||||||
.fill-icon.brand-warning:before {
|
.fill-icon.icon-warning:before {
|
||||||
background: #f0b840; }
|
background: #f0b840; }
|
||||||
.fill-icon.brand-danger:before {
|
.fill-icon.icon-danger:before {
|
||||||
background: #ef4e3a; }
|
background: #ef4e3a; }
|
||||||
.fill-icon.brand-dark:before {
|
.fill-icon.icon-dark:before {
|
||||||
background: #444444; }
|
background: #444444; }
|
||||||
.fill-icon.gray-darker:before {
|
.fill-icon.icon-gray-darker:before {
|
||||||
background: #222222; }
|
background: #222222; }
|
||||||
.fill-icon.gray-dark:before {
|
.fill-icon.icon-gray-dark:before {
|
||||||
background: #333333; }
|
background: #333333; }
|
||||||
.fill-icon.gray:before {
|
.fill-icon.icon-gray:before {
|
||||||
background: #555555; }
|
background: #555555; }
|
||||||
.fill-icon.gray-light:before {
|
.fill-icon.icon-gray-light:before {
|
||||||
background: #999999; }
|
background: #999999; }
|
||||||
.fill-icon.gray-lighter:before {
|
.fill-icon.icon-gray-lighter:before {
|
||||||
background: #eeeeee; }
|
background: #eeeeee; }
|
||||||
|
|
||||||
.icon-loading {
|
.icon-loading {
|
||||||
@ -3978,9 +4039,9 @@ a.button {
|
|||||||
line-height: 1;
|
line-height: 1;
|
||||||
-webkit-font-smoothing: antialiased;
|
-webkit-font-smoothing: antialiased;
|
||||||
-moz-osx-font-smoothing: grayscale;
|
-moz-osx-font-smoothing: grayscale;
|
||||||
-webkit-animation: spin 0.75s linear infinite;
|
-webkit-animation: spin .75s linear infinite;
|
||||||
-moz-animation: spin 0.75s linear infinite;
|
-moz-animation: spin .75s linear infinite;
|
||||||
animation: spin 0.75s linear infinite; }
|
animation: spin .75s linear infinite; }
|
||||||
.icon-loading:before {
|
.icon-loading:before {
|
||||||
content: "\e144"; }
|
content: "\e144"; }
|
||||||
|
|
||||||
@ -3993,9 +4054,9 @@ a.button {
|
|||||||
line-height: 1;
|
line-height: 1;
|
||||||
-webkit-font-smoothing: antialiased;
|
-webkit-font-smoothing: antialiased;
|
||||||
-moz-osx-font-smoothing: grayscale;
|
-moz-osx-font-smoothing: grayscale;
|
||||||
-webkit-animation: spin 0.75s linear infinite;
|
-webkit-animation: spin .75s linear infinite;
|
||||||
-moz-animation: spin 0.75s linear infinite;
|
-moz-animation: spin .75s linear infinite;
|
||||||
animation: spin 0.75s linear infinite; }
|
animation: spin .75s linear infinite; }
|
||||||
.icon-refreshing:before {
|
.icon-refreshing:before {
|
||||||
content: "\e144"; }
|
content: "\e144"; }
|
||||||
|
|
||||||
|
|||||||
@ -10,12 +10,12 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
i, .icon {
|
i, .icon {
|
||||||
font-family: 'ionicons';
|
font-family: 'ionicons' !important;
|
||||||
speak: none;
|
speak: none !important;
|
||||||
font-style: normal;
|
font-style: normal !important;
|
||||||
font-weight: normal;
|
font-weight: normal !important;
|
||||||
font-variant: normal;
|
font-variant: normal !important;
|
||||||
text-transform: none;
|
text-transform: none !important;
|
||||||
line-height: 1;
|
line-height: 1;
|
||||||
|
|
||||||
/* Better Font Rendering =========== */
|
/* Better Font Rendering =========== */
|
||||||
|
|||||||
10
js/ext/angular/src/directive/ionicNav.js
vendored
10
js/ext/angular/src/directive/ionicNav.js
vendored
@ -40,7 +40,6 @@ angular.module('ionic.ui.nav', ['ionic.service.templateLoad', 'ionic.service.ges
|
|||||||
*/
|
*/
|
||||||
this.pushFromTemplate = function(templateUrl) {
|
this.pushFromTemplate = function(templateUrl) {
|
||||||
var childScope = $scope.$new();
|
var childScope = $scope.$new();
|
||||||
childScope.isVisible = true;
|
|
||||||
|
|
||||||
// Load the given template
|
// Load the given template
|
||||||
TemplateLoader.load(templateUrl).then(function(templateString) {
|
TemplateLoader.load(templateUrl).then(function(templateString) {
|
||||||
@ -123,13 +122,14 @@ angular.module('ionic.ui.nav', ['ionic.service.templateLoad', 'ionic.service.ges
|
|||||||
};
|
};
|
||||||
|
|
||||||
return {
|
return {
|
||||||
restrict: 'ECA',
|
restrict: 'CA',
|
||||||
require: '^navs',
|
require: '^navs',
|
||||||
transclude: 'element',
|
transclude: 'element',
|
||||||
compile: function(element, attr, transclude) {
|
compile: function(element, attr, transclude) {
|
||||||
return function($scope, $element, $attr, navCtrl) {
|
return function($scope, $element, $attr, navCtrl) {
|
||||||
var lastParent, lastIndex, childScope, childElement;
|
var lastParent, lastIndex, childScope, childElement;
|
||||||
|
|
||||||
|
<<<<<<< HEAD
|
||||||
|
|
||||||
$scope.title = $attr.title;
|
$scope.title = $attr.title;
|
||||||
$scope.slideAnimation = $attr.slideAnimation || '';
|
$scope.slideAnimation = $attr.slideAnimation || '';
|
||||||
@ -143,6 +143,9 @@ angular.module('ionic.ui.nav', ['ionic.service.templateLoad', 'ionic.service.ges
|
|||||||
|
|
||||||
// Push this controller onto the stack
|
// Push this controller onto the stack
|
||||||
$scope.pushController($scope, $element);
|
$scope.pushController($scope, $element);
|
||||||
|
=======
|
||||||
|
$scope.isVisible = true;
|
||||||
|
>>>>>>> e8bd9a5dee77d29b746115546a51b1a4a3d46246
|
||||||
|
|
||||||
$scope.$watch('isVisible', function(value) {
|
$scope.$watch('isVisible', function(value) {
|
||||||
// Taken from ngIf
|
// Taken from ngIf
|
||||||
@ -158,7 +161,10 @@ angular.module('ionic.ui.nav', ['ionic.service.templateLoad', 'ionic.service.ges
|
|||||||
// Check if this is visible, and if so, create it and show it
|
// Check if this is visible, and if so, create it and show it
|
||||||
if(value) {
|
if(value) {
|
||||||
childScope = $scope.$new();
|
childScope = $scope.$new();
|
||||||
|
<<<<<<< HEAD
|
||||||
|
|
||||||
|
=======
|
||||||
|
>>>>>>> e8bd9a5dee77d29b746115546a51b1a4a3d46246
|
||||||
transclude(childScope, function(clone) {
|
transclude(childScope, function(clone) {
|
||||||
childElement = clone;
|
childElement = clone;
|
||||||
|
|
||||||
|
|||||||
@ -73,6 +73,11 @@
|
|||||||
|
|
||||||
.controller('CatsCtrl', function($scope, $compile, $element) {
|
.controller('CatsCtrl', function($scope, $compile, $element) {
|
||||||
console.log('Cats', $element);
|
console.log('Cats', $element);
|
||||||
|
var items = [];
|
||||||
|
for(var i = 0; i < 100; i++) {
|
||||||
|
items.push({});
|
||||||
|
}
|
||||||
|
$scope.items = items;
|
||||||
$scope.goNext = function() {
|
$scope.goNext = function() {
|
||||||
$scope.navController.pushFromTemplate('page.html');
|
$scope.navController.pushFromTemplate('page.html');
|
||||||
};
|
};
|
||||||
|
|||||||
@ -20,9 +20,9 @@
|
|||||||
border-style: solid;
|
border-style: solid;
|
||||||
border-top: 1px solid transparent;
|
border-top: 1px solid transparent;
|
||||||
border-bottom: 1px solid $bar-default-border-color;
|
border-bottom: 1px solid $bar-default-border-color;
|
||||||
background-size: 0;
|
|
||||||
|
|
||||||
background-color: $bar-bg;
|
background-color: $bar-bg;
|
||||||
|
background-size: 0;
|
||||||
@media (min--moz-device-pixel-ratio: 1.5),
|
@media (min--moz-device-pixel-ratio: 1.5),
|
||||||
(-webkit-min-device-pixel-ratio: 1.5),
|
(-webkit-min-device-pixel-ratio: 1.5),
|
||||||
(min-device-pixel-ratio: 1.5),
|
(min-device-pixel-ratio: 1.5),
|
||||||
@ -102,22 +102,21 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
> .button {
|
> .button {
|
||||||
@include box-flex(0);
|
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
margin: 0;
|
padding: $button-bar-button-padding;
|
||||||
padding: 2px 8px 0 8px;
|
min-height: $button-bar-button-height;
|
||||||
min-height: $button-bar-button-min-height;
|
font-size: $button-bar-button-font-size;
|
||||||
background-color: transparent;
|
line-height: $button-bar-button-height - $button-border-width;
|
||||||
font-size: 12px;
|
|
||||||
line-height: 28px;
|
|
||||||
|
|
||||||
i, .icon {
|
i, .icon {
|
||||||
margin-top: 1px;
|
font-size: $button-bar-button-icon-size;
|
||||||
|
line-height: $button-bar-button-height - $button-border-width - 1;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.button-bar {
|
.button-bar > .button {
|
||||||
line-height: $bar-button-bar-line-height;
|
min-height: $button-bar-button-height;
|
||||||
|
line-height: $button-bar-button-height;
|
||||||
}
|
}
|
||||||
|
|
||||||
.button-bar + .button, .button + .button-bar {
|
.button-bar + .button, .button + .button-bar {
|
||||||
|
|||||||
@ -1,17 +1,16 @@
|
|||||||
|
|
||||||
.button-bar {
|
.button-bar {
|
||||||
@include box-flex(1);
|
@include display-flex();
|
||||||
@include box-orient(horizontal);
|
@include flex(1);
|
||||||
display: -webkit-box;
|
@include flex-direction(horizontal);
|
||||||
display: box;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.button-bar > .button {
|
.button-bar > .button {
|
||||||
@include box-flex(1);
|
@include flex(1);
|
||||||
display: block;
|
|
||||||
|
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|
||||||
padding: 8px 16px;
|
padding: 0 16px;
|
||||||
|
|
||||||
// Fix for unequal widths of buttons
|
// Fix for unequal widths of buttons
|
||||||
width: 0;
|
width: 0;
|
||||||
@ -21,9 +20,6 @@
|
|||||||
text-align: center;
|
text-align: center;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
// Fix for box-flex width issue
|
|
||||||
|
|
||||||
line-height: $button-bar-button-line-height;
|
|
||||||
|
|
||||||
&:first-child {
|
&:first-child {
|
||||||
border-radius: 2px 0px 0px 2px;
|
border-radius: 2px 0px 0px 2px;
|
||||||
@ -33,13 +29,3 @@
|
|||||||
border-radius: 0px 2px 2px 0px;
|
border-radius: 0px 2px 2px 0px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Buttons are used to group a set of buttons, useful
|
|
||||||
// to pull a set of buttons to the right side of a header
|
|
||||||
// bar, for example.
|
|
||||||
.buttons {
|
|
||||||
@include box-flex(1);
|
|
||||||
@include box-orient(horizontal);
|
|
||||||
display: -webkit-box;
|
|
||||||
display: box;
|
|
||||||
}
|
|
||||||
|
|||||||
@ -4,7 +4,8 @@
|
|||||||
margin: 0;
|
margin: 0;
|
||||||
|
|
||||||
padding: $button-padding;
|
padding: $button-padding;
|
||||||
min-height: $button-min-height;
|
padding-top: 1px;
|
||||||
|
min-height: $button-height;
|
||||||
|
|
||||||
border-width: $button-border-width;
|
border-width: $button-border-width;
|
||||||
border-style: solid;
|
border-style: solid;
|
||||||
@ -17,31 +18,31 @@
|
|||||||
|
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
font-size: $button-font-size;
|
font-size: $button-font-size;
|
||||||
line-height: $button-line-height;
|
line-height: $button-height - $button-border-width;
|
||||||
|
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
|
||||||
i, .icon {
|
i, .icon {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
padding: 0;
|
padding: 0 0 $button-border-width 0;
|
||||||
vertical-align: inherit;
|
vertical-align: inherit;
|
||||||
font-size: $button-icon-font-size;
|
font-size: $button-icon-size;
|
||||||
line-height: $button-line-height - 1;
|
line-height: $button-height - $button-border-width - 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.button-icon {
|
&.button-icon {
|
||||||
padding: $button-clear-padding;
|
padding: 2px 4px;
|
||||||
background: none;
|
background: none;
|
||||||
|
|
||||||
i, .icon {
|
i, .icon {
|
||||||
font-size: $button-icon-large-font-size;
|
font-size: $button-large-icon-size;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&.button-clear {
|
&.button-clear {
|
||||||
@include transition(opacity .1s);
|
@include transition(opacity .1s);
|
||||||
padding: $button-clear-padding;
|
padding: $button-clear-padding;
|
||||||
max-height: 44px;
|
max-height: $button-height;
|
||||||
border: none;
|
border: none;
|
||||||
background: none;
|
background: none;
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
@ -116,24 +117,26 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.button-small {
|
.button-small {
|
||||||
padding: 1px 8px 1px 8px;
|
padding: $button-small-padding;
|
||||||
min-height: $button-small-min-height;
|
min-height: $button-small-height;
|
||||||
line-height: $button-small-line-height;
|
font-size: $button-small-font-size;
|
||||||
font-size: $button-font-size - 4;
|
line-height: $button-small-height - $button-border-width;
|
||||||
|
|
||||||
i, .icon {
|
i, .icon {
|
||||||
font-size: $button-icon-font-size - 4;
|
font-size: $button-small-icon-size;
|
||||||
line-height: $button-small-line-height - 3;
|
line-height: $button-small-height - $button-border-width - 1;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.button-large {
|
.button-large {
|
||||||
padding: 12px 18px 12px 18px;
|
padding: $button-large-padding;
|
||||||
min-height: $button-min-height + 8;
|
min-height: $button-large-height;
|
||||||
font-size: $button-font-size + 8;
|
font-size: $button-large-font-size;
|
||||||
|
line-height: $button-large-height - $button-border-width;
|
||||||
|
|
||||||
i, .icon {
|
i, .icon {
|
||||||
font-size: $button-icon-font-size + 8;
|
font-size: $button-large-icon-size;
|
||||||
|
line-height: $button-large-height - $button-border-width - 1;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -1,4 +1,57 @@
|
|||||||
|
|
||||||
|
i.icon-default, .icon.icon-default {
|
||||||
|
color: $brand-default;
|
||||||
|
}
|
||||||
|
|
||||||
|
i.icon-secondary, .icon.icon-secondary {
|
||||||
|
color: darken($brand-secondary, 10%);
|
||||||
|
}
|
||||||
|
|
||||||
|
i.icon-primary, .icon.icon-primary {
|
||||||
|
color: $brand-primary;
|
||||||
|
}
|
||||||
|
|
||||||
|
i.icon-info, .icon.icon-info {
|
||||||
|
color: $brand-info;
|
||||||
|
}
|
||||||
|
|
||||||
|
i.icon-success, .icon.icon-success {
|
||||||
|
color: $brand-success;
|
||||||
|
}
|
||||||
|
|
||||||
|
i.icon-warning, .icon.icon-warning {
|
||||||
|
color: $brand-warning;
|
||||||
|
}
|
||||||
|
|
||||||
|
i.icon-danger, .icon.icon-danger {
|
||||||
|
color: $brand-danger;
|
||||||
|
}
|
||||||
|
|
||||||
|
i.icon-dark, .icon.icon-dark {
|
||||||
|
color: $brand-dark;
|
||||||
|
}
|
||||||
|
|
||||||
|
i.icon-gray-darker, .icon.icon-gray-darker {
|
||||||
|
color: $gray-darker;
|
||||||
|
}
|
||||||
|
|
||||||
|
i.icon-gray-dark, .icon.icon-gray-dark {
|
||||||
|
color: $gray-dark;
|
||||||
|
}
|
||||||
|
|
||||||
|
i.icon-gray, .icon.icon-gray {
|
||||||
|
color: $gray;
|
||||||
|
}
|
||||||
|
|
||||||
|
i.icon-gray-light, .icon.icon-gray-light {
|
||||||
|
color: $gray-light;
|
||||||
|
}
|
||||||
|
|
||||||
|
i.icon-gray-lighter, .icon.icon-gray-lighter {
|
||||||
|
color: $gray-light;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
.fill-icon {
|
.fill-icon {
|
||||||
color: white !important;
|
color: white !important;
|
||||||
&:before {
|
&:before {
|
||||||
@ -8,44 +61,44 @@
|
|||||||
padding: 1px;
|
padding: 1px;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.brand-default:before {
|
&.icon-default:before {
|
||||||
background: $brand-default;
|
background: $brand-default;
|
||||||
}
|
}
|
||||||
&.brand-secondary:before {
|
&.icon-secondary:before {
|
||||||
background: $brand-secondary;
|
background: $brand-secondary;
|
||||||
}
|
}
|
||||||
&.brand-primary:before {
|
&.icon-primary:before {
|
||||||
background: $brand-primary;
|
background: $brand-primary;
|
||||||
}
|
}
|
||||||
&.brand-info:before {
|
&.icon-info:before {
|
||||||
background: $brand-info;
|
background: $brand-info;
|
||||||
}
|
}
|
||||||
&.brand-success:before {
|
&.icon-success:before {
|
||||||
background: $brand-success;
|
background: $brand-success;
|
||||||
}
|
}
|
||||||
&.brand-warning:before {
|
&.icon-warning:before {
|
||||||
background: $brand-warning;
|
background: $brand-warning;
|
||||||
}
|
}
|
||||||
&.brand-danger:before {
|
&.icon-danger:before {
|
||||||
background: $brand-danger;
|
background: $brand-danger;
|
||||||
}
|
}
|
||||||
&.brand-dark:before {
|
&.icon-dark:before {
|
||||||
background: $brand-dark;
|
background: $brand-dark;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.gray-darker:before {
|
&.icon-gray-darker:before {
|
||||||
background: $gray-darker;
|
background: $gray-darker;
|
||||||
}
|
}
|
||||||
&.gray-dark:before {
|
&.icon-gray-dark:before {
|
||||||
background: $gray-dark;
|
background: $gray-dark;
|
||||||
}
|
}
|
||||||
&.gray:before {
|
&.icon-gray:before {
|
||||||
background: $gray;
|
background: $gray;
|
||||||
}
|
}
|
||||||
&.gray-light:before {
|
&.icon-gray-light:before {
|
||||||
background: $gray-light;
|
background: $gray-light;
|
||||||
}
|
}
|
||||||
&.gray-lighter:before {
|
&.icon-gray-lighter:before {
|
||||||
background: $gray-lighter;
|
background: $gray-lighter;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -186,6 +186,8 @@ a.item {
|
|||||||
|
|
||||||
.item .fill-icon {
|
.item .fill-icon {
|
||||||
font-size: $item-icon-fill-font-size;
|
font-size: $item-icon-fill-font-size;
|
||||||
|
min-width: $item-icon-fill-font-size + 2;
|
||||||
|
min-height: $item-icon-fill-font-size + 2;
|
||||||
}
|
}
|
||||||
|
|
||||||
.item-icon-left {
|
.item-icon-left {
|
||||||
@ -275,13 +277,13 @@ button.item-icon-right:after {
|
|||||||
// -------------------------------
|
// -------------------------------
|
||||||
|
|
||||||
.item-thumbnail-left {
|
.item-thumbnail-left {
|
||||||
padding-left: $item-thumbnail-width + $item-padding;
|
padding-left: $item-thumbnail-width + $item-thumbnail-margin + $item-padding;
|
||||||
min-height: $item-thumbnail-height;
|
min-height: $item-thumbnail-height + ($item-thumbnail-margin * 2);
|
||||||
|
|
||||||
img:first-child, .item-image {
|
img:first-child, .item-image {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: $item-thumbnail-margin;
|
||||||
left: 0;
|
left: $item-thumbnail-margin;
|
||||||
max-width: $item-thumbnail-width;
|
max-width: $item-thumbnail-width;
|
||||||
max-height: $item-thumbnail-height;
|
max-height: $item-thumbnail-height;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
@ -289,13 +291,13 @@ button.item-icon-right:after {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.item-thumbnail-right {
|
.item-thumbnail-right {
|
||||||
padding-right: $item-thumbnail-width + $item-padding;
|
padding-right: $item-thumbnail-width + $item-thumbnail-margin + $item-padding;
|
||||||
min-height: $item-thumbnail-height;
|
min-height: $item-thumbnail-height + ($item-thumbnail-margin * 2);
|
||||||
|
|
||||||
img:first-child, .item-image {
|
img:first-child, .item-image {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: $item-thumbnail-margin;
|
||||||
right: 0;
|
right: $item-thumbnail-margin;
|
||||||
max-width: $item-thumbnail-width;
|
max-width: $item-thumbnail-width;
|
||||||
max-height: $item-thumbnail-height;
|
max-height: $item-thumbnail-height;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
@ -339,6 +341,7 @@ button.item-icon-right:after {
|
|||||||
.item-divider {
|
.item-divider {
|
||||||
margin: $item-border-width * -1;
|
margin: $item-border-width * -1;
|
||||||
padding: $item-divider-padding;
|
padding: $item-divider-padding;
|
||||||
|
min-height: 30px;
|
||||||
border: none;
|
border: none;
|
||||||
background-color: $item-divider-bg;
|
background-color: $item-divider-bg;
|
||||||
box-shadow: $item-box-shadow;
|
box-shadow: $item-box-shadow;
|
||||||
@ -347,6 +350,16 @@ button.item-icon-right:after {
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// Item Note
|
||||||
|
// -------------------------------
|
||||||
|
|
||||||
|
.item-note {
|
||||||
|
float: right;
|
||||||
|
color: #aaa;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
// Item Animations
|
// Item Animations
|
||||||
// -------------------------------
|
// -------------------------------
|
||||||
|
|
||||||
|
|||||||
@ -57,12 +57,6 @@
|
|||||||
padding-left: 1px;
|
padding-left: 1px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.item-label-right {
|
|
||||||
float: right;
|
|
||||||
color: #aaa;
|
|
||||||
font-size: 14px;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
// Cards / Inset Lists
|
// Cards / Inset Lists
|
||||||
// --------------------------------------------------
|
// --------------------------------------------------
|
||||||
|
|||||||
@ -350,18 +350,6 @@
|
|||||||
hyphens: $mode;
|
hyphens: $mode;
|
||||||
}
|
}
|
||||||
|
|
||||||
@mixin box-orient($orientation) {
|
|
||||||
box-orient: $orientation;
|
|
||||||
-webkit-box-orient: $orientation;
|
|
||||||
-moz-box-orient: $orientation;
|
|
||||||
}
|
|
||||||
|
|
||||||
@mixin box-flex($flex) {
|
|
||||||
box-flex: 1;
|
|
||||||
-webkit-box-flex: $flex;
|
|
||||||
-moz-box-flex: $flex;
|
|
||||||
}
|
|
||||||
|
|
||||||
@mixin display-flex {
|
@mixin display-flex {
|
||||||
display: -webkit-box;
|
display: -webkit-box;
|
||||||
display: -webkit-flex;
|
display: -webkit-flex;
|
||||||
|
|||||||
@ -16,7 +16,7 @@ h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
|||||||
a, abbr, acronym, address, big, cite, code,
|
a, abbr, acronym, address, big, cite, code,
|
||||||
del, dfn, em, img, ins, kbd, q, s, samp,
|
del, dfn, em, img, ins, kbd, q, s, samp,
|
||||||
small, strike, strong, sub, sup, tt, var,
|
small, strike, strong, sub, sup, tt, var,
|
||||||
b, u, i, center,
|
b, u, center,
|
||||||
dl, dt, dd, ol, ul, li,
|
dl, dt, dd, ol, ul, li,
|
||||||
fieldset, form, label, legend,
|
fieldset, form, label, legend,
|
||||||
table, caption, tbody, tfoot, thead, tr, th, td,
|
table, caption, tbody, tfoot, thead, tr, th, td,
|
||||||
|
|||||||
@ -5,15 +5,13 @@
|
|||||||
*/
|
*/
|
||||||
|
|
||||||
.tabs {
|
.tabs {
|
||||||
|
@include display-flex();
|
||||||
@include box-orient(horizontal);
|
@include flex-direction(horizontal);
|
||||||
|
|
||||||
@include tab-style($tabs-default-bg, $tabs-default-border-color, $gray-dark);
|
@include tab-style($tabs-default-bg, $tabs-default-border-color, $gray-dark);
|
||||||
position: fixed;
|
position: fixed;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
z-index: 5;
|
z-index: 5;
|
||||||
display: -webkit-box;
|
|
||||||
display: box;
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: $tabs-height;
|
height: $tabs-height;
|
||||||
border-style: solid;
|
border-style: solid;
|
||||||
@ -66,13 +64,12 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.tab-item {
|
.tab-item {
|
||||||
@include box-flex(1);
|
@include flex(1);
|
||||||
display: block;
|
display: inline-block;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
|
margin: auto;
|
||||||
|
|
||||||
// Required to force box elements to be the same size;
|
|
||||||
width: 0;
|
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
|
||||||
color: inherit;
|
color: inherit;
|
||||||
@ -149,3 +146,12 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.item.tabs {
|
||||||
|
@include display-flex();
|
||||||
|
padding: 0;
|
||||||
|
|
||||||
|
i, .icon {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|||||||
@ -210,23 +210,30 @@ $info-border: darken(adjust-hue($info-bg, -10), 7%);
|
|||||||
// -------------------------------
|
// -------------------------------
|
||||||
|
|
||||||
$button-color: #222;
|
$button-color: #222;
|
||||||
$button-padding: 10px 12px 7px 12px;
|
|
||||||
$button-block-margin: 10px !default;
|
$button-block-margin: 10px !default;
|
||||||
$button-clear-padding: 12px 6px;
|
$button-clear-padding: 0 6px;
|
||||||
$button-border-radius: 2px;
|
$button-border-radius: 2px;
|
||||||
$button-border-width: 1px;
|
$button-border-width: 1px;
|
||||||
|
|
||||||
$button-font-size: 16px;
|
$button-font-size: 16px;
|
||||||
$button-line-height: 23px;
|
$button-height: 42px;
|
||||||
$button-min-height: 44px;
|
$button-padding: 0 12px;
|
||||||
|
$button-icon-size: 24px;
|
||||||
|
|
||||||
$button-small-line-height: 29px !default;
|
$button-large-font-size: 18px;
|
||||||
$button-small-min-height: 32px !default;
|
$button-large-height: 54px;
|
||||||
|
$button-large-padding: 0 12px;
|
||||||
|
$button-large-icon-size: 32px;
|
||||||
|
|
||||||
$button-icon-font-size: 24px;
|
$button-small-font-size: 12px;
|
||||||
$button-icon-large-font-size: 32px;
|
$button-small-height: 28px;
|
||||||
|
$button-small-padding: 0 4px;
|
||||||
|
$button-small-icon-size: 16px;
|
||||||
|
|
||||||
$button-bar-button-line-height: 15px !default;
|
$button-bar-button-font-size: 12px;
|
||||||
$button-bar-button-min-height: 33px !default;
|
$button-bar-button-height: 31px !default;
|
||||||
|
$button-bar-button-padding: 0 8px;
|
||||||
|
$button-bar-button-icon-size: 24px;
|
||||||
|
|
||||||
$button-default-bg: $brand-default;
|
$button-default-bg: $brand-default;
|
||||||
$button-default-border: #ddd;
|
$button-default-border: #ddd;
|
||||||
@ -411,6 +418,7 @@ $item-avitar-height: 40px !default;
|
|||||||
|
|
||||||
$item-thumbnail-width: 80px !default;
|
$item-thumbnail-width: 80px !default;
|
||||||
$item-thumbnail-height: 80px !default;
|
$item-thumbnail-height: 80px !default;
|
||||||
|
$item-thumbnail-margin: 10px !default;
|
||||||
|
|
||||||
|
|
||||||
// Icons
|
// Icons
|
||||||
|
|||||||
@ -95,6 +95,18 @@
|
|||||||
<p>November 05, 1955</p>
|
<p>November 05, 1955</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="item item-thumbnail-left">
|
||||||
|
<img src="http://mimg.ugo.com/201001/34590/cuts/marty-mcfly_288x288.jpg">
|
||||||
|
<h2>Marty McFly</h2>
|
||||||
|
<p>November 05, 1955</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="item item-thumbnail-right">
|
||||||
|
<img src="http://mimg.ugo.com/201001/34590/cuts/marty-mcfly_288x288.jpg">
|
||||||
|
<h2>Marty McFly</h2>
|
||||||
|
<p>November 05, 1955</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="item item-body">
|
<div class="item item-body">
|
||||||
<img class="full-image" src="http://paulaubin.com/wp/wp-content/uploads/2012/05/back-to-the-future-delorean.jpg">
|
<img class="full-image" src="http://paulaubin.com/wp/wp-content/uploads/2012/05/back-to-the-future-delorean.jpg">
|
||||||
<p>
|
<p>
|
||||||
@ -108,8 +120,19 @@
|
|||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="item item-divider">
|
<div class="item tabs tabs-secondary tabs-icon-left">
|
||||||
Like Comment Share
|
<a class="tab-item" href="#">
|
||||||
|
<i class="icon-thumbsup"></i>
|
||||||
|
Like
|
||||||
|
</a>
|
||||||
|
<a class="tab-item" href="#">
|
||||||
|
<i class="icon-chatbox"></i>
|
||||||
|
Comment
|
||||||
|
</a>
|
||||||
|
<a class="tab-item" href="#">
|
||||||
|
<i class="icon-share"></i>
|
||||||
|
Share
|
||||||
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -48,31 +48,31 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<a href="#" class="item item-icon-left">
|
<a href="#" class="item item-icon-left">
|
||||||
<i class="icon-email"></i>
|
<i class="icon-email icon-secondary"></i>
|
||||||
Check mail
|
Check mail
|
||||||
<span class="badge badge-info">5</span>
|
<span class="badge badge-info">5</span>
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
<a href="#" class="item item-icon-left">
|
<a href="#" class="item item-icon-left">
|
||||||
<i class="icon-chatbubble-working"></i>
|
<i class="icon-chatbubble-working icon-primary"></i>
|
||||||
Call Ma
|
Call Ma
|
||||||
<span class="item-label-right">
|
<span class="item-note">
|
||||||
Cell
|
Cell
|
||||||
</span>
|
</span>
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
<a href="#" class="item item-icon-left">
|
<a href="#" class="item item-icon-left">
|
||||||
<i class="icon-mic-a"></i>
|
<i class="icon-mic-a icon-info"></i>
|
||||||
Record album
|
Record album
|
||||||
<span class="item-label-right">
|
<span class="item-note">
|
||||||
Grammy
|
Grammy
|
||||||
</span>
|
</span>
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
<a href="#" class="item item-icon-left">
|
<a href="#" class="item item-icon-left">
|
||||||
<i class="icon-flask"></i>
|
<i class="icon-flask icon-success"></i>
|
||||||
Breaking Bad
|
Breaking Bad
|
||||||
<span class="item-label-right">
|
<span class="item-note">
|
||||||
Blue, yellow, pink
|
Blue, yellow, pink
|
||||||
</span>
|
</span>
|
||||||
</a>
|
</a>
|
||||||
@ -82,31 +82,31 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<a href="#" class="item item-icon-left">
|
<a href="#" class="item item-icon-left">
|
||||||
<i class="icon-game-controller-b"></i>
|
<i class="icon-game-controller-b icon-warning"></i>
|
||||||
Games
|
Games
|
||||||
<span class="item-label-right">
|
<span class="item-note">
|
||||||
Super Mario
|
Super Mario
|
||||||
</span>
|
</span>
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
<a href="#" class="item item-icon-left">
|
<a href="#" class="item item-icon-left">
|
||||||
<i class="icon-music-note"></i>
|
<i class="icon-music-note icon-danger"></i>
|
||||||
Music
|
Music
|
||||||
<span class="item-label-right">
|
<span class="item-note">
|
||||||
JT
|
JT
|
||||||
</span>
|
</span>
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
<a href="#" class="item item-icon-left">
|
<a href="#" class="item item-icon-left">
|
||||||
<i class="icon-bag"></i>
|
<i class="icon-bag icon-dark"></i>
|
||||||
Shopping
|
Shopping
|
||||||
<span class="item-label-right">
|
<span class="item-note">
|
||||||
Bag
|
Bag
|
||||||
</span>
|
</span>
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
<a href="#" class="item item-icon-left">
|
<a href="#" class="item item-icon-left">
|
||||||
<i class="icon-person-stalker"></i>
|
<i class="icon-person-stalker icon-warning fill-icon"></i>
|
||||||
Friends
|
Friends
|
||||||
<span class="badge badge-danger">0</span>
|
<span class="badge badge-danger">0</span>
|
||||||
</a>
|
</a>
|
||||||
|
|||||||
Reference in New Issue
Block a user