芝麻web文件管理V1.00
编辑当前文件:/home/digitalh/tricomgroupbd.com/assets/sass/component/_woocommerce.scss
/*------------------------------------------------------- 45.Woocommerce css ---------------------------------------------------------*/ .woocommerce-message, .woocommerce-info { position: relative; border: 1px solid #d8d8d8; padding: 11px 20px; background-color: var(--clr-body); color: var(--clr-white); font-size: 14px; font-weight: 700; margin-bottom: 20px; border-radius: 5px; a { color: inherit; &:hover { text-decoration: underline; } } &:before { content: '\f06a'; font-family: #ddd; font-weight: 900; margin-right: 10px; } } .woocommerce-notices-wrapper { .woocommerce-message { background-color: var(--clr-def); &:before { content: '\f14a'; font-weight: 300; } } } .woocommerce-form-coupon, .woocommerce-form-login { display: none; } .woocommerce-form-login-toggle { .woocommerce-info { background-color: var(--clr-def); } } .woocommerce-checkout { .form-select, .form-group { margin-bottom: 0.5rem; } .form-control { margin-bottom: 15px; } .shipping_address { display: none; } } .woocommerce-product-rating { .star-rating { display: inline-block; vertical-align: middle; } } // #ship-to-different-address { // margin-bottom: 11px; // label { // font-size: 24px; // font-family: var(--font-2); // display: inline-block; // padding-right: 30px; // padding-left: 0; // margin-bottom: 0; // &:before { // left: auto; // right: 0; // top: 10px; // } // } // } .woocommerce-cart-form { text-align: center; } .cart_table { border: 1px solid #eaf0f2; margin-bottom: 45px; thead { background-color: #ecf0f1; } td:before, th { font-family: var(--font-2); color: var(--clr-heading); font-weight: 700; text-transform: uppercase; border: none; padding: 27px 15px; } td:before { content: attr(data-title); position: absolute; left: 15px; top: 50%; vertical-align: top; padding: 0; transform: translateY(-50%); display: none; } td { border: none; border-bottom: 1px solid #f3f3f3; color: #8b8b8b; padding: 20px 10px; position: relative; } .product-quantity { color: var(--clr-heading); } .cart-productname { font-weight: 600; font-family: var(--font-2); color: inherit; } .cart-productimage { display: inline-block; border: 1px solid #ddd; } .remove { color: #29af8a; font-size: 18px; } .quantity { display: inline-flex; align-items: center; } .qut-btn { border: 2px solid var(--clr-menu); background-color: transparent; color: #b8c6d0; padding: 0; width: 30px; height: 30px; font-size: 16px; border-radius: 4px; position: relative; top: 0; left: 0; &.quantity-minus { top: 0; } &:hover { background-color: var(--clr-def); color: var(--clr-white); border-color: transparent; } } .qty-input { vertical-align: middle; border: 2px solid var(--clr-menu); width: 70px; height: 30px; font-size: 14px; text-align: center; color: #2c3e50; font-weight: 700; margin: 0 10px; border-radius: 4px; padding-right: 0; &::-webkit-outer-spin-button, &::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } /* Firefox */ &[type=number] { -moz-appearance: textfield; } } .actions { text-align: right; vertical-align: middle; >.vs-btn { margin-right: 15px; &:last-child { margin-right: 0; } } } .tb-cart-coupon { float: left; margin: 0; width: 455px; max-width: 100%; display: flex; input { height: 5rem; width: calc(100% - 200px); margin-right: 10px; padding-left: 20px; } .vs-btn { width: 200px; padding-left: 0; padding-right: 0; } } } .cart_totals { border: 1px solid #ecf0f1; th, td { vertical-align: top; padding: 20px 20px; border: none; border-bottom: 1px solid #ecf0f1; font-size: 14px; color: var(--clr-heading); width: 55%; &:first-child { width: 45%; background-color: #f9fbfb; font-weight: 700; font-size: 14px; color: #333333; } } .shipping-calculator-button { display: inline-block; border-bottom: 1px solid; color: var(--clr-heading); font-weight: 700; &:hover { color: var(--clr-def); } } .woocommerce-shipping-destination { margin-bottom: 10px; } .woocommerce-shipping-methods { margin-bottom: 0; } .shipping-calculator-form { display: none; p:first-child { margin-top: 20px; } p:last-child { margin-bottom: 0; } .vs-btn { padding: 5px 30px; } } .amount { font-weight: 700; } .order-total { .amount { color: #1abc9c; } } } .shipping-calculator-form { .form-select, .form-control { height: 40px; padding-left: 15px; font-size: 16px; border-radius: 0; background-position: right 13px center; } .vs-btn { font-size: 14px; padding: 0 20px; width: max-content; height: 40px; } } .checkout-ordertable { th, td { border: none; vertical-align: top; padding: 5px 0; font-size: 14px; font-weight: 700; color: var(--clr-body); border: 1px solid #ededed; text-align: right; padding: 5px 20px; } th { text-align: left; } ul { margin: 0; padding: 0; } .order-total { .amount { color: #29af8a; } } input[type="hidden"] { ~label { color: #29af8a; } } } .woocommerce-checkout-payment { ul { margin: 0; padding: 0; list-style-type: none; li { padding-top: 10px; border-bottom: 1px solid #d8d8d8; border-radius: 4px; } } .place-order { padding-top: 30px; } .payment_box { color: #a1b1bc; background-color: var(--clr-def); border: 1px solid #d8d8d8; border-bottom: none; font-size: 14px; padding: 10px 20px; border-radius: 4px; display: none; p { margin: 0; } } input[type="radio"]~label { margin-bottom: 15px; color: var(--clr-body); img { margin-bottom: -2px; margin-left: 10px; } } } .star-rating { overflow: hidden; position: relative; width: 100px; height: 1.2em; line-height: 1.2em; display: block; font-family: #ddd; font-weight: 700; font-size: 14px; &:before { content: "\f005\f005\f005\f005\f005"; // color: #e1e1e1; color: var(--clr-def-3); float: left; top: 0; left: 0; font-weight: 400; position: absolute; letter-spacing: 3px; } span { overflow: hidden; float: left; top: 0; left: 0; position: absolute; padding-top: 1.5em; &:before { content: "\f005\f005\f005\f005\f005"; top: 0; position: absolute; left: 0; color: var(--clr-def-3); letter-spacing: 3px; } } } .rating-select { label { margin: 0; margin-right: 10px; } p.stars { margin-bottom: 0; line-height: 1; a { position: relative; height: 14px; width: 18px; text-indent: -999em; display: inline-block; text-decoration: none; } a::before { display: block; position: absolute; top: 0; left: 0; width: 18px; height: 14px; line-height: 1; font-family: #ddd; content: "\f005"; font-weight: 400; text-indent: 0; color: var(--clr-def-3); } a:hover~a::before { content: "\f005"; font-weight: 400; } &:hover a::before { content: "\f005"; font-weight: 700; } &.selected a.active::before { content: "\f005"; font-weight: 700; } &.selected a.active~a::before { content: "\f005"; font-weight: 400; } &.selected a:not(.active)::before { content: "\f005"; font-weight: 700; } } } @media only screen and (min-width: 768px) and (max-width: 991px) { .cart_table { th { padding: 23px 8px; font-size: 14px; } .cart-productname { font-size: 14px; } .tb-cart-coupon { width: 100%; margin-bottom: 20px; } .actions { text-align: center; } .tb-udp { button { margin-bottom: 2rem; } } } } @media only screen and (max-width: 767px) { .tb-udp { button { margin-bottom: 1rem; } } .cart_table { text-align: left; min-width: auto; border-collapse: separate; border-spacing: 0 20px; border: none; margin-right: 0; padding-right: 0; width: 100%; thead { display: none; } td { padding: 15px; display: block; width: 100%; padding-left: 25%; text-align: right; border: 1px solid #f3f3f3; border-bottom: none; font-size: 1.3rem; &::before { display: block; } &:last-child { border-bottom: 1px solid #f3f3f3; } &.actions { padding-left: 15px; text-align: center; >.vs-btn { margin-top: 10px; margin-right: 0; display: block; width: max-content; margin-left: auto; margin-right: auto; &:last-child { margin-right: auto; } } } } .tb-cart-coupon { width: 100%; text-align: center; float: none; justify-content: center; display: block; padding-bottom: 10px; input { width: 100%; margin-bottom: 10px; } } } tfoot.checkout-ordertable th { display: none; } .woocommerce-checkout-payment ul input[type="radio"]~label img { max-width: 150px; } .woocommerce-message, .woocommerce-info { font-size: 12px; padding: 5px 10px; } .cart_totals { th, td { padding: 15px 10px; &:first-child { width: 17%; line-height: 1.4; } } } }