@symphony-talent/component-library 4.71.0 → 4.73.0
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/esm2020/lib/atoms/navigation-link-v2/navigation-link-v2.module.mjs +5 -4
- package/esm2020/lib/atoms/navigation-link-v2/navigation-link.component.mjs +4 -3
- package/esm2020/lib/molecules/additional-information-card/additional-information-card.component.mjs +42 -6
- package/esm2020/lib/molecules/additional-information-card/additional-information-card.model.mjs +2 -2
- package/esm2020/projects/component-library/lib/atoms/navigation-link-v2/navigation-link-v2.module.mjs +5 -4
- package/esm2020/projects/component-library/lib/atoms/navigation-link-v2/navigation-link.component.mjs +4 -3
- package/esm2020/projects/component-library/lib/molecules/additional-information-card/additional-information-card.component.mjs +42 -6
- package/esm2020/projects/component-library/lib/molecules/additional-information-card/additional-information-card.model.mjs +2 -2
- package/fesm2015/symphony-talent-component-library-projects-component-library.mjs +45 -8
- package/fesm2015/symphony-talent-component-library-projects-component-library.mjs.map +1 -1
- package/fesm2015/symphony-talent-component-library.mjs +45 -8
- package/fesm2015/symphony-talent-component-library.mjs.map +1 -1
- package/fesm2020/symphony-talent-component-library-projects-component-library.mjs +45 -8
- package/fesm2020/symphony-talent-component-library-projects-component-library.mjs.map +1 -1
- package/fesm2020/symphony-talent-component-library.mjs +45 -8
- package/fesm2020/symphony-talent-component-library.mjs.map +1 -1
- package/lib/atoms/navigation-link-v2/navigation-link-v2.module.d.ts +2 -1
- package/lib/molecules/additional-information-card/additional-information-card.component.d.ts +9 -1
- package/lib/molecules/additional-information-card/additional-information-card.model.d.ts +2 -2
- package/package.json +1 -1
- package/projects/component-library/lib/atoms/navigation-link-v2/navigation-link-v2.module.d.ts +2 -1
- package/projects/component-library/lib/molecules/additional-information-card/additional-information-card.component.d.ts +9 -1
- package/projects/component-library/lib/molecules/additional-information-card/additional-information-card.model.d.ts +2 -2
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Component, Input, NgModule, EventEmitter, Output, Pipe, Injectable, ViewEncapsulation, ViewChild } from '@angular/core';
|
|
2
|
+
import { Component, Input, NgModule, EventEmitter, Output, Pipe, Injectable, ViewEncapsulation, ViewChild, HostListener } from '@angular/core';
|
|
3
3
|
import * as i1 from '@angular/common';
|
|
4
4
|
import { SlicePipe, CommonModule, DecimalPipe } from '@angular/common';
|
|
5
5
|
import * as i1$1 from 'ngx-bootstrap/dropdown';
|
|
@@ -4413,10 +4413,10 @@ class NavigationLinkV2Component extends NavigationLinkComponent {
|
|
|
4413
4413
|
}
|
|
4414
4414
|
}
|
|
4415
4415
|
NavigationLinkV2Component.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NavigationLinkV2Component, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4416
|
-
NavigationLinkV2Component.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: NavigationLinkV2Component, selector: "symphony-navigation-link-v2", usesInheritance: true, ngImport: i0, template: "<div class=\"v2\">\n <symphony-tooltip-wrapper\n *ngIf=\"!isMenuOpen\"\n [placement]=\"'right'\"\n [tooltipHtml]=\"navigationLinkModel.linkText\"\n [ngClass]=\"{ 'sfx-menu-open': isMenuOpen }\"\n >\n <div class=\"nav-link\">\n <a\n [href]=\"navigationLinkModel.href\"\n [ngClass]=\"{ 'sfx-menu-active': navigationLinkModel.isActive }\"\n (click)=\"onClick()\"\n ><symphony-icon\n [icon]=\"navigationLinkModel.iconClass\"\n [size]=\"'24px'\"\n ></symphony-icon>\n <span>{{ navigationLinkModel.linkText }}</span>\n </a>\n </div>\n </symphony-tooltip-wrapper>\n\n <div\n class=\"nav-link\"\n *ngIf=\"isMenuOpen\"\n [ngClass]=\"{ 'sfx-menu-open': isMenuOpen }\"\n >\n <a\n [href]=\"navigationLinkModel.href\"\n [ngClass]=\"{ 'sfx-menu-active': navigationLinkModel.isActive }\"\n (click)=\"onClick()\"\n ><symphony-icon\n [icon]=\"navigationLinkModel.iconClass\"\n [size]=\"'24px'\"\n ></symphony-icon>\n <span>{{ navigationLinkModel.linkText }}</span>\n </a>\n </div>\n</div>\n", styles: [".v2 .nav-link a{color:#82919f;display:block;text-align:left;text-decoration:none;padding:16px 10px 16px 40px;border-left:5px solid white;transition:all .3s linear 0s}.v2 .nav-link a i{display:inline-block;vertical-align:middle}.v2 .nav-link a span{margin-left:30px;font-size:12px;line-height:1;text-transform:uppercase;vertical-align:middle;font-weight:600;display:none;opacity:0;transition:opacity 1s;font-family:neuzeit_groteskbold,sans-serif}.v2 .nav-link a.sfx-menu-active{color:#814dff;border-left:5px solid #814DFF}.v2 .nav-link a:hover{color:#334860}.v2 symphony-icon{display:inline-block;line-height:.6;vertical-align:middle}.v2 .sfx-menu-open.nav-link{width:280px}.v2 .sfx-menu-open a span{display:inline-block;animation:fade-in .5s forwards}.v2 .sfx-menu-open a:hover{background:#814DFF;color:#fff;border-left-color:#814dff}.v2 .sfx-menu-open a.sfx-menu-active{background:#814DFF;color:#fff}@keyframes fade-in{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}\n"], components: [{ type: TooltipWrapperComponent, selector: "symphony-tooltip-wrapper", inputs: ["placement", "tooltipHtml"] }, { type: IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
|
|
4416
|
+
NavigationLinkV2Component.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: NavigationLinkV2Component, selector: "symphony-navigation-link-v2", usesInheritance: true, ngImport: i0, template: "<div class=\"v2\">\n <symphony-tooltip-wrapper\n *ngIf=\"!isMenuOpen\"\n [placement]=\"'right'\"\n [tooltipHtml]=\"navigationLinkModel.linkText\"\n [ngClass]=\"{ 'sfx-menu-open': isMenuOpen }\"\n >\n <div class=\"nav-link\">\n <a\n [href]=\"navigationLinkModel.href\"\n id=\"navigation-link-{{ navigationLinkModel.linkText | trimId}}\"\n [ngClass]=\"{ 'sfx-menu-active': navigationLinkModel.isActive }\"\n (click)=\"onClick()\"\n ><symphony-icon\n [icon]=\"navigationLinkModel.iconClass\"\n [size]=\"'24px'\"\n ></symphony-icon>\n <span>{{ navigationLinkModel.linkText }}</span>\n </a>\n </div>\n </symphony-tooltip-wrapper>\n\n <div\n class=\"nav-link\"\n *ngIf=\"isMenuOpen\"\n [ngClass]=\"{ 'sfx-menu-open': isMenuOpen }\"\n >\n <a\n id=\"navigation-link-{{ navigationLinkModel.linkText | trimId}}\"\n [href]=\"navigationLinkModel.href\"\n [ngClass]=\"{ 'sfx-menu-active': navigationLinkModel.isActive }\"\n (click)=\"onClick()\"\n ><symphony-icon\n [icon]=\"navigationLinkModel.iconClass\"\n [size]=\"'24px'\"\n ></symphony-icon>\n <span>{{ navigationLinkModel.linkText }}</span>\n </a>\n </div>\n</div>\n", styles: [".v2 .nav-link a{color:#82919f;display:block;text-align:left;text-decoration:none;padding:16px 10px 16px 40px;border-left:5px solid white;transition:all .3s linear 0s}.v2 .nav-link a i{display:inline-block;vertical-align:middle}.v2 .nav-link a span{margin-left:30px;font-size:12px;line-height:1;text-transform:uppercase;vertical-align:middle;font-weight:600;display:none;opacity:0;transition:opacity 1s;font-family:neuzeit_groteskbold,sans-serif}.v2 .nav-link a.sfx-menu-active{color:#814dff;border-left:5px solid #814DFF}.v2 .nav-link a:hover{color:#334860}.v2 symphony-icon{display:inline-block;line-height:.6;vertical-align:middle}.v2 .sfx-menu-open.nav-link{width:280px}.v2 .sfx-menu-open a span{display:inline-block;animation:fade-in .5s forwards}.v2 .sfx-menu-open a:hover{background:#814DFF;color:#fff;border-left-color:#814dff}.v2 .sfx-menu-open a.sfx-menu-active{background:#814DFF;color:#fff}@keyframes fade-in{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}\n"], components: [{ type: TooltipWrapperComponent, selector: "symphony-tooltip-wrapper", inputs: ["placement", "tooltipHtml"] }, { type: IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], pipes: { "trimId": TrimIdPipe } });
|
|
4417
4417
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NavigationLinkV2Component, decorators: [{
|
|
4418
4418
|
type: Component,
|
|
4419
|
-
args: [{ selector: 'symphony-navigation-link-v2', template: "<div class=\"v2\">\n <symphony-tooltip-wrapper\n *ngIf=\"!isMenuOpen\"\n [placement]=\"'right'\"\n [tooltipHtml]=\"navigationLinkModel.linkText\"\n [ngClass]=\"{ 'sfx-menu-open': isMenuOpen }\"\n >\n <div class=\"nav-link\">\n <a\n [href]=\"navigationLinkModel.href\"\n [ngClass]=\"{ 'sfx-menu-active': navigationLinkModel.isActive }\"\n (click)=\"onClick()\"\n ><symphony-icon\n [icon]=\"navigationLinkModel.iconClass\"\n [size]=\"'24px'\"\n ></symphony-icon>\n <span>{{ navigationLinkModel.linkText }}</span>\n </a>\n </div>\n </symphony-tooltip-wrapper>\n\n <div\n class=\"nav-link\"\n *ngIf=\"isMenuOpen\"\n [ngClass]=\"{ 'sfx-menu-open': isMenuOpen }\"\n >\n <a\n [href]=\"navigationLinkModel.href\"\n [ngClass]=\"{ 'sfx-menu-active': navigationLinkModel.isActive }\"\n (click)=\"onClick()\"\n ><symphony-icon\n [icon]=\"navigationLinkModel.iconClass\"\n [size]=\"'24px'\"\n ></symphony-icon>\n <span>{{ navigationLinkModel.linkText }}</span>\n </a>\n </div>\n</div>\n", styles: [".v2 .nav-link a{color:#82919f;display:block;text-align:left;text-decoration:none;padding:16px 10px 16px 40px;border-left:5px solid white;transition:all .3s linear 0s}.v2 .nav-link a i{display:inline-block;vertical-align:middle}.v2 .nav-link a span{margin-left:30px;font-size:12px;line-height:1;text-transform:uppercase;vertical-align:middle;font-weight:600;display:none;opacity:0;transition:opacity 1s;font-family:neuzeit_groteskbold,sans-serif}.v2 .nav-link a.sfx-menu-active{color:#814dff;border-left:5px solid #814DFF}.v2 .nav-link a:hover{color:#334860}.v2 symphony-icon{display:inline-block;line-height:.6;vertical-align:middle}.v2 .sfx-menu-open.nav-link{width:280px}.v2 .sfx-menu-open a span{display:inline-block;animation:fade-in .5s forwards}.v2 .sfx-menu-open a:hover{background:#814DFF;color:#fff;border-left-color:#814dff}.v2 .sfx-menu-open a.sfx-menu-active{background:#814DFF;color:#fff}@keyframes fade-in{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}\n"] }]
|
|
4419
|
+
args: [{ selector: 'symphony-navigation-link-v2', template: "<div class=\"v2\">\n <symphony-tooltip-wrapper\n *ngIf=\"!isMenuOpen\"\n [placement]=\"'right'\"\n [tooltipHtml]=\"navigationLinkModel.linkText\"\n [ngClass]=\"{ 'sfx-menu-open': isMenuOpen }\"\n >\n <div class=\"nav-link\">\n <a\n [href]=\"navigationLinkModel.href\"\n id=\"navigation-link-{{ navigationLinkModel.linkText | trimId}}\"\n [ngClass]=\"{ 'sfx-menu-active': navigationLinkModel.isActive }\"\n (click)=\"onClick()\"\n ><symphony-icon\n [icon]=\"navigationLinkModel.iconClass\"\n [size]=\"'24px'\"\n ></symphony-icon>\n <span>{{ navigationLinkModel.linkText }}</span>\n </a>\n </div>\n </symphony-tooltip-wrapper>\n\n <div\n class=\"nav-link\"\n *ngIf=\"isMenuOpen\"\n [ngClass]=\"{ 'sfx-menu-open': isMenuOpen }\"\n >\n <a\n id=\"navigation-link-{{ navigationLinkModel.linkText | trimId}}\"\n [href]=\"navigationLinkModel.href\"\n [ngClass]=\"{ 'sfx-menu-active': navigationLinkModel.isActive }\"\n (click)=\"onClick()\"\n ><symphony-icon\n [icon]=\"navigationLinkModel.iconClass\"\n [size]=\"'24px'\"\n ></symphony-icon>\n <span>{{ navigationLinkModel.linkText }}</span>\n </a>\n </div>\n</div>\n", styles: [".v2 .nav-link a{color:#82919f;display:block;text-align:left;text-decoration:none;padding:16px 10px 16px 40px;border-left:5px solid white;transition:all .3s linear 0s}.v2 .nav-link a i{display:inline-block;vertical-align:middle}.v2 .nav-link a span{margin-left:30px;font-size:12px;line-height:1;text-transform:uppercase;vertical-align:middle;font-weight:600;display:none;opacity:0;transition:opacity 1s;font-family:neuzeit_groteskbold,sans-serif}.v2 .nav-link a.sfx-menu-active{color:#814dff;border-left:5px solid #814DFF}.v2 .nav-link a:hover{color:#334860}.v2 symphony-icon{display:inline-block;line-height:.6;vertical-align:middle}.v2 .sfx-menu-open.nav-link{width:280px}.v2 .sfx-menu-open a span{display:inline-block;animation:fade-in .5s forwards}.v2 .sfx-menu-open a:hover{background:#814DFF;color:#fff;border-left-color:#814dff}.v2 .sfx-menu-open a.sfx-menu-active{background:#814DFF;color:#fff}@keyframes fade-in{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}\n"] }]
|
|
4420
4420
|
}], ctorParameters: function () { return []; } });
|
|
4421
4421
|
|
|
4422
4422
|
class SidebarNavigationV2Component extends SidebarNavigationComponent {
|
|
@@ -4435,13 +4435,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImpor
|
|
|
4435
4435
|
class NavigationLinkV2Module {
|
|
4436
4436
|
}
|
|
4437
4437
|
NavigationLinkV2Module.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NavigationLinkV2Module, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
4438
|
-
NavigationLinkV2Module.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NavigationLinkV2Module, declarations: [NavigationLinkV2Component], imports: [CommonModule, TooltipWrapperModule, IconModule], exports: [NavigationLinkV2Component] });
|
|
4439
|
-
NavigationLinkV2Module.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NavigationLinkV2Module, imports: [[CommonModule, TooltipWrapperModule, IconModule]] });
|
|
4438
|
+
NavigationLinkV2Module.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NavigationLinkV2Module, declarations: [NavigationLinkV2Component], imports: [CommonModule, TooltipWrapperModule, IconModule, PipeModule], exports: [NavigationLinkV2Component] });
|
|
4439
|
+
NavigationLinkV2Module.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NavigationLinkV2Module, imports: [[CommonModule, TooltipWrapperModule, IconModule, PipeModule]] });
|
|
4440
4440
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NavigationLinkV2Module, decorators: [{
|
|
4441
4441
|
type: NgModule,
|
|
4442
4442
|
args: [{
|
|
4443
4443
|
declarations: [NavigationLinkV2Component],
|
|
4444
|
-
imports: [CommonModule, TooltipWrapperModule, IconModule],
|
|
4444
|
+
imports: [CommonModule, TooltipWrapperModule, IconModule, PipeModule],
|
|
4445
4445
|
exports: [NavigationLinkV2Component],
|
|
4446
4446
|
}]
|
|
4447
4447
|
}] });
|
|
@@ -4574,14 +4574,51 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImpor
|
|
|
4574
4574
|
|
|
4575
4575
|
class AdditionalInformationCardComponent {
|
|
4576
4576
|
constructor() { }
|
|
4577
|
+
ngOnInit() {
|
|
4578
|
+
this.truncateText();
|
|
4579
|
+
this.hasMore = true;
|
|
4580
|
+
}
|
|
4581
|
+
onWindowResize() {
|
|
4582
|
+
this.truncateText();
|
|
4583
|
+
}
|
|
4584
|
+
truncateText() {
|
|
4585
|
+
if (this.contentHeight) {
|
|
4586
|
+
let getheight = this.contentHeight.nativeElement.offsetHeight;
|
|
4587
|
+
const contentClass = this.contentHeight.nativeElement.parentElement;
|
|
4588
|
+
if (getheight > 60) {
|
|
4589
|
+
setTimeout(() => {
|
|
4590
|
+
contentClass.classList.add('truncate-text');
|
|
4591
|
+
this.hasMore = true;
|
|
4592
|
+
}, 50);
|
|
4593
|
+
}
|
|
4594
|
+
else {
|
|
4595
|
+
contentClass.classList.remove('truncate-text');
|
|
4596
|
+
this.hasMore = true;
|
|
4597
|
+
}
|
|
4598
|
+
}
|
|
4599
|
+
}
|
|
4600
|
+
onMoreClick() {
|
|
4601
|
+
this.contentHeight.nativeElement.parentElement.classList.remove('truncate-text');
|
|
4602
|
+
this.hasMore = false;
|
|
4603
|
+
}
|
|
4604
|
+
onLessClick() {
|
|
4605
|
+
this.contentHeight.nativeElement.parentElement.classList.add('truncate-text');
|
|
4606
|
+
this.hasMore = true;
|
|
4607
|
+
}
|
|
4577
4608
|
}
|
|
4578
4609
|
AdditionalInformationCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AdditionalInformationCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4579
|
-
AdditionalInformationCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: AdditionalInformationCardComponent, selector: "symphony-additional-information-card", inputs: { additionalInformationModel: "additionalInformationModel" }, ngImport: i0, template: "<div
|
|
4610
|
+
AdditionalInformationCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: AdditionalInformationCardComponent, selector: "symphony-additional-information-card", inputs: { additionalInformationModel: "additionalInformationModel" }, host: { listeners: { "window:resize": "onWindowResize($event)" } }, viewQueries: [{ propertyName: "contentHeight", first: true, predicate: ["contentHeight"], descendants: true }], ngImport: i0, template: "<div\n *ngIf=\"additionalInformationModel\"\n class=\"additional-information-card-item-wrapper\"\n>\n <div class=\"additional-information-card-icon\">\n <symphony-icon-wrapper\n [isInverse]=\"true\"\n [hasHoverWithoutBorder]=\"true\"\n [backgroundColor]=\"additionalInformationModel.iconWrapperColor\"\n >\n <symphony-icon\n [icon]=\"additionalInformationModel.icon\"\n [iconColor]=\"additionalInformationModel.iconInnerColor\"\n ></symphony-icon>\n </symphony-icon-wrapper>\n </div>\n\n <div>\n <div class=\"sfx-pb-10 sfx-font-bold\">\n <symphony-paragraph\n >{{ additionalInformationModel.header }}:\n {{ additionalInformationModel.headerText }}</symphony-paragraph\n >\n </div>\n <div\n *ngFor=\"\n let information of additionalInformationModel.additionalInformation\n \"\n class=\"additional-information-card-description\"\n >\n <symphony-paragraph *ngIf=\"!information.showMore\" class=\"card-wrap-text\">\n <span class=\"sfx-pr-5 sfx-font-bold pull-left sfx-d-inline-block\"\n >{{ information.label }}:</span\n >\n <span>{{ information.text }}</span>\n </symphony-paragraph>\n <symphony-paragraph *ngIf=\"information.showMore\" class=\"card-wrap-text\">\n <span class=\"sfx-pr-5 sfx-font-bold pull-left sfx-d-inline-block\"\n >{{ information.label }}:</span\n >\n <span #contentHeight class=\"sfx-d-block\"\n >{{ information.text }}\n <a\n href=\"javascript:;\"\n *ngIf=\"hasMore\"\n class=\"sfx-btn-link\"\n (click)=\"onMoreClick()\"\n >more</a\n >\n <a\n href=\"javascript:;\"\n *ngIf=\"!hasMore\"\n class=\"sfx-btn-link hasLess\"\n (click)=\"onLessClick()\"\n >less</a\n >\n </span>\n </symphony-paragraph>\n </div>\n </div>\n</div>\n", styles: [".additional-information-card-item-wrapper{position:relative;width:100%;display:flex;padding-block:20px}.additional-information-card-item-wrapper div:last-child{flex:1}.additional-information-card-icon{display:inline-block;float:left;padding-right:15px}.additional-information-card-icon .si-feedback-maybe{position:relative;left:-1px;top:-1px}.additional-information-card-icon .si-feedback-yes{position:relative;top:-3px}.card-wrap-text{font-size:16px;word-break:break-word;position:relative}.card-wrap-text .body-copy-primary{word-break:break-word}.card-wrap-text .body-copy-primary.truncate-text{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}.card-wrap-text .body-copy-primary.truncate-text .sfx-btn-link{display:inline}.card-wrap-text .body-copy-primary .sfx-btn-link{font-weight:500;color:#82919f;position:absolute;bottom:0;right:0;background:#fff;display:none}.card-wrap-text .body-copy-primary .sfx-btn-link:before{content:\"...\"}.card-wrap-text .body-copy-primary .sfx-btn-link.hasLess{display:inline;position:relative}.card-wrap-text .body-copy-primary .sfx-btn-link.hasLess:before{content:\"\"}\n"], components: [{ type: IconWrapperComponent, selector: "symphony-icon-wrapper", inputs: ["backgroundColor", "isInverse", "hasHoverWithoutBorder"], outputs: ["clicked"] }, { type: IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
4580
4611
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AdditionalInformationCardComponent, decorators: [{
|
|
4581
4612
|
type: Component,
|
|
4582
|
-
args: [{ selector: 'symphony-additional-information-card', encapsulation: ViewEncapsulation.None, template: "<div
|
|
4613
|
+
args: [{ selector: 'symphony-additional-information-card', encapsulation: ViewEncapsulation.None, template: "<div\n *ngIf=\"additionalInformationModel\"\n class=\"additional-information-card-item-wrapper\"\n>\n <div class=\"additional-information-card-icon\">\n <symphony-icon-wrapper\n [isInverse]=\"true\"\n [hasHoverWithoutBorder]=\"true\"\n [backgroundColor]=\"additionalInformationModel.iconWrapperColor\"\n >\n <symphony-icon\n [icon]=\"additionalInformationModel.icon\"\n [iconColor]=\"additionalInformationModel.iconInnerColor\"\n ></symphony-icon>\n </symphony-icon-wrapper>\n </div>\n\n <div>\n <div class=\"sfx-pb-10 sfx-font-bold\">\n <symphony-paragraph\n >{{ additionalInformationModel.header }}:\n {{ additionalInformationModel.headerText }}</symphony-paragraph\n >\n </div>\n <div\n *ngFor=\"\n let information of additionalInformationModel.additionalInformation\n \"\n class=\"additional-information-card-description\"\n >\n <symphony-paragraph *ngIf=\"!information.showMore\" class=\"card-wrap-text\">\n <span class=\"sfx-pr-5 sfx-font-bold pull-left sfx-d-inline-block\"\n >{{ information.label }}:</span\n >\n <span>{{ information.text }}</span>\n </symphony-paragraph>\n <symphony-paragraph *ngIf=\"information.showMore\" class=\"card-wrap-text\">\n <span class=\"sfx-pr-5 sfx-font-bold pull-left sfx-d-inline-block\"\n >{{ information.label }}:</span\n >\n <span #contentHeight class=\"sfx-d-block\"\n >{{ information.text }}\n <a\n href=\"javascript:;\"\n *ngIf=\"hasMore\"\n class=\"sfx-btn-link\"\n (click)=\"onMoreClick()\"\n >more</a\n >\n <a\n href=\"javascript:;\"\n *ngIf=\"!hasMore\"\n class=\"sfx-btn-link hasLess\"\n (click)=\"onLessClick()\"\n >less</a\n >\n </span>\n </symphony-paragraph>\n </div>\n </div>\n</div>\n", styles: [".additional-information-card-item-wrapper{position:relative;width:100%;display:flex;padding-block:20px}.additional-information-card-item-wrapper div:last-child{flex:1}.additional-information-card-icon{display:inline-block;float:left;padding-right:15px}.additional-information-card-icon .si-feedback-maybe{position:relative;left:-1px;top:-1px}.additional-information-card-icon .si-feedback-yes{position:relative;top:-3px}.card-wrap-text{font-size:16px;word-break:break-word;position:relative}.card-wrap-text .body-copy-primary{word-break:break-word}.card-wrap-text .body-copy-primary.truncate-text{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}.card-wrap-text .body-copy-primary.truncate-text .sfx-btn-link{display:inline}.card-wrap-text .body-copy-primary .sfx-btn-link{font-weight:500;color:#82919f;position:absolute;bottom:0;right:0;background:#fff;display:none}.card-wrap-text .body-copy-primary .sfx-btn-link:before{content:\"...\"}.card-wrap-text .body-copy-primary .sfx-btn-link.hasLess{display:inline;position:relative}.card-wrap-text .body-copy-primary .sfx-btn-link.hasLess:before{content:\"\"}\n"] }]
|
|
4583
4614
|
}], ctorParameters: function () { return []; }, propDecorators: { additionalInformationModel: [{
|
|
4584
4615
|
type: Input
|
|
4616
|
+
}], contentHeight: [{
|
|
4617
|
+
type: ViewChild,
|
|
4618
|
+
args: ['contentHeight']
|
|
4619
|
+
}], onWindowResize: [{
|
|
4620
|
+
type: HostListener,
|
|
4621
|
+
args: ['window:resize', ['$event']]
|
|
4585
4622
|
}] } });
|
|
4586
4623
|
|
|
4587
4624
|
class AdditionalInformationCardListComponent {
|