center text

lindapeebee · May 22, 2021 · 8629481 · 8629481
1 parent 0c95c7b
commit 8629481
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 4 deletions.
diff --git a/Extension/src/components/CheckoutDialog/CheckoutDialog.scss b/Extension/src/components/CheckoutDialog/CheckoutDialog.scss
@@ -35,19 +35,26 @@
 
 .take2--checkout-dialog-cart-item {
  display: inline-flex;
+ justify-content: space-between;
+ width: 100%;
+ padding-right: 10px;
 }
 
 .take2--checkout-dialog-cart-item-text {
  max-width: 160px;
  word-wrap: break-word;
- line-height: normal;
- vertical-align: middle;
  overflow: hidden;
- display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  padding-left: 8px;
  text-align: left;
+ display: -webkit-box;
+ vertical-align: middle;
+ line-height: normal;
+}
+
+.take2--checkout-dialog-cart-item-text-wrapper {
+ display: inline-block;
 }
 
 .take2--checkout-dialog-cart-item-score {
@@ -67,6 +74,7 @@
  height: 40px;
  // line-height: 40px;
  text-align: center;
+ line-height: 40px;
 }
 
 .take2--checkout-dialog-cart-item-img {

diff --git a/Extension/src/components/CheckoutDialog/CheckoutDialog.tsx b/Extension/src/components/CheckoutDialog/CheckoutDialog.tsx
@@ -42,7 +42,9 @@ class CheckoutDialog extends Component<CheckoutDialogProps, CheckoutDialogState>
  <img className={"take2--checkout-dialog-cart-item-img"} src={item.image.currentSrc}/>
  </div>
  <div className={"take2--checkout-dialog-cart-item-text-container"}>
- <span className={"take2--checkout-dialog-cart-item-text"}>{item.name}</span>
+ <div className={"take2--checkout-dialog-cart-item-text-wrapper"}>
+ <span className={"take2--checkout-dialog-cart-item-text"}>{item.name}</span>
+ </div>
  </div>
  <div className={"take2--checkout-dialog-cart-item-text-container"}>
  <span className={"take2--checkout-dialog-cart-item-score"}>{"3000"}</span>