feat(cart): update cart layout styles for improved responsiveness and structure

This commit is contained in:
2026-08-20 08:42:41 -03:00
parent 5c6a03b10d
commit 56e011bc7a
3 changed files with 17 additions and 3 deletions

View File

@@ -21,6 +21,8 @@
.store-layout__cart-dropdown { .store-layout__cart-dropdown {
position: absolute; position: absolute;
display: flex;
flex-direction: column;
top: 100px; top: 100px;
right: calc((100% - 1320px) / 2 + 1.5rem); right: calc((100% - 1320px) / 2 + 1.5rem);
width: 100%; width: 100%;
@@ -34,6 +36,10 @@
overflow: hidden; overflow: hidden;
animation: store-layout-slide-down 0.2s ease-out; animation: store-layout-slide-down 0.2s ease-out;
> app-cart {
min-height: 0;
}
@media (max-width: 1400px) { @media (max-width: 1400px) {
right: 1.5rem; right: 1.5rem;
} }

View File

@@ -1,5 +1,5 @@
<section <section
class="d-flex flex-column h-100 overflow-hidden text-secondary" class="d-flex flex-column overflow-hidden text-secondary cart-shell"
[style.background-color]="backgroundColor()" [style.background-color]="backgroundColor()"
> >
<header class="d-flex align-items-center p-3 justify-content-between bg-transparent cart-header"> <header class="d-flex align-items-center p-3 justify-content-between bg-transparent cart-header">

View File

@@ -1,7 +1,15 @@
:host { :host {
display: block; display: flex;
width: 100%; width: 100%;
height: 100%; min-height: 0;
max-height: 100%;
overflow: hidden;
}
.cart-shell {
flex: 1 1 auto;
min-height: 0;
max-height: 100%;
} }
.cart-header { .cart-header {