You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

196 lines
4.5 KiB

4 years ago
//
// Base styles
// --------------------------------------------------
// Use box sizing on all the things!
* {
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-tap-highlight-color: rgba(0,0,0,0);
-webkit-tap-highlight-color: transparent;
-webkit-user-select: none;//禁止选择文字
outline: none;
}
// We fix position the body and scroll `.#{$namespace}content`.
body {
font-family: $font-family-default;
font-size: $font-size-default;
line-height: $line-height-default;
color: #000;
background-color: #efeff4;
-webkit-overflow-scrolling: touch;
}
// Universal link styling
a {
color: $primary-color;
text-decoration: none;
&:active {
color: darken($primary-color, 10%);
}
}
// Wrapper to be used around all content not in .#{$namespace}bar-title and .#{$namespace}bar-tab
.#{$namespace}content {
background-color: #efeff4;
-webkit-overflow-scrolling: touch;
}
// Hack to force all relatively and absolutely positioned elements still render while scrolling
// Note: This is a bug for "-webkit-overflow-scrolling: touch"
// .#{$namespace}content > * {
// @include transform(translateZ(0));
// }
// Pad top/bottom of content so it doesn't hide behind bars.
// Note: For these to work, content must come after both bars in the markup
.#{$namespace}bar-nav ~ .#{$namespace}content {
padding-top: $bar-base-height;
&.#{$namespace}scroll-wrapper{
.#{$namespace}scrollbar-vertical{
top:$bar-base-height;
}
}
}
.#{$namespace}bar-header-secondary ~ .#{$namespace}content {
padding-top: ($bar-base-height*2);
&.#{$namespace}scroll-wrapper{
.#{$namespace}scrollbar-vertical{
top:($bar-base-height*2);
}
}
}
// Footer bar padding
.#{$namespace}bar-footer ~ .#{$namespace}content {
padding-bottom: $bar-base-height;
&.#{$namespace}scroll-wrapper{
.#{$namespace}scrollbar-vertical{
bottom:$bar-base-height;
}
}
}
.#{$namespace}bar-footer-secondary ~ .#{$namespace}content {
padding-bottom: ($bar-base-height*2);
&.#{$namespace}scroll-wrapper{
.#{$namespace}scrollbar-vertical{
bottom:($bar-base-height*2);
}
}
}
// Tab bar padding
.#{$namespace}bar-tab ~ .#{$namespace}content {
padding-bottom: $bar-tab-height;
&.#{$namespace}scroll-wrapper{
.#{$namespace}scrollbar-vertical{
bottom:$bar-tab-height;
}
}
}
.#{$namespace}bar-footer-secondary-tab ~ .#{$namespace}content {
padding-bottom: ($bar-tab-height+$bar-base-height);
&.#{$namespace}scroll-wrapper{
.#{$namespace}scrollbar-vertical{
bottom:($bar-tab-height+$bar-base-height);
}
}
}
// Utility classes
.#{$namespace}content-padded {
//暂时放弃content-padded
margin: $bar-side-spacing;
}
.#{$namespace}inline {
display: inline-block;
vertical-align: top;
}
.#{$namespace}block {
display: block!important;
}
.#{$namespace}visibility {
visibility: visible!important;
}
.#{$namespace}hidden {
display: none!important;
}
.#{$namespace}ellipsis{
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.#{$namespace}ellipsis-2{
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
white-space: normal!important;
word-wrap: break-word;
}
.#{$namespace}table{
display: table;
table-layout: fixed;
width: 100%;
}
.#{$namespace}table-cell{
display: table-cell;
position: relative;
}
.#{$namespace}text-left{
text-align: left!important;
}
.#{$namespace}text-center{
text-align: center!important;
}
.#{$namespace}text-justify{
text-align: justify!important;
}
.#{$namespace}text-right{
text-align: right!important;
}
.#{$namespace}pull-left {
float: left;
}
.#{$namespace}pull-right {
float: right;
}
.#{$namespace}list-unstyled {
padding-left: 0;
list-style: none;
}
.#{$namespace}list-inline {
padding-left: 0;
list-style: none;
margin-left: -5px;
}
.#{$namespace}list-inline > li {
display: inline-block;
padding-left: 5px;
padding-right: 5px;
}
.#{$namespace}clearfix {
@include clearfix();
}
.#{$namespace}bg-primary {
background-color:$primary-color;
}
.#{$namespace}bg-positive{
background-color:$positive-color;
}
.#{$namespace}bg-negative{
background-color:$negative-color;
}
.#{$namespace}error{
margin: 88px 35px;
padding:10px;
border-radius:6px;
background-color:#bbb;
}
.#{$namespace}subtitle{
font-size: 15px;
}