@norwegian/core-components 6.11.2 → 6.11.4
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.
- package/esm2022/lib/components/campaign-header/campaign-header.component.mjs +2 -2
- package/esm2022/lib/components/micro-button/micro-button.component.mjs +2 -2
- package/esm2022/lib/components/tab-group/tab/tab.component.mjs +2 -2
- package/fesm2022/norwegian-core-components.mjs +6 -6
- package/fesm2022/norwegian-core-components.mjs.map +1 -1
- package/package.json +1 -1
|
@@ -32,11 +32,11 @@ export class CampaignHeaderComponent extends NasComponentBase {
|
|
|
32
32
|
return 'var(--primary-base-color)';
|
|
33
33
|
}
|
|
34
34
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: CampaignHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
35
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: CampaignHeaderComponent, selector: "nas-campaign-header", inputs: { title: "title", source: "source", description: "description", microButtonModel: "microButtonModel", gradient: "gradient" }, usesInheritance: true, ngImport: i0, template: "<div>\n <div *ngIf=\"microButtonModel\" [nasClass]=\"getClass('micro-button')\">\n <nas-micro-button icon=\"arrow-left\" [model]=\"microButtonModel\"></nas-micro-button>\n </div>\n <header [nasClass]=\"gradient ? getClass('gradient-header') : getClass('header')\"\n [style.--bg-image]=\"getBackgroundImage()\" [style.background-color]=\"getBackgroundColor()\">\n <div [nasClass]=\"getClass('content')\">\n <h1 [nasClass]=\"getClass('title')\">{{ title }}</h1>\n <div [nasClass]=\"getClass('description')\">\n <ng-container *ngIf=\"description; else descriptionContent\">{{description}}</ng-container>\n <ng-template #descriptionContent>\n <ng-content select=\"[description]\"></ng-content>\n </ng-template>\n </div>\n </div>\n </header>\n</div>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}:host{--primary-base-color: #d81939}.nas-campaign-header{max-width:820px;margin:24px auto 36px}.nas-campaign-header__header{display:flex;align-items:flex-end;height:250px;background-image:var(--bg-image, none);background-size:cover;background-position:center;background-repeat:no-repeat}@media (min-width: 640px){.nas-campaign-header__header{padding-left:0;background-size:cover;height:300px}}.nas-campaign-header__gradient-header{display:flex;align-items:flex-end;height:250px;background-image:var(--bg-image, none);background-size:cover;background-position:center;background-repeat:no-repeat;background:linear-gradient(180deg,rgba(0,50,81,0) 0%,rgba(0,50,81,.8) 100%),var(--bg-image, none),lightgray 50%/cover no-repeat}@media (min-width: 640px){.nas-campaign-header__gradient-header{padding-left:0;background-size:cover;height:300px}}.nas-campaign-header__micro-button{position:absolute;
|
|
35
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: CampaignHeaderComponent, selector: "nas-campaign-header", inputs: { title: "title", source: "source", description: "description", microButtonModel: "microButtonModel", gradient: "gradient" }, usesInheritance: true, ngImport: i0, template: "<div>\n <div *ngIf=\"microButtonModel\" [nasClass]=\"getClass('micro-button')\">\n <nas-micro-button icon=\"arrow-left\" [model]=\"microButtonModel\"></nas-micro-button>\n </div>\n <header [nasClass]=\"gradient ? getClass('gradient-header') : getClass('header')\"\n [style.--bg-image]=\"getBackgroundImage()\" [style.background-color]=\"getBackgroundColor()\">\n <div [nasClass]=\"getClass('content')\">\n <h1 [nasClass]=\"getClass('title')\">{{ title }}</h1>\n <div [nasClass]=\"getClass('description')\">\n <ng-container *ngIf=\"description; else descriptionContent\">{{description}}</ng-container>\n <ng-template #descriptionContent>\n <ng-content select=\"[description]\"></ng-content>\n </ng-template>\n </div>\n </div>\n </header>\n</div>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}:host{--primary-base-color: #d81939}.nas-campaign-header{max-width:820px;margin:24px auto 36px}.nas-campaign-header__header{display:flex;align-items:flex-end;height:250px;background-image:var(--bg-image, none);background-size:cover;background-position:center;background-repeat:no-repeat}@media (min-width: 640px){.nas-campaign-header__header{padding-left:0;background-size:cover;height:300px}}.nas-campaign-header__gradient-header{display:flex;align-items:flex-end;height:250px;background-image:var(--bg-image, none);background-size:cover;background-position:center;background-repeat:no-repeat;background:linear-gradient(180deg,rgba(0,50,81,0) 0%,rgba(0,50,81,.8) 100%),var(--bg-image, none),lightgray 50%/cover no-repeat}@media (min-width: 640px){.nas-campaign-header__gradient-header{padding-left:0;background-size:cover;height:300px}}.nas-campaign-header__micro-button{position:absolute;padding:16px}@media (min-width: 640px){.nas-campaign-header__micro-button{padding:32px}}.nas-campaign-header__content{flex-grow:2}.nas-campaign-header__title{font-size:28px;color:#fff;padding:0 16px 8px;margin:unset!important}@media (min-width: 640px){.nas-campaign-header__title{font-size:50px;line-height:56px;padding:0 32px 16px}}.nas-campaign-header__description{font-family:Apercu,Helvetica Neue,Helvetica,Arial,sans-serif;color:#fff;font-size:16px;line-height:26px;padding:0 16px 16px}@media (min-width: 640px){.nas-campaign-header__description{padding:0 32px 32px;font-size:18px;line-height:26px}}.nas-campaign-header--small{margin-bottom:24px}.nas-campaign-header--small .nas-campaign-header__title{font-size:24px;line-height:30px}.nas-campaign-header--small .nas-campaign-header__header{height:auto;background-image:none;border-bottom:2px solid #003251}::ng-deep .nas-micro-button--text{border-bottom:none;font-weight:700}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NasClassDirective, selector: "[nasClass]", inputs: ["nasClass", "attr.class"] }, { kind: "component", type: i3.MicroButtonComponent, selector: "nas-micro-button", inputs: ["model", "icon"] }] }); }
|
|
36
36
|
}
|
|
37
37
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: CampaignHeaderComponent, decorators: [{
|
|
38
38
|
type: Component,
|
|
39
|
-
args: [{ selector: 'nas-campaign-header', template: "<div>\n <div *ngIf=\"microButtonModel\" [nasClass]=\"getClass('micro-button')\">\n <nas-micro-button icon=\"arrow-left\" [model]=\"microButtonModel\"></nas-micro-button>\n </div>\n <header [nasClass]=\"gradient ? getClass('gradient-header') : getClass('header')\"\n [style.--bg-image]=\"getBackgroundImage()\" [style.background-color]=\"getBackgroundColor()\">\n <div [nasClass]=\"getClass('content')\">\n <h1 [nasClass]=\"getClass('title')\">{{ title }}</h1>\n <div [nasClass]=\"getClass('description')\">\n <ng-container *ngIf=\"description; else descriptionContent\">{{description}}</ng-container>\n <ng-template #descriptionContent>\n <ng-content select=\"[description]\"></ng-content>\n </ng-template>\n </div>\n </div>\n </header>\n</div>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}:host{--primary-base-color: #d81939}.nas-campaign-header{max-width:820px;margin:24px auto 36px}.nas-campaign-header__header{display:flex;align-items:flex-end;height:250px;background-image:var(--bg-image, none);background-size:cover;background-position:center;background-repeat:no-repeat}@media (min-width: 640px){.nas-campaign-header__header{padding-left:0;background-size:cover;height:300px}}.nas-campaign-header__gradient-header{display:flex;align-items:flex-end;height:250px;background-image:var(--bg-image, none);background-size:cover;background-position:center;background-repeat:no-repeat;background:linear-gradient(180deg,rgba(0,50,81,0) 0%,rgba(0,50,81,.8) 100%),var(--bg-image, none),lightgray 50%/cover no-repeat}@media (min-width: 640px){.nas-campaign-header__gradient-header{padding-left:0;background-size:cover;height:300px}}.nas-campaign-header__micro-button{position:absolute;
|
|
39
|
+
args: [{ selector: 'nas-campaign-header', template: "<div>\n <div *ngIf=\"microButtonModel\" [nasClass]=\"getClass('micro-button')\">\n <nas-micro-button icon=\"arrow-left\" [model]=\"microButtonModel\"></nas-micro-button>\n </div>\n <header [nasClass]=\"gradient ? getClass('gradient-header') : getClass('header')\"\n [style.--bg-image]=\"getBackgroundImage()\" [style.background-color]=\"getBackgroundColor()\">\n <div [nasClass]=\"getClass('content')\">\n <h1 [nasClass]=\"getClass('title')\">{{ title }}</h1>\n <div [nasClass]=\"getClass('description')\">\n <ng-container *ngIf=\"description; else descriptionContent\">{{description}}</ng-container>\n <ng-template #descriptionContent>\n <ng-content select=\"[description]\"></ng-content>\n </ng-template>\n </div>\n </div>\n </header>\n</div>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}:host{--primary-base-color: #d81939}.nas-campaign-header{max-width:820px;margin:24px auto 36px}.nas-campaign-header__header{display:flex;align-items:flex-end;height:250px;background-image:var(--bg-image, none);background-size:cover;background-position:center;background-repeat:no-repeat}@media (min-width: 640px){.nas-campaign-header__header{padding-left:0;background-size:cover;height:300px}}.nas-campaign-header__gradient-header{display:flex;align-items:flex-end;height:250px;background-image:var(--bg-image, none);background-size:cover;background-position:center;background-repeat:no-repeat;background:linear-gradient(180deg,rgba(0,50,81,0) 0%,rgba(0,50,81,.8) 100%),var(--bg-image, none),lightgray 50%/cover no-repeat}@media (min-width: 640px){.nas-campaign-header__gradient-header{padding-left:0;background-size:cover;height:300px}}.nas-campaign-header__micro-button{position:absolute;padding:16px}@media (min-width: 640px){.nas-campaign-header__micro-button{padding:32px}}.nas-campaign-header__content{flex-grow:2}.nas-campaign-header__title{font-size:28px;color:#fff;padding:0 16px 8px;margin:unset!important}@media (min-width: 640px){.nas-campaign-header__title{font-size:50px;line-height:56px;padding:0 32px 16px}}.nas-campaign-header__description{font-family:Apercu,Helvetica Neue,Helvetica,Arial,sans-serif;color:#fff;font-size:16px;line-height:26px;padding:0 16px 16px}@media (min-width: 640px){.nas-campaign-header__description{padding:0 32px 32px;font-size:18px;line-height:26px}}.nas-campaign-header--small{margin-bottom:24px}.nas-campaign-header--small .nas-campaign-header__title{font-size:24px;line-height:30px}.nas-campaign-header--small .nas-campaign-header__header{height:auto;background-image:none;border-bottom:2px solid #003251}::ng-deep .nas-micro-button--text{border-bottom:none;font-weight:700}\n"] }]
|
|
40
40
|
}], ctorParameters: function () { return []; }, propDecorators: { title: [{
|
|
41
41
|
type: Input
|
|
42
42
|
}], source: [{
|
|
@@ -37,11 +37,11 @@ export class MicroButtonComponent extends NasComponentBase {
|
|
|
37
37
|
return classes;
|
|
38
38
|
}
|
|
39
39
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: MicroButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
40
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: MicroButtonComponent, selector: "nas-micro-button", inputs: { model: "model", icon: "icon" }, usesInheritance: true, ngImport: i0, template: "<div class=\"nas-micro-button\">\n <a [nasClass]=\"getClasses('link')\" [href]=\"model.href\" *ngIf=\"model\">\n <div class=\"icon\" *ngIf=\"_icon.length > 0\">\n <nas-icon [icon]=\"_icon\" [type]=\"'xsmall'\" [lightCircularBackground]=\"true\"\n [nasClass]=\"getClasses('nas-icon')\"></nas-icon>\n </div>\n <div [nasClass]=\"getClasses('text-container')\">\n <div class=\"text\" [nasClass]=\"_icon.length > 0 ? getClasses('text-space') : getClasses('text')\">\n {{ model.text }}\n </div>\n </div>\n </a>\n</div>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}:host ::ng-deep .nas-micro-button .icon nas-icon .nas-icon-xsmall{display:inline-block;margin-top:
|
|
40
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: MicroButtonComponent, selector: "nas-micro-button", inputs: { model: "model", icon: "icon" }, usesInheritance: true, ngImport: i0, template: "<div class=\"nas-micro-button\">\n <a [nasClass]=\"getClasses('link')\" [href]=\"model.href\" *ngIf=\"model\">\n <div class=\"icon\" *ngIf=\"_icon.length > 0\">\n <nas-icon [icon]=\"_icon\" [type]=\"'xsmall'\" [lightCircularBackground]=\"true\"\n [nasClass]=\"getClasses('nas-icon')\"></nas-icon>\n </div>\n <div [nasClass]=\"getClasses('text-container')\">\n <div class=\"text\" [nasClass]=\"_icon.length > 0 ? getClasses('text-space') : getClasses('text')\">\n {{ model.text }}\n </div>\n </div>\n </a>\n</div>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}:host ::ng-deep .nas-micro-button .icon nas-icon .nas-icon-xsmall{display:inline-block;margin-top:4px}.nas-micro-button{display:flex;background:#003251;height:32px;width:-webkit-max-content;width:max-content;flex-direction:row;justify-content:center;border-radius:4px;padding:8px 12px;align-items:center}.nas-micro-button__text-container{display:flex;justify-content:center;align-items:center}.nas-micro-button__text{color:#fff;text-align:center;font-family:Apercu;font-size:12px;font-style:normal;font-weight:500;line-height:16px}.nas-micro-button__text-space{color:#fff;text-align:center;font-family:Apercu;font-size:12px;font-style:normal;font-weight:500;line-height:16px;padding:0 0 1px 8px}.nas-micro-button__link{border-bottom:none;display:flex;align-items:center}.nas-micro-button:hover{background:#0A2033}.nas-micro-button:focus{border:2px solid #0978E8;background:#003251}.nas-micro-button:active{background:#071622}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NasClassDirective, selector: "[nasClass]", inputs: ["nasClass", "attr.class"] }, { kind: "component", type: i3.IconComponent, selector: "nas-icon", inputs: ["icon", "type", "isIndicator", "lightCircularBackground", "cssClass"] }] }); }
|
|
41
41
|
}
|
|
42
42
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: MicroButtonComponent, decorators: [{
|
|
43
43
|
type: Component,
|
|
44
|
-
args: [{ selector: 'nas-micro-button', template: "<div class=\"nas-micro-button\">\n <a [nasClass]=\"getClasses('link')\" [href]=\"model.href\" *ngIf=\"model\">\n <div class=\"icon\" *ngIf=\"_icon.length > 0\">\n <nas-icon [icon]=\"_icon\" [type]=\"'xsmall'\" [lightCircularBackground]=\"true\"\n [nasClass]=\"getClasses('nas-icon')\"></nas-icon>\n </div>\n <div [nasClass]=\"getClasses('text-container')\">\n <div class=\"text\" [nasClass]=\"_icon.length > 0 ? getClasses('text-space') : getClasses('text')\">\n {{ model.text }}\n </div>\n </div>\n </a>\n</div>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}:host ::ng-deep .nas-micro-button .icon nas-icon .nas-icon-xsmall{display:inline-block;margin-top:
|
|
44
|
+
args: [{ selector: 'nas-micro-button', template: "<div class=\"nas-micro-button\">\n <a [nasClass]=\"getClasses('link')\" [href]=\"model.href\" *ngIf=\"model\">\n <div class=\"icon\" *ngIf=\"_icon.length > 0\">\n <nas-icon [icon]=\"_icon\" [type]=\"'xsmall'\" [lightCircularBackground]=\"true\"\n [nasClass]=\"getClasses('nas-icon')\"></nas-icon>\n </div>\n <div [nasClass]=\"getClasses('text-container')\">\n <div class=\"text\" [nasClass]=\"_icon.length > 0 ? getClasses('text-space') : getClasses('text')\">\n {{ model.text }}\n </div>\n </div>\n </a>\n</div>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}:host ::ng-deep .nas-micro-button .icon nas-icon .nas-icon-xsmall{display:inline-block;margin-top:4px}.nas-micro-button{display:flex;background:#003251;height:32px;width:-webkit-max-content;width:max-content;flex-direction:row;justify-content:center;border-radius:4px;padding:8px 12px;align-items:center}.nas-micro-button__text-container{display:flex;justify-content:center;align-items:center}.nas-micro-button__text{color:#fff;text-align:center;font-family:Apercu;font-size:12px;font-style:normal;font-weight:500;line-height:16px}.nas-micro-button__text-space{color:#fff;text-align:center;font-family:Apercu;font-size:12px;font-style:normal;font-weight:500;line-height:16px;padding:0 0 1px 8px}.nas-micro-button__link{border-bottom:none;display:flex;align-items:center}.nas-micro-button:hover{background:#0A2033}.nas-micro-button:focus{border:2px solid #0978E8;background:#003251}.nas-micro-button:active{background:#071622}\n"] }]
|
|
45
45
|
}], ctorParameters: function () { return []; }, propDecorators: { model: [{
|
|
46
46
|
type: Input
|
|
47
47
|
}], icon: [{
|
|
@@ -101,11 +101,11 @@ export class TabComponent extends NasComponentBase {
|
|
|
101
101
|
]);
|
|
102
102
|
}
|
|
103
103
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: TabComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
104
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: TabComponent, selector: "nas-tab", inputs: { icon: "icon", label: "label", shadowless: "shadowless", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, outputs: { tabClick: "tabClick", focusOnNext: "focusOnNext", focusOnPrevious: "focusOnPrevious" }, viewQueries: [{ propertyName: "tab", first: true, predicate: ["tab"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<a #tab\n role=\"tab\"\n [nasClass]=\"getClass('label', [selected && 'selected'])\"\n [id]=\"getLabelId()\"\n [attr.tabIndex]=\"getTabIndex()\"\n [attr.aria-posinset]=\"index + 1\"\n [attr.aria-setsize]=\"size\"\n [attr.aria-controls]=\"getTabContentId()\"\n [attr.aria-selected]=\"selected\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-labelledby]=\"(!ariaLabel && ariaLabelledby) ? ariaLabelledby : null\"\n (click)=\"onTabClick()\"\n (keyup.arrowright)=\"onArrowRightClick()\"\n (keyup.arrowleft)=\"onArrowLeftClick()\">\n <nas-icon *ngIf=\"icon\"\n [icon]=\"getIcon()\"></nas-icon>\n {{label}}\n <ng-container *ngIf=\"displayDropdownIcon()\">\n <nas-icon [nasClass]=\"getDropdownClass()\"\n [type]=\"getDropdownIconType()\"></nas-icon>\n </ng-container>\n</a>\n<div [nasClass]=\"getContentClass()\"\n [id]=\"getTabContentId()\"\n [attr.aria-labelledby]=\"getLabelId()\">\n <ng-content></ng-content>\n</div>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-tab__label{color:#fff;background:#003251;font-size:18px;line-height:26px;border-bottom:none;width:100%;position:relative;z-index:1;outline:none;padding:10px 24px 12px}.nas-tab__label:not(:first-child){margin-top:3px}@media (min-width: 1000px){.nas-tab__label:not(:first-child){margin-top:0}}.nas-tab__label--selected{pointer-events:none;color:#003251;background-color:#e3e3e3;font-family:Apercu,Helvetica Neue,Helvetica,Arial,sans-serif;font-weight:700}@media (min-width: 1000px){.nas-tab__label--selected:before{content:\"\";display:block;position:absolute;height:3px;top:-6px;left:0;width:100%;background-color:#d81939}}.nas-tab__label:focus{box-shadow:inset 0 0 2px #c3c3c3,inset 0 0 2px 3px #3b99fc}.nas-tab__label:hover{background-color:#002238;color:#fff}@media (min-width: 1000px){.nas-tab__label{order:1;width:auto;margin-right:3px}}.nas-tab__content{display:none;padding:12px 12px 24px;background-color:#e3e3e3;width:100%;animation:fade-in .3s cubic-bezier(0,0,.1,1);outline:none;z-index:2}.nas-tab__content--selected{display:block}@media (min-width: 1000px){.nas-tab__content{order:99;padding:24px
|
|
104
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: TabComponent, selector: "nas-tab", inputs: { icon: "icon", label: "label", shadowless: "shadowless", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, outputs: { tabClick: "tabClick", focusOnNext: "focusOnNext", focusOnPrevious: "focusOnPrevious" }, viewQueries: [{ propertyName: "tab", first: true, predicate: ["tab"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<a #tab\n role=\"tab\"\n [nasClass]=\"getClass('label', [selected && 'selected'])\"\n [id]=\"getLabelId()\"\n [attr.tabIndex]=\"getTabIndex()\"\n [attr.aria-posinset]=\"index + 1\"\n [attr.aria-setsize]=\"size\"\n [attr.aria-controls]=\"getTabContentId()\"\n [attr.aria-selected]=\"selected\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-labelledby]=\"(!ariaLabel && ariaLabelledby) ? ariaLabelledby : null\"\n (click)=\"onTabClick()\"\n (keyup.arrowright)=\"onArrowRightClick()\"\n (keyup.arrowleft)=\"onArrowLeftClick()\">\n <nas-icon *ngIf=\"icon\"\n [icon]=\"getIcon()\"></nas-icon>\n {{label}}\n <ng-container *ngIf=\"displayDropdownIcon()\">\n <nas-icon [nasClass]=\"getDropdownClass()\"\n [type]=\"getDropdownIconType()\"></nas-icon>\n </ng-container>\n</a>\n<div [nasClass]=\"getContentClass()\"\n [id]=\"getTabContentId()\"\n [attr.aria-labelledby]=\"getLabelId()\">\n <ng-content></ng-content>\n</div>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-tab__label{color:#fff;background:#003251;font-size:18px;line-height:26px;border-bottom:none;width:100%;position:relative;z-index:1;outline:none;padding:10px 24px 12px}.nas-tab__label:not(:first-child){margin-top:3px}@media (min-width: 1000px){.nas-tab__label:not(:first-child){margin-top:0}}.nas-tab__label--selected{pointer-events:none;color:#003251;background-color:#e3e3e3;font-family:Apercu,Helvetica Neue,Helvetica,Arial,sans-serif;font-weight:700}@media (min-width: 1000px){.nas-tab__label--selected:before{content:\"\";display:block;position:absolute;height:3px;top:-6px;left:0;width:100%;background-color:#d81939}}.nas-tab__label:focus{box-shadow:inset 0 0 2px #c3c3c3,inset 0 0 2px 3px #3b99fc}.nas-tab__label:hover{background-color:#002238;color:#fff}@media (min-width: 1000px){.nas-tab__label{order:1;width:auto;margin-right:3px}}.nas-tab__content{display:none;padding:12px 12px 24px;background-color:#e3e3e3;width:100%;animation:fade-in .3s cubic-bezier(0,0,.1,1);outline:none;z-index:2}.nas-tab__content--selected{display:block}@media (min-width: 1000px){.nas-tab__content{order:99;padding:24px}.nas-tab__content:not(.nas-tab__content--shadowless){box-shadow:0 0 30px #002a3a80}}.nas-tab__dropdown::ng-deep span{display:block;position:absolute;width:24px;height:24px;top:0;right:12px;margin-top:14px;border-radius:50%;background-position:center center;background-color:#002238;transition:transform .3s cubic-bezier(0,0,.1,1)}@media (min-width: 1000px){.nas-tab__dropdown::ng-deep span{display:none}}.nas-tab__dropdown--selected::ng-deep span{transform:rotate(-180deg);background-color:#fff}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NasClassDirective, selector: "[nasClass]", inputs: ["nasClass", "attr.class"] }, { kind: "component", type: i3.IconComponent, selector: "nas-icon", inputs: ["icon", "type", "isIndicator", "lightCircularBackground", "cssClass"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
105
105
|
}
|
|
106
106
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: TabComponent, decorators: [{
|
|
107
107
|
type: Component,
|
|
108
|
-
args: [{ selector: 'nas-tab', encapsulation: ViewEncapsulation.None, template: "<a #tab\n role=\"tab\"\n [nasClass]=\"getClass('label', [selected && 'selected'])\"\n [id]=\"getLabelId()\"\n [attr.tabIndex]=\"getTabIndex()\"\n [attr.aria-posinset]=\"index + 1\"\n [attr.aria-setsize]=\"size\"\n [attr.aria-controls]=\"getTabContentId()\"\n [attr.aria-selected]=\"selected\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-labelledby]=\"(!ariaLabel && ariaLabelledby) ? ariaLabelledby : null\"\n (click)=\"onTabClick()\"\n (keyup.arrowright)=\"onArrowRightClick()\"\n (keyup.arrowleft)=\"onArrowLeftClick()\">\n <nas-icon *ngIf=\"icon\"\n [icon]=\"getIcon()\"></nas-icon>\n {{label}}\n <ng-container *ngIf=\"displayDropdownIcon()\">\n <nas-icon [nasClass]=\"getDropdownClass()\"\n [type]=\"getDropdownIconType()\"></nas-icon>\n </ng-container>\n</a>\n<div [nasClass]=\"getContentClass()\"\n [id]=\"getTabContentId()\"\n [attr.aria-labelledby]=\"getLabelId()\">\n <ng-content></ng-content>\n</div>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-tab__label{color:#fff;background:#003251;font-size:18px;line-height:26px;border-bottom:none;width:100%;position:relative;z-index:1;outline:none;padding:10px 24px 12px}.nas-tab__label:not(:first-child){margin-top:3px}@media (min-width: 1000px){.nas-tab__label:not(:first-child){margin-top:0}}.nas-tab__label--selected{pointer-events:none;color:#003251;background-color:#e3e3e3;font-family:Apercu,Helvetica Neue,Helvetica,Arial,sans-serif;font-weight:700}@media (min-width: 1000px){.nas-tab__label--selected:before{content:\"\";display:block;position:absolute;height:3px;top:-6px;left:0;width:100%;background-color:#d81939}}.nas-tab__label:focus{box-shadow:inset 0 0 2px #c3c3c3,inset 0 0 2px 3px #3b99fc}.nas-tab__label:hover{background-color:#002238;color:#fff}@media (min-width: 1000px){.nas-tab__label{order:1;width:auto;margin-right:3px}}.nas-tab__content{display:none;padding:12px 12px 24px;background-color:#e3e3e3;width:100%;animation:fade-in .3s cubic-bezier(0,0,.1,1);outline:none;z-index:2}.nas-tab__content--selected{display:block}@media (min-width: 1000px){.nas-tab__content{order:99;padding:24px
|
|
108
|
+
args: [{ selector: 'nas-tab', encapsulation: ViewEncapsulation.None, template: "<a #tab\n role=\"tab\"\n [nasClass]=\"getClass('label', [selected && 'selected'])\"\n [id]=\"getLabelId()\"\n [attr.tabIndex]=\"getTabIndex()\"\n [attr.aria-posinset]=\"index + 1\"\n [attr.aria-setsize]=\"size\"\n [attr.aria-controls]=\"getTabContentId()\"\n [attr.aria-selected]=\"selected\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-labelledby]=\"(!ariaLabel && ariaLabelledby) ? ariaLabelledby : null\"\n (click)=\"onTabClick()\"\n (keyup.arrowright)=\"onArrowRightClick()\"\n (keyup.arrowleft)=\"onArrowLeftClick()\">\n <nas-icon *ngIf=\"icon\"\n [icon]=\"getIcon()\"></nas-icon>\n {{label}}\n <ng-container *ngIf=\"displayDropdownIcon()\">\n <nas-icon [nasClass]=\"getDropdownClass()\"\n [type]=\"getDropdownIconType()\"></nas-icon>\n </ng-container>\n</a>\n<div [nasClass]=\"getContentClass()\"\n [id]=\"getTabContentId()\"\n [attr.aria-labelledby]=\"getLabelId()\">\n <ng-content></ng-content>\n</div>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-tab__label{color:#fff;background:#003251;font-size:18px;line-height:26px;border-bottom:none;width:100%;position:relative;z-index:1;outline:none;padding:10px 24px 12px}.nas-tab__label:not(:first-child){margin-top:3px}@media (min-width: 1000px){.nas-tab__label:not(:first-child){margin-top:0}}.nas-tab__label--selected{pointer-events:none;color:#003251;background-color:#e3e3e3;font-family:Apercu,Helvetica Neue,Helvetica,Arial,sans-serif;font-weight:700}@media (min-width: 1000px){.nas-tab__label--selected:before{content:\"\";display:block;position:absolute;height:3px;top:-6px;left:0;width:100%;background-color:#d81939}}.nas-tab__label:focus{box-shadow:inset 0 0 2px #c3c3c3,inset 0 0 2px 3px #3b99fc}.nas-tab__label:hover{background-color:#002238;color:#fff}@media (min-width: 1000px){.nas-tab__label{order:1;width:auto;margin-right:3px}}.nas-tab__content{display:none;padding:12px 12px 24px;background-color:#e3e3e3;width:100%;animation:fade-in .3s cubic-bezier(0,0,.1,1);outline:none;z-index:2}.nas-tab__content--selected{display:block}@media (min-width: 1000px){.nas-tab__content{order:99;padding:24px}.nas-tab__content:not(.nas-tab__content--shadowless){box-shadow:0 0 30px #002a3a80}}.nas-tab__dropdown::ng-deep span{display:block;position:absolute;width:24px;height:24px;top:0;right:12px;margin-top:14px;border-radius:50%;background-position:center center;background-color:#002238;transition:transform .3s cubic-bezier(0,0,.1,1)}@media (min-width: 1000px){.nas-tab__dropdown::ng-deep span{display:none}}.nas-tab__dropdown--selected::ng-deep span{transform:rotate(-180deg);background-color:#fff}\n"] }]
|
|
109
109
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { tab: [{
|
|
110
110
|
type: ViewChild,
|
|
111
111
|
args: ['tab']
|
|
@@ -10072,11 +10072,11 @@ class TabComponent extends NasComponentBase {
|
|
|
10072
10072
|
]);
|
|
10073
10073
|
}
|
|
10074
10074
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: TabComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
10075
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: TabComponent, selector: "nas-tab", inputs: { icon: "icon", label: "label", shadowless: "shadowless", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, outputs: { tabClick: "tabClick", focusOnNext: "focusOnNext", focusOnPrevious: "focusOnPrevious" }, viewQueries: [{ propertyName: "tab", first: true, predicate: ["tab"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<a #tab\n role=\"tab\"\n [nasClass]=\"getClass('label', [selected && 'selected'])\"\n [id]=\"getLabelId()\"\n [attr.tabIndex]=\"getTabIndex()\"\n [attr.aria-posinset]=\"index + 1\"\n [attr.aria-setsize]=\"size\"\n [attr.aria-controls]=\"getTabContentId()\"\n [attr.aria-selected]=\"selected\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-labelledby]=\"(!ariaLabel && ariaLabelledby) ? ariaLabelledby : null\"\n (click)=\"onTabClick()\"\n (keyup.arrowright)=\"onArrowRightClick()\"\n (keyup.arrowleft)=\"onArrowLeftClick()\">\n <nas-icon *ngIf=\"icon\"\n [icon]=\"getIcon()\"></nas-icon>\n {{label}}\n <ng-container *ngIf=\"displayDropdownIcon()\">\n <nas-icon [nasClass]=\"getDropdownClass()\"\n [type]=\"getDropdownIconType()\"></nas-icon>\n </ng-container>\n</a>\n<div [nasClass]=\"getContentClass()\"\n [id]=\"getTabContentId()\"\n [attr.aria-labelledby]=\"getLabelId()\">\n <ng-content></ng-content>\n</div>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-tab__label{color:#fff;background:#003251;font-size:18px;line-height:26px;border-bottom:none;width:100%;position:relative;z-index:1;outline:none;padding:10px 24px 12px}.nas-tab__label:not(:first-child){margin-top:3px}@media (min-width: 1000px){.nas-tab__label:not(:first-child){margin-top:0}}.nas-tab__label--selected{pointer-events:none;color:#003251;background-color:#e3e3e3;font-family:Apercu,Helvetica Neue,Helvetica,Arial,sans-serif;font-weight:700}@media (min-width: 1000px){.nas-tab__label--selected:before{content:\"\";display:block;position:absolute;height:3px;top:-6px;left:0;width:100%;background-color:#d81939}}.nas-tab__label:focus{box-shadow:inset 0 0 2px #c3c3c3,inset 0 0 2px 3px #3b99fc}.nas-tab__label:hover{background-color:#002238;color:#fff}@media (min-width: 1000px){.nas-tab__label{order:1;width:auto;margin-right:3px}}.nas-tab__content{display:none;padding:12px 12px 24px;background-color:#e3e3e3;width:100%;animation:fade-in .3s cubic-bezier(0,0,.1,1);outline:none;z-index:2}.nas-tab__content--selected{display:block}@media (min-width: 1000px){.nas-tab__content{order:99;padding:24px
|
|
10075
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: TabComponent, selector: "nas-tab", inputs: { icon: "icon", label: "label", shadowless: "shadowless", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, outputs: { tabClick: "tabClick", focusOnNext: "focusOnNext", focusOnPrevious: "focusOnPrevious" }, viewQueries: [{ propertyName: "tab", first: true, predicate: ["tab"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<a #tab\n role=\"tab\"\n [nasClass]=\"getClass('label', [selected && 'selected'])\"\n [id]=\"getLabelId()\"\n [attr.tabIndex]=\"getTabIndex()\"\n [attr.aria-posinset]=\"index + 1\"\n [attr.aria-setsize]=\"size\"\n [attr.aria-controls]=\"getTabContentId()\"\n [attr.aria-selected]=\"selected\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-labelledby]=\"(!ariaLabel && ariaLabelledby) ? ariaLabelledby : null\"\n (click)=\"onTabClick()\"\n (keyup.arrowright)=\"onArrowRightClick()\"\n (keyup.arrowleft)=\"onArrowLeftClick()\">\n <nas-icon *ngIf=\"icon\"\n [icon]=\"getIcon()\"></nas-icon>\n {{label}}\n <ng-container *ngIf=\"displayDropdownIcon()\">\n <nas-icon [nasClass]=\"getDropdownClass()\"\n [type]=\"getDropdownIconType()\"></nas-icon>\n </ng-container>\n</a>\n<div [nasClass]=\"getContentClass()\"\n [id]=\"getTabContentId()\"\n [attr.aria-labelledby]=\"getLabelId()\">\n <ng-content></ng-content>\n</div>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-tab__label{color:#fff;background:#003251;font-size:18px;line-height:26px;border-bottom:none;width:100%;position:relative;z-index:1;outline:none;padding:10px 24px 12px}.nas-tab__label:not(:first-child){margin-top:3px}@media (min-width: 1000px){.nas-tab__label:not(:first-child){margin-top:0}}.nas-tab__label--selected{pointer-events:none;color:#003251;background-color:#e3e3e3;font-family:Apercu,Helvetica Neue,Helvetica,Arial,sans-serif;font-weight:700}@media (min-width: 1000px){.nas-tab__label--selected:before{content:\"\";display:block;position:absolute;height:3px;top:-6px;left:0;width:100%;background-color:#d81939}}.nas-tab__label:focus{box-shadow:inset 0 0 2px #c3c3c3,inset 0 0 2px 3px #3b99fc}.nas-tab__label:hover{background-color:#002238;color:#fff}@media (min-width: 1000px){.nas-tab__label{order:1;width:auto;margin-right:3px}}.nas-tab__content{display:none;padding:12px 12px 24px;background-color:#e3e3e3;width:100%;animation:fade-in .3s cubic-bezier(0,0,.1,1);outline:none;z-index:2}.nas-tab__content--selected{display:block}@media (min-width: 1000px){.nas-tab__content{order:99;padding:24px}.nas-tab__content:not(.nas-tab__content--shadowless){box-shadow:0 0 30px #002a3a80}}.nas-tab__dropdown::ng-deep span{display:block;position:absolute;width:24px;height:24px;top:0;right:12px;margin-top:14px;border-radius:50%;background-position:center center;background-color:#002238;transition:transform .3s cubic-bezier(0,0,.1,1)}@media (min-width: 1000px){.nas-tab__dropdown::ng-deep span{display:none}}.nas-tab__dropdown--selected::ng-deep span{transform:rotate(-180deg);background-color:#fff}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NasClassDirective, selector: "[nasClass]", inputs: ["nasClass", "attr.class"] }, { kind: "component", type: IconComponent, selector: "nas-icon", inputs: ["icon", "type", "isIndicator", "lightCircularBackground", "cssClass"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
10076
10076
|
}
|
|
10077
10077
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: TabComponent, decorators: [{
|
|
10078
10078
|
type: Component,
|
|
10079
|
-
args: [{ selector: 'nas-tab', encapsulation: ViewEncapsulation.None, template: "<a #tab\n role=\"tab\"\n [nasClass]=\"getClass('label', [selected && 'selected'])\"\n [id]=\"getLabelId()\"\n [attr.tabIndex]=\"getTabIndex()\"\n [attr.aria-posinset]=\"index + 1\"\n [attr.aria-setsize]=\"size\"\n [attr.aria-controls]=\"getTabContentId()\"\n [attr.aria-selected]=\"selected\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-labelledby]=\"(!ariaLabel && ariaLabelledby) ? ariaLabelledby : null\"\n (click)=\"onTabClick()\"\n (keyup.arrowright)=\"onArrowRightClick()\"\n (keyup.arrowleft)=\"onArrowLeftClick()\">\n <nas-icon *ngIf=\"icon\"\n [icon]=\"getIcon()\"></nas-icon>\n {{label}}\n <ng-container *ngIf=\"displayDropdownIcon()\">\n <nas-icon [nasClass]=\"getDropdownClass()\"\n [type]=\"getDropdownIconType()\"></nas-icon>\n </ng-container>\n</a>\n<div [nasClass]=\"getContentClass()\"\n [id]=\"getTabContentId()\"\n [attr.aria-labelledby]=\"getLabelId()\">\n <ng-content></ng-content>\n</div>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-tab__label{color:#fff;background:#003251;font-size:18px;line-height:26px;border-bottom:none;width:100%;position:relative;z-index:1;outline:none;padding:10px 24px 12px}.nas-tab__label:not(:first-child){margin-top:3px}@media (min-width: 1000px){.nas-tab__label:not(:first-child){margin-top:0}}.nas-tab__label--selected{pointer-events:none;color:#003251;background-color:#e3e3e3;font-family:Apercu,Helvetica Neue,Helvetica,Arial,sans-serif;font-weight:700}@media (min-width: 1000px){.nas-tab__label--selected:before{content:\"\";display:block;position:absolute;height:3px;top:-6px;left:0;width:100%;background-color:#d81939}}.nas-tab__label:focus{box-shadow:inset 0 0 2px #c3c3c3,inset 0 0 2px 3px #3b99fc}.nas-tab__label:hover{background-color:#002238;color:#fff}@media (min-width: 1000px){.nas-tab__label{order:1;width:auto;margin-right:3px}}.nas-tab__content{display:none;padding:12px 12px 24px;background-color:#e3e3e3;width:100%;animation:fade-in .3s cubic-bezier(0,0,.1,1);outline:none;z-index:2}.nas-tab__content--selected{display:block}@media (min-width: 1000px){.nas-tab__content{order:99;padding:24px
|
|
10079
|
+
args: [{ selector: 'nas-tab', encapsulation: ViewEncapsulation.None, template: "<a #tab\n role=\"tab\"\n [nasClass]=\"getClass('label', [selected && 'selected'])\"\n [id]=\"getLabelId()\"\n [attr.tabIndex]=\"getTabIndex()\"\n [attr.aria-posinset]=\"index + 1\"\n [attr.aria-setsize]=\"size\"\n [attr.aria-controls]=\"getTabContentId()\"\n [attr.aria-selected]=\"selected\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-labelledby]=\"(!ariaLabel && ariaLabelledby) ? ariaLabelledby : null\"\n (click)=\"onTabClick()\"\n (keyup.arrowright)=\"onArrowRightClick()\"\n (keyup.arrowleft)=\"onArrowLeftClick()\">\n <nas-icon *ngIf=\"icon\"\n [icon]=\"getIcon()\"></nas-icon>\n {{label}}\n <ng-container *ngIf=\"displayDropdownIcon()\">\n <nas-icon [nasClass]=\"getDropdownClass()\"\n [type]=\"getDropdownIconType()\"></nas-icon>\n </ng-container>\n</a>\n<div [nasClass]=\"getContentClass()\"\n [id]=\"getTabContentId()\"\n [attr.aria-labelledby]=\"getLabelId()\">\n <ng-content></ng-content>\n</div>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-tab__label{color:#fff;background:#003251;font-size:18px;line-height:26px;border-bottom:none;width:100%;position:relative;z-index:1;outline:none;padding:10px 24px 12px}.nas-tab__label:not(:first-child){margin-top:3px}@media (min-width: 1000px){.nas-tab__label:not(:first-child){margin-top:0}}.nas-tab__label--selected{pointer-events:none;color:#003251;background-color:#e3e3e3;font-family:Apercu,Helvetica Neue,Helvetica,Arial,sans-serif;font-weight:700}@media (min-width: 1000px){.nas-tab__label--selected:before{content:\"\";display:block;position:absolute;height:3px;top:-6px;left:0;width:100%;background-color:#d81939}}.nas-tab__label:focus{box-shadow:inset 0 0 2px #c3c3c3,inset 0 0 2px 3px #3b99fc}.nas-tab__label:hover{background-color:#002238;color:#fff}@media (min-width: 1000px){.nas-tab__label{order:1;width:auto;margin-right:3px}}.nas-tab__content{display:none;padding:12px 12px 24px;background-color:#e3e3e3;width:100%;animation:fade-in .3s cubic-bezier(0,0,.1,1);outline:none;z-index:2}.nas-tab__content--selected{display:block}@media (min-width: 1000px){.nas-tab__content{order:99;padding:24px}.nas-tab__content:not(.nas-tab__content--shadowless){box-shadow:0 0 30px #002a3a80}}.nas-tab__dropdown::ng-deep span{display:block;position:absolute;width:24px;height:24px;top:0;right:12px;margin-top:14px;border-radius:50%;background-position:center center;background-color:#002238;transition:transform .3s cubic-bezier(0,0,.1,1)}@media (min-width: 1000px){.nas-tab__dropdown::ng-deep span{display:none}}.nas-tab__dropdown--selected::ng-deep span{transform:rotate(-180deg);background-color:#fff}\n"] }]
|
|
10080
10080
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { tab: [{
|
|
10081
10081
|
type: ViewChild,
|
|
10082
10082
|
args: ['tab']
|
|
@@ -12207,11 +12207,11 @@ class MicroButtonComponent extends NasComponentBase {
|
|
|
12207
12207
|
return classes;
|
|
12208
12208
|
}
|
|
12209
12209
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: MicroButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
12210
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: MicroButtonComponent, selector: "nas-micro-button", inputs: { model: "model", icon: "icon" }, usesInheritance: true, ngImport: i0, template: "<div class=\"nas-micro-button\">\n <a [nasClass]=\"getClasses('link')\" [href]=\"model.href\" *ngIf=\"model\">\n <div class=\"icon\" *ngIf=\"_icon.length > 0\">\n <nas-icon [icon]=\"_icon\" [type]=\"'xsmall'\" [lightCircularBackground]=\"true\"\n [nasClass]=\"getClasses('nas-icon')\"></nas-icon>\n </div>\n <div [nasClass]=\"getClasses('text-container')\">\n <div class=\"text\" [nasClass]=\"_icon.length > 0 ? getClasses('text-space') : getClasses('text')\">\n {{ model.text }}\n </div>\n </div>\n </a>\n</div>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}:host ::ng-deep .nas-micro-button .icon nas-icon .nas-icon-xsmall{display:inline-block;margin-top:
|
|
12210
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: MicroButtonComponent, selector: "nas-micro-button", inputs: { model: "model", icon: "icon" }, usesInheritance: true, ngImport: i0, template: "<div class=\"nas-micro-button\">\n <a [nasClass]=\"getClasses('link')\" [href]=\"model.href\" *ngIf=\"model\">\n <div class=\"icon\" *ngIf=\"_icon.length > 0\">\n <nas-icon [icon]=\"_icon\" [type]=\"'xsmall'\" [lightCircularBackground]=\"true\"\n [nasClass]=\"getClasses('nas-icon')\"></nas-icon>\n </div>\n <div [nasClass]=\"getClasses('text-container')\">\n <div class=\"text\" [nasClass]=\"_icon.length > 0 ? getClasses('text-space') : getClasses('text')\">\n {{ model.text }}\n </div>\n </div>\n </a>\n</div>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}:host ::ng-deep .nas-micro-button .icon nas-icon .nas-icon-xsmall{display:inline-block;margin-top:4px}.nas-micro-button{display:flex;background:#003251;height:32px;width:-webkit-max-content;width:max-content;flex-direction:row;justify-content:center;border-radius:4px;padding:8px 12px;align-items:center}.nas-micro-button__text-container{display:flex;justify-content:center;align-items:center}.nas-micro-button__text{color:#fff;text-align:center;font-family:Apercu;font-size:12px;font-style:normal;font-weight:500;line-height:16px}.nas-micro-button__text-space{color:#fff;text-align:center;font-family:Apercu;font-size:12px;font-style:normal;font-weight:500;line-height:16px;padding:0 0 1px 8px}.nas-micro-button__link{border-bottom:none;display:flex;align-items:center}.nas-micro-button:hover{background:#0A2033}.nas-micro-button:focus{border:2px solid #0978E8;background:#003251}.nas-micro-button:active{background:#071622}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NasClassDirective, selector: "[nasClass]", inputs: ["nasClass", "attr.class"] }, { kind: "component", type: IconComponent, selector: "nas-icon", inputs: ["icon", "type", "isIndicator", "lightCircularBackground", "cssClass"] }] }); }
|
|
12211
12211
|
}
|
|
12212
12212
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: MicroButtonComponent, decorators: [{
|
|
12213
12213
|
type: Component,
|
|
12214
|
-
args: [{ selector: 'nas-micro-button', template: "<div class=\"nas-micro-button\">\n <a [nasClass]=\"getClasses('link')\" [href]=\"model.href\" *ngIf=\"model\">\n <div class=\"icon\" *ngIf=\"_icon.length > 0\">\n <nas-icon [icon]=\"_icon\" [type]=\"'xsmall'\" [lightCircularBackground]=\"true\"\n [nasClass]=\"getClasses('nas-icon')\"></nas-icon>\n </div>\n <div [nasClass]=\"getClasses('text-container')\">\n <div class=\"text\" [nasClass]=\"_icon.length > 0 ? getClasses('text-space') : getClasses('text')\">\n {{ model.text }}\n </div>\n </div>\n </a>\n</div>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}:host ::ng-deep .nas-micro-button .icon nas-icon .nas-icon-xsmall{display:inline-block;margin-top:
|
|
12214
|
+
args: [{ selector: 'nas-micro-button', template: "<div class=\"nas-micro-button\">\n <a [nasClass]=\"getClasses('link')\" [href]=\"model.href\" *ngIf=\"model\">\n <div class=\"icon\" *ngIf=\"_icon.length > 0\">\n <nas-icon [icon]=\"_icon\" [type]=\"'xsmall'\" [lightCircularBackground]=\"true\"\n [nasClass]=\"getClasses('nas-icon')\"></nas-icon>\n </div>\n <div [nasClass]=\"getClasses('text-container')\">\n <div class=\"text\" [nasClass]=\"_icon.length > 0 ? getClasses('text-space') : getClasses('text')\">\n {{ model.text }}\n </div>\n </div>\n </a>\n</div>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}:host ::ng-deep .nas-micro-button .icon nas-icon .nas-icon-xsmall{display:inline-block;margin-top:4px}.nas-micro-button{display:flex;background:#003251;height:32px;width:-webkit-max-content;width:max-content;flex-direction:row;justify-content:center;border-radius:4px;padding:8px 12px;align-items:center}.nas-micro-button__text-container{display:flex;justify-content:center;align-items:center}.nas-micro-button__text{color:#fff;text-align:center;font-family:Apercu;font-size:12px;font-style:normal;font-weight:500;line-height:16px}.nas-micro-button__text-space{color:#fff;text-align:center;font-family:Apercu;font-size:12px;font-style:normal;font-weight:500;line-height:16px;padding:0 0 1px 8px}.nas-micro-button__link{border-bottom:none;display:flex;align-items:center}.nas-micro-button:hover{background:#0A2033}.nas-micro-button:focus{border:2px solid #0978E8;background:#003251}.nas-micro-button:active{background:#071622}\n"] }]
|
|
12215
12215
|
}], ctorParameters: function () { return []; }, propDecorators: { model: [{
|
|
12216
12216
|
type: Input
|
|
12217
12217
|
}], icon: [{
|
|
@@ -12268,11 +12268,11 @@ class CampaignHeaderComponent extends NasComponentBase {
|
|
|
12268
12268
|
return 'var(--primary-base-color)';
|
|
12269
12269
|
}
|
|
12270
12270
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: CampaignHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
12271
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: CampaignHeaderComponent, selector: "nas-campaign-header", inputs: { title: "title", source: "source", description: "description", microButtonModel: "microButtonModel", gradient: "gradient" }, usesInheritance: true, ngImport: i0, template: "<div>\n <div *ngIf=\"microButtonModel\" [nasClass]=\"getClass('micro-button')\">\n <nas-micro-button icon=\"arrow-left\" [model]=\"microButtonModel\"></nas-micro-button>\n </div>\n <header [nasClass]=\"gradient ? getClass('gradient-header') : getClass('header')\"\n [style.--bg-image]=\"getBackgroundImage()\" [style.background-color]=\"getBackgroundColor()\">\n <div [nasClass]=\"getClass('content')\">\n <h1 [nasClass]=\"getClass('title')\">{{ title }}</h1>\n <div [nasClass]=\"getClass('description')\">\n <ng-container *ngIf=\"description; else descriptionContent\">{{description}}</ng-container>\n <ng-template #descriptionContent>\n <ng-content select=\"[description]\"></ng-content>\n </ng-template>\n </div>\n </div>\n </header>\n</div>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}:host{--primary-base-color: #d81939}.nas-campaign-header{max-width:820px;margin:24px auto 36px}.nas-campaign-header__header{display:flex;align-items:flex-end;height:250px;background-image:var(--bg-image, none);background-size:cover;background-position:center;background-repeat:no-repeat}@media (min-width: 640px){.nas-campaign-header__header{padding-left:0;background-size:cover;height:300px}}.nas-campaign-header__gradient-header{display:flex;align-items:flex-end;height:250px;background-image:var(--bg-image, none);background-size:cover;background-position:center;background-repeat:no-repeat;background:linear-gradient(180deg,rgba(0,50,81,0) 0%,rgba(0,50,81,.8) 100%),var(--bg-image, none),lightgray 50%/cover no-repeat}@media (min-width: 640px){.nas-campaign-header__gradient-header{padding-left:0;background-size:cover;height:300px}}.nas-campaign-header__micro-button{position:absolute;
|
|
12271
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: CampaignHeaderComponent, selector: "nas-campaign-header", inputs: { title: "title", source: "source", description: "description", microButtonModel: "microButtonModel", gradient: "gradient" }, usesInheritance: true, ngImport: i0, template: "<div>\n <div *ngIf=\"microButtonModel\" [nasClass]=\"getClass('micro-button')\">\n <nas-micro-button icon=\"arrow-left\" [model]=\"microButtonModel\"></nas-micro-button>\n </div>\n <header [nasClass]=\"gradient ? getClass('gradient-header') : getClass('header')\"\n [style.--bg-image]=\"getBackgroundImage()\" [style.background-color]=\"getBackgroundColor()\">\n <div [nasClass]=\"getClass('content')\">\n <h1 [nasClass]=\"getClass('title')\">{{ title }}</h1>\n <div [nasClass]=\"getClass('description')\">\n <ng-container *ngIf=\"description; else descriptionContent\">{{description}}</ng-container>\n <ng-template #descriptionContent>\n <ng-content select=\"[description]\"></ng-content>\n </ng-template>\n </div>\n </div>\n </header>\n</div>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}:host{--primary-base-color: #d81939}.nas-campaign-header{max-width:820px;margin:24px auto 36px}.nas-campaign-header__header{display:flex;align-items:flex-end;height:250px;background-image:var(--bg-image, none);background-size:cover;background-position:center;background-repeat:no-repeat}@media (min-width: 640px){.nas-campaign-header__header{padding-left:0;background-size:cover;height:300px}}.nas-campaign-header__gradient-header{display:flex;align-items:flex-end;height:250px;background-image:var(--bg-image, none);background-size:cover;background-position:center;background-repeat:no-repeat;background:linear-gradient(180deg,rgba(0,50,81,0) 0%,rgba(0,50,81,.8) 100%),var(--bg-image, none),lightgray 50%/cover no-repeat}@media (min-width: 640px){.nas-campaign-header__gradient-header{padding-left:0;background-size:cover;height:300px}}.nas-campaign-header__micro-button{position:absolute;padding:16px}@media (min-width: 640px){.nas-campaign-header__micro-button{padding:32px}}.nas-campaign-header__content{flex-grow:2}.nas-campaign-header__title{font-size:28px;color:#fff;padding:0 16px 8px;margin:unset!important}@media (min-width: 640px){.nas-campaign-header__title{font-size:50px;line-height:56px;padding:0 32px 16px}}.nas-campaign-header__description{font-family:Apercu,Helvetica Neue,Helvetica,Arial,sans-serif;color:#fff;font-size:16px;line-height:26px;padding:0 16px 16px}@media (min-width: 640px){.nas-campaign-header__description{padding:0 32px 32px;font-size:18px;line-height:26px}}.nas-campaign-header--small{margin-bottom:24px}.nas-campaign-header--small .nas-campaign-header__title{font-size:24px;line-height:30px}.nas-campaign-header--small .nas-campaign-header__header{height:auto;background-image:none;border-bottom:2px solid #003251}::ng-deep .nas-micro-button--text{border-bottom:none;font-weight:700}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NasClassDirective, selector: "[nasClass]", inputs: ["nasClass", "attr.class"] }, { kind: "component", type: MicroButtonComponent, selector: "nas-micro-button", inputs: ["model", "icon"] }] }); }
|
|
12272
12272
|
}
|
|
12273
12273
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: CampaignHeaderComponent, decorators: [{
|
|
12274
12274
|
type: Component,
|
|
12275
|
-
args: [{ selector: 'nas-campaign-header', template: "<div>\n <div *ngIf=\"microButtonModel\" [nasClass]=\"getClass('micro-button')\">\n <nas-micro-button icon=\"arrow-left\" [model]=\"microButtonModel\"></nas-micro-button>\n </div>\n <header [nasClass]=\"gradient ? getClass('gradient-header') : getClass('header')\"\n [style.--bg-image]=\"getBackgroundImage()\" [style.background-color]=\"getBackgroundColor()\">\n <div [nasClass]=\"getClass('content')\">\n <h1 [nasClass]=\"getClass('title')\">{{ title }}</h1>\n <div [nasClass]=\"getClass('description')\">\n <ng-container *ngIf=\"description; else descriptionContent\">{{description}}</ng-container>\n <ng-template #descriptionContent>\n <ng-content select=\"[description]\"></ng-content>\n </ng-template>\n </div>\n </div>\n </header>\n</div>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}:host{--primary-base-color: #d81939}.nas-campaign-header{max-width:820px;margin:24px auto 36px}.nas-campaign-header__header{display:flex;align-items:flex-end;height:250px;background-image:var(--bg-image, none);background-size:cover;background-position:center;background-repeat:no-repeat}@media (min-width: 640px){.nas-campaign-header__header{padding-left:0;background-size:cover;height:300px}}.nas-campaign-header__gradient-header{display:flex;align-items:flex-end;height:250px;background-image:var(--bg-image, none);background-size:cover;background-position:center;background-repeat:no-repeat;background:linear-gradient(180deg,rgba(0,50,81,0) 0%,rgba(0,50,81,.8) 100%),var(--bg-image, none),lightgray 50%/cover no-repeat}@media (min-width: 640px){.nas-campaign-header__gradient-header{padding-left:0;background-size:cover;height:300px}}.nas-campaign-header__micro-button{position:absolute;
|
|
12275
|
+
args: [{ selector: 'nas-campaign-header', template: "<div>\n <div *ngIf=\"microButtonModel\" [nasClass]=\"getClass('micro-button')\">\n <nas-micro-button icon=\"arrow-left\" [model]=\"microButtonModel\"></nas-micro-button>\n </div>\n <header [nasClass]=\"gradient ? getClass('gradient-header') : getClass('header')\"\n [style.--bg-image]=\"getBackgroundImage()\" [style.background-color]=\"getBackgroundColor()\">\n <div [nasClass]=\"getClass('content')\">\n <h1 [nasClass]=\"getClass('title')\">{{ title }}</h1>\n <div [nasClass]=\"getClass('description')\">\n <ng-container *ngIf=\"description; else descriptionContent\">{{description}}</ng-container>\n <ng-template #descriptionContent>\n <ng-content select=\"[description]\"></ng-content>\n </ng-template>\n </div>\n </div>\n </header>\n</div>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}:host{--primary-base-color: #d81939}.nas-campaign-header{max-width:820px;margin:24px auto 36px}.nas-campaign-header__header{display:flex;align-items:flex-end;height:250px;background-image:var(--bg-image, none);background-size:cover;background-position:center;background-repeat:no-repeat}@media (min-width: 640px){.nas-campaign-header__header{padding-left:0;background-size:cover;height:300px}}.nas-campaign-header__gradient-header{display:flex;align-items:flex-end;height:250px;background-image:var(--bg-image, none);background-size:cover;background-position:center;background-repeat:no-repeat;background:linear-gradient(180deg,rgba(0,50,81,0) 0%,rgba(0,50,81,.8) 100%),var(--bg-image, none),lightgray 50%/cover no-repeat}@media (min-width: 640px){.nas-campaign-header__gradient-header{padding-left:0;background-size:cover;height:300px}}.nas-campaign-header__micro-button{position:absolute;padding:16px}@media (min-width: 640px){.nas-campaign-header__micro-button{padding:32px}}.nas-campaign-header__content{flex-grow:2}.nas-campaign-header__title{font-size:28px;color:#fff;padding:0 16px 8px;margin:unset!important}@media (min-width: 640px){.nas-campaign-header__title{font-size:50px;line-height:56px;padding:0 32px 16px}}.nas-campaign-header__description{font-family:Apercu,Helvetica Neue,Helvetica,Arial,sans-serif;color:#fff;font-size:16px;line-height:26px;padding:0 16px 16px}@media (min-width: 640px){.nas-campaign-header__description{padding:0 32px 32px;font-size:18px;line-height:26px}}.nas-campaign-header--small{margin-bottom:24px}.nas-campaign-header--small .nas-campaign-header__title{font-size:24px;line-height:30px}.nas-campaign-header--small .nas-campaign-header__header{height:auto;background-image:none;border-bottom:2px solid #003251}::ng-deep .nas-micro-button--text{border-bottom:none;font-weight:700}\n"] }]
|
|
12276
12276
|
}], ctorParameters: function () { return []; }, propDecorators: { title: [{
|
|
12277
12277
|
type: Input
|
|
12278
12278
|
}], source: [{
|