UNPKG

@logo-software/accordion

Version:

An accordion allows to toggle the display of sections of content.

elements.logo.com.tr

41 lines • 35.9 kB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
!function(o,r){"object"==typeof exports&&"undefined"!=typeof module?r(exports,require("@angular/core"),require("@angular/common/http"),require("@angular/router"),require("@angular/common")):"function"==typeof define&&define.amd?define("@logo-software/accordion",["exports","@angular/core","@angular/common/http","@angular/router","@angular/common"],r):r(((o="undefined"!=typeof globalThis?globalThis:o||self)["logo-software"]=o["logo-software"]||{},o["logo-software"].accordion={}),o.ng.core,o.ng.common.http,o.ng.router,o.ng.common)}(this,(function(o,r,t,a,e){"use strict"; /** * @license * Copyright LOGO YAZILIM SANAYİ VE TİCARET A.Ş. All Rights Reserved. * * Save to the extent permitted by law, you may not use, copy, modify, * distribute or create derivative works of this material or any part * of it without the prior written consent of LOGO YAZILIM SANAYİ VE TİCARET A.Ş. Limited. * Any reproduction of this material must contain this notice. */var n=function(){function o(){this.isHidden=!1,this.isOpen=!1,this.icon=null,this.classes=null,this.selectorId=null,this.onInit=new r.EventEmitter,this.onClick=new r.EventEmitter}return o.prototype.ngAfterViewInit=function(){this.onInit.emit(this)},o.prototype.accordionItemClick=function(o){this.$onAccordionItemClick(this)},o.prototype.$onAccordionItemClick=function(o){this.onClick.emit(o)},o.prototype.ngOnInit=function(){this.selectorId||(this.selectorId=this.generateElementId())},o.prototype.generateElementId=function(){return String.fromCharCode(Math.floor(26*Math.random())+97)+Math.random().toString(16).slice(2)+Date.now().toString(16).slice(4)},o}();n.decorators=[{type:r.Component,args:[{selector:"logo-accordion-item",template:'\n <li [hidden]="isHidden" [ngClass]="classes" class="level-0 accordion-category">\n <input [checked]="isOpen" hidden id="{{selectorId}}" type="checkbox"/>\n <label\n (click)="accordionItemClick()"\n class="label label-category"\n for="{{selectorId}}"\n >\n <div class="title-left">\n <ng-content select="[titleLeft]"></ng-content>\n </div>\n <div *ngIf="!!icon" [ngClass]="icon" class="{{icon}}"></div>\n <div class="title">\n <p class="large">{{title}}</p>\n </div>\n <div class="options">\n <ng-content select="[option]"></ng-content>\n </div>\n <div class="arrow le-arrow_down"></div>\n </label>\n <div class="content">\n <ng-content></ng-content>\n </div>\n </li>\n ',styles:["[class*=\" le-\"],[class^=le-]{position:relative;height:100%}[class*=\" le-\"]:before,[class^=le-]:before{height:100%;top:0;-webkit-mask-size:14px;mask-size:14px}.le-arrow_right:before{-webkit-mask-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='currentColor' xmlns='http://www.w3.org/2000/svg'%3E %3Cg id='arrow_right'%3E %3Cpath id='Shape' fill-rule='evenodd' clip-rule='evenodd' d='M14.5713 12C14.5713 11.8762 14.5351 11.7657 14.4628 11.6686L14.4017 11.5982L10.4017 7.59823C10.2886 7.48514 10.1547 7.42859 9.9999 7.42859C9.84513 7.42859 9.7112 7.48514 9.59811 7.59823C9.50763 7.68871 9.45335 7.79252 9.43525 7.90966L9.42847 8.00002V16C9.42847 16.1548 9.48501 16.2887 9.59811 16.4018C9.7112 16.5149 9.84513 16.5714 9.9999 16.5714C10.1237 16.5714 10.2342 16.5353 10.3313 16.4629L10.4017 16.4018L14.4017 12.4018C14.5148 12.2887 14.5713 12.1548 14.5713 12Z' fill='%235A5A5A'/%3E %3C/g%3E %3C/svg%3E\");-webkit-mask-repeat:no-repeat;-webkit-mask-position:center;display:inline-block;content:\"\";position:absolute;background:currentColor}.dotted{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.logo-tooltip .tip.on-bottom:after,.logo-tooltip .tip.on-top:after{border-left:7px solid transparent;border-right:7px solid transparent}.logo-tooltip .tip.on-left:after,.logo-tooltip .tip.on-right:after{border-top:7px solid transparent;border-bottom:7px solid transparent}.logo-tooltip{position:relative;color:#e94a34;cursor:pointer}.logo-tooltip .tip{position:absolute;width:180px;color:#fff;font-size:14px;font-style:normal;line-height:1.4;text-align:center;border-radius:3px;background:#333;padding:8px 12px;box-sizing:border-box;cursor:auto;z-index:10;opacity:0;visibility:hidden;transition:all .25s ease-in}.logo-tooltip .tip:after{position:absolute;width:0;height:0;content:\"\"}.logo-tooltip .tip.on-top{bottom:25px;left:0}.logo-tooltip .tip.on-top:after{bottom:-7px;left:10px;border-top:7px solid #333}.logo-tooltip .tip.on-right{top:-5px;left:103%}.logo-tooltip .tip.on-right:after{top:37%;left:-7px;border-right:7px solid #333}.logo-tooltip .tip.on-bottom{top:25px;left:0}.logo-tooltip .tip.on-bottom:after{top:-7px;left:10px;border-bottom:7px solid #333}.logo-tooltip .tip.on-left{top:-100%;right:103%}.logo-tooltip .tip.on-left:after{top:37%;right:-7px;border-left:7px solid #333}.logo-tooltip:hover .tip{opacity:1;visibility:visible}.logo-tooltip:hover .tip.on-top{transform:translateY(-15px)}.logo-tooltip:hover .tip.on-right{transform:translateX(15px)}.logo-tooltip:hover .tip.on-bottom{transform:translateY(15px)}.logo-tooltip:hover .tip.on-left{transform:translateX(-15px)}.test{content:\"a\";content:\"ba\";content:\"aa\";content:\"aade\";content:\"abde\"}:root .basic,:root .gray,:root .secondary{color:var(--leds-contrast-90pct)}:root .danger,:root .info,:root .success,:root .warning{color:var(--white)}:root .outline.primary,:root .outline.primary:active,:root .outline.primary:focus,:root .outline.primary:hover{border-color:var(--light-600)}:root .outline.primary:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--primary)}:root .outline.primary:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--primary)}:root .outline.primary:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--primary)}:root .outline.secondary{color:var(--leds-contrast-90pct)}:root .outline.secondary,:root .outline.secondary:active,:root .outline.secondary:focus,:root .outline.secondary:hover{border-color:var(--light-600)}:root .outline.secondary:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--leds-contrast-90pct)}:root .outline.secondary:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--leds-contrast-90pct)}:root .outline.secondary:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--leds-contrast-90pct)}:root .outline.basic{color:var(--leds-contrast-90pct)}:root .outline.basic,:root .outline.basic:active,:root .outline.basic:focus,:root .outline.basic:hover{border-color:var(--light-600)}:root .outline.basic:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--leds-contrast-90pct)}:root .outline.basic:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--leds-contrast-90pct)}:root .outline.basic:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--leds-contrast-90pct)}:root .outline.neutral,:root .outline.neutral:active,:root .outline.neutral:focus,:root .outline.neutral:hover{border-color:var(--light-600)}:root .outline.neutral:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--neutral)}:root .outline.neutral:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--neutral)}:root .outline.neutral:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--neutral)}:root .outline.light{border-color:rgba(var(--light-rgb),.5)}:root .outline.light:active,:root .outline.light:focus,:root .outline.light:hover{border-color:var(--light)}:root .outline.light:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--white)}:root .outline.light:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--white)}:root .outline.light:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--white)}:root .outline.dark,:root .outline.dark:active,:root .outline.dark:focus,:root .outline.dark:hover{border-color:var(--light-600)}:root .outline.dark:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--dark)}:root .outline.dark:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--dark)}:root .outline.dark:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--dark)}:root .outline.gray{color:var(--leds-contrast-90pct)}:root .outline.gray,:root .outline.gray:active,:root .outline.gray:focus,:root .outline.gray:hover{border-color:var(--light-600)}:root .outline.gray:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--leds-contrast-90pct)}:root .outline.gray:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--leds-contrast-90pct)}:root .outline.gray:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--leds-contrast-90pct)}:root .outline.info{color:var(--info)}:root .outline.info,:root .outline.info:active,:root .outline.info:focus,:root .outline.info:hover{border-color:var(--light-600)}:root .outline.info:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--info)}:root .outline.info:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--info)}:root .outline.info:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--info)}:root .outline.danger{color:var(--danger)}:root .outline.danger,:root .outline.danger:active,:root .outline.danger:focus,:root .outline.danger:hover{border-color:var(--light-600)}:root .outline.danger:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--danger)}:root .outline.danger:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--danger)}:root .outline.danger:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--danger)}:root .outline.warning{color:var(--warning)}:root .outline.warning,:root .outline.warning:active,:root .outline.warning:focus,:root .outline.warning:hover{border-color:var(--light-600)}:root .outline.warning:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--warning)}:root .outline.warning:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--warning)}:root .outline.warning:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--warning)}:root .outline.success{color:var(--success)}:root .outline.success,:root .outline.success:active,:root .outline.success:focus,:root .outline.success:hover{border-color:var(--light-600)}:root .outline.success:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--success)}:root .outline.success:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--success)}:root .outline.success:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--success)}:root .ghost.primary:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--primary)}:root .ghost.primary:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--primary)}:root .ghost.primary:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--primary)}:root .ghost.secondary,:root .ghost.secondary:hover{color:var(--leds-contrast-90pct)}:root .ghost.secondary:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover))}:root .ghost.secondary:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--leds-contrast-90pct)}:root .ghost.secondary:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus))}:root .ghost.basic,:root .ghost.basic:hover,:root .ghost.secondary:focus{color:var(--leds-contrast-90pct)}:root .ghost.basic:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover))}:root .ghost.basic:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--leds-contrast-90pct)}:root .ghost.basic:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--leds-contrast-90pct)}:root .ghost.neutral:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--neutral)}:root .ghost.neutral:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--neutral)}:root .ghost.neutral:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--neutral)}:root .ghost.light:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--white)}:root .ghost.light:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--white)}:root .ghost.light:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--white)}:root .ghost.dark:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--dark)}:root .ghost.dark:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--dark)}:root .ghost.dark:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--dark)}:root .ghost.gray,:root .ghost.gray:hover{color:var(--leds-contrast-90pct)}:root .ghost.gray:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover))}:root .ghost.gray:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--leds-contrast-90pct)}:root .ghost.gray:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--leds-contrast-90pct)}:root .ghost.info{color:var(--info)}:root .ghost.info:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--info)}:root .ghost.info:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--info)}:root .ghost.info:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--info)}:root .ghost.danger{color:var(--danger)}:root .ghost.danger:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--danger)}:root .ghost.danger:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--danger)}:root .ghost.danger:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--danger)}:root .ghost.warning{color:var(--warning)}:root .ghost.warning:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--warning)}:root .ghost.warning:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--warning)}:root .ghost.warning:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--warning)}:root .ghost.success{color:var(--success)}:root .ghost.success:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--success)}:root .ghost.success:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--success)}:root .ghost.success:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--success)}:host li label{display:flex;color:var(--leds-contrast-90pct);padding-left:4px;padding-right:4px;font-size:16px;line-height:38px;height:38px;box-sizing:border-box;align-items:center;justify-content:space-between;cursor:auto;background-color:var(--white);position:relative;z-index:1}:host li label:hover{background-color:rgba(var(--neutral-rgb),var(--ghost-hover));transition:color .1s ease-in}:host li label .title-left{line-height:normal}:host li label .title{flex-grow:1;font-weight:700;padding-left:10px;cursor:pointer}:host li label .options,:host li label .options ::ng-deep{white-space:nowrap}:host li label .arrow{width:14px;height:14px;display:inline-block}:host li .content{height:100%;max-height:0;opacity:0;transition:all .5s ease-out;padding:0 20px;margin:0;background-color:var(--white)}:host li input[type=checkbox]:checked+label>span.arrow{transform:rotate(180deg)}:host li input[type=checkbox]:checked+label+.content{max-height:none;opacity:1;transition:all .5s ease-out;padding-top:24px;padding-bottom:24px}"]}]}],n.propDecorators={title:[{type:r.Input}],params:[{type:r.Input}],isHidden:[{type:r.Input}],isOpen:[{type:r.Input}],icon:[{type:r.Input}],classes:[{type:r.Input}],selectorId:[{type:r.Input}],onInit:[{type:r.Output}],onClick:[{type:r.Output}]}; /** * @license * Copyright LOGO YAZILIM SANAYİ VE TİCARET A.Ş. All Rights Reserved. * * Save to the extent permitted by law, you may not use, copy, modify, * distribute or create derivative works of this material or any part * of it without the prior written consent of LOGO YAZILIM SANAYİ VE TİCARET A.Ş. Limited. * Any reproduction of this material must contain this notice. */ var l=function(){function o(o){this.http=o,this.classes="",this.iconClasses="",this.items=[],this.hasShadow=!1,this.onItemClick=new r.EventEmitter,this._level=0}return Object.defineProperty(o.prototype,"level",{get:function(){return this._level},set:function(o){++o,this._level=o},enumerable:!1,configurable:!0}),o.prototype.ngOnInit=function(){this.elementId||(this.elementId=this.generateElementId())},o.prototype.generateElementId=function(){return String.fromCharCode(Math.floor(26*Math.random())+97)+Math.random().toString(16).slice(2)+Date.now().toString(16).slice(4)},o.prototype.itemClick=function(o,r){this.$onItemClick(o)},o.prototype.$onItemClick=function(o){this.onItemClick.emit(o)},o}();l.decorators=[{type:r.Component,args:[{selector:"logo-accordion",template:'\x3c!--\n/**\n * @license\n * Copyright LOGO YAZILIM SANAYİ VE TİCARET A.Ş. All Rights Reserved.\n *\n * Save to the extent permitted by law, you may not use, copy, modify,\n * distribute or create derivative works of this material or any part\n * of it without the prior written consent of LOGO YAZILIM SANAYİ VE TİCARET A.Ş. Limited.\n * Any reproduction of this material must contain this notice.\n */\n--\x3e\n<ul class="top-level-accordion" [ngClass]="{\'shadowed\': hasShadow}">\n <ng-container *ngIf="items.length === 0; else nativeTemplate">\n <ng-content></ng-content>\n </ng-container>\n <ng-template #nativeTemplate>\n <li\n *ngFor="let item of items; let i = index; let lst=last"\n [ngClass]="item.classes"\n class="level-{{level}} accordion-category {{classes}}"\n >\n <input [checked]="item.isOpen" hidden id="{{elementId}}{{i}}" type="checkbox"/>\n <label\n (click)="itemClick(item)"\n class="label label-category"\n for="{{elementId}}{{i}}"\n >\n <div [ngClass]="item.iconClasses" class="{{iconClasses}}"></div>\n <div class="title">\n <p class="large">{{item.title}}</p>\n </div>\n <div class="options">\n <ng-content select="[option]"></ng-content>\n </div>\n <div class="arrow le-arrow_down"></div>\n </label>\n <p [innerHTML]="item.description" class="content"></p>\n </li>\n </ng-template>\n</ul>\n',styles:["[class*=\" le-\"],[class^=le-]{position:relative;height:100%}[class*=\" le-\"]:before,[class^=le-]:before{height:100%;top:0;-webkit-mask-size:14px;mask-size:14px}.le-arrow_right:before{-webkit-mask-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='currentColor' xmlns='http://www.w3.org/2000/svg'%3E %3Cg id='arrow_right'%3E %3Cpath id='Shape' fill-rule='evenodd' clip-rule='evenodd' d='M14.5713 12C14.5713 11.8762 14.5351 11.7657 14.4628 11.6686L14.4017 11.5982L10.4017 7.59823C10.2886 7.48514 10.1547 7.42859 9.9999 7.42859C9.84513 7.42859 9.7112 7.48514 9.59811 7.59823C9.50763 7.68871 9.45335 7.79252 9.43525 7.90966L9.42847 8.00002V16C9.42847 16.1548 9.48501 16.2887 9.59811 16.4018C9.7112 16.5149 9.84513 16.5714 9.9999 16.5714C10.1237 16.5714 10.2342 16.5353 10.3313 16.4629L10.4017 16.4018L14.4017 12.4018C14.5148 12.2887 14.5713 12.1548 14.5713 12Z' fill='%235A5A5A'/%3E %3C/g%3E %3C/svg%3E\");-webkit-mask-repeat:no-repeat;-webkit-mask-position:center;display:inline-block;content:\"\";position:absolute;background:currentColor}.dotted{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.logo-tooltip .tip.on-bottom:after,.logo-tooltip .tip.on-top:after{border-left:7px solid transparent;border-right:7px solid transparent}.logo-tooltip .tip.on-left:after,.logo-tooltip .tip.on-right:after{border-top:7px solid transparent;border-bottom:7px solid transparent}.logo-tooltip{position:relative;color:#e94a34;cursor:pointer}.logo-tooltip .tip{position:absolute;width:180px;color:#fff;font-size:14px;font-style:normal;line-height:1.4;text-align:center;border-radius:3px;background:#333;padding:8px 12px;box-sizing:border-box;cursor:auto;z-index:10;opacity:0;visibility:hidden;transition:all .25s ease-in}.logo-tooltip .tip:after{position:absolute;width:0;height:0;content:\"\"}.logo-tooltip .tip.on-top{bottom:25px;left:0}.logo-tooltip .tip.on-top:after{bottom:-7px;left:10px;border-top:7px solid #333}.logo-tooltip .tip.on-right{top:-5px;left:103%}.logo-tooltip .tip.on-right:after{top:37%;left:-7px;border-right:7px solid #333}.logo-tooltip .tip.on-bottom{top:25px;left:0}.logo-tooltip .tip.on-bottom:after{top:-7px;left:10px;border-bottom:7px solid #333}.logo-tooltip .tip.on-left{top:-100%;right:103%}.logo-tooltip .tip.on-left:after{top:37%;right:-7px;border-left:7px solid #333}.logo-tooltip:hover .tip{opacity:1;visibility:visible}.logo-tooltip:hover .tip.on-top{transform:translateY(-15px)}.logo-tooltip:hover .tip.on-right{transform:translateX(15px)}.logo-tooltip:hover .tip.on-bottom{transform:translateY(15px)}.logo-tooltip:hover .tip.on-left{transform:translateX(-15px)}.test{content:\"a\";content:\"ba\";content:\"aa\";content:\"aade\";content:\"abde\"}:root .basic,:root .gray,:root .secondary{color:var(--leds-contrast-90pct)}:root .danger,:root .info,:root .success,:root .warning{color:var(--white)}:root .outline.primary,:root .outline.primary:active,:root .outline.primary:focus,:root .outline.primary:hover{border-color:var(--light-600)}:root .outline.primary:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--primary)}:root .outline.primary:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--primary)}:root .outline.primary:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--primary)}:root .outline.secondary{color:var(--leds-contrast-90pct)}:root .outline.secondary,:root .outline.secondary:active,:root .outline.secondary:focus,:root .outline.secondary:hover{border-color:var(--light-600)}:root .outline.secondary:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--leds-contrast-90pct)}:root .outline.secondary:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--leds-contrast-90pct)}:root .outline.secondary:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--leds-contrast-90pct)}:root .outline.basic{color:var(--leds-contrast-90pct)}:root .outline.basic,:root .outline.basic:active,:root .outline.basic:focus,:root .outline.basic:hover{border-color:var(--light-600)}:root .outline.basic:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--leds-contrast-90pct)}:root .outline.basic:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--leds-contrast-90pct)}:root .outline.basic:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--leds-contrast-90pct)}:root .outline.neutral,:root .outline.neutral:active,:root .outline.neutral:focus,:root .outline.neutral:hover{border-color:var(--light-600)}:root .outline.neutral:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--neutral)}:root .outline.neutral:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--neutral)}:root .outline.neutral:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--neutral)}:root .outline.light{border-color:rgba(var(--light-rgb),.5)}:root .outline.light:active,:root .outline.light:focus,:root .outline.light:hover{border-color:var(--light)}:root .outline.light:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--white)}:root .outline.light:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--white)}:root .outline.light:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--white)}:root .outline.dark,:root .outline.dark:active,:root .outline.dark:focus,:root .outline.dark:hover{border-color:var(--light-600)}:root .outline.dark:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--dark)}:root .outline.dark:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--dark)}:root .outline.dark:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--dark)}:root .outline.gray{color:var(--leds-contrast-90pct)}:root .outline.gray,:root .outline.gray:active,:root .outline.gray:focus,:root .outline.gray:hover{border-color:var(--light-600)}:root .outline.gray:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--leds-contrast-90pct)}:root .outline.gray:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--leds-contrast-90pct)}:root .outline.gray:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--leds-contrast-90pct)}:root .outline.info{color:var(--info)}:root .outline.info,:root .outline.info:active,:root .outline.info:focus,:root .outline.info:hover{border-color:var(--light-600)}:root .outline.info:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--info)}:root .outline.info:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--info)}:root .outline.info:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--info)}:root .outline.danger{color:var(--danger)}:root .outline.danger,:root .outline.danger:active,:root .outline.danger:focus,:root .outline.danger:hover{border-color:var(--light-600)}:root .outline.danger:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--danger)}:root .outline.danger:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--danger)}:root .outline.danger:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--danger)}:root .outline.warning{color:var(--warning)}:root .outline.warning,:root .outline.warning:active,:root .outline.warning:focus,:root .outline.warning:hover{border-color:var(--light-600)}:root .outline.warning:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--warning)}:root .outline.warning:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--warning)}:root .outline.warning:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--warning)}:root .outline.success{color:var(--success)}:root .outline.success,:root .outline.success:active,:root .outline.success:focus,:root .outline.success:hover{border-color:var(--light-600)}:root .outline.success:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--success)}:root .outline.success:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--success)}:root .outline.success:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--success)}:root .ghost.primary:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--primary)}:root .ghost.primary:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--primary)}:root .ghost.primary:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--primary)}:root .ghost.secondary,:root .ghost.secondary:hover{color:var(--leds-contrast-90pct)}:root .ghost.secondary:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover))}:root .ghost.secondary:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--leds-contrast-90pct)}:root .ghost.secondary:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus))}:root .ghost.basic,:root .ghost.basic:hover,:root .ghost.secondary:focus{color:var(--leds-contrast-90pct)}:root .ghost.basic:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover))}:root .ghost.basic:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--leds-contrast-90pct)}:root .ghost.basic:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--leds-contrast-90pct)}:root .ghost.neutral:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--neutral)}:root .ghost.neutral:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--neutral)}:root .ghost.neutral:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--neutral)}:root .ghost.light:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--white)}:root .ghost.light:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--white)}:root .ghost.light:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--white)}:root .ghost.dark:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--dark)}:root .ghost.dark:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--dark)}:root .ghost.dark:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--dark)}:root .ghost.gray,:root .ghost.gray:hover{color:var(--leds-contrast-90pct)}:root .ghost.gray:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover))}:root .ghost.gray:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--leds-contrast-90pct)}:root .ghost.gray:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--leds-contrast-90pct)}:root .ghost.info{color:var(--info)}:root .ghost.info:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--info)}:root .ghost.info:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--info)}:root .ghost.info:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--info)}:root .ghost.danger{color:var(--danger)}:root .ghost.danger:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--danger)}:root .ghost.danger:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--danger)}:root .ghost.danger:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--danger)}:root .ghost.warning{color:var(--warning)}:root .ghost.warning:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--warning)}:root .ghost.warning:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--warning)}:root .ghost.warning:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--warning)}:root .ghost.success{color:var(--success)}:root .ghost.success:hover{background-color:rgba(var(--neutral-500-rgb),var(--ghost-hover));color:var(--success)}:root .ghost.success:active{background-color:rgba(var(--neutral-500-rgb),var(--ghost-active));color:var(--success)}:root .ghost.success:focus{background-color:rgba(var(--neutral-500-rgb),var(--ghost-focus));color:var(--success)}:host{display:block;padding:0;margin:0;font-family:Nunito Sans!important;opacity:1;transition:all .5s ease-out}:host ul{list-style:none;padding:0}:host ul.shadowed ::ng-deep li label,:host ul.shadowed li label{box-shadow:0 0 4px 1px rgba(var(--black-rgb),.08)}:host ul li label{display:flex;color:var(--leds-contrast-90pct);padding-left:4px;padding-right:4px;font-size:16px;line-height:38px;height:38px;box-sizing:border-box;align-items:center;justify-content:space-between;cursor:auto;background-color:var(--white);position:relative;z-index:1}:host ul li label:hover{transition:color .1s ease-in}:host ul li label.router-link-active,:host ul li label:hover{background-color:rgba(var(--neutral-rgb),var(--ghost-hover))}:host ul li label .title-left{line-height:normal}:host ul li label .title{flex-grow:1;font-weight:700;padding-left:10px;cursor:pointer}:host ul li label .options,:host ul li label .options ::ng-deep{white-space:nowrap}:host ul li label .arrow{width:14px;height:14px;display:inline-block}:host ul li .content{height:100%;max-height:0;opacity:0;transition:all .5s ease-out;padding:0 20px;margin:0;background-color:var(--white)}:host ul li input[type=checkbox]:checked+label>span.arrow{transform:rotate(180deg)}:host ul li input[type=checkbox]:checked+label+.content{max-height:none;opacity:1;transition:all .5s ease-out;padding-top:24px;padding-bottom:24px}:host .emitter{background:rgba(200,20,20,.1);width:100%;height:48px}"]}]}],l.ctorParameters=function(){return[{type:t.HttpClient}]},l.propDecorators={classes:[{type:r.Input}],iconClasses:[{type:r.Input}],items:[{type:r.Input}],hasShadow:[{type:r.Input}],request:[{type:r.Input}],onItemClick:[{type:r.Output}],elementId:[{type:r.Input}],accordionItems:[{type:r.ContentChildren,args:[n]}],level:[{type:r.Input,args:["level"]}]}; /** * @license * Copyright LOGO YAZILIM SANAYİ VE TİCARET A.Ş. All Rights Reserved. * * Save to the extent permitted by law, you may not use, copy, modify, * distribute or create derivative works of this material or any part * of it without the prior written consent of LOGO YAZILIM SANAYİ VE TİCARET A.Ş. Limited. * Any reproduction of this material must contain this notice. */ var c=function(){function o(o){var t=this;this.router=o,this.isActiveRouteEmitter=new r.EventEmitter,this.subscription=this.router.events.subscribe((function(o){o instanceof a.NavigationEnd&&t.update()}))}return o.prototype.ngAfterContentInit=function(){this.update()},o.prototype.ngOnDestroy=function(){this.subscription.unsubscribe()},o.prototype.update=function(){var o=this;Promise.resolve().then((function(){o.isActiveRoute&&o.isActiveRoute.isActive&&o.isActiveRouteEmitter.emit(o.isActiveRoute)}))},o}();c.decorators=[{type:r.Directive,args:[{selector:"[isActiveRoute]"}]}],c.ctorParameters=function(){return[{type:a.Router}]},c.propDecorators={isActiveRoute:[{type:r.Input}],isActiveRouteEmitter:[{type:r.Output}]}; /** * @license * Copyright LOGO YAZILIM SANAYİ VE TİCARET A.Ş. All Rights Reserved. * * Save to the extent permitted by law, you may not use, copy, modify, * distribute or create derivative works of this material or any part * of it without the prior written consent of LOGO YAZILIM SANAYİ VE TİCARET A.Ş. Limited. * Any reproduction of this material must contain this notice. */ var i=function(o,r){if(this.http=r,!r)throw new Error("You need to import the HttpClientModule in your AppModule! \nSee also https://github.com/angular/angular/issues/20575")};i.decorators=[{type:r.NgModule,args:[{imports:[e.CommonModule,a.RouterModule],declarations:[l,c,n],exports:[l,n],providers:[]}]}],i.ctorParameters=function(){return[{type:i,decorators:[{type:r.Optional},{type:r.SkipSelf}]},{type:t.HttpClient,decorators:[{type:r.Optional}]}]},o.AccordionComponent=l,o.AccordionModule=i,o.ItemComponent=n,o["ɵa"]=c,Object.defineProperty(o,"__esModule",{value:!0})})); //# sourceMappingURL=logo-software-accordion.umd.min.js.map