ngx-obelisco-example
Version:
Componentes funcionales y reutilizables para Angular.
153 lines (148 loc) • 13.5 kB
JavaScript
import * as i0 from '@angular/core';
import { Component, Input, ContentChild, NgModule } from '@angular/core';
import { OCustomContentDirective } from 'ngx-obelisco-example/directives';
import * as i1 from '@angular/common';
import { CommonModule } from '@angular/common';
import { RouterModule } from '@angular/router';
const PHONE_LIST = [
{
title: '102 - Niñez y Adolescencia',
number: 102
},
{
title: '103 - Emergencias',
number: 103
},
{
title: '107 - SAME',
number: 107
},
{
title: '911 - Policía',
number: 911
},
{
title: '144 - Violencia de género',
number: 144
},
{
title: '147 - Atención ciudadana',
number: 147
}
];
const NETWORK_LIST = [
{
title: 'Facebook',
src: 'https://www.facebook.com/GCBA',
icon: 'bx bxl-facebook-circle'
},
{
title: 'Instagram',
src: 'https://www.instagram.com/gcba/',
icon: 'bx bxl-instagram-alt'
},
{
title: 'Twitter',
src: 'https://twitter.com/buenosaires',
icon: 'bxl-twitter'
},
{
title: 'YouTube',
src: 'https://www.youtube.com/user/GCBA',
icon: 'bxl-youtube'
},
{
title: 'LinkedIn',
src: 'https://ar.linkedin.com/company/gobierno-de-la-ciudad-de-buenos-aires',
icon: 'bx bxl-linkedin-square'
},
{
title: 'TikTok',
src: 'https://www.tiktok.com/@buenosaires',
icon: 'bx bxl-tiktok'
},
{
title: 'Pinterest',
src: 'https://www.pinterest.es/buenosaires/',
icon: 'bx bxl-pinterest'
}
];
const LINK_LIST = [
{
title: 'Boletín oficial',
src: 'https://boletinoficial.buenosaires.gob.ar'
},
{
title: 'Términos y condiciones',
src: 'https://buenosaires.gob.ar/terminos-y-condiciones'
},
{
title: 'Política de privacidad',
src: 'https://buenosaires.gob.ar/privacidad'
},
{
title: 'Oficios judiciales',
src: 'https://buenosaires.gob.ar/jefedegobierno/legalytecnica/normativa/boletin-oficial-y-registro/oficios-judiciales'
},
{
title: 'Transparencia',
src: 'https://buenosaires.gob.ar/gobierno/transparencia'
}
];
class OFooterComponent {
constructor() {
this.phoneCustomItems = PHONE_LIST;
this.networkCustomItems = NETWORK_LIST;
this.linkCustomItems = LINK_LIST;
this.isPhoneSectionHidden = false;
this.isNetworkSectionHidden = false;
this.isLinkSectionHidden = false;
this.customClasses = '';
this.customClassesIndicator = '';
}
}
OFooterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: OFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
OFooterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: OFooterComponent, selector: "o-footer", inputs: { phoneCustomItems: "phoneCustomItems", networkCustomItems: "networkCustomItems", linkCustomItems: "linkCustomItems", isPhoneSectionHidden: "isPhoneSectionHidden", isNetworkSectionHidden: "isNetworkSectionHidden", isLinkSectionHidden: "isLinkSectionHidden", indicatorText: "indicatorText", customClasses: "customClasses", customClassesIndicator: "customClassesIndicator" }, queries: [{ propertyName: "oCustomContent", first: true, predicate: OCustomContentDirective, descendants: true, static: true }], ngImport: i0, template: "<h2 class=\"sr-only\">Navegaci\u00F3n de pie de p\u00E1gina</h2>\r\n<div *ngIf=\"indicatorText\" class=\"footer-info\" [ngClass]=\"customClassesIndicator\">\r\n <div class=\"container\">\r\n <h3 class=\"footer-info-text\">{{ indicatorText }}</h3>\r\n <div class=\"footer-info-actions\">\r\n <ng-content></ng-content>\r\n </div>\r\n </div>\r\n</div>\r\n<footer class=\"main-footer\" [ngClass]=\"customClasses\">\r\n <ng-container *ngIf=\"!oCustomContent\">\r\n <div class=\"container\">\r\n <section *ngIf=\"!isPhoneSectionHidden\">\r\n <h3>Tel\u00E9fonos \u00FAtiles</h3>\r\n <ul class=\"list-inline\">\r\n <li class=\"list-inline-item phone-items\" *ngFor=\"let phone of phoneCustomItems\">\r\n <a [href]=\"'tel:' + phone.number\">{{ phone.title }}</a>\r\n </li>\r\n </ul>\r\n <a href=\"https://www.buenosaires.gob.ar/laciudad/telefonosutiles\"> Ver todos los tel\u00E9fonos </a>\r\n </section>\r\n <section *ngIf=\"!isNetworkSectionHidden\">\r\n <h3>Redes de la ciudad</h3>\r\n <ul class=\"list-inline\">\r\n <li class=\"list-inline-item redes-items\" *ngFor=\"let network of networkCustomItems\">\r\n <a [href]=\"network.src\" target=\"_blank\"><i class=\"bx {{ network.icon }}\"></i>{{ network.title }}</a>\r\n </li>\r\n </ul>\r\n </section>\r\n </div>\r\n <hr class=\"divider\" *ngIf=\"!isPhoneSectionHidden || !isNetworkSectionHidden\" />\r\n <div class=\"container\">\r\n <section class=\"footer-legal-section\">\r\n <h3 class=\"sr-only\">Informaci\u00F3n gubernamental</h3>\r\n <div class=\"row align-items-center\">\r\n <div class=\"col-12 col-md-5 col-xl-4 footer-content-img\">\r\n <img\r\n oDefaultImage\r\n class=\"d-lg-none\"\r\n src=\"https://raw.githubusercontent.com/gcba/Obelisco/8e3c51245a98c0c2c5fed1e43e20d53fa135e98d/static/footer/ciudad-ba-sm.svg\"\r\n alt=\"Logo de Ciudad de Buenos Aires\"\r\n height=\"48\"\r\n />\r\n <img\r\n oDefaultImage\r\n class=\"d-none d-lg-inline\"\r\n src=\"https://raw.githubusercontent.com/gcba/Obelisco/8e3c51245a98c0c2c5fed1e43e20d53fa135e98d/static/footer/ciudad-ba.svg\"\r\n alt=\"Logo de Ciudad de Buenos Aires\"\r\n height=\"40\"\r\n />\r\n <img\r\n oDefaultImage\r\n class=\"img-vamos-ba\"\r\n src=\"https://raw.githubusercontent.com/gcba/Obelisco/8e3c51245a98c0c2c5fed1e43e20d53fa135e98d/static/footer/vamos-ba.svg\"\r\n alt=\"Logo de Vamos Buenos Aires\"\r\n />\r\n </div>\r\n <div class=\"col-12\" *ngIf=\"!isLinkSectionHidden\">\r\n <ul class=\"list-inline\">\r\n <li class=\"list-inline-item\" *ngFor=\"let link of linkCustomItems\">\r\n <a [href]=\"link.src\">{{ link.title }}</a>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </section>\r\n <section>\r\n <div class=\"footer-license-text\">\r\n Los contenidos de buenosaires.gob.ar est\u00E1n licenciados bajo Creative Commons Reconocimiento 2.5 Argentina\r\n License.\r\n </div>\r\n </section>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"oCustomContent\" [ngTemplateOutlet]=\"oCustomContent.template\"></ng-container>\r\n</footer>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: OFooterComponent, decorators: [{
type: Component,
args: [{ selector: 'o-footer', template: "<h2 class=\"sr-only\">Navegaci\u00F3n de pie de p\u00E1gina</h2>\r\n<div *ngIf=\"indicatorText\" class=\"footer-info\" [ngClass]=\"customClassesIndicator\">\r\n <div class=\"container\">\r\n <h3 class=\"footer-info-text\">{{ indicatorText }}</h3>\r\n <div class=\"footer-info-actions\">\r\n <ng-content></ng-content>\r\n </div>\r\n </div>\r\n</div>\r\n<footer class=\"main-footer\" [ngClass]=\"customClasses\">\r\n <ng-container *ngIf=\"!oCustomContent\">\r\n <div class=\"container\">\r\n <section *ngIf=\"!isPhoneSectionHidden\">\r\n <h3>Tel\u00E9fonos \u00FAtiles</h3>\r\n <ul class=\"list-inline\">\r\n <li class=\"list-inline-item phone-items\" *ngFor=\"let phone of phoneCustomItems\">\r\n <a [href]=\"'tel:' + phone.number\">{{ phone.title }}</a>\r\n </li>\r\n </ul>\r\n <a href=\"https://www.buenosaires.gob.ar/laciudad/telefonosutiles\"> Ver todos los tel\u00E9fonos </a>\r\n </section>\r\n <section *ngIf=\"!isNetworkSectionHidden\">\r\n <h3>Redes de la ciudad</h3>\r\n <ul class=\"list-inline\">\r\n <li class=\"list-inline-item redes-items\" *ngFor=\"let network of networkCustomItems\">\r\n <a [href]=\"network.src\" target=\"_blank\"><i class=\"bx {{ network.icon }}\"></i>{{ network.title }}</a>\r\n </li>\r\n </ul>\r\n </section>\r\n </div>\r\n <hr class=\"divider\" *ngIf=\"!isPhoneSectionHidden || !isNetworkSectionHidden\" />\r\n <div class=\"container\">\r\n <section class=\"footer-legal-section\">\r\n <h3 class=\"sr-only\">Informaci\u00F3n gubernamental</h3>\r\n <div class=\"row align-items-center\">\r\n <div class=\"col-12 col-md-5 col-xl-4 footer-content-img\">\r\n <img\r\n oDefaultImage\r\n class=\"d-lg-none\"\r\n src=\"https://raw.githubusercontent.com/gcba/Obelisco/8e3c51245a98c0c2c5fed1e43e20d53fa135e98d/static/footer/ciudad-ba-sm.svg\"\r\n alt=\"Logo de Ciudad de Buenos Aires\"\r\n height=\"48\"\r\n />\r\n <img\r\n oDefaultImage\r\n class=\"d-none d-lg-inline\"\r\n src=\"https://raw.githubusercontent.com/gcba/Obelisco/8e3c51245a98c0c2c5fed1e43e20d53fa135e98d/static/footer/ciudad-ba.svg\"\r\n alt=\"Logo de Ciudad de Buenos Aires\"\r\n height=\"40\"\r\n />\r\n <img\r\n oDefaultImage\r\n class=\"img-vamos-ba\"\r\n src=\"https://raw.githubusercontent.com/gcba/Obelisco/8e3c51245a98c0c2c5fed1e43e20d53fa135e98d/static/footer/vamos-ba.svg\"\r\n alt=\"Logo de Vamos Buenos Aires\"\r\n />\r\n </div>\r\n <div class=\"col-12\" *ngIf=\"!isLinkSectionHidden\">\r\n <ul class=\"list-inline\">\r\n <li class=\"list-inline-item\" *ngFor=\"let link of linkCustomItems\">\r\n <a [href]=\"link.src\">{{ link.title }}</a>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </section>\r\n <section>\r\n <div class=\"footer-license-text\">\r\n Los contenidos de buenosaires.gob.ar est\u00E1n licenciados bajo Creative Commons Reconocimiento 2.5 Argentina\r\n License.\r\n </div>\r\n </section>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"oCustomContent\" [ngTemplateOutlet]=\"oCustomContent.template\"></ng-container>\r\n</footer>\r\n" }]
}], propDecorators: { phoneCustomItems: [{
type: Input
}], networkCustomItems: [{
type: Input
}], linkCustomItems: [{
type: Input
}], isPhoneSectionHidden: [{
type: Input
}], isNetworkSectionHidden: [{
type: Input
}], isLinkSectionHidden: [{
type: Input
}], indicatorText: [{
type: Input
}], customClasses: [{
type: Input
}], customClassesIndicator: [{
type: Input
}], oCustomContent: [{
type: ContentChild,
args: [OCustomContentDirective, { static: true }]
}] } });
class OFooterModule {
}
OFooterModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: OFooterModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
OFooterModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: OFooterModule, declarations: [OFooterComponent], imports: [CommonModule, RouterModule], exports: [OFooterComponent] });
OFooterModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: OFooterModule, imports: [CommonModule, RouterModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: OFooterModule, decorators: [{
type: NgModule,
args: [{
declarations: [OFooterComponent],
imports: [CommonModule, RouterModule],
exports: [OFooterComponent]
}]
}] });
/**
* Generated bundle index. Do not edit.
*/
export { OFooterComponent, OFooterModule };
//# sourceMappingURL=ngx-obelisco-example-footer.mjs.map