tickera-angular-components 0.0.1-dev.65 → 0.0.1-dev.66
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -4051,20 +4051,23 @@ class AppBadgeComponent {
|
|
|
4051
4051
|
text = '';
|
|
4052
4052
|
color = 'primary';
|
|
4053
4053
|
size = 'md';
|
|
4054
|
+
bordered = true;
|
|
4054
4055
|
backgroundColor = '';
|
|
4055
4056
|
textColor = '';
|
|
4056
4057
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: AppBadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4057
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: AppBadgeComponent, isStandalone: true, selector: "app-badge", inputs: { text: "text", color: "color", size: "size", backgroundColor: "backgroundColor", textColor: "textColor" }, ngImport: i0, template: "<span\n class=\"badge\"\n [class]=\"'badge--' + color + ' badge--' + size\"\n [style.background-color]=\"backgroundColor || null\"\n [style.color]=\"textColor || null\"\n [style.color]=\"textColor || null\"\n>\n {{ text }}\n</span>\n", styles: [".badge{display:inline-flex;align-items:center;border-radius:9999px;font-weight:700;line-height:1;white-space:nowrap}.badge--primary{background-color:#dbeafe;color:#1d4ed8}.badge--secondary{background-color:#f3f4f6;color:#374151}.badge--success{background-color:#dcfce7;color:#15803d}.badge--warning{background-color:#fef9c3;color:#a16207}.badge--error{background-color:#fee2e2;color:#b91c1c}.badge--info{background-color:#e0e7ff;color:#4338ca}.badge--xs{padding:.25rem .5rem;font-size:.75rem}.badge--sm{padding:.375rem .625rem;font-size:.875rem}.badge--md{padding:.5rem .75rem;font-size:.875rem}.badge--lg{padding:.625rem .875rem;font-size:1rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None });
|
|
4058
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: AppBadgeComponent, isStandalone: true, selector: "app-badge", inputs: { text: "text", color: "color", size: "size", bordered: "bordered", backgroundColor: "backgroundColor", textColor: "textColor" }, ngImport: i0, template: "<span\n class=\"badge\"\n [class]=\"'badge--' + color + ' badge--' + size\"\n [class.badge--bordered]=\"bordered\"\n [style.background-color]=\"backgroundColor || null\"\n [style.color]=\"textColor || null\"\n [style.border-color]=\"textColor || null\"\n>\n {{ text }}\n</span>\n", styles: [".badge{display:inline-flex;align-items:center;border-radius:9999px;font-weight:700;line-height:1;white-space:nowrap}.badge--bordered{border:1px solid}.badge--primary{background-color:#dbeafe;border-color:#1d4ed8;color:#1d4ed8}.badge--secondary{background-color:#f3f4f6;border-color:#374151;color:#374151}.badge--success{background-color:#dcfce7;border-color:#15803d;color:#15803d}.badge--warning{background-color:#fef9c3;border-color:#a16207;color:#a16207}.badge--error{background-color:#fee2e2;border-color:#b91c1c;color:#b91c1c}.badge--info{background-color:#e0e7ff;border-color:#4338ca;color:#4338ca}.badge--xs{padding:.25rem .5rem;font-size:.75rem}.badge--sm{padding:.375rem .625rem;font-size:.875rem}.badge--md{padding:.5rem .75rem;font-size:.875rem}.badge--lg{padding:.625rem .875rem;font-size:1rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None });
|
|
4058
4059
|
}
|
|
4059
4060
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: AppBadgeComponent, decorators: [{
|
|
4060
4061
|
type: Component,
|
|
4061
|
-
args: [{ selector: 'app-badge', standalone: true, imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "<span\n class=\"badge\"\n [class]=\"'badge--' + color + ' badge--' + size\"\n [style.background-color]=\"backgroundColor || null\"\n [style.color]=\"textColor || null\"\n [style.color]=\"textColor || null\"\n>\n {{ text }}\n</span>\n", styles: [".badge{display:inline-flex;align-items:center;border-radius:9999px;font-weight:700;line-height:1;white-space:nowrap}.badge--primary{background-color:#dbeafe;color:#1d4ed8}.badge--secondary{background-color:#f3f4f6;color:#374151}.badge--success{background-color:#dcfce7;color:#15803d}.badge--warning{background-color:#fef9c3;color:#a16207}.badge--error{background-color:#fee2e2;color:#b91c1c}.badge--info{background-color:#e0e7ff;color:#4338ca}.badge--xs{padding:.25rem .5rem;font-size:.75rem}.badge--sm{padding:.375rem .625rem;font-size:.875rem}.badge--md{padding:.5rem .75rem;font-size:.875rem}.badge--lg{padding:.625rem .875rem;font-size:1rem}\n"] }]
|
|
4062
|
+
args: [{ selector: 'app-badge', standalone: true, imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "<span\n class=\"badge\"\n [class]=\"'badge--' + color + ' badge--' + size\"\n [class.badge--bordered]=\"bordered\"\n [style.background-color]=\"backgroundColor || null\"\n [style.color]=\"textColor || null\"\n [style.border-color]=\"textColor || null\"\n>\n {{ text }}\n</span>\n", styles: [".badge{display:inline-flex;align-items:center;border-radius:9999px;font-weight:700;line-height:1;white-space:nowrap}.badge--bordered{border:1px solid}.badge--primary{background-color:#dbeafe;border-color:#1d4ed8;color:#1d4ed8}.badge--secondary{background-color:#f3f4f6;border-color:#374151;color:#374151}.badge--success{background-color:#dcfce7;border-color:#15803d;color:#15803d}.badge--warning{background-color:#fef9c3;border-color:#a16207;color:#a16207}.badge--error{background-color:#fee2e2;border-color:#b91c1c;color:#b91c1c}.badge--info{background-color:#e0e7ff;border-color:#4338ca;color:#4338ca}.badge--xs{padding:.25rem .5rem;font-size:.75rem}.badge--sm{padding:.375rem .625rem;font-size:.875rem}.badge--md{padding:.5rem .75rem;font-size:.875rem}.badge--lg{padding:.625rem .875rem;font-size:1rem}\n"] }]
|
|
4062
4063
|
}], propDecorators: { text: [{
|
|
4063
4064
|
type: Input
|
|
4064
4065
|
}], color: [{
|
|
4065
4066
|
type: Input
|
|
4066
4067
|
}], size: [{
|
|
4067
4068
|
type: Input
|
|
4069
|
+
}], bordered: [{
|
|
4070
|
+
type: Input
|
|
4068
4071
|
}], backgroundColor: [{
|
|
4069
4072
|
type: Input
|
|
4070
4073
|
}], textColor: [{
|
|
@@ -4174,7 +4177,7 @@ class ShowCardComponent {
|
|
|
4174
4177
|
return new Date(date);
|
|
4175
4178
|
}
|
|
4176
4179
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ShowCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4177
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: ShowCardComponent, isStandalone: true, selector: "show-card", inputs: { show: "show", linkText: "linkText", linkUrlFn: "linkUrlFn", linkQueryParams: "linkQueryParams" }, ngImport: i0, template: "<div class=\"show-card\">\n <div class=\"show-card__image\">\n <app-badge\n [text]=\"`show.showTypes.${show.show_type}` | transloco\"\n [backgroundColor]=\"this.showTypeColor.bg\"\n [textColor]=\"this.showTypeColor.text\"\n size=\"xs\"\n class=\"show-card__badge\"\n />\n\n @if (show.images && show.images.length > 0) {\n <img [src]=\"show.images[0].full_url\" class=\"show-card__image-img\" />\n } @else {\n <span class=\"show-card__image-placeholder\"></span>\n }\n </div>\n\n <div class=\"show-card__info\">\n <p class=\"show-card__title\">\n {{ show.title }}\n </p>\n\n @if (show.next_performance) {\n <div class=\"show-card__datetime\">\n <span class=\"show-card__datetime-title\">\n {{ 'show.next_performance' | transloco }}\n </span>\n\n <br />\n\n <span class=\"show-card__date\">\n {{ show.next_performance.start_time | date: `EEEE` | titlecase }}\n {{ show.next_performance.start_time | date: `dd 'de' MMMM, hh:mm a` }}\n </span>\n </div>\n }\n\n @if (show.days_of_week && show.days_of_week.length > 0) {\n <div class=\"show-card__days\">\n @for (day of show.days_of_week; track $index) {\n <app-badge\n [text]=\"`common.daysOfWeekByNumber.${day}` | transloco\"\n size=\"xs\"\n backgroundColor=\"#525252\"\n textColor=\"#e5e5e5\"\n />\n }\n </div>\n }\n\n @if (show.unique_start_times && show.unique_start_times.length > 0) {\n <div class=\"show-card__times\">\n @for (time of show.unique_start_times; track $index) {\n <app-badge\n [text]=\"dateService.formatDate(formatTimeDate(time), 'hh:mm a')\"\n size=\"xs\"\n backgroundColor=\"#525252\"\n textColor=\"#e5e5e5\"\n />\n }\n </div>\n }\n\n <app-link-button\n class=\"show-card__link\"\n [route]=\"linkUrlFn ? linkUrlFn(show) : '#'\"\n [queryParams]=\"linkQueryParams ?? {}\"\n [text]=\"linkText\"\n icon=\"ri-calendar-line\"\n variant=\"primary\"\n size=\"sm\"\n />\n </div>\n</div>\n", styles: [".show-card{align-items:center;background-color:#171717;border-radius:.5rem;display:flex;flex-direction:column;gap:0;justify-content:space-between;overflow:hidden;padding:0;position:relative;transition:all .2s ease-in-out;max-width:320px;width:100%}.show-card:hover{border-color:#525252}.show-card--selected{background-color:#262626;border-color:#ef4444;box-shadow:0 0 0 1px #ef444480,0 0 16px #ef444459}.show-card--selected:hover{border-color:#ef4444}.show-card__image{aspect-ratio:1/1;display:flex;border-radius:.125rem;overflow:hidden;position:relative;width:100%}.show-card__image-img{object-fit:cover;object-position:center;max-height:100%;max-width:100%;margin-left:auto;margin-right:auto}.show-card__image-placeholder{display:flex;background-color:#e5e7eb;height:100%;width:100%}.show-card__badge{position:absolute;left:1rem;top:1rem}.show-card__info{display:flex;flex-direction:column;flex:1;gap:.5rem;padding:1.5rem;width:100%}.show-card__title{color:#e5e7eb;font-size:1.5rem;font-weight:800;line-height:130%;margin:0}.show-card__datetime{line-height:1}.show-card__datetime-title{color:#a3a3a3;font-size:.75rem;font-weight:700;width:100%}.show-card__date{color:#a3a3a3;font-size:.875rem}.show-card__days,.show-card__times{display:flex;flex-flow:row wrap;gap:.25rem}.show-card__times{margin-bottom:.5rem}.show-card__link{margin-top:auto}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: AppLinkButtonComponent, selector: "app-link-button", inputs: ["disabled", "loading", "target", "text", "icon", "loadingText", "route", "queryParams", "size", "variant"] }, { kind: "component", type: AppBadgeComponent, selector: "app-badge", inputs: ["text", "color", "size", "backgroundColor", "textColor"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "pipe", type: i2.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i2.DatePipe, name: "date" }, { kind: "pipe", type: i2$1.TranslocoPipe, name: "transloco" }] });
|
|
4180
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: ShowCardComponent, isStandalone: true, selector: "show-card", inputs: { show: "show", linkText: "linkText", linkUrlFn: "linkUrlFn", linkQueryParams: "linkQueryParams" }, ngImport: i0, template: "<div class=\"show-card\">\n <div class=\"show-card__image\">\n <app-badge\n [text]=\"`show.showTypes.${show.show_type}` | transloco\"\n [backgroundColor]=\"this.showTypeColor.bg\"\n [textColor]=\"this.showTypeColor.text\"\n size=\"xs\"\n class=\"show-card__badge\"\n />\n\n @if (show.images && show.images.length > 0) {\n <img [src]=\"show.images[0].full_url\" class=\"show-card__image-img\" />\n } @else {\n <span class=\"show-card__image-placeholder\"></span>\n }\n </div>\n\n <div class=\"show-card__info\">\n <p class=\"show-card__title\">\n {{ show.title }}\n </p>\n\n @if (show.next_performance) {\n <div class=\"show-card__datetime\">\n <span class=\"show-card__datetime-title\">\n {{ 'show.next_performance' | transloco }}\n </span>\n\n <br />\n\n <span class=\"show-card__date\">\n {{ show.next_performance.start_time | date: `EEEE` | titlecase }}\n {{ show.next_performance.start_time | date: `dd 'de' MMMM, hh:mm a` }}\n </span>\n </div>\n }\n\n @if (show.days_of_week && show.days_of_week.length > 0) {\n <div class=\"show-card__days\">\n @for (day of show.days_of_week; track $index) {\n <app-badge\n [text]=\"`common.daysOfWeekByNumber.${day}` | transloco\"\n size=\"xs\"\n backgroundColor=\"#525252\"\n textColor=\"#e5e5e5\"\n />\n }\n </div>\n }\n\n @if (show.unique_start_times && show.unique_start_times.length > 0) {\n <div class=\"show-card__times\">\n @for (time of show.unique_start_times; track $index) {\n <app-badge\n [text]=\"dateService.formatDate(formatTimeDate(time), 'hh:mm a')\"\n size=\"xs\"\n backgroundColor=\"#525252\"\n textColor=\"#e5e5e5\"\n />\n }\n </div>\n }\n\n <app-link-button\n class=\"show-card__link\"\n [route]=\"linkUrlFn ? linkUrlFn(show) : '#'\"\n [queryParams]=\"linkQueryParams ?? {}\"\n [text]=\"linkText\"\n icon=\"ri-calendar-line\"\n variant=\"primary\"\n size=\"sm\"\n />\n </div>\n</div>\n", styles: [".show-card{align-items:center;background-color:#171717;border-radius:.5rem;display:flex;flex-direction:column;gap:0;justify-content:space-between;overflow:hidden;padding:0;position:relative;transition:all .2s ease-in-out;max-width:320px;width:100%}.show-card:hover{border-color:#525252}.show-card--selected{background-color:#262626;border-color:#ef4444;box-shadow:0 0 0 1px #ef444480,0 0 16px #ef444459}.show-card--selected:hover{border-color:#ef4444}.show-card__image{aspect-ratio:1/1;display:flex;border-radius:.125rem;overflow:hidden;position:relative;width:100%}.show-card__image-img{object-fit:cover;object-position:center;max-height:100%;max-width:100%;margin-left:auto;margin-right:auto}.show-card__image-placeholder{display:flex;background-color:#e5e7eb;height:100%;width:100%}.show-card__badge{position:absolute;left:1rem;top:1rem}.show-card__info{display:flex;flex-direction:column;flex:1;gap:.5rem;padding:1.5rem;width:100%}.show-card__title{color:#e5e7eb;font-size:1.5rem;font-weight:800;line-height:130%;margin:0}.show-card__datetime{line-height:1}.show-card__datetime-title{color:#a3a3a3;font-size:.75rem;font-weight:700;width:100%}.show-card__date{color:#a3a3a3;font-size:.875rem}.show-card__days,.show-card__times{display:flex;flex-flow:row wrap;gap:.25rem}.show-card__times{margin-bottom:.5rem}.show-card__link{margin-top:auto}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: AppLinkButtonComponent, selector: "app-link-button", inputs: ["disabled", "loading", "target", "text", "icon", "loadingText", "route", "queryParams", "size", "variant"] }, { kind: "component", type: AppBadgeComponent, selector: "app-badge", inputs: ["text", "color", "size", "bordered", "backgroundColor", "textColor"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "pipe", type: i2.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i2.DatePipe, name: "date" }, { kind: "pipe", type: i2$1.TranslocoPipe, name: "transloco" }] });
|
|
4178
4181
|
}
|
|
4179
4182
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ShowCardComponent, decorators: [{
|
|
4180
4183
|
type: Component,
|
|
@@ -7120,7 +7123,7 @@ class PerformanceCardComponent {
|
|
|
7120
7123
|
return this.listEventService.selectedPerformance()?.id === this.card.id;
|
|
7121
7124
|
}
|
|
7122
7125
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: PerformanceCardComponent, deps: [{ token: PerformancesListEventsService }], target: i0.ɵɵFactoryTarget.Component });
|
|
7123
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: PerformanceCardComponent, isStandalone: true, selector: "performance-card", inputs: { card: "card", linkText: "linkText", linkUrlFn: "linkUrlFn", linkQueryParams: "linkQueryParams" }, ngImport: i0, template: "<div class=\"performance-card\" [class.performance-card--selected]=\"isSelected()\">\n <div class=\"performance-card-image\">\n @if (card.show.images && card.show.images.length > 0) {\n <img [src]=\"card.show.images[0].full_url\" class=\"performance-card-image-img\" />\n } @else {\n <span class=\"performance-card-image-placeholder\"></span>\n }\n </div>\n\n <div class=\"performance-card-info\">\n <div class=\"performance-card-title\">\n {{ card.show.title }}\n </div>\n\n <div class=\"performance-card-datetime\">\n <span class=\"performance-card-date\">\n {{ card.start_time | date: `EEEE` | titlecase }}\n {{ card.start_time | date: `dd 'de' MMMM,` }}\n </span>\n\n <span class=\"performance-card-time\">\n {{ card.start_time | date: `hh:mm` }}\n </span>\n\n <span class=\"performance-card-meridiem\">\n {{ card.start_time | date: 'a' }}\n </span>\n </div>\n\n <ul class=\"performance-card-location\">\n @if (card.hall) {\n <li class=\"performance-card-location__item\">\n <i class=\"ri-armchair-line\"></i>\n <strong>Sala:</strong>\n <span>{{ card.hall.name }}</span>\n </li>\n }\n\n @if (card.venue) {\n <li class=\"performance-card-location__item\">\n <i class=\"ri-building-4-line\"></i>\n <strong>Teatro:</strong>\n <span>{{ card.venue.name }}</span>\n </li>\n }\n </ul>\n </div>\n\n <div class=\"performance-card-actions\">\n <app-badge\n [text]=\"`${card.available_tickets_count} entrada(s) disponible(s)`\"\n size=\"xs\"\n [color]=\"badgeColor\"\n />\n\n <div class=\"performance-card-price\">\n Desde\n\n <span class=\"performance-card-price-value\">\n ${{ card.zone_price_cheapest | number: '1.0-2' }}\n </span>\n </div>\n\n <app-link-button\n [style.width]=\"'100%'\"\n [route]=\"linkUrlFn ? linkUrlFn(card) : '#'\"\n [queryParams]=\"linkQueryParams ?? {}\"\n [text]=\"linkText\"\n icon=\"ri-coupon-line\"\n variant=\"primary\"\n size=\"xs\"\n />\n </div>\n</div>\n", styles: [".performance-card{align-items:center;background-color:#171717;border-radius:.5rem;border:1px solid #404040;display:flex;flex-direction:column;gap:1rem;justify-content:space-between;padding:1rem 1.25rem;transition:all .2s ease-in-out}@media(min-width:640px){.performance-card{flex-direction:row}}.performance-card:hover{border-color:#525252}.performance-card--selected{background-color:#262626;border-color:#ef4444;box-shadow:0 0 0 1px #ef444480,0 0 16px #ef444459}.performance-card--selected:hover{border-color:#ef4444}.performance-card-image{display:flex;border-radius:.125rem;overflow:hidden;height:auto;min-height:6rem;width:100%}@media(min-width:640px){.performance-card-image{height:6rem;width:6rem}}.performance-card-image-img{object-fit:contain;object-position:center;max-height:100%;max-width:100%;margin-left:auto;margin-right:auto}.performance-card-image-placeholder{display:flex;background-color:#e5e7eb;height:6rem;width:100%}.performance-card-info{display:flex;flex-direction:column;flex:1;gap:.5rem;width:100%}.performance-card-title{color:#e5e7eb;font-size:1.5rem;font-weight:800;line-height:1}.performance-card--selected .performance-card-title{color:#f3f4f6}.performance-card-datetime{line-height:1}.performance-card-date{font-size:.875rem;color:#9ca3af}.performance-card-time{font-weight:800;font-size:1.125rem;color:#e5e7eb}.performance-card-meridiem{font-weight:800;font-size:.875rem;color:#fff}.performance-card--selected .performance-card-meridiem{color:#ef4444}.performance-card-price{font-size:1rem;color:#9ca3af;line-height:1}.performance-card-price-value{color:#d1d5db;font-weight:600}.performance-card-location{align-items:flex-start;display:flex;flex-flow:row wrap;gap:1rem;list-style:none;margin:0;padding:0;width:100%}.performance-card-location__item{color:#a3a3a3;align-self:center;display:flex;flex-flow:row nowrap;font-size:.75rem;justify-content:flex-start;gap:.25rem}.performance-card-actions{align-items:center;display:flex;flex-direction:column;gap:.5rem;width:100%}@media(min-width:640px){.performance-card-actions{max-width:200px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: AppLinkButtonComponent, selector: "app-link-button", inputs: ["disabled", "loading", "target", "text", "icon", "loadingText", "route", "queryParams", "size", "variant"] }, { kind: "component", type: AppBadgeComponent, selector: "app-badge", inputs: ["text", "color", "size", "backgroundColor", "textColor"] }, { kind: "pipe", type: i2.DecimalPipe, name: "number" }, { kind: "pipe", type: i2.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i2.DatePipe, name: "date" }] });
|
|
7126
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: PerformanceCardComponent, isStandalone: true, selector: "performance-card", inputs: { card: "card", linkText: "linkText", linkUrlFn: "linkUrlFn", linkQueryParams: "linkQueryParams" }, ngImport: i0, template: "<div class=\"performance-card\" [class.performance-card--selected]=\"isSelected()\">\n <div class=\"performance-card-image\">\n @if (card.show.images && card.show.images.length > 0) {\n <img [src]=\"card.show.images[0].full_url\" class=\"performance-card-image-img\" />\n } @else {\n <span class=\"performance-card-image-placeholder\"></span>\n }\n </div>\n\n <div class=\"performance-card-info\">\n <div class=\"performance-card-title\">\n {{ card.show.title }}\n </div>\n\n <div class=\"performance-card-datetime\">\n <span class=\"performance-card-date\">\n {{ card.start_time | date: `EEEE` | titlecase }}\n {{ card.start_time | date: `dd 'de' MMMM,` }}\n </span>\n\n <span class=\"performance-card-time\">\n {{ card.start_time | date: `hh:mm` }}\n </span>\n\n <span class=\"performance-card-meridiem\">\n {{ card.start_time | date: 'a' }}\n </span>\n </div>\n\n <ul class=\"performance-card-location\">\n @if (card.hall) {\n <li class=\"performance-card-location__item\">\n <i class=\"ri-armchair-line\"></i>\n <strong>Sala:</strong>\n <span>{{ card.hall.name }}</span>\n </li>\n }\n\n @if (card.venue) {\n <li class=\"performance-card-location__item\">\n <i class=\"ri-building-4-line\"></i>\n <strong>Teatro:</strong>\n <span>{{ card.venue.name }}</span>\n </li>\n }\n </ul>\n </div>\n\n <div class=\"performance-card-actions\">\n <app-badge\n [text]=\"`${card.available_tickets_count} entrada(s) disponible(s)`\"\n size=\"xs\"\n [color]=\"badgeColor\"\n />\n\n <div class=\"performance-card-price\">\n Desde\n\n <span class=\"performance-card-price-value\">\n ${{ card.zone_price_cheapest | number: '1.0-2' }}\n </span>\n </div>\n\n <app-link-button\n [style.width]=\"'100%'\"\n [route]=\"linkUrlFn ? linkUrlFn(card) : '#'\"\n [queryParams]=\"linkQueryParams ?? {}\"\n [text]=\"linkText\"\n icon=\"ri-coupon-line\"\n variant=\"primary\"\n size=\"xs\"\n />\n </div>\n</div>\n", styles: [".performance-card{align-items:center;background-color:#171717;border-radius:.5rem;border:1px solid #404040;display:flex;flex-direction:column;gap:1rem;justify-content:space-between;padding:1rem 1.25rem;transition:all .2s ease-in-out}@media(min-width:640px){.performance-card{flex-direction:row}}.performance-card:hover{border-color:#525252}.performance-card--selected{background-color:#262626;border-color:#ef4444;box-shadow:0 0 0 1px #ef444480,0 0 16px #ef444459}.performance-card--selected:hover{border-color:#ef4444}.performance-card-image{display:flex;border-radius:.125rem;overflow:hidden;height:auto;min-height:6rem;width:100%}@media(min-width:640px){.performance-card-image{height:6rem;width:6rem}}.performance-card-image-img{object-fit:contain;object-position:center;max-height:100%;max-width:100%;margin-left:auto;margin-right:auto}.performance-card-image-placeholder{display:flex;background-color:#e5e7eb;height:6rem;width:100%}.performance-card-info{display:flex;flex-direction:column;flex:1;gap:.5rem;width:100%}.performance-card-title{color:#e5e7eb;font-size:1.5rem;font-weight:800;line-height:1}.performance-card--selected .performance-card-title{color:#f3f4f6}.performance-card-datetime{line-height:1}.performance-card-date{font-size:.875rem;color:#9ca3af}.performance-card-time{font-weight:800;font-size:1.125rem;color:#e5e7eb}.performance-card-meridiem{font-weight:800;font-size:.875rem;color:#fff}.performance-card--selected .performance-card-meridiem{color:#ef4444}.performance-card-price{font-size:1rem;color:#9ca3af;line-height:1}.performance-card-price-value{color:#d1d5db;font-weight:600}.performance-card-location{align-items:flex-start;display:flex;flex-flow:row wrap;gap:1rem;list-style:none;margin:0;padding:0;width:100%}.performance-card-location__item{color:#a3a3a3;align-self:center;display:flex;flex-flow:row nowrap;font-size:.75rem;justify-content:flex-start;gap:.25rem}.performance-card-actions{align-items:center;display:flex;flex-direction:column;gap:.5rem;width:100%}@media(min-width:640px){.performance-card-actions{max-width:200px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: AppLinkButtonComponent, selector: "app-link-button", inputs: ["disabled", "loading", "target", "text", "icon", "loadingText", "route", "queryParams", "size", "variant"] }, { kind: "component", type: AppBadgeComponent, selector: "app-badge", inputs: ["text", "color", "size", "bordered", "backgroundColor", "textColor"] }, { kind: "pipe", type: i2.DecimalPipe, name: "number" }, { kind: "pipe", type: i2.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i2.DatePipe, name: "date" }] });
|
|
7124
7127
|
}
|
|
7125
7128
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: PerformanceCardComponent, decorators: [{
|
|
7126
7129
|
type: Component,
|
|
@@ -7902,7 +7905,7 @@ class OrderStatusBadgeComponent {
|
|
|
7902
7905
|
return ORDER_STATUS_COLORS[this.order.status] ?? null;
|
|
7903
7906
|
}
|
|
7904
7907
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: OrderStatusBadgeComponent, deps: [{ token: i2$1.TranslocoService }], target: i0.ɵɵFactoryTarget.Component });
|
|
7905
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: OrderStatusBadgeComponent, isStandalone: true, selector: "order-status-badge", inputs: { order: "order", size: "size" }, ngImport: i0, template: "<app-badge\n [text]=\"`order.status.${order.status}` | transloco\"\n [backgroundColor]=\"statusColors.bg\"\n [textColor]=\"statusColors.text\"\n [size]=\"size\"\n/>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: TranslocoModule }, { kind: "component", type: AppBadgeComponent, selector: "app-badge", inputs: ["text", "color", "size", "backgroundColor", "textColor"] }, { kind: "pipe", type: i2$1.TranslocoPipe, name: "transloco" }] });
|
|
7908
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: OrderStatusBadgeComponent, isStandalone: true, selector: "order-status-badge", inputs: { order: "order", size: "size" }, ngImport: i0, template: "<app-badge\n [text]=\"`order.status.${order.status}` | transloco\"\n [backgroundColor]=\"statusColors.bg\"\n [textColor]=\"statusColors.text\"\n [size]=\"size\"\n/>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: TranslocoModule }, { kind: "component", type: AppBadgeComponent, selector: "app-badge", inputs: ["text", "color", "size", "bordered", "backgroundColor", "textColor"] }, { kind: "pipe", type: i2$1.TranslocoPipe, name: "transloco" }] });
|
|
7906
7909
|
}
|
|
7907
7910
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: OrderStatusBadgeComponent, decorators: [{
|
|
7908
7911
|
type: Component,
|