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

feat(cart-copia): enhance cart design with improved button styles and layout

Browse Source
This commit is contained in:
ncoronel
2026-07-07 16:06:10 -03:00
parent bdb7f5e907
commit 9d42de9fa8
3 changed files with 31 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
src/app/shared/components/cart-copia/cart-copia.component.html
View File

@@ -4,7 +4,7 @@
@if (showClose()) {
<button
class="cart-copia__close-button"
class="btn btn-link p-0 border-0 d-inline-flex align-items-center justify-content-center cart-copia__close-button"
type="button"
aria-label="Cerrar carrito"
(click)="closed.emit()"
@@ -55,7 +55,7 @@
<div class="cart-copia__item-actions">
<div class="cart-copia__quantity-selector" aria-label="Selector de cantidad">
<button
class="cart-copia__quantity-button cart-copia__quantity-button--decrease"
class="btn btn-sm p-0 border-0 d-inline-flex align-items-center justify-content-center cart-copia__quantity-button cart-copia__quantity-button--decrease"
type="button"
aria-label="Disminuir cantidad"
[disabled]="getItemQuantity(item) <= 1"
@@ -67,7 +67,7 @@
<span class="cart-copia__quantity-value">{{ getItemQuantity(item) }}</span>
<button
class="cart-copia__quantity-button cart-copia__quantity-button--increase"
class="btn btn-sm p-0 border-0 d-inline-flex align-items-center justify-content-center cart-copia__quantity-button cart-copia__quantity-button--increase"
type="button"
aria-label="Aumentar cantidad"
(click)="increaseItemQuantity(idx)"
@@ -77,7 +77,7 @@
</div>
<button
class="cart-copia__remove-button"
class="btn btn-link p-0 border-0 d-inline-flex align-items-center justify-content-center cart-copia__remove-button"
type="button"
aria-label="Eliminar producto"
(click)="onItemRemove(idx)"
@@ -110,22 +110,28 @@
</div>
@if (showActions()) {
<div class="cart-copia__footer-actions">
<button
class="cart-copia__footer-button cart-copia__footer-button--secondary"
type="button"
(click)="secondaryAction.emit()"
>
{{ secondaryActionLabel() }}
</button>
<div class="row g-2 mt-4 cart-copia__footer-actions">
<div class="col-12 col-sm-6">
<app-button
variant="secondary"
hostClass="w-100"
buttonClass="w-100 rounded-2 px-3 cart-copia__footer-app-button"
(click)="secondaryAction.emit()"
>
{{ secondaryActionLabel() }}
</app-button>
</div>
<button
class="cart-copia__footer-button cart-copia__footer-button--primary"
type="button"
(click)="primaryAction.emit()"
>
{{ primaryActionLabel() }}
</button>
<div class="col-12 col-sm-6">
<app-button
variant="primary"
hostClass="w-100"
buttonClass="w-100 rounded-2 px-3 cart-copia__footer-app-button"
(click)="primaryAction.emit()"
>
{{ primaryActionLabel() }}
</app-button>
</div>
</div>
}
</footer>