diff --git a/src/Web/WebSPA/eShopOnContainers.WebSPA/Client/modules/basket/basket-status/basket-status.component.html b/src/Web/WebSPA/eShopOnContainers.WebSPA/Client/modules/basket/basket-status/basket-status.component.html
index 0fad8fcb0..5052e98e1 100644
--- a/src/Web/WebSPA/eShopOnContainers.WebSPA/Client/modules/basket/basket-status/basket-status.component.html
+++ b/src/Web/WebSPA/eShopOnContainers.WebSPA/Client/modules/basket/basket-status/basket-status.component.html
@@ -1,5 +1,6 @@
-
+
diff --git a/src/Web/WebSPA/eShopOnContainers.WebSPA/Client/modules/basket/basket-status/basket-status.component.scss b/src/Web/WebSPA/eShopOnContainers.WebSPA/Client/modules/basket/basket-status/basket-status.component.scss
index 2888ead1a..fface6f9d 100644
--- a/src/Web/WebSPA/eShopOnContainers.WebSPA/Client/modules/basket/basket-status/basket-status.component.scss
+++ b/src/Web/WebSPA/eShopOnContainers.WebSPA/Client/modules/basket/basket-status/basket-status.component.scss
@@ -1,26 +1,26 @@
@import '../../_variables.scss';
.esh-basketstatus {
- float:right;
+ float: right;
+ position: relative;
&-image {
height: 36px;
- margin-top: 5px;
+ margin-top: .5rem;
}
&-badge {
- position: absolute;
- margin-top: 2px;
- margin-left: 14px;
- background-color: #83d01b;
- padding: 1px;
- color: white;
+ $size: 1.5rem;
+ background-color: $color-secondary;
border-radius: 50%;
- width: 18px;
- height: 18px;
- font-size: 12px;
- cursor: pointer;
+ color: $color-foreground-brighter;
+ display: block;
+ height: $size;
+ left: 50%;
+ position: absolute;
+ text-align: center;
top: 0;
- padding-left: 3px;
+ transform: translateX(-38%);
+ width: $size;
}
}