tbianchini/shopit-front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: update cart item layout and typography for improved consistency and readability

Browse Source
This commit is contained in:
ncoronel
2026-07-08 14:27:01 -03:00
parent 26466f57db
commit 451dc58cd7
3 changed files with 19 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
src/app/features/store/pages/account-page/components/purchase-item/purchase-item.scss
View File

@@ -9,15 +9,15 @@
.cart-item { .cart-item {
display: grid; display: grid;
grid-template-columns: 90px minmax(0, 1fr); grid-template-columns: 120px minmax(0, 1fr);
gap: 0.75rem; gap: 0.75rem;
background-color: transparent; background-color: transparent;
position: relative; position: relative;
} }
.cart-item-media { .cart-item-media {
width: 90px; width: 120px;
aspect-ratio: 1 / 1; aspect-ratio: 4 / 3;
border-radius: 5px 0 0 5px; border-radius: 5px 0 0 5px;
background-color: #ffffff; background-color: #ffffff;
border: 1px solid #eaeaea; border: 1px solid #eaeaea;
@@ -31,11 +31,15 @@
} }
.cart-item-discount-badge { .cart-item-discount-badge {
padding: 2px 5px; width: 44px;
height: 22px;
display: flex;
align-items: center;
justify-content: center;
border-bottom-right-radius: 4px; border-bottom-right-radius: 4px;
background-color: var(--bs-primary, #5b75ff); background-color: var(--bs-primary, #5b75ff);
color: #ffffff; color: #ffffff;
font-size: 8px; font-size: 10px;
font-weight: 500; font-weight: 500;
line-height: 1; line-height: 1;
} }
@@ -57,7 +61,7 @@
.cart-item-product { .cart-item-product {
color: #666666; color: #666666;
font-size: 12px; font-size: 10px;
line-height: 1.25; line-height: 1.25;
font-weight: 325; font-weight: 325;
} }
@@ -70,7 +74,7 @@
.cart-item-original-price { .cart-item-original-price {
color: #a0a0a0; color: #a0a0a0;
font-size: 10px; font-size: 9px;
font-weight: 325; font-weight: 325;
} }
@@ -86,7 +90,7 @@
.cart-item-attribute { .cart-item-attribute {
color: #666666; color: #666666;
font-size: 11px; font-size: 9px;
line-height: 1.2; line-height: 1.2;
} }
@@ -96,6 +100,6 @@
.cart-item-transfer-price { .cart-item-transfer-price {
color: #666666; color: #666666;
font-size: 10px; font-size: 9px;
line-height: 1.2; line-height: 1.2;
} }

1
src/app/features/store/pages/account-page/pages/purchases-page/purchases-page.scss
View File

@@ -9,5 +9,4 @@
font-size: 15px; font-size: 15px;
font-weight: bold; font-weight: bold;
color: #A0A0A0; color: #A0A0A0;
margin-bottom: 24px;
} }

8
src/app/shared/components/cart-item/cart-item.component.scss
View File

@@ -50,11 +50,15 @@
} }
.cart-item-discount-badge { .cart-item-discount-badge {
padding: 2px 5px; width: 44px;
height: 22px;
display: flex;
align-items: center;
justify-content: center;
border-bottom-right-radius: 4px; border-bottom-right-radius: 4px;
background-color: var(--bs-primary); background-color: var(--bs-primary);
color: #ffffff; color: #ffffff;
font-size: 8px; font-size: 10px;
font-weight: 500; font-weight: 500;
line-height: 1; line-height: 1;
} }