feat: add StoreSection component and integrate it into reutilizables test page

This commit is contained in:
2026-06-29 15:39:52 -03:00
parent 9f32588828
commit 286e56c979
6 changed files with 62 additions and 1 deletions

View File

@@ -282,5 +282,22 @@
</div>
</div>
</section>
<app-store-section title="PRODUCTOS" class="component-demo store-section-demo mt-5">
<div class="row">
@for (product of testProducts; track product.title) {
<div class="col-12 col-md-6 col-lg-4 mb-4 d-flex align-items-stretch store-section-demo__item">
<app-product-card
[imageUrl]="product.imageUrl"
[title]="product.title"
[originalPrice]="product.originalPrice"
[discount]="product.discount"
[transferPrice]="product.transferPrice"
(buy)="onProductBuy(product.title)"
/>
</div>
}
</div>
</app-store-section>
</main>

View File

@@ -15,6 +15,10 @@
border: 0;
}
.store-section-demo {
width: min(100%, 64rem);
}
.eyebrow {
display: inline-block;
margin-bottom: 0.75rem;
@@ -55,6 +59,12 @@ h1 {
min-width: 3rem;
}
.store-section-demo__item {
app-product-card {
width: 100%;
}
}
.section-divider {
margin: 2rem 0;
}

View File

@@ -2,11 +2,12 @@ import { Component, inject } from '@angular/core';
import { ButtonComponent } from '../../../../shared/components/button/button.component';
import { InputComponent } from '../../../../shared/components/input/input.component';
import { ProductCardComponent } from '../../../../shared/components/product-card/product-card.component';
import { StoreSectionComponent } from '../../../../shared/components/store-section/store-section.component';
import { TenantService } from '../../../../core/services/tenant.service';
@Component({
selector: 'app-reutilizables-test-page',
imports: [ButtonComponent, InputComponent, ProductCardComponent],
imports: [ButtonComponent, InputComponent, ProductCardComponent, StoreSectionComponent],
templateUrl: './reutilizables-test-page.component.html',
styleUrl: './reutilizables-test-page.component.scss'
})