Commit 47a7d413 authored by Nature's avatar Nature

px to rem

parent e0683419
.has-footer {
bottom: 44px;
bottom: 0.88rem;
.scrollContent{
padding-bottom: 45px;
padding-bottom: 0.9rem;
}
}
.header-top {
margin-top: 34px;
margin-top: 0.68rem;
}
.has-tabs {
.scrollContent{
padding-bottom: 50px;
padding-bottom: 1rem;
}
bottom: 50px;
bottom: 1rem;
}
.spinner svg {
width: 28px;
height: 28px;
width: 0.56rem;
height: 0.56rem;
}
.public-style {
......@@ -26,32 +26,32 @@
width: 100%;
font-weight: inherit;
.bar.button.button-icon .icon:before, .bar .button.button-icon.icon-left:before, .bar .button.button-icon.icon-right:before, .bar .button.button-icon:before, .bar button.button-icon .icon:before, .bar button.button-icon.icon-left:before, .bar button.button-icon.icon-right:before, .bar button.button-icon:before {
padding-right: 4px;
padding-left: 4px;
font-size: 32px;
line-height: 32px;
padding-right: 0.8rem;
padding-left: 0.8rem;
font-size: 0.64rem;
line-height: 0.64rem;
}
.bar {
background-image: none;
padding: 5px 0;
height: 43px;
padding: 0.1rem 0;
height: 0.86rem;
display: flex;
display: -webkit-flex;
align-items: center;
-webkit-align-items: center;
.title {
height: 43px;
min-width: 30px;
height: 0.86rem;
min-width: 0.6rem;
line-height: normal;
font-size: 17px;
font-size: 0.34rem;
display: flex;
display: -webkit-flex;
justify-content: center;
-webkit-justify-content: center;
align-items: center;
-webkit-align-items: center;
padding-top: 4px;
padding-top: 0.8rem;
}
}
.header-bar {
......@@ -60,14 +60,14 @@
.buttons {
.button {
color: @headerColor;
font-size: 16px;
padding-left: 10px;
padding-right: 12.5px;
font-size: 0.32rem;
padding-left: 0.2rem;
padding-right: 0.25rem;
}
}
.title {
color: #4A4A4A;
font-size: 17px;
font-size: 0.34rem;
//font-weight: 600;
left: 0 !important;
right: 0 !important;
......@@ -75,8 +75,8 @@
.iconLeft {
text-align: left;
i {
font-size: 12.5px;
padding-left: 5px;
font-size: 0.25rem;
padding-left: 0.1rem;
}
}
}
......@@ -100,7 +100,7 @@
.list {
background-color: #ffffff;
//border-bottom: 1px solid rgba(0, 0, 0, 0.10);
margin-bottom: 10px;
margin-bottom: 0.2rem;
.item:last-child {
.contents {
border-bottom: none;
......@@ -113,9 +113,9 @@
transform: scale(1,1)
}
.item {
height: 45px;
height: 0.9rem;
border: none;
padding: 0 0 0 15px;
padding: 0 0 0 0.3rem;
.contents {
height: 100%;
width: 100%;
......@@ -127,7 +127,7 @@
align-items: center;
-webkit-justify-content: space-between;
-webkit-align-items: center;
padding: 0 15px 0 0;
padding: 0 0.3rem 0 0;
&.activated {
opacity: 0.9;
-webkit-transform: scale(0.95);
......@@ -141,13 +141,13 @@
-webkit-justify-content: flex-start;
-webkit-align-items: center;
letter-spacing: 0;
line-height: 16px;
line-height: 0.32rem;
font-size: @font-size-big;
color: #838E94;
letter-spacing: 0;
text-align: center;
.left-icon {
margin-right: 10px;
margin-right: 0.2rem;
}
.required {
display: flex;
......@@ -155,9 +155,9 @@
.required::after {
content: '*';
color: #D24E4E;
height: 8px;
padding-top: 4px;
margin-left: 2.5px;
height: 0.16rem;
padding-top: 0.08rem;
margin-left: 0.05rem;
}
}
.add-content {
......@@ -174,7 +174,7 @@
white-space: normal;
word-break: break-all;
word-wrap: break-word;
line-height: 20px;
line-height: 0.4rem;
//输入框
input {
font-size: @font-size-middle;
......@@ -186,7 +186,7 @@
}
//右侧图标
.right-icon {
margin-left: 10px;
margin-left: 0.2rem;
}
//toggle
.toggle-check {
......@@ -197,15 +197,15 @@
-webkit-align-items: center;
align-items: center;
.track {
width: 40px;
height: 25px;
margin-right: 2.5px;
border-radius: 15px;
width: 0.8rem;
height: 0.5rem;
margin-right: 0.05rem;
border-radius: 0.3rem;
.handle {
width: 22.5px;
height: 22.5px;
top: 3.5px;
left: 2.5px;
width: 0.45rem;
height: 0.45rem;
top: 0.07rem;
left: 0.05rem;
}
}
}
......@@ -213,10 +213,10 @@
border-color: @check-box-bg;
background-color: @check-box-bg;
.handle {
width: 22.5px;
height: 22.5px;
top: 3.5px;
left: 9px;
width: 0.45rem;
height: 0.45rem;
top: 0.07rem;
left: 0.18rem;
}
}
}
......@@ -225,7 +225,7 @@
}
}
.bottom-tab {
height: 44px;
height: 0.88rem;
width: 100%;
background-color: #fff;
position: fixed;
......@@ -257,7 +257,7 @@
}
.bottom-tab-divider {
width: 2px; /*no*/
height: 30px;
height: 0.6rem;
background-color: rgb(214, 217, 218);
}
}
......
This diff is collapsed.
.platform-ios {
.bar .title + .buttons {
top: auto;
bottom: 12px;
bottom: 0.24rem;
}
.has-header {
top: 64px;
top: 1.28rem;
}
.header-top {
margin-top: 63px;
margin-top: 1.26rem;
}
.img {
margin-top: 10px;
margin-top: 0.2rem;
}
.bar {
background-image: none;
padding: 5px 0 5px 0;
height: 64px !important;
padding: 0.1rem 0 0.1rem 0;
height: 1.28rem !important;
display: flex;
display: -webkit-flex;
align-items: center;
-webkit-align-items: center;
.title {
height: 48px;
min-width: 30px;
line-height: 48px;
font-size: 17px;
height: 0.96rem;
min-width: 0.6rem;
line-height: 0.96rem;
font-size: 0.34rem;
display: flex;
display: -webkit-flex;
justify-content: center;
-webkit-justify-content: center;
align-items: center;
-webkit-align-items: center;
margin-top: 4px;
margin-top: 0.08rem;
}
}
.content {
......@@ -44,8 +44,8 @@
color: #D24E4E;
position: absolute;
top: 0;
right: -8px;
height: 8px;
right: -0.16rem;
height: 0.16rem;
padding-top: 2px;
}
}
......
......@@ -2,18 +2,18 @@
@media (device-width: 375px) and (device-height: 812px) and (-webkit-min-device-pixel-ratio: 3) {
.platform-ios{
.has-header {
top: 84px;
top: 1.68rem;
}
.has-tabs {
bottom: 84px;
bottom: 1.68rem;
}
.has-footer{
margin-bottom: 34px;
margin-bottom: 0.68rem;
}
.public-style {
.bottom-tab{
height: 78px;
padding-bottom: 34px;
height: 1.56rem;
padding-bottom: 0.68rem;
}
}
}
......@@ -21,22 +21,22 @@
// iPhoneX适配
@media (device-width: 414) and (device-height: 896){
@media (device-width: 414px) and (device-height: 896px){
.platform-ios{
.has-header {
top: 84px;
top: 1.68rem;
}
.has-tabs {
bottom: 84px;
bottom: 1.68rem;
}
.has-footer{
margin-bottom: 34px;
margin-bottom: 0.68rem;
}
.public-style {
.bottom-tab{
height: 78px;
padding-bottom: 34px;
height: 1.56rem;
padding-bottom: 0.68rem;
}
}
}
}
\ No newline at end of file
}
......@@ -3,27 +3,27 @@
position: absolute !important;
top: 0;
width: 100%;
height: 46px;
font-size: 14px !important;
height: 0.92rem;
font-size: 0.28rem !important;
background: white;
.vux-header-left {
font-size: 14px !important;
top: 12px !important;
line-height: 21px !important;
font-size: 0.28rem !important;
top: 0.24rem !important;
line-height: 0.42rem !important;
.vux-header-back {
}
.left-arrow {
&before {
width: 12px !important;
height: 12px !important;
width: 0.24rem !important;
height: 0.24rem !important;
}
}
}
.vux-header-title {
height: 40px !important;
line-height: 40px !important;
font-size: 18px !important;
height: 0.8rem !important;
line-height: 0.8rem !important;
font-size: 0.36rem !important;
}
.vux-header-right {
......@@ -35,7 +35,7 @@
}
.weui-loading_toast .weui-toast__content {
margin-top: 7px !important;
margin-top: 0.14rem !important;
}
.weui-toast {
......@@ -44,7 +44,7 @@
max-width: 14em;
min-height: 3em !important;
top: 38% !important;
border-radius: 7px !important;
border-radius: 0.14rem !important;
}
.weui-toast.vux-toast-top {
......@@ -58,27 +58,27 @@
}
.weui-icon_toast {
margin: 15px 0 0 !important;
margin: 0.3rem 0 0 !important;
}
.weui-icon_toast.weui-loading {
width: 32px !important;
height: 32px !important;
width: 0.64rem !important;
height: 0.64rem !important;
}
.weui-toast__content {
//margin: 0 0 30px !important;
font-size: 16px !important;
font-size: 0.32rem !important;
}
.weui-toast_text .weui-toast__content {
border-radius: 10px !important;
padding: 6px 7px;
border-radius: 0.2rem !important;
padding: 0.12rem 0.14rem;
}
.weui-toast.vux-toast-bottom {
top: auto !important;
bottom: 50px !important;
bottom: 1rem !important;
}
.weui-toast_success {
......@@ -88,8 +88,8 @@
width: auto !important;
.weui-toast__content {
margin: 10px 5px !important;
line-height: 21px !important;
margin: 0.2rem 0.1rem !important;
line-height: 0.42rem !important;
}
}
......@@ -105,22 +105,22 @@
}
.weui-toast.weui-toast_forbidden .weui-toast__content {
margin: 10px 5px !important;
line-height: 21px !important;
margin: 0.2rem 0.1rem !important;
line-height: 0.42rem !important;
}
.weui-icon_toast.weui-loading {
margin: 12px 0 0 !important;
margin: 0.24rem 0 0 !important;
}
.weui-icon_toast.weui-icon-success-no-circle:before {
font-size: 34px !important;
font-size: 0.68rem !important;
}
.weui-dialog {
width: 70% !important;
max-width: 260px !important;
border-radius: 10px !important;
max-width: 5.2rem !important;
border-radius: 0.2rem !important;
}
.weui-dialog__hd {
......@@ -128,16 +128,16 @@
}
.weui-tabbar__item {
padding: 6px 0 0 !important;
padding: 0.12rem 0 0 !important;
}
.weui-tabbar__icon {
width: 22px !important;
height: 22px !important;
width: 0.44rem !important;
height: 0.44rem !important;
}
.weui-tabbar__label {
font-size: 12px !important;
font-size: 0.24rem !important;
}
......@@ -148,52 +148,52 @@
.weui-dialog__title {
font-weight: 600 !important;
font-size: 18px !important;
font-size: 0.36rem !important;
}
.weui-dialog__bd {
font-size: 15px !important;
font-size: 0.3rem !important;
min-height: 0.4rem;
}
.weui-dialog__ft {
line-height: 48px !important;
font-size: 18px !important;
line-height: 0.96rem !important;
font-size: 0.36rem !important;
}
.dp-header {
.vux-datetime-cancel {
padding-left: 15px !important;
padding-left: 0.3rem !important;
}
.vux-datetime-confirm {
padding-right: 15px !important;
padding-right: 0.3rem !important;
}
}
.dp-header .dp-item {
font-size: 16px !important;
height: 44px !important;
line-height: 44px !important;
font-size: 0.32rem !important;
height: 0.88rem !important;
line-height: 0.88rem !important;
}
.dp-content {
padding: 10px 0 !important;
padding: 0.2rem 0 !important;
}
.scroller-component {
height: 238px !important;
height: 4.76rem !important;
background-color: #fff;
z-index: 2;
}
.scroller-mask {
background-size: 100% 102px !important;
background-size: 100% 2.04rem !important;
}
.scroller-indicator {
top: 102px !important;
height: 34px !important;
line-height: 34px !important;
top: 2.04rem !important;
height: 0.68rem !important;
line-height: 0.68rem !important;
//border-bottom: 1px solid #cccccc !important;
//border-top: 1px solid #cccccc !important;
background-image: none !important;
......@@ -207,9 +207,9 @@
}
.scroller-item {
font-size: 16px !important;
height: 34px !important;
line-height: 34px !important;
font-size: 0.32rem !important;
height: 0.68rem !important;
line-height: 0.68rem !important;
}
.weui-cells {
......@@ -231,7 +231,7 @@
}
.weui-textarea {
font-size: 16px !important;
font-size: 0.32rem !important;
}
.lg-preview-img {
......
......@@ -41,22 +41,18 @@ export default {
// iPhoneX适配
@media (device-width: 375px) and (device-height: 812px) and (-webkit-min-device-pixel-ratio: 3) {
.platform-ios {
//.h-ios {
.h-bottom-tab {
height: 78px;
padding-bottom: 34px;
height: 78px;
padding-bottom: 34px;
}
//}
}
}
@media (device-width: 414px) and (device-height: 896px){
.platform-ios {
//.h-ios {
.h-bottom-tab {
height: 78px;
height: 78px;
padding-bottom: 34px;
}
//}
}
}
......
......@@ -98,6 +98,28 @@
border-bottom: 1px solid #e5e5e5; /*no*/
border-right: 1px solid #e5e5e5; /*no*/
&:nth-child(3){
border-right: none;
}
&:nth-child(6){
border-right: none;
}
&:nth-child(9){
border-right: none;
}
&:nth-child(10){
border-right: none;
border-bottom: none;
}
&:nth-child(11){
border-right: none;
border-bottom: none;
}
&:nth-child(12){
border-right: none;
border-bottom: none;
}
}
.delete {
......
......@@ -66,7 +66,6 @@ export default {
</script>
<style lang="less">
html, body, #app {
height: 100%;
width: 100%;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment