@akcelik/strct 0.5.23 → 0.5.25
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.
|
@@ -399,8 +399,21 @@ class StrctIcon {
|
|
|
399
399
|
></svg>
|
|
400
400
|
}
|
|
401
401
|
@if (badge() !== 'none') {
|
|
402
|
-
<span class="strct-icon__badge strct-icon__badge--{{ badge() }}"
|
|
403
|
-
|
|
402
|
+
<span class="strct-icon__badge strct-icon__badge--{{ badge() }}">
|
|
403
|
+
@if (badge() === 'maintenance') {
|
|
404
|
+
<svg
|
|
405
|
+
viewBox="0 0 16 16"
|
|
406
|
+
fill="none"
|
|
407
|
+
stroke="currentColor"
|
|
408
|
+
stroke-width="1.4"
|
|
409
|
+
stroke-linecap="round"
|
|
410
|
+
stroke-linejoin="round"
|
|
411
|
+
>
|
|
412
|
+
<path d="M3.5 3.5c-.5 1.5.5 2.5 2 3l5 5M5 3c-1 0-2 1-1.5 2.5L10 12M12.5 3.5L6 10" />
|
|
413
|
+
</svg>
|
|
414
|
+
}
|
|
415
|
+
</span>
|
|
416
|
+
}`, isInline: true, styles: [".strct-icon{position:relative;display:inline-flex;align-items:center;justify-content:center;line-height:0}.strct-icon__raw{display:inline-flex}.strct-icon__raw>svg{width:100%;height:100%;display:block}.strct-icon__badge{position:absolute;right:-2px;bottom:-2px;width:45%;height:45%;min-width:7px;min-height:7px;max-width:11px;max-height:11px;border-radius:50%;box-shadow:0 0 0 1.5px var(--bg-1)}.strct-icon__badge--success{background:var(--success)}.strct-icon__badge--warning{background:var(--warning);border-radius:1px;clip-path:polygon(50% 10%,92% 90%,8% 90%);box-shadow:none;filter:drop-shadow(0 0 1.5px var(--bg-1));right:-2px;bottom:-2px;width:56%;height:56%;min-width:10px;min-height:10px;max-width:16px;max-height:16px;display:flex;align-items:center;justify-content:center;font-size:clamp(6px,70%,10px);font-weight:800;color:#000000d9;line-height:1}.strct-icon__badge--warning:before{content:\"!\"}.strct-icon__badge--critical{background:var(--critical)}.strct-icon__badge--off{background:var(--t3)}.strct-icon__badge--info{background:var(--acc)}.strct-icon__badge--maintenance{background:var(--warning);right:-2px;bottom:-2px;width:50%;height:50%;min-width:8px;min-height:8px;max-width:13px;max-height:13px;display:flex;align-items:center;justify-content:center;padding:1px;box-shadow:0 0 0 1.5px var(--bg-1)}.strct-icon__badge--maintenance svg{width:84%;height:84%;color:#000000d9}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
404
417
|
}
|
|
405
418
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: StrctIcon, decorators: [{
|
|
406
419
|
type: Component,
|
|
@@ -428,8 +441,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImpo
|
|
|
428
441
|
></svg>
|
|
429
442
|
}
|
|
430
443
|
@if (badge() !== 'none') {
|
|
431
|
-
<span class="strct-icon__badge strct-icon__badge--{{ badge() }}"
|
|
432
|
-
|
|
444
|
+
<span class="strct-icon__badge strct-icon__badge--{{ badge() }}">
|
|
445
|
+
@if (badge() === 'maintenance') {
|
|
446
|
+
<svg
|
|
447
|
+
viewBox="0 0 16 16"
|
|
448
|
+
fill="none"
|
|
449
|
+
stroke="currentColor"
|
|
450
|
+
stroke-width="1.4"
|
|
451
|
+
stroke-linecap="round"
|
|
452
|
+
stroke-linejoin="round"
|
|
453
|
+
>
|
|
454
|
+
<path d="M3.5 3.5c-.5 1.5.5 2.5 2 3l5 5M5 3c-1 0-2 1-1.5 2.5L10 12M12.5 3.5L6 10" />
|
|
455
|
+
</svg>
|
|
456
|
+
}
|
|
457
|
+
</span>
|
|
458
|
+
}`, host: { class: 'strct-icon' }, styles: [".strct-icon{position:relative;display:inline-flex;align-items:center;justify-content:center;line-height:0}.strct-icon__raw{display:inline-flex}.strct-icon__raw>svg{width:100%;height:100%;display:block}.strct-icon__badge{position:absolute;right:-2px;bottom:-2px;width:45%;height:45%;min-width:7px;min-height:7px;max-width:11px;max-height:11px;border-radius:50%;box-shadow:0 0 0 1.5px var(--bg-1)}.strct-icon__badge--success{background:var(--success)}.strct-icon__badge--warning{background:var(--warning);border-radius:1px;clip-path:polygon(50% 10%,92% 90%,8% 90%);box-shadow:none;filter:drop-shadow(0 0 1.5px var(--bg-1));right:-2px;bottom:-2px;width:56%;height:56%;min-width:10px;min-height:10px;max-width:16px;max-height:16px;display:flex;align-items:center;justify-content:center;font-size:clamp(6px,70%,10px);font-weight:800;color:#000000d9;line-height:1}.strct-icon__badge--warning:before{content:\"!\"}.strct-icon__badge--critical{background:var(--critical)}.strct-icon__badge--off{background:var(--t3)}.strct-icon__badge--info{background:var(--acc)}.strct-icon__badge--maintenance{background:var(--warning);right:-2px;bottom:-2px;width:50%;height:50%;min-width:8px;min-height:8px;max-width:13px;max-height:13px;display:flex;align-items:center;justify-content:center;padding:1px;box-shadow:0 0 0 1.5px var(--bg-1)}.strct-icon__badge--maintenance svg{width:84%;height:84%;color:#000000d9}\n"] }]
|
|
433
459
|
}], propDecorators: { name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: true }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], strokeWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "strokeWidth", required: false }] }], badge: [{ type: i0.Input, args: [{ isSignal: true, alias: "badge", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }] } });
|
|
434
460
|
|
|
435
461
|
/** Palette dots + light/dark pill, wired to {@link StrctThemeService}. */
|