feat: update styles across components for improved layout and responsiveness

This commit is contained in:
2026-08-11 09:55:49 -03:00
parent c75787a59c
commit 563e4634d1
6 changed files with 75 additions and 21 deletions

View File

@@ -7,21 +7,21 @@
}
.store-layout__brand-slot {
width: min(100%, 12rem);
width: min(100%, 230px);
min-width: 10rem;
}
.store-layout__brand-logo-shell {
position: relative;
width: min(100%, 12rem);
height: 2.75rem;
width: min(100%, 230px);
height: 65px;
}
.store-layout__brand-logo {
display: block;
width: 100%;
height: 100%;
max-height: 2.75rem;
max-height: 65px;
object-fit: contain;
object-position: left center;
}
@@ -67,7 +67,7 @@
.store-layout__footer-link {
width: fit-content;
color: rgba(255, 255, 255, 0.72);
color: #ffffff;
text-decoration: none;
&:hover,
@@ -98,6 +98,7 @@
@media (max-width: 767.98px) {
.store-layout__footer-content {
padding: 1.45rem 2.5rem 1.8rem !important;
font-size: 13px;
}
.store-layout__footer-grid {
@@ -117,7 +118,6 @@
order: 1;
width: auto;
padding-bottom: 1.65rem;
font-size: 0.72rem;
line-height: 1.25;
&:nth-of-type(even) {
@@ -145,21 +145,21 @@
}
.store-layout__brand-slot {
width: min(100%, 7.75rem);
width: min(100%, 150px);
min-width: 0;
}
.store-layout__brand-logo {
max-height: 2.5rem;
max-height: 55px;
}
.store-layout__brand-logo-shell {
width: min(100%, 7.75rem);
height: 2.5rem;
width: min(100%, 150px);
height: 55px;
}
.store-layout__brand-text {
font-size: 1.45rem;
font-size: 13px;
}
.store-layout__social-column {
@@ -183,11 +183,10 @@
.store-layout__contact-details {
justify-items: center;
gap: 0.4rem !important;
font-size: 0.7rem;
}
.store-layout__copyright {
font-size: 0.6rem;
font-size: 11px;
line-height: 1.3;
}
}

View File

@@ -158,8 +158,21 @@
max-width: 150px;
}
.store-layout__actions-column {
flex: 1 1 auto;
width: auto;
min-width: 0;
}
::ng-deep .store-layout__tickets-btn-host {
flex: 1 1 0;
width: auto;
min-width: 0;
max-width: 50vw;
}
.store-layout__mobile-separator {
border-color: #DDDDDD;
border-color: #dddddd;
opacity: 1;
margin: 0 -1rem;
}
@@ -180,8 +193,9 @@
}
.store-layout__actions-column {
flex: 0 0 auto;
flex: 1 1 auto;
width: auto;
min-width: 0;
margin-left: 0 !important;
padding-left: 0.25rem;
gap: 0.25rem !important;