card drawer show amount for free delivery
parent
12f505fc2b
commit
0e8a8f4cb3
|
@ -416,7 +416,7 @@ cart-drawer-items::-webkit-scrollbar-track-piece {
|
|||
}
|
||||
}
|
||||
|
||||
.shx-shipping-costs-progress {
|
||||
.shx-shipping-costs-progress-bar-container {
|
||||
margin: 50px auto;
|
||||
padding: 2px;
|
||||
width: 100%;
|
||||
|
@ -425,18 +425,42 @@ cart-drawer-items::-webkit-scrollbar-track-piece {
|
|||
height: 30px;
|
||||
}
|
||||
|
||||
.shx-shipping-costs-progress-bar {
|
||||
height: 100%;
|
||||
width: 0%;
|
||||
background-color: #05e35e;
|
||||
animation: fill-bar 3s;
|
||||
.shx-shipping-costs-progress-bar-container progress {
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
appearance: none;
|
||||
background: #378c2c;
|
||||
border-radius: 23px;
|
||||
width: 100%;
|
||||
margin: 0px auto;
|
||||
height: 10px;
|
||||
}
|
||||
|
||||
@keyframes fill-bar {
|
||||
from {
|
||||
width: 0%;
|
||||
}
|
||||
to {
|
||||
width: 100%;
|
||||
}
|
||||
.shx-shipping-costs-progress-bar-container progress[value] {
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
appearance: none;
|
||||
}
|
||||
|
||||
.shx-shipping-costs-progress-bar-container progress:not([value]) {
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
appearance: none;
|
||||
}
|
||||
|
||||
.shx-shipping-costs-progress-bar-container progress::-webkit-progress-bar {
|
||||
background: #fff;
|
||||
border-radius: 23px;
|
||||
width: 100%;
|
||||
margin: 0px auto;
|
||||
height: 10px;
|
||||
}
|
||||
|
||||
.shx-shipping-costs-progress-bar-container progress::-webkit-progress-value {
|
||||
background: green;
|
||||
border-radius: 23px;
|
||||
-webkit-transition: width 5s ease;
|
||||
-moz-transition: width 5s ease;
|
||||
-o-transition: width 5s ease;
|
||||
transition: width 5s ease;
|
||||
}
|
||||
|
|
|
@ -91,8 +91,8 @@
|
|||
</span>
|
||||
</div>
|
||||
|
||||
<div class="shx-shipping-costs-progress">
|
||||
<div class="shx-shipping-costs-progress-bar"></div>
|
||||
<div class="shx-shipping-costs-progress-bar-container">
|
||||
<progress value="45" max="100"></progress>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
|
|
Loading…
Reference in New Issue