|
|
@@ -0,0 +1,357 @@
|
|
|
+[class*='g-image'] {
|
|
|
+ position: relative;
|
|
|
+ object-fit: cover;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+[class*='g-image']:before {
|
|
|
+ content: '';
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ top: 0;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ background: #fff url("../../images/avatar.png") no-repeat center;
|
|
|
+ background-size: cover;
|
|
|
+}
|
|
|
+.g-price-up {
|
|
|
+ color: #ff3333;
|
|
|
+}
|
|
|
+.g-price-normal {
|
|
|
+ color: #333333;
|
|
|
+}
|
|
|
+.g-price-down {
|
|
|
+ color: #0baf1f;
|
|
|
+}
|
|
|
+.g-form__container {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ padding-bottom: 0.32rem;
|
|
|
+ /* 父元素的第一个子元素 */
|
|
|
+ /* 相邻兄弟元素 */
|
|
|
+}
|
|
|
+.g-form__container .van-cell-group--inset:first-of-type {
|
|
|
+ margin-top: 0.32rem;
|
|
|
+}
|
|
|
+.g-form__container .van-cell-group--inset + .van-cell-group--inset {
|
|
|
+ margin-top: 0.24rem;
|
|
|
+}
|
|
|
+.g-form__container .van-field .van-stepper {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ width: 100%;
|
|
|
+}
|
|
|
+.g-form__container .van-field .van-stepper__input {
|
|
|
+ flex: 1;
|
|
|
+}
|
|
|
+.g-form__footer {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+.g-form__footer:empty {
|
|
|
+ display: none;
|
|
|
+}
|
|
|
+.g-form__footer.inset {
|
|
|
+ gap: 0.2rem;
|
|
|
+ padding: 0.2rem 0.32rem;
|
|
|
+}
|
|
|
+.g-flex {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+.g-flex--row {
|
|
|
+ flex-direction: row;
|
|
|
+}
|
|
|
+.g-flex__body {
|
|
|
+ flex: 1;
|
|
|
+ overflow-y: auto;
|
|
|
+ -webkit-overflow-scrolling: touch;
|
|
|
+}
|
|
|
+.g-flex__footer {
|
|
|
+ margin-top: auto;
|
|
|
+}
|
|
|
+.g-color--up {
|
|
|
+ color: var(--color-up);
|
|
|
+}
|
|
|
+.g-color--down {
|
|
|
+ color: var(--color-down);
|
|
|
+}
|
|
|
+.g-block--bg {
|
|
|
+ background: #fff url('../../images/block-bg.png') no-repeat center bottom;
|
|
|
+ background-size: 100%;
|
|
|
+}
|
|
|
+/* 导航列表 */
|
|
|
+.g-navmenu .app-iconfont {
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+.g-navmenu .app-iconfont__icon {
|
|
|
+ font-size: 0.32rem;
|
|
|
+ margin-right: 0.24rem;
|
|
|
+}
|
|
|
+/* 商品列表 */
|
|
|
+.g-goods-list {
|
|
|
+ padding: 0.2rem;
|
|
|
+}
|
|
|
+.g-goods-list .list {
|
|
|
+ padding: 0.2rem 0.2rem 0 0.2rem;
|
|
|
+}
|
|
|
+.g-goods-list .list-item {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ border-radius: 0.1rem;
|
|
|
+ overflow: hidden;
|
|
|
+ padding: 0.2rem;
|
|
|
+}
|
|
|
+.g-goods-list .list-item:not(:last-child) {
|
|
|
+ margin-bottom: 0.2rem;
|
|
|
+}
|
|
|
+.g-goods-list .list-item .img:first-child {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+.g-goods-list .list-item .img:first-child img {
|
|
|
+ width: 1.8rem;
|
|
|
+ height: 1.8rem;
|
|
|
+ object-fit: cover;
|
|
|
+ border-radius: 0.16rem;
|
|
|
+ margin-right: 0.3rem;
|
|
|
+}
|
|
|
+.g-goods-list .list-item .img:last-child .van-button {
|
|
|
+ width: 1.3rem;
|
|
|
+ height: 0.5rem;
|
|
|
+}
|
|
|
+.g-goods-list .list-item .info {
|
|
|
+ flex: 1;
|
|
|
+}
|
|
|
+.g-goods-list .list-item .info .title {
|
|
|
+ color: #333;
|
|
|
+ font-size: 0.3rem;
|
|
|
+}
|
|
|
+.g-goods-list .list-item .info .desc {
|
|
|
+ color: #666;
|
|
|
+ font-size: 0.24rem;
|
|
|
+ padding: 0.1rem 0;
|
|
|
+}
|
|
|
+.g-goods-list .list-item .info .price .buyprice,
|
|
|
+.g-goods-list .list-item .info .price .sellprice {
|
|
|
+ padding-bottom: 0.02rem;
|
|
|
+}
|
|
|
+.g-goods-waterfall {
|
|
|
+ padding: 0.2rem;
|
|
|
+}
|
|
|
+.g-goods-waterfall .goods {
|
|
|
+ background-color: #fff;
|
|
|
+ border-radius: 0.12rem;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+.g-goods-waterfall .goods-image {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ min-height: 2.4rem;
|
|
|
+ font-size: 0;
|
|
|
+}
|
|
|
+.g-goods-waterfall .goods-info {
|
|
|
+ padding: 0.2rem;
|
|
|
+}
|
|
|
+.g-goods-waterfall .goods-info__title {
|
|
|
+ font-size: 0.26rem;
|
|
|
+ margin-bottom: 0.1rem;
|
|
|
+}
|
|
|
+.g-goods-waterfall .goods-info__desc {
|
|
|
+ font-size: 0.24rem;
|
|
|
+ color: #999;
|
|
|
+ margin-bottom: 0.1rem;
|
|
|
+}
|
|
|
+.g-goods-waterfall .goods-info__price {
|
|
|
+ color: #f2270c;
|
|
|
+}
|
|
|
+.g-goods-waterfall .goods-info__price .unit {
|
|
|
+ font-size: 0.24rem;
|
|
|
+}
|
|
|
+.g-goods-waterfall .goods-info__price .integer {
|
|
|
+ font-size: 0.3rem;
|
|
|
+}
|
|
|
+/* 订单列表 */
|
|
|
+.g-order-list {
|
|
|
+ padding: 0.2rem;
|
|
|
+ padding-bottom: 0;
|
|
|
+}
|
|
|
+.g-order-list__box {
|
|
|
+ background-color: #fff;
|
|
|
+ border-radius: 0.16rem;
|
|
|
+ padding: 0.24rem;
|
|
|
+}
|
|
|
+.g-order-list__box:not(:first-child) {
|
|
|
+ margin-top: 0.2rem;
|
|
|
+}
|
|
|
+.g-order-list__titlebar {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ margin-bottom: 0.2rem;
|
|
|
+}
|
|
|
+.g-order-list__titlebar .left h4 {
|
|
|
+ font-weight: bold;
|
|
|
+}
|
|
|
+.g-order-list__titlebar .left span {
|
|
|
+ font-size: 0.24rem;
|
|
|
+ color: #999;
|
|
|
+}
|
|
|
+.g-order-list__titlebar .right {
|
|
|
+ font-size: 0.24rem;
|
|
|
+ color: #999;
|
|
|
+}
|
|
|
+.g-order-list__content {
|
|
|
+ font-size: 0.24rem;
|
|
|
+}
|
|
|
+.g-order-list__content ul {
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ justify-content: space-between;
|
|
|
+}
|
|
|
+.g-order-list__content ul li {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ line-height: 0.4rem;
|
|
|
+ width: calc(50% - .24rem);
|
|
|
+}
|
|
|
+.g-order-list__content ul li span:first-child {
|
|
|
+ color: #999;
|
|
|
+ white-space: nowrap;
|
|
|
+ padding-right: 0.24rem;
|
|
|
+}
|
|
|
+.g-order-list__btnbar {
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-end;
|
|
|
+ gap: 0.16rem;
|
|
|
+ margin-top: 0.2rem;
|
|
|
+}
|
|
|
+.g-order-list__btnbar .van-button {
|
|
|
+ width: 1.6rem;
|
|
|
+ border-width: 1px;
|
|
|
+}
|
|
|
+.g-detail__buy {
|
|
|
+ background-color: #fff;
|
|
|
+}
|
|
|
+.g-detail__buy .topic {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ color: #fff;
|
|
|
+ background-image: linear-gradient(to right, #ee0a24, #ff6034);
|
|
|
+ padding: 0.2rem 0.24rem;
|
|
|
+}
|
|
|
+.g-detail__buy .topic-left .price-text {
|
|
|
+ font-size: 0.24rem;
|
|
|
+}
|
|
|
+.g-detail__buy .topic-left .price-integer {
|
|
|
+ font-size: 0.44rem;
|
|
|
+}
|
|
|
+.g-detail__buy .topic-right {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ font-size: 0.24rem;
|
|
|
+}
|
|
|
+.g-detail__buy .title {
|
|
|
+ font-size: 0.3rem;
|
|
|
+ font-weight: bold;
|
|
|
+ line-height: 0.48rem;
|
|
|
+ padding: 0.24rem;
|
|
|
+ padding-bottom: 0;
|
|
|
+}
|
|
|
+.g-detail__buy .title .van-tag {
|
|
|
+ font-weight: normal;
|
|
|
+}
|
|
|
+.g-detail__buy .title span {
|
|
|
+ margin-right: 0.1rem;
|
|
|
+}
|
|
|
+.g-detail__buy .desc {
|
|
|
+ padding: 0 0.24rem;
|
|
|
+}
|
|
|
+.g-detail__buy .qty {
|
|
|
+ font-size: 0.24rem;
|
|
|
+ color: #999;
|
|
|
+ padding: 0.1rem 0.24rem 0 0.24rem;
|
|
|
+}
|
|
|
+.g-detail__buy .info {
|
|
|
+ background-color: #fff;
|
|
|
+ padding: 0.2rem;
|
|
|
+}
|
|
|
+.g-detail__buy .info ul {
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ font-size: 0.26rem;
|
|
|
+}
|
|
|
+.g-detail__buy .info ul li {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ width: 50%;
|
|
|
+ padding: 0.08rem 0.24rem;
|
|
|
+}
|
|
|
+.g-detail__buy .info ul li span:first-child {
|
|
|
+ color: #999;
|
|
|
+}
|
|
|
+.g-detail__desc {
|
|
|
+ background-color: #fff;
|
|
|
+ margin-top: 0.24rem;
|
|
|
+}
|
|
|
+.g-detail__footer {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ height: 0.88rem;
|
|
|
+ background-color: #fff;
|
|
|
+}
|
|
|
+.g-detail__footer .price {
|
|
|
+ padding-left: 0.32rem;
|
|
|
+}
|
|
|
+.g-detail__footer .price-text,
|
|
|
+.g-detail__footer .price-unit {
|
|
|
+ font-size: 0.24rem;
|
|
|
+}
|
|
|
+.g-detail__footer .price-unit {
|
|
|
+ color: #f2270c;
|
|
|
+}
|
|
|
+.g-detail__footer .price-integer {
|
|
|
+ font-size: 0.32rem;
|
|
|
+ color: #f2270c;
|
|
|
+}
|
|
|
+.g-detail__footer .submit {
|
|
|
+ align-self: stretch;
|
|
|
+ display: flex;
|
|
|
+ margin-left: auto;
|
|
|
+}
|
|
|
+.g-detail__footer .submit-button {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ height: 100%;
|
|
|
+ min-width: 2rem;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #fff;
|
|
|
+ padding: 0 0.48rem;
|
|
|
+}
|
|
|
+.g-detail__footer .submit-button.warning {
|
|
|
+ background-image: linear-gradient(to right, #ffd01e, #ff8917);
|
|
|
+ background-color: #ff8a17;
|
|
|
+}
|
|
|
+.g-detail__footer .submit-button.danger {
|
|
|
+ background-image: linear-gradient(to right, #ff6034, #ee0a24);
|
|
|
+ background-color: #ee270a;
|
|
|
+}
|
|
|
+.van-dialog__message {
|
|
|
+ font-size: 0.28rem;
|
|
|
+ line-height: 0.44rem;
|
|
|
+}
|
|
|
+.van-tabs--list {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+.van-tabs--list .van-tabs__content {
|
|
|
+ flex: 1;
|
|
|
+ overflow-y: auto;
|
|
|
+}
|
|
|
+.van-tabs--list .van-tabs__content .van-tab__panel {
|
|
|
+ height: 100%;
|
|
|
+}
|