diff --git a/scss/bootscore_woocommerce/_wc_cart.scss b/scss/bootscore_woocommerce/_wc_cart.scss index 0af3f5d0..17a62b18 100644 --- a/scss/bootscore_woocommerce/_wc_cart.scss +++ b/scss/bootscore_woocommerce/_wc_cart.scss @@ -69,8 +69,9 @@ WooCommerce Cart // Remove btn -/* Hide the "x" */ .woocommerce { + + // Hide the "x" a.remove { position: relative; text-indent: -9999px; @@ -80,28 +81,10 @@ WooCommerce Cart background: none; } - /* Add a Fontawesome icon instead */ - /* Learn More in the Following Paragraphs */ - + // Add a Fontawesome trash icon instead &::before { - /* - font-family: FontAwesome; - content: "\f2ed"; - color: var(--bscore-remove-invalid, var(--#{$prefix}danger)); - float: left; - text-indent: 0; - font-size: $font-size-base; - */ - - /* - position: absolute; - left: 1.25rem; - top: 50%; - transform: translate(0, -50%); - */ content: ' '; text-indent: 0; - //float: left; position: absolute; top: 50%; left: 0; @@ -109,14 +92,10 @@ WooCommerce Cart mask-position: center; mask-repeat: no-repeat; - //mask-size: $font-size-base; - //mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 32c14.2 0 27.3 7.5 34.5 19.8l216 368c7.3 12.4 7.3 27.7 .2 40.1S486.3 480 472 480H40c-14.3 0-27.6-7.7-34.7-20.1s-7-27.8 .2-40.1l216-368C228.7 39.5 241.8 32 256 32zm0 128c-13.3 0-24 10.7-24 24V296c0 13.3 10.7 24 24 24s24-10.7 24-24V184c0-13.3-10.7-24-24-24zm32 224a32 32 0 1 0 -64 0 32 32 0 1 0 64 0z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' height='1em' viewBox='0 0 448 512'%3e%3c!--! Font Awesome Free 6.4.0 by %40fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons%2c Inc. --%3e%3cpath d='M170.5 51.6L151.5 80h145l-19-28.4c-1.5-2.2-4-3.6-6.7-3.6H177.1c-2.7 0-5.2 1.3-6.7 3.6zm147-26.6L354.2 80H368h48 8c13.3 0 24 10.7 24 24s-10.7 24-24 24h-8V432c0 44.2-35.8 80-80 80H112c-44.2 0-80-35.8-80-80V128H24c-13.3 0-24-10.7-24-24S10.7 80 24 80h8H80 93.8l36.7-55.1C140.9 9.4 158.4 0 177.1 0h93.7c18.7 0 36.2 9.4 46.6 24.9zM80 128V432c0 17.7 14.3 32 32 32H336c17.7 0 32-14.3 32-32V128H80zm80 64V400c0 8.8-7.2 16-16 16s-16-7.2-16-16V192c0-8.8 7.2-16 16-16s16 7.2 16 16zm80 0V400c0 8.8-7.2 16-16 16s-16-7.2-16-16V192c0-8.8 7.2-16 16-16s16 7.2 16 16zm80 0V400c0 8.8-7.2 16-16 16s-16-7.2-16-16V192c0-8.8 7.2-16 16-16s16 7.2 16 16z'/%3e%3c/svg%3e"); -webkit-mask-position: center; -webkit-mask-repeat: no-repeat; - //-webkit-mask-size: $font-size-base; - //-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 32c14.2 0 27.3 7.5 34.5 19.8l216 368c7.3 12.4 7.3 27.7 .2 40.1S486.3 480 472 480H40c-14.3 0-27.6-7.7-34.7-20.1s-7-27.8 .2-40.1l216-368C228.7 39.5 241.8 32 256 32zm0 128c-13.3 0-24 10.7-24 24V296c0 13.3 10.7 24 24 24s24-10.7 24-24V184c0-13.3-10.7-24-24-24zm32 224a32 32 0 1 0 -64 0 32 32 0 1 0 64 0z'/%3E%3C/svg%3E"); -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' height='1em' viewBox='0 0 448 512'%3e%3c!--! Font Awesome Free 6.4.0 by %40fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons%2c Inc. --%3e%3cpath d='M170.5 51.6L151.5 80h145l-19-28.4c-1.5-2.2-4-3.6-6.7-3.6H177.1c-2.7 0-5.2 1.3-6.7 3.6zm147-26.6L354.2 80H368h48 8c13.3 0 24 10.7 24 24s-10.7 24-24 24h-8V432c0 44.2-35.8 80-80 80H112c-44.2 0-80-35.8-80-80V128H24c-13.3 0-24-10.7-24-24S10.7 80 24 80h8H80 93.8l36.7-55.1C140.9 9.4 158.4 0 177.1 0h93.7c18.7 0 36.2 9.4 46.6 24.9zM80 128V432c0 17.7 14.3 32 32 32H336c17.7 0 32-14.3 32-32V128H80zm80 64V400c0 8.8-7.2 16-16 16s-16-7.2-16-16V192c0-8.8 7.2-16 16-16s16 7.2 16 16zm80 0V400c0 8.8-7.2 16-16 16s-16-7.2-16-16V192c0-8.8 7.2-16 16-16s16 7.2 16 16zm80 0V400c0 8.8-7.2 16-16 16s-16-7.2-16-16V192c0-8.8 7.2-16 16-16s16 7.2 16 16z'/%3e%3c/svg%3e"); width: $font-size-base; @@ -124,15 +103,29 @@ WooCommerce Cart background-color: var(--bscore-remove-invalid, var(--#{$prefix}danger)); } } +} +@media (min-width: 769px) { + .woocommerce-cart .coupon { + width: 300px; + } } +// Coupon +.woocommerce-cart table.cart td.actions .coupon .input-text { + // Override WooCommerce CSS + margin: 0; + padding: $input-padding-y $input-padding-x; + border: $input-border-width solid $input-border-color; + // Add border-radius to form because first hidden item inside the input-group is the label + border-top-left-radius: $input-border-radius !important; + border-bottom-left-radius: $input-border-radius !important; +} -// Coupon .woocommerce-cart .coupon { @extend .input-group; @@ -142,6 +135,8 @@ WooCommerce Cart @extend .form-control; } + + button { @extend .input-group-text; //background: green;