fe / yoho-blk · Commits

Go to a project

Authored by 石坚
Commit 02ad13e7110e266fdfca3fe5755fa116be7f9b44 1 parent 62be00d1 master ... develop feature/catch feature/docker feature/login-msg feature/login-ua-ip feature/removCamel feature/safe-bug feature/sessionKey feature/setting feature/vip feature/webpack2 feature/wsl5.3 gray release/2.0 release/fontBack2.0

blk样式bug修改

Inline Side-by-side
Showing 7 changed files with 965 additions and 944 deletions
{{# banner}}
<div class="brand-info-wrapper">
<div class="brand-info">
<div class="nano-content">
<div class="">
<div class="brand-info-title">
<h2>{{name}}</h2>
<h5>品牌介绍</h5>
</div>
<div class="brand-info-content">
{{{info}}}
<div class="brand-info-content nano">
<div class="nano-content">{{{info}}}</div>
</div>
</div>
</div>
... ...
... ... @@ -12,8 +12,8 @@ var Shop = {
$('#brand-info').click(function() {
Shop.brandInfoDialog().show();
$('.brand-info').addClass('nano');
$('.brand-info').nanoScroller();
//$('.brand-info').addClass('nano');
$('.brand-info-dialog .brand-info-content').nanoScroller();
});
},
... ...
... ... @@ -182,7 +182,7 @@
.go-bag-btn {
font-size: 20px;
line-height: 1;
padding-top: 20px;
padding-top: 22px;
border-top: 1px solid #ddd;
text-align: center;
}
... ...
... ... @@ -289,6 +289,7 @@
text-align: left;
font-size: 12px;
line-height: 20px;
height: 396px;
p {
font-size: 12px;
... ...
.shopping-order-page {
.order-block {
border-bottom: 1px solid #eee;
padding-bottom: 30px;
}
.radio {
font-size: 16px;
}
.address-info {
padding-bottom: 15px;
ul {
width: 1173px;
&.shrink {
height: 195px;
overflow: hidden;
}
}
.new-address {
cursor: pointer;
height: 52px;
}
}
.address {
cursor: pointer;
.address-chosed {
display: none;
}
&.focus .address-chosed {
display: block;
}
}
.new-address .iconfont {
font-size: 12px;
}
.address-header {
height: 11px;
background: #eee url(/shopping/address-tag.png);
}
.new-address-block {
float: left;
width: 270px;
height: 180px;
margin-right: 23px;
border: 1px solid #eee;
margin-bottom: 15px;
height: 180px;
text-align: center;
color: #999;
cursor: pointer;
.iconfont {
display: block;
color: #eee;
font-size: 60px;
line-height: 80px;
margin-top: 30px;
}
}
.address {
position: relative;
float: left;
width: 270px;
height: 180px;
margin-right: 23px;
border: 1px solid #eee;
margin-bottom: 15px;
&.focus {
border-color: #000;
.address-header {
background-image: url(/shopping/address-tag-chosed.png);
}
}
.default-or-not {
text-align: right;
font-size: 12px;
height: 40px;
line-height: 40px;
}
&.default .default-or-not {
line-height: normal;
.set-default {
display: none;
}
.default-tag {
display: inline-block;
}
}
&.default .delete {
display: none;
}
.set-default {
display: inline-block;
color: #ccc;
cursor: pointer;
&:hover {
color: #379ed6;
}
}
.default-tag {
display: none;
border: 1px solid #ccc;
color: #000;
padding: 5px;
margin-top: 8px;
}
.consignee {
display: block;
float: left;
max-width: 140px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
}
.address-chosed {
position: absolute;
bottom: 0;
bottom: -1px\9; /* stylelint-disable-line */
right: 0;
}
.address-content {
padding: 0 15px;
}
.address-area {
line-height: 40px;
border-top: 1px solid #ccc;
margin-top: 10px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.address-detail {
line-height: 15px;
height: 30px;
}
.address-detail,
.address-opration {
font-size: 12px;
color: #999;
}
.address-opration {
cursor: pointer;
line-height: 30px;
text-align: right;
> span:hover {
color: #379ed6;
}
}
.address-all {
font-size: 12px;
color: #7e7e7e;
cursor: pointer;
.iconfont {
font-size: 12px;
}
}
.payment-type,
.dispatch-type {
padding-bottom: 10px;
}
.title {
line-height: 52px;
}
.chose-row {
color: #ccc;
line-height: 40px;
&.focus {
color: #000;
.chose-block {
border-color: #000;
}
}
}
.chose-block {
float: left;
display: block;
height: 40px;
margin-right: 20px;
text-align: center;
border: 1px solid #ccc;
cursor: pointer;
}
.payment-type .chose-block {
width: 160px;
}
.dispatch-type .chose-block {
width: 200px;
}
ul.content > li {
margin-bottom: 20px;
}
.dispatch-call {
margin-top: 30px;
}
.call-before-dispatch-tip {
color: #ccc;
margin-left: 75px;
}
.go-cart-link:hover {
color: #379ed6;
.iconfont {
color: #379ed6;
}
}
.go-cart-link .iconfont {
font-size: 16px;
}
.order-info {
margin-top: 50px;
}
.order-inner {
border: 1px solid #ccc;
.title {
padding: 0 15px;
border-bottom: 1px solid #eee;
overflow: hidden;
}
.block {
margin: 0 15px;
}
.info {
width: 548px;
}
/* [表格内容]商品图片 */
.goods-img {
position: relative;
width: 180px;
padding: 0 40px;
img {
width: 100px;
height: 148px;
}
.gift-tag {
position: absolute;
bottom: 0;
left: 40px;
right: 40px;
height: 25px;
color: #fff;
background: #379ed6;
font-size: 12px;
text-align: center;
line-height: 25px;
}
}
/* [表格内容]品牌和商品名称 */
.brand-and-name {
width: 368px;
text-align: left;
padding-right: 30px;
> a:hover {
color: #379ed6;
}
}
.color-size {
width: 190px;
}
.price {
width: 190px;
}
.number {
width: 190px;
}
}
.multi-package-row {
position: relative;
height: 40px;
font-size: 14px;
line-height: 40px;
border-bottom: 1px solid #eee;
text-align: center;
background: #f4fbff;
.show-package {
font-size: 16px;
cursor: pointer;
}
.package-up-icon {
position: absolute;
width: 10px;
height: 7px;
background: url(/shopping/package-up.png);
top: -7px;
left: 282px;
+ .package-item .package-title {
border-top: none;
}
}
.package-item {
position: relative;
.toggle-icon {
position: absolute;
font-size: 34px;
top: 106px;
cursor: pointer;
}
.left-icon {
left: -24px;
}
.right-icon {
right: -24px;
}
}
.package-goods-wrap {
height: 134px;
overflow: hidden;
}
.package-list {
position: absolute;
background: #fff;
border: 2px solid #bbb;
width: 586px;
right: 36px;
padding: 0 50px;
}
.package-title,
.package-shipping {
text-align: left;
margin-left: 10px;
}
.package-title {
border-top: 1px solid #eee;
line-height: 55px;
}
.package-shipping {
color: #595959;
margin-top: 20px;
margin-bottom: 30px;
}
.package-goods li {
width: 120px;
}
.package-goods-img {
display: block;
width: 100px;
height: 134px;
margin: 0 auto;
}
}
.order-table-head {
height: 50px;
line-height: 50px;
margin: 0 15px;
> span {
display: block;
float: left;
text-align: center;
}
}
.order-table-body {
display: table;
}
.order-goods {
border-top: 1px solid #eee;
padding: 20px 0;
margin: 0 15px;
text-align: center;
.brand-name {
display: block;
line-height: 50px;
width: 338px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.name {
display: inline-block;
font-size: 14px;
line-height: 16px;
max-height: 32px;
}
> * {
display: table-cell;
vertical-align: middle;
}
.number > .iconfont {
font-size: 14px;
}
}
.invoice-info .content {
> * {
display: inline-block;
}
.invoice-detail {
margin-left: 40px;
}
em {
margin-right: 20px;
}
.modify-invoice {
display: inline-block;
width: 40px;
height: 20px;
line-height: 20px;
}
}
.invoice-radio {
cursor: pointer;
color: #666;
label {
font-size: 14px;
}
}
.coin-and-remark {
padding: 20px 0;
}
.coin .title,
.remark .title {
line-height: 30px;
}
.coin-ctrl,
.remark-ctrl {
cursor: pointer;
&.iconfont {
font-size: 16px;
}
}
.balance {
padding: 10px 20px;
border: 1px solid #ccc;
font-size: 14px;
margin-bottom: 80px;
}
.balance-info {
line-height: 30px;
width: 670px;
}
.receiver-wrap {
position: relative;
i {
position: absolute;
width: 70px;
}
em {
display: inline-block;
width: 480px;
margin-left: 70px;
}
}
.balance-list {
width: 364px;
li {
line-height: 30px;
}
}
.balance-cost {
float: right;
}
li.need-pay {
border-top: 1px solid #000;
line-height: 50px;
margin-top: 10px;
}
.submit-order {
width: 160px;
height: 40px;
line-height: 40px;
}
/* 使用有货币&备注 */
.coin-and-remark .content {
background: #f5f5f5;
padding: 15px 20px;
margin: 20px 0;
font-size: 14px;
}
.coin-input {
width: 70px;
margin-left: 20px;
}
.coin-tip {
line-height: 30px;
}
.used-coin .btn {
display: inline-block;
width: auto;
height: 20px;
line-height: 20px;
padding: 0 5px;
border: none;
cursor: pointer;
&.modify {
margin-left: 130px;
margin-right: 10px;
}
}
.remark-content {
width: 1110px;
height: 118px;
padding: 10px;
resize: none;
}
.print-price-radio-group {
display: inline-block;
}
.print-price {
margin: 20px 0 10px;
}
.print-price-radio {
display: inline-block;
cursor: pointer;
> .iconfont {
font-size: 16px;
}
}
.remark-tip {
color: #b1b1b1;
}
.checked {
position: relative;
top: 2px;
}
}
.yoho-dialog.address,
.yoho-dialog.invoice {
background: #fff;
.content {
text-align: left;
}
.btns .btn {
width: 140px;
height: 40px;
line-height: 40px;
&.white {
border-color: #000;
color: #000;
}
}
}
.yoho-dialog.address {
width: 765px;
padding: 0 40px 10px;
.label-name {
text-align: right;
}
.dialog-title {
margin: 25px 0;
font-size: 18px;
}
&.is-init .cancel-address {
display: none;
}
.cascading-address {
float: left;
margin-left: 0 !important;
}
}
.yoho-dialog.invoice {
width: 702px;
.dialog-title {
color: #777;
line-height: 50px;
border-bottom: 1px solid #eee;
}
.invoice-tab {
margin: 17px 0;
.btn {
width: 85px;
height: 26px;
line-height: 26px;
}
}
.tip {
background: #f5f5f5;
padding: 20px;
font-size: 15px;
line-height: 18px;
}
.required-mark {
color: #f00;
}
.invoice-title-radio,
.invoice-content-radio {
display: inline-block;
cursor: pointer;
width: 115px;
}
.row {
margin: 18px 0;
line-height: 30px;
.iconfont {
font-size: 16px;
color: #e0e0e0;
}
.checked {
color: #1b1b1b;
}
.input {
width: 200px;
height: 30px;
border-color: #eee;
background: #f5f5f5;
}
.label {
float: left;
font-size: 14px;
width: 100px;
}
.row-content {
float: left;
width: 520px;
}
}
}
.address-confirm-dialog {
.content {
padding-top: 0 !important;
p {
position: static !important;
}
p.main {
line-height: 100px;
font-size: 28px;
}
}
}
.shopping-order-page {
.order-block {
border-bottom: 1px solid #eee;
padding-bottom: 30px;
}
.radio {
font-size: 16px;
}
.address-info {
padding-bottom: 15px;
ul {
width: 1173px;
&.shrink {
height: 195px;
overflow: hidden;
}
}
.new-address {
cursor: pointer;
height: 52px;
}
.title{
font-size: 15px;
}
}
.address {
cursor: pointer;
.address-chosed {
display: none;
}
&.focus .address-chosed {
display: block;
}
}
.new-address .iconfont {
font-size: 12px;
}
.address-header {
height: 11px;
background: #eee url(/shopping/address-tag.png);
}
.new-address-block {
float: left;
width: 270px;
height: 180px;
margin-right: 23px;
border: 1px solid #eee;
margin-bottom: 15px;
height: 180px;
text-align: center;
color: #999;
cursor: pointer;
.iconfont {
display: block;
color: #eee;
font-size: 60px;
line-height: 80px;
margin-top: 30px;
}
}
.address {
position: relative;
float: left;
width: 270px;
height: 180px;
margin-right: 23px;
border: 1px solid #eee;
margin-bottom: 15px;
&.focus {
border-color: #000;
.address-header {
background-image: url(/shopping/address-tag-chosed.png);
}
}
.default-or-not {
text-align: right;
font-size: 12px;
height: 40px;
line-height: 40px;
}
&.default .default-or-not {
line-height: normal;
.set-default {
display: none;
}
.default-tag {
display: inline-block;
}
}
&.default .delete {
display: none;
}
.set-default {
display: inline-block;
color: #ccc;
cursor: pointer;
&:hover {
color: #379ed6;
}
}
.default-tag {
display: none;
border: 1px solid #ccc;
color: #000;
padding: 5px;
margin-top: 8px;
}
.consignee {
display: block;
float: left;
max-width: 140px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
}
.address-chosed {
position: absolute;
bottom: 0;
bottom: -1px\9; /* stylelint-disable-line */
right: 0;
}
.address-content {
padding: 0 15px;
}
.address-area {
line-height: 40px;
border-top: 1px solid #ccc;
margin-top: 10px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-size: 14px;
}
.address-detail {
line-height: 15px;
height: 30px;
}
.address-detail,
.address-opration {
font-size: 12px;
color: #999;
}
.address-opration {
cursor: pointer;
line-height: 30px;
text-align: right;
> span:hover {
color: #379ed6;
}
}
.address-all {
font-size: 12px;
color: #7e7e7e;
cursor: pointer;
.iconfont {
font-size: 12px;
}
}
.payment-type,
.dispatch-type {
padding-bottom: 10px;
}
.title {
line-height: 52px;
font-size: 14px;
}
.chose-row {
color: #ccc;
line-height: 40px;
&.focus {
color: #000;
.chose-block {
border-color: #000;
font-size: 15px;
}
.tip-text{
font-size: 14px;
}
}
}
.chose-block {
float: left;
display: block;
height: 40px;
margin-right: 20px;
text-align: center;
border: 1px solid #ccc;
cursor: pointer;
}
.payment-type .chose-block {
width: 160px;
}
.dispatch-type .chose-block {
width: 200px;
}
ul.content > li {
margin-bottom: 20px;
}
.dispatch-call {
margin-top: 30px;
}
.call-before-dispatch-tip {
color: #ccc;
margin-left: 75px;
}
.go-cart-link:hover {
color: #379ed6;
.iconfont {
color: #379ed6;
}
}
.go-cart-link .iconfont {
font-size: 16px;
}
.order-info {
margin-top: 50px;
}
.order-inner {
border: 1px solid #ccc;
.title {
padding: 0 15px;
border-bottom: 1px solid #eee;
overflow: hidden;
}
.block {
margin: 0 15px;
}
.info {
width: 548px;
}
/* [表格内容]商品图片 */
.goods-img {
position: relative;
width: 180px;
padding: 0 40px;
img {
width: 100px;
height: 148px;
}
.gift-tag {
position: absolute;
bottom: 0;
left: 40px;
right: 40px;
height: 25px;
color: #fff;
background: #379ed6;
font-size: 12px;
text-align: center;
line-height: 25px;
}
}
/* [表格内容]品牌和商品名称 */
.brand-and-name {
width: 368px;
text-align: left;
padding-right: 30px;
> a:hover {
color: #379ed6;
}
}
.color-size {
width: 190px;
font-size: 14px;
}
.price {
width: 190px;
}
.number {
width: 190px;
}
}
.multi-package-row {
position: relative;
height: 40px;
font-size: 14px;
line-height: 40px;
border-bottom: 1px solid #eee;
text-align: center;
background: #f4fbff;
.show-package {
font-size: 16px;
cursor: pointer;
}
.package-up-icon {
position: absolute;
width: 10px;
height: 7px;
background: url(/shopping/package-up.png);
top: -7px;
left: 282px;
+ .package-item .package-title {
border-top: none;
}
}
.package-item {
position: relative;
.toggle-icon {
position: absolute;
font-size: 34px;
top: 106px;
cursor: pointer;
}
.left-icon {
left: -24px;
}
.right-icon {
right: -24px;
}
}
.package-goods-wrap {
height: 134px;
overflow: hidden;
}
.package-list {
position: absolute;
background: #fff;
border: 2px solid #bbb;
width: 586px;
right: 36px;
padding: 0 50px;
}
.package-title,
.package-shipping {
text-align: left;
margin-left: 10px;
}
.package-title {
border-top: 1px solid #eee;
line-height: 55px;
}
.package-shipping {
color: #595959;
margin-top: 20px;
margin-bottom: 30px;
}
.package-goods li {
width: 120px;
}
.package-goods-img {
display: block;
width: 100px;
height: 134px;
margin: 0 auto;
}
}
.order-table-head {
height: 50px;
line-height: 50px;
margin: 0 15px;
> span {
display: block;
float: left;
text-align: center;
font-size: 14px;
}
}
.order-table-body {
display: table;
}
.order-goods {
border-top: 1px solid #eee;
padding: 20px 0;
margin: 0 15px;
text-align: center;
.brand-name {
display: block;
line-height: 50px;
width: 338px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.name {
display: inline-block;
font-size: 14px;
line-height: 16px;
max-height: 32px;
}
> * {
display: table-cell;
vertical-align: middle;
}
.number > .iconfont {
font-size: 14px;
}
}
.invoice-info .content {
> * {
display: inline-block;
}
.invoice-detail {
margin-left: 40px;
}
em {
margin-right: 20px;
}
.modify-invoice {
display: inline-block;
width: 40px;
height: 20px;
line-height: 20px;
}
}
.invoice-radio {
cursor: pointer;
color: #666;
label {
font-size: 14px;
}
}
.coin-and-remark {
padding: 20px 0;
}
.coin .title,
.remark .title {
line-height: 30px;
}
.coin-ctrl,
.remark-ctrl {
cursor: pointer;
&.iconfont {
font-size: 16px;
}
}
.balance {
padding: 10px 20px;
border: 1px solid #ccc;
font-size: 14px;
margin-bottom: 80px;
}
.balance-info {
line-height: 30px;
width: 670px;
}
.receiver-wrap {
position: relative;
i {
position: absolute;
width: 70px;
}
em {
display: inline-block;
width: 480px;
margin-left: 70px;
}
}
.balance-list {
width: 364px;
li {
line-height: 30px;
}
}
.balance-cost {
float: right;
}
li.need-pay {
border-top: 1px solid #000;
line-height: 50px;
margin-top: 10px;
}
.submit-order {
width: 160px;
height: 40px;
line-height: 40px;
}
/* 使用有货币&备注 */
.coin-and-remark .content {
background: #f5f5f5;
padding: 15px 20px;
margin: 20px 0;
font-size: 14px;
}
.coin-input {
width: 70px;
margin-left: 20px;
}
.coin-tip {
line-height: 30px;
}
.used-coin .btn {
display: inline-block;
width: auto;
height: 20px;
line-height: 20px;
padding: 0 5px;
border: none;
cursor: pointer;
&.modify {
margin-left: 130px;
margin-right: 10px;
}
}
.remark-content {
width: 1110px;
height: 118px;
padding: 10px;
resize: none;
}
.print-price-radio-group {
display: inline-block;
}
.print-price {
margin: 20px 0 10px;
}
.print-price-radio {
display: inline-block;
cursor: pointer;
> .iconfont {
font-size: 16px;
}
}
.remark-tip {
color: #b1b1b1;
}
.checked {
position: relative;
top: 2px;
}
}
.yoho-dialog.address,
.yoho-dialog.invoice {
background: #fff;
.content {
text-align: left;
}
.btns .btn {
width: 140px;
height: 40px;
line-height: 40px;
&.white {
border-color: #000;
color: #000;
}
}
}
.yoho-dialog.address {
width: 765px;
padding: 0 40px 10px;
.label-name {
text-align: right;
}
.dialog-title {
margin: 25px 0;
font-size: 18px;
}
&.is-init .cancel-address {
display: none;
}
.cascading-address {
float: left;
margin-left: 0 !important;
}
}
.yoho-dialog.invoice {
width: 702px;
.dialog-title {
color: #777;
line-height: 50px;
border-bottom: 1px solid #eee;
}
.invoice-tab {
margin: 17px 0;
.btn {
width: 85px;
height: 26px;
line-height: 26px;
}
}
.tip {
background: #f5f5f5;
padding: 20px;
font-size: 15px;
line-height: 18px;
}
.required-mark {
color: #f00;
}
.invoice-title-radio,
.invoice-content-radio {
display: inline-block;
cursor: pointer;
width: 115px;
}
.row {
margin: 18px 0;
line-height: 30px;
.iconfont {
font-size: 16px;
color: #e0e0e0;
}
.checked {
color: #1b1b1b;
}
.input {
width: 200px;
height: 30px;
border-color: #eee;
background: #f5f5f5;
}
.label {
float: left;
font-size: 14px;
width: 100px;
}
.row-content {
float: left;
width: 520px;
}
}
}
.address-confirm-dialog {
.content {
padding-top: 0 !important;
p {
position: static !important;
}
p.main {
line-height: 100px;
font-size: 28px;
}
}
}
... ...
$width: 1150px;
$liWidth: 140px;
$liHeight: 40px;
$liBorderColor: #e6e6e6;
$fontColor: #616161;
.pay-online-wrapper {
.title {
margin-top: 35px;
margin-bottom: 20px;
height: 60px;
.content {
font-weight: bold;
height: 40px;
}
.footer {
height: 20px;
}
}
.pay-notice {
color: #999;
font-size: 14px;
}
.order-detail-ctrl {
font-size: 14px;
cursor: pointer;
.up {
display: none;
}
.down {
display: inline-block;
}
/* 默认情况为展开状态 箭头方向为下 */
&.shrink {
.up {
display: inline-block;
}
.down {
display: none;
}
}
.iconfont {
font-size: 12px;
margin-left: 10px;
}
}
.order-detail {
border: 1px solid $liBorderColor;
margin-bottom: 30px;
height: calc(135px + 2px);
padding: 20px 30px;
.row {
height: 30px;
line-height: @height;
font-weight: bold;
.item {
float: left;
width: calc($width / 2 - 31px);
}
}
.item.receiver-address {
width: 100%;
}
}
.pay-nav {
height: calc($liHeight + 2px);
line-height: calc($liHeight + 2px);
border-bottom: 1px solid $liBorderColor;
z-index: 0;
clear: both;
.tabs {
display: inline-block;
height: $liHeight;
li {
width: $liWidth;
height: $liHeight;
line-height: $liHeight;
float: left;
font-size: 16px;
text-align: center;
background-color: #fff;
color: $fontColor;
cursor: pointer;
position: relative;
&.active {
border: 1px solid $liBorderColor;
height: calc($liHeight + 1px);
line-height: calc($liHeight - 2px);
top: 1px;
border-bottom: none;
color: #000;
z-index: 3;
}
}
}
}
.pay-type-icon {
position: relative;
float: left;
width: 250px;
height: 80px;
margin-bottom: 30px;
margin-right: 50px;
margin-top: 30px;
cursor: pointer;
border: 1px solid $liBorderColor;
text-align: center;
img {
display: inline-block;
margin-top: 19px;
}
.choose-tag {
display: none;
position: absolute;
bottom: 0;
right: 0;
height: 22px;
width: 23px;
}
&.active {
border: 2px solid black;
.choose-tag {
display: inline-block;
}
}
}
.pay-ctrl {
height: 40px;
margin-top: 20px;
margin-bottom: 20px;
clear: both;
.btn-shape {
width: 160px;
height: 40px;
line-height: @height;
}
}
}
.pay-info-dialog {
.pay-page-tips {
text-align: center;
h3 {
font-size: 18px;
font-weight: 700;
margin: 30px 0;
}
p {
font-size: 14px;
color: #999;
margin: 10px 0;
}
.btn {
margin-top: 20px;
}
}
}
$width: 1150px;
$liWidth: 140px;
$liHeight: 40px;
$liBorderColor: #e6e6e6;
$fontColor: #616161;
.pay-online-wrapper {
.title {
margin-top: 35px;
margin-bottom: 20px;
height: 60px;
.content {
font-weight: bold;
height: 40px;
}
.footer {
height: 20px;
}
}
.pay-notice {
color: #999;
font-size: 14px;
}
.order-detail-ctrl {
font-size: 14px;
cursor: pointer;
.up {
display: none;
}
.down {
display: inline-block;
}
/* 默认情况为展开状态 箭头方向为下 */
&.shrink {
.up {
display: inline-block;
}
.down {
display: none;
}
}
.iconfont {
font-size: 12px;
margin-left: 10px;
}
}
.order-detail {
border: 1px solid $liBorderColor;
margin-bottom: 30px;
height: calc(135px + 2px);
padding: 20px 30px;
font-size: 14px;
.row {
height: 30px;
line-height: @height;
font-weight: bold;
.item {
float: left;
width: calc($width / 2 - 31px);
}
}
.item.receiver-address {
width: 100%;
}
}
.pay-nav {
height: calc($liHeight + 2px);
line-height: calc($liHeight + 2px);
border-bottom: 1px solid $liBorderColor;
z-index: 0;
clear: both;
.tabs {
display: inline-block;
height: $liHeight;
li {
width: $liWidth;
height: $liHeight;
line-height: $liHeight;
float: left;
font-size: 16px;
text-align: center;
background-color: #fff;
color: $fontColor;
cursor: pointer;
position: relative;
font-size: 14px;
&.active {
border: 1px solid $liBorderColor;
height: calc($liHeight + 1px);
line-height: calc($liHeight - 2px);
top: 1px;
border-bottom: none;
color: #000;
z-index: 3;
}
}
}
}
.pay-type-icon {
position: relative;
float: left;
width: 250px;
height: 80px;
margin-bottom: 30px;
margin-right: 50px;
margin-top: 30px;
cursor: pointer;
border: 1px solid $liBorderColor;
text-align: center;
img {
display: inline-block;
margin-top: 19px;
}
.choose-tag {
display: none;
position: absolute;
bottom: 0;
right: 0;
height: 22px;
width: 23px;
}
&.active {
border: 2px solid black;
.choose-tag {
display: inline-block;
}
}
}
.pay-ctrl {
height: 40px;
margin-top: 20px;
margin-bottom: 20px;
clear: both;
.btn-shape {
width: 160px;
height: 40px;
line-height: @height;
}
}
}
.pay-info-dialog {
.pay-page-tips {
text-align: center;
h3 {
font-size: 18px;
font-weight: 700;
margin: 30px 0;
}
p {
font-size: 14px;
color: #999;
margin: 10px 0;
}
.btn {
margin-top: 20px;
}
}
}
... ...
... ... @@ -30,8 +30,11 @@
}
.disable {
background: #999;
background: #eee;
color: #fff;
&:hover {
background-color: #eee;
}
}
.input {
... ... @@ -39,6 +42,9 @@
width: 38px;
height: 28px;
text-align: center;
font-family: BrownStd;
font-weight: bold;
color: #1b1b1b;
}
.warning {
... ...