@flywheel-io/vision 0.15.1 → 0.15.2
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.
|
@@ -17,10 +17,10 @@ export class FwAppIconComponent {
|
|
|
17
17
|
}
|
|
18
18
|
}
|
|
19
19
|
FwAppIconComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwAppIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
20
|
-
FwAppIconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FwAppIconComponent, selector: "fw-app-icon", inputs: { label: "label", icon: "icon", color: "color", size: "size", variant: "variant", badge: "badge", tabindex: "tabindex", locked: "locked", animated: "animated" }, host: { properties: { "tabindex": "this.tabindex", "class.locked": "this.locked", "class.animated": "this.animated", "role": "this.role", "class": "this.cssClass" } }, ngImport: i0, template: "<div class=\"icon-highlight\"></div>\n<div class=\"icon-wrapper\">\n <div class=\"app-badge\" *ngIf=\"badge\">{{ badge }}</div>\n <div class=\"app-locked\" *ngIf=\"locked\">\n <fw-icon>lock</fw-icon>\n </div>\n <fw-icon *ngIf=\"icon\">{{ icon }}</fw-icon>\n</div>\n<p class=\"vision-p3\" *ngIf=\"label\">{{ label }}</p>\n", styles: [":host{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;position:relative;outline:none}:host .icon-highlight{box-sizing:content-box;display:inline-flex;border:4px solid transparent;padding:2px;position:absolute;top:0}:host .icon-wrapper{display:inline-flex;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none;position:relative;box-sizing:border-box;margin
|
|
20
|
+
FwAppIconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FwAppIconComponent, selector: "fw-app-icon", inputs: { label: "label", icon: "icon", color: "color", size: "size", variant: "variant", badge: "badge", tabindex: "tabindex", locked: "locked", animated: "animated" }, host: { properties: { "tabindex": "this.tabindex", "class.locked": "this.locked", "class.animated": "this.animated", "role": "this.role", "class": "this.cssClass" } }, ngImport: i0, template: "<div class=\"icon-highlight\"></div>\n<div class=\"icon-wrapper\">\n <div class=\"app-badge\" *ngIf=\"badge\">{{ badge }}</div>\n <div class=\"app-locked\" *ngIf=\"locked\">\n <fw-icon>lock</fw-icon>\n </div>\n <fw-icon *ngIf=\"icon\">{{ icon }}</fw-icon>\n</div>\n<p class=\"vision-p3\" *ngIf=\"label\">{{ label }}</p>\n", styles: [":host{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;position:relative;outline:none}:host .icon-highlight{box-sizing:content-box;display:inline-flex;border:4px solid transparent;padding:2px;position:absolute;top:0}:host .icon-wrapper{display:inline-flex;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none;position:relative;box-sizing:border-box;margin:6px}:host p{margin:0;line-height:16.8px;-webkit-user-select:none;user-select:none;display:inline-block;color:var(--typography-muted);text-align:center}:host .app-badge{width:18px;height:18px;border-radius:64px;background:var(--red-base);font-size:10px;font-weight:500;line-height:17px;letter-spacing:0;text-align:center;color:var(--typography-contrast);display:inline-flex;align-items:start;justify-content:center;position:absolute;top:-6px;right:-6px;overflow:hidden;white-space:nowrap;box-shadow:0 1px 2px #0000000d}:host .app-locked{width:21px;height:21px;border-radius:64px;background:var(--slate-base);font-size:15px;color:var(--typography-contrast);display:inline-flex;align-items:center;justify-content:center;position:absolute;top:-6px;right:-6px;overflow:hidden;white-space:nowrap;box-shadow:0 2px 5px #0000001a}:host.primary .icon-wrapper{background-color:var(--primary-base)}:host.primary .icon-wrapper>fw-icon{color:var(--typography-contrast)}:host.dark .icon-wrapper{background-color:var(--primary-dark)}:host.dark .icon-wrapper>fw-icon{color:var(--typography-contrast)}:host.gradient .icon-wrapper{background:linear-gradient(23.3deg,#093af6 -22.41%,#1b68fa 41.03%,#b080fc 94.31%)}:host.gradient .icon-wrapper>fw-icon{color:var(--typography-contrast)}:host.light .icon-wrapper{background-color:var(--page-light);outline:1px solid #e3e6ea}:host.light .icon-wrapper>fw-icon{background:-webkit-linear-gradient(23.3deg,#093af6 -22.41%,#1b68fa 41.03%,#b080fc 94.31%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}:host.small .icon-highlight{border-radius:12px;width:24px;height:24px}:host.small .icon-wrapper{display:inline-flex;width:24px;height:24px;border-radius:6px;align-items:center;justify-content:center}:host.small .icon-wrapper>fw-icon{font-size:16px}:host.small .app-badge{width:8px;height:8px;border-radius:8px;text-indent:-9999px;top:-3px;right:-3px;box-shadow:-1px 1px #00000040}:host.medium .icon-highlight{border-radius:14px;width:32px;height:32px}:host.medium .icon-wrapper{display:inline-flex;width:32px;height:32px;border-radius:8px;align-items:center;justify-content:center}:host.medium .icon-wrapper>fw-icon{font-size:20px}:host.medium .app-badge{width:8px;height:8px;border-radius:8px;text-indent:-9999px;top:-3px;right:-3px;box-shadow:-1px 1px #00000040}:host.large .icon-highlight{border-radius:18px;width:48px;height:48px}:host.large .icon-wrapper{display:inline-flex;width:48px;height:48px;border-radius:12px;align-items:center;justify-content:center}:host.large .icon-wrapper>fw-icon{font-size:32px}:host.extra-large .icon-highlight{border-radius:22px;width:64px;height:64px}:host.extra-large .icon-wrapper{display:inline-flex;width:64px;height:64px;border-radius:16px;align-items:center;justify-content:center}:host.extra-large .icon-wrapper>fw-icon{font-size:48px}:host.extra-large p{max-width:64px}:host.interactive .icon-highlight{border:4px solid transparent}:host.hover .icon-highlight,:host:hover .icon-highlight{border:4px solid var(--primary-border)}@keyframes rubber-band{0%{transform:scale(.95)}20%{transform:scale(1.05)}32%{transform:scale(.95)}48%{transform:scale(1)}}:host.animated.hover .icon-highlight,:host.animated:hover .icon-highlight{animation:rubber-band .5s linear forwards;border:4px solid var(--primary-border)}:host.focused .icon-highlight,:host:focus .icon-highlight,:host.animated:focus .icon-highlight{border:4px solid var(--primary-base)}:host.focused p,:host:focus p,:host.animated:focus p{color:var(--typography-base)}:host.static .icon-highlight,:host.static:hover .icon-highlight,:host.static.animated:hover .icon-highlight{border:4px solid transparent}:host.locked{pointer-events:none}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.FwIconComponent, selector: "fw-icon" }] });
|
|
21
21
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwAppIconComponent, decorators: [{
|
|
22
22
|
type: Component,
|
|
23
|
-
args: [{ selector: 'fw-app-icon', template: "<div class=\"icon-highlight\"></div>\n<div class=\"icon-wrapper\">\n <div class=\"app-badge\" *ngIf=\"badge\">{{ badge }}</div>\n <div class=\"app-locked\" *ngIf=\"locked\">\n <fw-icon>lock</fw-icon>\n </div>\n <fw-icon *ngIf=\"icon\">{{ icon }}</fw-icon>\n</div>\n<p class=\"vision-p3\" *ngIf=\"label\">{{ label }}</p>\n", styles: [":host{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;position:relative;outline:none}:host .icon-highlight{box-sizing:content-box;display:inline-flex;border:4px solid transparent;padding:2px;position:absolute;top:0}:host .icon-wrapper{display:inline-flex;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none;position:relative;box-sizing:border-box;margin
|
|
23
|
+
args: [{ selector: 'fw-app-icon', template: "<div class=\"icon-highlight\"></div>\n<div class=\"icon-wrapper\">\n <div class=\"app-badge\" *ngIf=\"badge\">{{ badge }}</div>\n <div class=\"app-locked\" *ngIf=\"locked\">\n <fw-icon>lock</fw-icon>\n </div>\n <fw-icon *ngIf=\"icon\">{{ icon }}</fw-icon>\n</div>\n<p class=\"vision-p3\" *ngIf=\"label\">{{ label }}</p>\n", styles: [":host{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;position:relative;outline:none}:host .icon-highlight{box-sizing:content-box;display:inline-flex;border:4px solid transparent;padding:2px;position:absolute;top:0}:host .icon-wrapper{display:inline-flex;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none;position:relative;box-sizing:border-box;margin:6px}:host p{margin:0;line-height:16.8px;-webkit-user-select:none;user-select:none;display:inline-block;color:var(--typography-muted);text-align:center}:host .app-badge{width:18px;height:18px;border-radius:64px;background:var(--red-base);font-size:10px;font-weight:500;line-height:17px;letter-spacing:0;text-align:center;color:var(--typography-contrast);display:inline-flex;align-items:start;justify-content:center;position:absolute;top:-6px;right:-6px;overflow:hidden;white-space:nowrap;box-shadow:0 1px 2px #0000000d}:host .app-locked{width:21px;height:21px;border-radius:64px;background:var(--slate-base);font-size:15px;color:var(--typography-contrast);display:inline-flex;align-items:center;justify-content:center;position:absolute;top:-6px;right:-6px;overflow:hidden;white-space:nowrap;box-shadow:0 2px 5px #0000001a}:host.primary .icon-wrapper{background-color:var(--primary-base)}:host.primary .icon-wrapper>fw-icon{color:var(--typography-contrast)}:host.dark .icon-wrapper{background-color:var(--primary-dark)}:host.dark .icon-wrapper>fw-icon{color:var(--typography-contrast)}:host.gradient .icon-wrapper{background:linear-gradient(23.3deg,#093af6 -22.41%,#1b68fa 41.03%,#b080fc 94.31%)}:host.gradient .icon-wrapper>fw-icon{color:var(--typography-contrast)}:host.light .icon-wrapper{background-color:var(--page-light);outline:1px solid #e3e6ea}:host.light .icon-wrapper>fw-icon{background:-webkit-linear-gradient(23.3deg,#093af6 -22.41%,#1b68fa 41.03%,#b080fc 94.31%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}:host.small .icon-highlight{border-radius:12px;width:24px;height:24px}:host.small .icon-wrapper{display:inline-flex;width:24px;height:24px;border-radius:6px;align-items:center;justify-content:center}:host.small .icon-wrapper>fw-icon{font-size:16px}:host.small .app-badge{width:8px;height:8px;border-radius:8px;text-indent:-9999px;top:-3px;right:-3px;box-shadow:-1px 1px #00000040}:host.medium .icon-highlight{border-radius:14px;width:32px;height:32px}:host.medium .icon-wrapper{display:inline-flex;width:32px;height:32px;border-radius:8px;align-items:center;justify-content:center}:host.medium .icon-wrapper>fw-icon{font-size:20px}:host.medium .app-badge{width:8px;height:8px;border-radius:8px;text-indent:-9999px;top:-3px;right:-3px;box-shadow:-1px 1px #00000040}:host.large .icon-highlight{border-radius:18px;width:48px;height:48px}:host.large .icon-wrapper{display:inline-flex;width:48px;height:48px;border-radius:12px;align-items:center;justify-content:center}:host.large .icon-wrapper>fw-icon{font-size:32px}:host.extra-large .icon-highlight{border-radius:22px;width:64px;height:64px}:host.extra-large .icon-wrapper{display:inline-flex;width:64px;height:64px;border-radius:16px;align-items:center;justify-content:center}:host.extra-large .icon-wrapper>fw-icon{font-size:48px}:host.extra-large p{max-width:64px}:host.interactive .icon-highlight{border:4px solid transparent}:host.hover .icon-highlight,:host:hover .icon-highlight{border:4px solid var(--primary-border)}@keyframes rubber-band{0%{transform:scale(.95)}20%{transform:scale(1.05)}32%{transform:scale(.95)}48%{transform:scale(1)}}:host.animated.hover .icon-highlight,:host.animated:hover .icon-highlight{animation:rubber-band .5s linear forwards;border:4px solid var(--primary-border)}:host.focused .icon-highlight,:host:focus .icon-highlight,:host.animated:focus .icon-highlight{border:4px solid var(--primary-base)}:host.focused p,:host:focus p,:host.animated:focus p{color:var(--typography-base)}:host.static .icon-highlight,:host.static:hover .icon-highlight,:host.static.animated:hover .icon-highlight{border:4px solid transparent}:host.locked{pointer-events:none}\n"] }]
|
|
24
24
|
}], propDecorators: { label: [{
|
|
25
25
|
type: Input
|
|
26
26
|
}], icon: [{
|
|
@@ -200,10 +200,10 @@ class FwAppIconComponent {
|
|
|
200
200
|
}
|
|
201
201
|
}
|
|
202
202
|
FwAppIconComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwAppIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
203
|
-
FwAppIconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FwAppIconComponent, selector: "fw-app-icon", inputs: { label: "label", icon: "icon", color: "color", size: "size", variant: "variant", badge: "badge", tabindex: "tabindex", locked: "locked", animated: "animated" }, host: { properties: { "tabindex": "this.tabindex", "class.locked": "this.locked", "class.animated": "this.animated", "role": "this.role", "class": "this.cssClass" } }, ngImport: i0, template: "<div class=\"icon-highlight\"></div>\n<div class=\"icon-wrapper\">\n <div class=\"app-badge\" *ngIf=\"badge\">{{ badge }}</div>\n <div class=\"app-locked\" *ngIf=\"locked\">\n <fw-icon>lock</fw-icon>\n </div>\n <fw-icon *ngIf=\"icon\">{{ icon }}</fw-icon>\n</div>\n<p class=\"vision-p3\" *ngIf=\"label\">{{ label }}</p>\n", styles: [":host{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;position:relative;outline:none}:host .icon-highlight{box-sizing:content-box;display:inline-flex;border:4px solid transparent;padding:2px;position:absolute;top:0}:host .icon-wrapper{display:inline-flex;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none;position:relative;box-sizing:border-box;margin
|
|
203
|
+
FwAppIconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FwAppIconComponent, selector: "fw-app-icon", inputs: { label: "label", icon: "icon", color: "color", size: "size", variant: "variant", badge: "badge", tabindex: "tabindex", locked: "locked", animated: "animated" }, host: { properties: { "tabindex": "this.tabindex", "class.locked": "this.locked", "class.animated": "this.animated", "role": "this.role", "class": "this.cssClass" } }, ngImport: i0, template: "<div class=\"icon-highlight\"></div>\n<div class=\"icon-wrapper\">\n <div class=\"app-badge\" *ngIf=\"badge\">{{ badge }}</div>\n <div class=\"app-locked\" *ngIf=\"locked\">\n <fw-icon>lock</fw-icon>\n </div>\n <fw-icon *ngIf=\"icon\">{{ icon }}</fw-icon>\n</div>\n<p class=\"vision-p3\" *ngIf=\"label\">{{ label }}</p>\n", styles: [":host{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;position:relative;outline:none}:host .icon-highlight{box-sizing:content-box;display:inline-flex;border:4px solid transparent;padding:2px;position:absolute;top:0}:host .icon-wrapper{display:inline-flex;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none;position:relative;box-sizing:border-box;margin:6px}:host p{margin:0;line-height:16.8px;-webkit-user-select:none;user-select:none;display:inline-block;color:var(--typography-muted);text-align:center}:host .app-badge{width:18px;height:18px;border-radius:64px;background:var(--red-base);font-size:10px;font-weight:500;line-height:17px;letter-spacing:0;text-align:center;color:var(--typography-contrast);display:inline-flex;align-items:start;justify-content:center;position:absolute;top:-6px;right:-6px;overflow:hidden;white-space:nowrap;box-shadow:0 1px 2px #0000000d}:host .app-locked{width:21px;height:21px;border-radius:64px;background:var(--slate-base);font-size:15px;color:var(--typography-contrast);display:inline-flex;align-items:center;justify-content:center;position:absolute;top:-6px;right:-6px;overflow:hidden;white-space:nowrap;box-shadow:0 2px 5px #0000001a}:host.primary .icon-wrapper{background-color:var(--primary-base)}:host.primary .icon-wrapper>fw-icon{color:var(--typography-contrast)}:host.dark .icon-wrapper{background-color:var(--primary-dark)}:host.dark .icon-wrapper>fw-icon{color:var(--typography-contrast)}:host.gradient .icon-wrapper{background:linear-gradient(23.3deg,#093af6 -22.41%,#1b68fa 41.03%,#b080fc 94.31%)}:host.gradient .icon-wrapper>fw-icon{color:var(--typography-contrast)}:host.light .icon-wrapper{background-color:var(--page-light);outline:1px solid #e3e6ea}:host.light .icon-wrapper>fw-icon{background:-webkit-linear-gradient(23.3deg,#093af6 -22.41%,#1b68fa 41.03%,#b080fc 94.31%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}:host.small .icon-highlight{border-radius:12px;width:24px;height:24px}:host.small .icon-wrapper{display:inline-flex;width:24px;height:24px;border-radius:6px;align-items:center;justify-content:center}:host.small .icon-wrapper>fw-icon{font-size:16px}:host.small .app-badge{width:8px;height:8px;border-radius:8px;text-indent:-9999px;top:-3px;right:-3px;box-shadow:-1px 1px #00000040}:host.medium .icon-highlight{border-radius:14px;width:32px;height:32px}:host.medium .icon-wrapper{display:inline-flex;width:32px;height:32px;border-radius:8px;align-items:center;justify-content:center}:host.medium .icon-wrapper>fw-icon{font-size:20px}:host.medium .app-badge{width:8px;height:8px;border-radius:8px;text-indent:-9999px;top:-3px;right:-3px;box-shadow:-1px 1px #00000040}:host.large .icon-highlight{border-radius:18px;width:48px;height:48px}:host.large .icon-wrapper{display:inline-flex;width:48px;height:48px;border-radius:12px;align-items:center;justify-content:center}:host.large .icon-wrapper>fw-icon{font-size:32px}:host.extra-large .icon-highlight{border-radius:22px;width:64px;height:64px}:host.extra-large .icon-wrapper{display:inline-flex;width:64px;height:64px;border-radius:16px;align-items:center;justify-content:center}:host.extra-large .icon-wrapper>fw-icon{font-size:48px}:host.extra-large p{max-width:64px}:host.interactive .icon-highlight{border:4px solid transparent}:host.hover .icon-highlight,:host:hover .icon-highlight{border:4px solid var(--primary-border)}@keyframes rubber-band{0%{transform:scale(.95)}20%{transform:scale(1.05)}32%{transform:scale(.95)}48%{transform:scale(1)}}:host.animated.hover .icon-highlight,:host.animated:hover .icon-highlight{animation:rubber-band .5s linear forwards;border:4px solid var(--primary-border)}:host.focused .icon-highlight,:host:focus .icon-highlight,:host.animated:focus .icon-highlight{border:4px solid var(--primary-base)}:host.focused p,:host:focus p,:host.animated:focus p{color:var(--typography-base)}:host.static .icon-highlight,:host.static:hover .icon-highlight,:host.static.animated:hover .icon-highlight{border:4px solid transparent}:host.locked{pointer-events:none}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: FwIconComponent, selector: "fw-icon" }] });
|
|
204
204
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FwAppIconComponent, decorators: [{
|
|
205
205
|
type: Component,
|
|
206
|
-
args: [{ selector: 'fw-app-icon', template: "<div class=\"icon-highlight\"></div>\n<div class=\"icon-wrapper\">\n <div class=\"app-badge\" *ngIf=\"badge\">{{ badge }}</div>\n <div class=\"app-locked\" *ngIf=\"locked\">\n <fw-icon>lock</fw-icon>\n </div>\n <fw-icon *ngIf=\"icon\">{{ icon }}</fw-icon>\n</div>\n<p class=\"vision-p3\" *ngIf=\"label\">{{ label }}</p>\n", styles: [":host{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;position:relative;outline:none}:host .icon-highlight{box-sizing:content-box;display:inline-flex;border:4px solid transparent;padding:2px;position:absolute;top:0}:host .icon-wrapper{display:inline-flex;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none;position:relative;box-sizing:border-box;margin
|
|
206
|
+
args: [{ selector: 'fw-app-icon', template: "<div class=\"icon-highlight\"></div>\n<div class=\"icon-wrapper\">\n <div class=\"app-badge\" *ngIf=\"badge\">{{ badge }}</div>\n <div class=\"app-locked\" *ngIf=\"locked\">\n <fw-icon>lock</fw-icon>\n </div>\n <fw-icon *ngIf=\"icon\">{{ icon }}</fw-icon>\n</div>\n<p class=\"vision-p3\" *ngIf=\"label\">{{ label }}</p>\n", styles: [":host{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;position:relative;outline:none}:host .icon-highlight{box-sizing:content-box;display:inline-flex;border:4px solid transparent;padding:2px;position:absolute;top:0}:host .icon-wrapper{display:inline-flex;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none;position:relative;box-sizing:border-box;margin:6px}:host p{margin:0;line-height:16.8px;-webkit-user-select:none;user-select:none;display:inline-block;color:var(--typography-muted);text-align:center}:host .app-badge{width:18px;height:18px;border-radius:64px;background:var(--red-base);font-size:10px;font-weight:500;line-height:17px;letter-spacing:0;text-align:center;color:var(--typography-contrast);display:inline-flex;align-items:start;justify-content:center;position:absolute;top:-6px;right:-6px;overflow:hidden;white-space:nowrap;box-shadow:0 1px 2px #0000000d}:host .app-locked{width:21px;height:21px;border-radius:64px;background:var(--slate-base);font-size:15px;color:var(--typography-contrast);display:inline-flex;align-items:center;justify-content:center;position:absolute;top:-6px;right:-6px;overflow:hidden;white-space:nowrap;box-shadow:0 2px 5px #0000001a}:host.primary .icon-wrapper{background-color:var(--primary-base)}:host.primary .icon-wrapper>fw-icon{color:var(--typography-contrast)}:host.dark .icon-wrapper{background-color:var(--primary-dark)}:host.dark .icon-wrapper>fw-icon{color:var(--typography-contrast)}:host.gradient .icon-wrapper{background:linear-gradient(23.3deg,#093af6 -22.41%,#1b68fa 41.03%,#b080fc 94.31%)}:host.gradient .icon-wrapper>fw-icon{color:var(--typography-contrast)}:host.light .icon-wrapper{background-color:var(--page-light);outline:1px solid #e3e6ea}:host.light .icon-wrapper>fw-icon{background:-webkit-linear-gradient(23.3deg,#093af6 -22.41%,#1b68fa 41.03%,#b080fc 94.31%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}:host.small .icon-highlight{border-radius:12px;width:24px;height:24px}:host.small .icon-wrapper{display:inline-flex;width:24px;height:24px;border-radius:6px;align-items:center;justify-content:center}:host.small .icon-wrapper>fw-icon{font-size:16px}:host.small .app-badge{width:8px;height:8px;border-radius:8px;text-indent:-9999px;top:-3px;right:-3px;box-shadow:-1px 1px #00000040}:host.medium .icon-highlight{border-radius:14px;width:32px;height:32px}:host.medium .icon-wrapper{display:inline-flex;width:32px;height:32px;border-radius:8px;align-items:center;justify-content:center}:host.medium .icon-wrapper>fw-icon{font-size:20px}:host.medium .app-badge{width:8px;height:8px;border-radius:8px;text-indent:-9999px;top:-3px;right:-3px;box-shadow:-1px 1px #00000040}:host.large .icon-highlight{border-radius:18px;width:48px;height:48px}:host.large .icon-wrapper{display:inline-flex;width:48px;height:48px;border-radius:12px;align-items:center;justify-content:center}:host.large .icon-wrapper>fw-icon{font-size:32px}:host.extra-large .icon-highlight{border-radius:22px;width:64px;height:64px}:host.extra-large .icon-wrapper{display:inline-flex;width:64px;height:64px;border-radius:16px;align-items:center;justify-content:center}:host.extra-large .icon-wrapper>fw-icon{font-size:48px}:host.extra-large p{max-width:64px}:host.interactive .icon-highlight{border:4px solid transparent}:host.hover .icon-highlight,:host:hover .icon-highlight{border:4px solid var(--primary-border)}@keyframes rubber-band{0%{transform:scale(.95)}20%{transform:scale(1.05)}32%{transform:scale(.95)}48%{transform:scale(1)}}:host.animated.hover .icon-highlight,:host.animated:hover .icon-highlight{animation:rubber-band .5s linear forwards;border:4px solid var(--primary-border)}:host.focused .icon-highlight,:host:focus .icon-highlight,:host.animated:focus .icon-highlight{border:4px solid var(--primary-base)}:host.focused p,:host:focus p,:host.animated:focus p{color:var(--typography-base)}:host.static .icon-highlight,:host.static:hover .icon-highlight,:host.static.animated:hover .icon-highlight{border:4px solid transparent}:host.locked{pointer-events:none}\n"] }]
|
|
207
207
|
}], propDecorators: { label: [{
|
|
208
208
|
type: Input
|
|
209
209
|
}], icon: [{
|