valtech-components 2.0.237 → 2.0.239
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/molecules/layered-card/layered-card.component.mjs +25 -7
- package/esm2022/lib/components/molecules/layered-card/types.mjs +1 -1
- package/fesm2022/valtech-components.mjs +24 -6
- package/fesm2022/valtech-components.mjs.map +1 -1
- package/lib/components/molecules/layered-card/types.d.ts +4 -2
- package/package.json +1 -1
|
@@ -22,20 +22,29 @@ export class LayeredCardComponent {
|
|
|
22
22
|
class="fun-card"
|
|
23
23
|
[class.big-space]="props.bigSpace"
|
|
24
24
|
[class.hoverable]="props.hoverable"
|
|
25
|
+
[class.with-opacity]="props.withOpacity"
|
|
26
|
+
[class.layered]="props.mode === 'layered'"
|
|
27
|
+
[class.poster]="props.mode === 'poster'"
|
|
25
28
|
[ngStyle]="{
|
|
26
29
|
background: theme.IsDark ? 'var(--ion-background-color)' : color(props.background),
|
|
27
30
|
minHeight: props.withMin ? '340px' : 'auto',
|
|
28
31
|
}"
|
|
29
32
|
>
|
|
30
|
-
|
|
33
|
+
@if (props.mode === 'poster') {
|
|
34
|
+
<img class="poster-image" [class.dark]="props.dark" alt="image" [src]="props.image" />
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
@if (props.mode === 'layered') {
|
|
38
|
+
<img class="layer-image" [class.dark]="props.dark" alt="image" [src]="props.image" />
|
|
39
|
+
}
|
|
31
40
|
|
|
32
41
|
<val-title-block [props]="props.content" />
|
|
33
42
|
|
|
34
43
|
@if (props.actions) {
|
|
35
|
-
<val-button-group [props]="props.actions" />
|
|
44
|
+
<val-button-group style="margin-top: 16px;" [props]="props.actions" />
|
|
36
45
|
}
|
|
37
46
|
</div>
|
|
38
|
-
`, isInline: true, styles: [":root{--ion-color-primary: #7026df;--ion-color-primary-rgb: 112, 38, 223;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #6321c4;--ion-color-primary-tint: #7e3ce2;--ion-color-secondary: #e2ccff;--ion-color-secondary-rgb: 226, 204, 255;--ion-color-secondary-contrast: #000000;--ion-color-secondary-contrast-rgb: 0, 0, 0;--ion-color-secondary-shade: #c7b4e0;--ion-color-secondary-tint: #e5d1ff;--ion-color-texti: #354c69;--ion-color-texti-rgb: 53, 76, 105;--ion-color-texti-contrast: #ffffff;--ion-color-texti-contrast-rgb: 255, 255, 255;--ion-color-texti-shade: #2f435c;--ion-color-texti-tint: #495e78;--ion-color-darki: #090f1b;--ion-color-darki-rgb: 9, 15, 27;--ion-color-darki-contrast: #ffffff;--ion-color-darki-contrast-rgb: 255, 255, 255;--ion-color-darki-shade: #080d18;--ion-color-darki-tint: #222732;--ion-color-medium: #9e9e9e;--ion-color-medium-rgb: 158, 158, 158;--ion-color-medium-contrast: #000000;--ion-color-medium-contrast-rgb: 0, 0, 0;--ion-color-medium-shade: #8b8b8b;--ion-color-medium-tint: #a8a8a8}@media (prefers-color-scheme: dark){:root{--ion-color-texti: #8fc1ff;--ion-color-texti-rgb: 143, 193, 255;--ion-color-texti-contrast: #000000;--ion-color-texti-contrast-rgb: 0, 0, 0;--ion-color-texti-shade: #7eaae0;--ion-color-texti-tint: #9ac7ff;--ion-color-darki: #ffffff;--ion-color-darki-rgb: 255, 255, 255;--ion-color-darki-contrast: #000000;--ion-color-darki-contrast-rgb: 0, 0, 0;--ion-color-darki-shade: #e0e0e0;--ion-color-darki-tint: #ffffff;--ion-color-primary: #8f49f8;--ion-color-primary-rgb: 143,73,248;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255,255,255;--ion-color-primary-shade: #7e40da;--ion-color-primary-tint: #9a5bf9}}.ion-color-texti{--ion-color-base: var(--ion-color-texti);--ion-color-base-rgb: var(--ion-color-texti-rgb);--ion-color-contrast: var(--ion-color-texti-contrast);--ion-color-contrast-rgb: var(--ion-color-texti-contrast-rgb);--ion-color-shade: var(--ion-color-texti-shade);--ion-color-tint: var(--ion-color-texti-tint)}.ion-color-darki{--ion-color-base: var(--ion-color-darki);--ion-color-base-rgb: var(--ion-color-darki-rgb);--ion-color-contrast: var(--ion-color-darki-contrast);--ion-color-contrast-rgb: var(--ion-color-darki-contrast-rgb);--ion-color-shade: var(--ion-color-darki-shade);--ion-color-tint: var(--ion-color-darki-tint)}.fun-card{z-index:0;position:relative;cursor:pointer;background:var(--ion-card-background, var(--ion-item-background, var(--ion-background-color, #fff)));display:flex;border-radius:1.5rem;align-items:start;padding:1rem;
|
|
47
|
+
`, isInline: true, styles: [":root{--ion-color-primary: #7026df;--ion-color-primary-rgb: 112, 38, 223;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #6321c4;--ion-color-primary-tint: #7e3ce2;--ion-color-secondary: #e2ccff;--ion-color-secondary-rgb: 226, 204, 255;--ion-color-secondary-contrast: #000000;--ion-color-secondary-contrast-rgb: 0, 0, 0;--ion-color-secondary-shade: #c7b4e0;--ion-color-secondary-tint: #e5d1ff;--ion-color-texti: #354c69;--ion-color-texti-rgb: 53, 76, 105;--ion-color-texti-contrast: #ffffff;--ion-color-texti-contrast-rgb: 255, 255, 255;--ion-color-texti-shade: #2f435c;--ion-color-texti-tint: #495e78;--ion-color-darki: #090f1b;--ion-color-darki-rgb: 9, 15, 27;--ion-color-darki-contrast: #ffffff;--ion-color-darki-contrast-rgb: 255, 255, 255;--ion-color-darki-shade: #080d18;--ion-color-darki-tint: #222732;--ion-color-medium: #9e9e9e;--ion-color-medium-rgb: 158, 158, 158;--ion-color-medium-contrast: #000000;--ion-color-medium-contrast-rgb: 0, 0, 0;--ion-color-medium-shade: #8b8b8b;--ion-color-medium-tint: #a8a8a8}@media (prefers-color-scheme: dark){:root{--ion-color-texti: #8fc1ff;--ion-color-texti-rgb: 143, 193, 255;--ion-color-texti-contrast: #000000;--ion-color-texti-contrast-rgb: 0, 0, 0;--ion-color-texti-shade: #7eaae0;--ion-color-texti-tint: #9ac7ff;--ion-color-darki: #ffffff;--ion-color-darki-rgb: 255, 255, 255;--ion-color-darki-contrast: #000000;--ion-color-darki-contrast-rgb: 0, 0, 0;--ion-color-darki-shade: #e0e0e0;--ion-color-darki-tint: #ffffff;--ion-color-primary: #8f49f8;--ion-color-primary-rgb: 143,73,248;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255,255,255;--ion-color-primary-shade: #7e40da;--ion-color-primary-tint: #9a5bf9}}.ion-color-texti{--ion-color-base: var(--ion-color-texti);--ion-color-base-rgb: var(--ion-color-texti-rgb);--ion-color-contrast: var(--ion-color-texti-contrast);--ion-color-contrast-rgb: var(--ion-color-texti-contrast-rgb);--ion-color-shade: var(--ion-color-texti-shade);--ion-color-tint: var(--ion-color-texti-tint)}.ion-color-darki{--ion-color-base: var(--ion-color-darki);--ion-color-base-rgb: var(--ion-color-darki-rgb);--ion-color-contrast: var(--ion-color-darki-contrast);--ion-color-contrast-rgb: var(--ion-color-darki-contrast-rgb);--ion-color-shade: var(--ion-color-darki-shade);--ion-color-tint: var(--ion-color-darki-tint)}.fun-card{z-index:0;position:relative;cursor:pointer;background:var(--ion-card-background, var(--ion-item-background, var(--ion-background-color, #fff)));display:flex;border-radius:1.5rem;align-items:start;padding:1rem;justify-content:space-between;box-shadow:0 .25rem .75rem #12195412}@media (prefers-color-scheme: dark){.fun-card{border:.0625rem solid var(--ion-color-medium)}}.fun-card.layered{flex-direction:column}.fun-card.poster{flex-direction:row}.fun-card.hoverable{transition:transform .3s ease,box-shadow .3s ease}.fun-card.hoverable:hover{transform:scale(1.01);box-shadow:.1875rem .625rem .5rem #1219541a}.fun-card.big-space{padding:2.625rem}.layer-image{z-index:-1;right:3%;bottom:2%;position:absolute;max-height:100%;max-width:40%;padding:.5rem}.layer-imagewith-opacity{opacity:.1}@media (prefers-color-scheme: dark){.layer-image.dark{opacity:.2;filter:invert(1)}}.poster-image{max-height:100%;max-width:30%;padding:.5rem}.poster-imagewith-opacity{opacity:.1}@media (prefers-color-scheme: dark){.poster-image.dark{opacity:.2;filter:invert(1)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: ButtonGroupComponent, selector: "val-button-group", inputs: ["props"], outputs: ["onClick"] }, { kind: "component", type: TitleBlockComponent, selector: "val-title-block", inputs: ["props"] }] }); }
|
|
39
48
|
}
|
|
40
49
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: LayeredCardComponent, decorators: [{
|
|
41
50
|
type: Component,
|
|
@@ -44,21 +53,30 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
44
53
|
class="fun-card"
|
|
45
54
|
[class.big-space]="props.bigSpace"
|
|
46
55
|
[class.hoverable]="props.hoverable"
|
|
56
|
+
[class.with-opacity]="props.withOpacity"
|
|
57
|
+
[class.layered]="props.mode === 'layered'"
|
|
58
|
+
[class.poster]="props.mode === 'poster'"
|
|
47
59
|
[ngStyle]="{
|
|
48
60
|
background: theme.IsDark ? 'var(--ion-background-color)' : color(props.background),
|
|
49
61
|
minHeight: props.withMin ? '340px' : 'auto',
|
|
50
62
|
}"
|
|
51
63
|
>
|
|
52
|
-
|
|
64
|
+
@if (props.mode === 'poster') {
|
|
65
|
+
<img class="poster-image" [class.dark]="props.dark" alt="image" [src]="props.image" />
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
@if (props.mode === 'layered') {
|
|
69
|
+
<img class="layer-image" [class.dark]="props.dark" alt="image" [src]="props.image" />
|
|
70
|
+
}
|
|
53
71
|
|
|
54
72
|
<val-title-block [props]="props.content" />
|
|
55
73
|
|
|
56
74
|
@if (props.actions) {
|
|
57
|
-
<val-button-group [props]="props.actions" />
|
|
75
|
+
<val-button-group style="margin-top: 16px;" [props]="props.actions" />
|
|
58
76
|
}
|
|
59
77
|
</div>
|
|
60
|
-
`, styles: [":root{--ion-color-primary: #7026df;--ion-color-primary-rgb: 112, 38, 223;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #6321c4;--ion-color-primary-tint: #7e3ce2;--ion-color-secondary: #e2ccff;--ion-color-secondary-rgb: 226, 204, 255;--ion-color-secondary-contrast: #000000;--ion-color-secondary-contrast-rgb: 0, 0, 0;--ion-color-secondary-shade: #c7b4e0;--ion-color-secondary-tint: #e5d1ff;--ion-color-texti: #354c69;--ion-color-texti-rgb: 53, 76, 105;--ion-color-texti-contrast: #ffffff;--ion-color-texti-contrast-rgb: 255, 255, 255;--ion-color-texti-shade: #2f435c;--ion-color-texti-tint: #495e78;--ion-color-darki: #090f1b;--ion-color-darki-rgb: 9, 15, 27;--ion-color-darki-contrast: #ffffff;--ion-color-darki-contrast-rgb: 255, 255, 255;--ion-color-darki-shade: #080d18;--ion-color-darki-tint: #222732;--ion-color-medium: #9e9e9e;--ion-color-medium-rgb: 158, 158, 158;--ion-color-medium-contrast: #000000;--ion-color-medium-contrast-rgb: 0, 0, 0;--ion-color-medium-shade: #8b8b8b;--ion-color-medium-tint: #a8a8a8}@media (prefers-color-scheme: dark){:root{--ion-color-texti: #8fc1ff;--ion-color-texti-rgb: 143, 193, 255;--ion-color-texti-contrast: #000000;--ion-color-texti-contrast-rgb: 0, 0, 0;--ion-color-texti-shade: #7eaae0;--ion-color-texti-tint: #9ac7ff;--ion-color-darki: #ffffff;--ion-color-darki-rgb: 255, 255, 255;--ion-color-darki-contrast: #000000;--ion-color-darki-contrast-rgb: 0, 0, 0;--ion-color-darki-shade: #e0e0e0;--ion-color-darki-tint: #ffffff;--ion-color-primary: #8f49f8;--ion-color-primary-rgb: 143,73,248;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255,255,255;--ion-color-primary-shade: #7e40da;--ion-color-primary-tint: #9a5bf9}}.ion-color-texti{--ion-color-base: var(--ion-color-texti);--ion-color-base-rgb: var(--ion-color-texti-rgb);--ion-color-contrast: var(--ion-color-texti-contrast);--ion-color-contrast-rgb: var(--ion-color-texti-contrast-rgb);--ion-color-shade: var(--ion-color-texti-shade);--ion-color-tint: var(--ion-color-texti-tint)}.ion-color-darki{--ion-color-base: var(--ion-color-darki);--ion-color-base-rgb: var(--ion-color-darki-rgb);--ion-color-contrast: var(--ion-color-darki-contrast);--ion-color-contrast-rgb: var(--ion-color-darki-contrast-rgb);--ion-color-shade: var(--ion-color-darki-shade);--ion-color-tint: var(--ion-color-darki-tint)}.fun-card{z-index:0;position:relative;cursor:pointer;background:var(--ion-card-background, var(--ion-item-background, var(--ion-background-color, #fff)));display:flex;border-radius:1.5rem;align-items:start;padding:1rem;
|
|
78
|
+
`, styles: [":root{--ion-color-primary: #7026df;--ion-color-primary-rgb: 112, 38, 223;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #6321c4;--ion-color-primary-tint: #7e3ce2;--ion-color-secondary: #e2ccff;--ion-color-secondary-rgb: 226, 204, 255;--ion-color-secondary-contrast: #000000;--ion-color-secondary-contrast-rgb: 0, 0, 0;--ion-color-secondary-shade: #c7b4e0;--ion-color-secondary-tint: #e5d1ff;--ion-color-texti: #354c69;--ion-color-texti-rgb: 53, 76, 105;--ion-color-texti-contrast: #ffffff;--ion-color-texti-contrast-rgb: 255, 255, 255;--ion-color-texti-shade: #2f435c;--ion-color-texti-tint: #495e78;--ion-color-darki: #090f1b;--ion-color-darki-rgb: 9, 15, 27;--ion-color-darki-contrast: #ffffff;--ion-color-darki-contrast-rgb: 255, 255, 255;--ion-color-darki-shade: #080d18;--ion-color-darki-tint: #222732;--ion-color-medium: #9e9e9e;--ion-color-medium-rgb: 158, 158, 158;--ion-color-medium-contrast: #000000;--ion-color-medium-contrast-rgb: 0, 0, 0;--ion-color-medium-shade: #8b8b8b;--ion-color-medium-tint: #a8a8a8}@media (prefers-color-scheme: dark){:root{--ion-color-texti: #8fc1ff;--ion-color-texti-rgb: 143, 193, 255;--ion-color-texti-contrast: #000000;--ion-color-texti-contrast-rgb: 0, 0, 0;--ion-color-texti-shade: #7eaae0;--ion-color-texti-tint: #9ac7ff;--ion-color-darki: #ffffff;--ion-color-darki-rgb: 255, 255, 255;--ion-color-darki-contrast: #000000;--ion-color-darki-contrast-rgb: 0, 0, 0;--ion-color-darki-shade: #e0e0e0;--ion-color-darki-tint: #ffffff;--ion-color-primary: #8f49f8;--ion-color-primary-rgb: 143,73,248;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255,255,255;--ion-color-primary-shade: #7e40da;--ion-color-primary-tint: #9a5bf9}}.ion-color-texti{--ion-color-base: var(--ion-color-texti);--ion-color-base-rgb: var(--ion-color-texti-rgb);--ion-color-contrast: var(--ion-color-texti-contrast);--ion-color-contrast-rgb: var(--ion-color-texti-contrast-rgb);--ion-color-shade: var(--ion-color-texti-shade);--ion-color-tint: var(--ion-color-texti-tint)}.ion-color-darki{--ion-color-base: var(--ion-color-darki);--ion-color-base-rgb: var(--ion-color-darki-rgb);--ion-color-contrast: var(--ion-color-darki-contrast);--ion-color-contrast-rgb: var(--ion-color-darki-contrast-rgb);--ion-color-shade: var(--ion-color-darki-shade);--ion-color-tint: var(--ion-color-darki-tint)}.fun-card{z-index:0;position:relative;cursor:pointer;background:var(--ion-card-background, var(--ion-item-background, var(--ion-background-color, #fff)));display:flex;border-radius:1.5rem;align-items:start;padding:1rem;justify-content:space-between;box-shadow:0 .25rem .75rem #12195412}@media (prefers-color-scheme: dark){.fun-card{border:.0625rem solid var(--ion-color-medium)}}.fun-card.layered{flex-direction:column}.fun-card.poster{flex-direction:row}.fun-card.hoverable{transition:transform .3s ease,box-shadow .3s ease}.fun-card.hoverable:hover{transform:scale(1.01);box-shadow:.1875rem .625rem .5rem #1219541a}.fun-card.big-space{padding:2.625rem}.layer-image{z-index:-1;right:3%;bottom:2%;position:absolute;max-height:100%;max-width:40%;padding:.5rem}.layer-imagewith-opacity{opacity:.1}@media (prefers-color-scheme: dark){.layer-image.dark{opacity:.2;filter:invert(1)}}.poster-image{max-height:100%;max-width:30%;padding:.5rem}.poster-imagewith-opacity{opacity:.1}@media (prefers-color-scheme: dark){.poster-image.dark{opacity:.2;filter:invert(1)}}\n"] }]
|
|
61
79
|
}], propDecorators: { props: [{
|
|
62
80
|
type: Input
|
|
63
81
|
}] } });
|
|
64
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
82
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGF5ZXJlZC1jYXJkLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3ZhbHRlY2gtY29tcG9uZW50cy9zcmMvbGliL2NvbXBvbmVudHMvbW9sZWN1bGVzL2xheWVyZWQtY2FyZC9sYXllcmVkLWNhcmQuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUMvQyxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sRUFBRSxLQUFLLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDekQsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlDQUFpQyxDQUFDO0FBQy9ELE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSw4QkFBOEIsQ0FBQztBQUM1RCxPQUFPLEVBQUUsb0JBQW9CLEVBQUUsTUFBTSx3Q0FBd0MsQ0FBQztBQUM5RSxPQUFPLEVBQUUsbUJBQW1CLEVBQUUsTUFBTSxzQ0FBc0MsQ0FBQzs7O0FBcUMzRSxNQUFNLE9BQU8sb0JBQW9CO0lBbENqQztRQW1DRSxVQUFLLEdBQUcsTUFBTSxDQUFDLFlBQVksQ0FBQyxDQUFDO0tBVzlCO0lBTkMsS0FBSyxDQUFDLFVBQVU7UUFDZCxJQUFJLENBQUMsVUFBVSxFQUFFLENBQUM7WUFDaEIsT0FBTyxFQUFFLENBQUM7UUFDWixDQUFDO1FBQ0QsT0FBTyxZQUFZLENBQUMsVUFBVSxDQUFDLENBQUM7SUFDbEMsQ0FBQzsrR0FYVSxvQkFBb0I7bUdBQXBCLG9CQUFvQixvR0E5QnJCOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7R0EyQlQsaThHQTVCUyxZQUFZLG9IQUFFLG9CQUFvQixzR0FBRSxtQkFBbUI7OzRGQStCdEQsb0JBQW9CO2tCQWxDaEMsU0FBUzsrQkFDRSxjQUFjLGNBQ1osSUFBSSxXQUNQLENBQUMsWUFBWSxFQUFFLG9CQUFvQixFQUFFLG1CQUFtQixDQUFDLFlBQ3hEOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7R0EyQlQ7OEJBT0QsS0FBSztzQkFESixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7IENvbXBvbmVudCwgaW5qZWN0LCBJbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgVGhlbWVTZXJ2aWNlIH0gZnJvbSAnLi4vLi4vLi4vc2VydmljZXMvdGhlbWUuc2VydmljZSc7XG5pbXBvcnQgeyByZXNvbHZlQ29sb3IgfSBmcm9tICcuLi8uLi8uLi9zaGFyZWQvdXRpbHMvc3R5bGVzJztcbmltcG9ydCB7IEJ1dHRvbkdyb3VwQ29tcG9uZW50IH0gZnJvbSAnLi4vYnV0dG9uLWdyb3VwL2J1dHRvbi1ncm91cC5jb21wb25lbnQnO1xuaW1wb3J0IHsgVGl0bGVCbG9ja0NvbXBvbmVudCB9IGZyb20gJy4uL3RpdGxlLWJsb2NrL3RpdGxlLWJsb2NrLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBMYXllcmVkQ2FyZE1ldGFkYXRhIH0gZnJvbSAnLi90eXBlcyc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2xheWVyZWQtY2FyZCcsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGltcG9ydHM6IFtDb21tb25Nb2R1bGUsIEJ1dHRvbkdyb3VwQ29tcG9uZW50LCBUaXRsZUJsb2NrQ29tcG9uZW50XSxcbiAgdGVtcGxhdGU6IGBcbiAgICA8ZGl2XG4gICAgICBjbGFzcz1cImZ1bi1jYXJkXCJcbiAgICAgIFtjbGFzcy5iaWctc3BhY2VdPVwicHJvcHMuYmlnU3BhY2VcIlxuICAgICAgW2NsYXNzLmhvdmVyYWJsZV09XCJwcm9wcy5ob3ZlcmFibGVcIlxuICAgICAgW2NsYXNzLndpdGgtb3BhY2l0eV09XCJwcm9wcy53aXRoT3BhY2l0eVwiXG4gICAgICBbY2xhc3MubGF5ZXJlZF09XCJwcm9wcy5tb2RlID09PSAnbGF5ZXJlZCdcIlxuICAgICAgW2NsYXNzLnBvc3Rlcl09XCJwcm9wcy5tb2RlID09PSAncG9zdGVyJ1wiXG4gICAgICBbbmdTdHlsZV09XCJ7XG4gICAgICAgIGJhY2tncm91bmQ6IHRoZW1lLklzRGFyayA/ICd2YXIoLS1pb24tYmFja2dyb3VuZC1jb2xvciknIDogY29sb3IocHJvcHMuYmFja2dyb3VuZCksXG4gICAgICAgIG1pbkhlaWdodDogcHJvcHMud2l0aE1pbiA/ICczNDBweCcgOiAnYXV0bycsXG4gICAgICB9XCJcbiAgICA+XG4gICAgICBAaWYgKHByb3BzLm1vZGUgPT09ICdwb3N0ZXInKSB7XG4gICAgICAgIDxpbWcgY2xhc3M9XCJwb3N0ZXItaW1hZ2VcIiBbY2xhc3MuZGFya109XCJwcm9wcy5kYXJrXCIgYWx0PVwiaW1hZ2VcIiBbc3JjXT1cInByb3BzLmltYWdlXCIgLz5cbiAgICAgIH1cblxuICAgICAgQGlmIChwcm9wcy5tb2RlID09PSAnbGF5ZXJlZCcpIHtcbiAgICAgICAgPGltZyBjbGFzcz1cImxheWVyLWltYWdlXCIgW2NsYXNzLmRhcmtdPVwicHJvcHMuZGFya1wiIGFsdD1cImltYWdlXCIgW3NyY109XCJwcm9wcy5pbWFnZVwiIC8+XG4gICAgICB9XG5cbiAgICAgIDx2YWwtdGl0bGUtYmxvY2sgW3Byb3BzXT1cInByb3BzLmNvbnRlbnRcIiAvPlxuXG4gICAgICBAaWYgKHByb3BzLmFjdGlvbnMpIHtcbiAgICAgICAgPHZhbC1idXR0b24tZ3JvdXAgc3R5bGU9XCJtYXJnaW4tdG9wOiAxNnB4O1wiIFtwcm9wc109XCJwcm9wcy5hY3Rpb25zXCIgLz5cbiAgICAgIH1cbiAgICA8L2Rpdj5cbiAgYCxcbiAgc3R5bGVVcmw6ICcuL2xheWVyZWQtY2FyZC5jb21wb25lbnQuc2NzcycsXG59KVxuZXhwb3J0IGNsYXNzIExheWVyZWRDYXJkQ29tcG9uZW50IHtcbiAgdGhlbWUgPSBpbmplY3QoVGhlbWVTZXJ2aWNlKTtcblxuICBASW5wdXQoKVxuICBwcm9wczogTGF5ZXJlZENhcmRNZXRhZGF0YTtcblxuICBjb2xvcihiYWNrZ3JvdW5kKSB7XG4gICAgaWYgKCFiYWNrZ3JvdW5kKSB7XG4gICAgICByZXR1cm4gJyc7XG4gICAgfVxuICAgIHJldHVybiByZXNvbHZlQ29sb3IoYmFja2dyb3VuZCk7XG4gIH1cbn1cbiJdfQ==
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export {};
|
|
2
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
2
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidHlwZXMuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy92YWx0ZWNoLWNvbXBvbmVudHMvc3JjL2xpYi9jb21wb25lbnRzL21vbGVjdWxlcy9sYXllcmVkLWNhcmQvdHlwZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEJ1dHRvbkdyb3VwTWV0YWRhdGEgfSBmcm9tICcuLi9idXR0b24tZ3JvdXAvdHlwZXMnO1xuaW1wb3J0IHsgVGl0bGVCbG9ja01ldGFkYSB9IGZyb20gJy4uL3RpdGxlLWJsb2NrL3R5cGVzJztcblxuZXhwb3J0IGludGVyZmFjZSBMYXllcmVkQ2FyZE1ldGFkYXRhIHtcbiAgdG9rZW4/OiBzdHJpbmc7XG4gIGltYWdlPzogc3RyaW5nO1xuICBhY3Rpb25zPzogQnV0dG9uR3JvdXBNZXRhZGF0YTtcbiAgY29udGVudDogVGl0bGVCbG9ja01ldGFkYTtcbiAgYmlnU3BhY2U/OiBib29sZWFuO1xuICBiYWNrZ3JvdW5kPzogc3RyaW5nO1xuICBob3ZlcmFibGU/OiBib29sZWFuO1xuICB3aXRoTWluPzogYm9vbGVhbjtcbiAgZGFyaz86IGJvb2xlYW47XG4gIHdpdGhPcGFjaXR5PzogYm9vbGVhbjtcbiAgbW9kZTogJ2xheWVyZWQnIHwgJ3Bvc3Rlcic7XG59XG4iXX0=
|
|
@@ -3299,20 +3299,29 @@ class LayeredCardComponent {
|
|
|
3299
3299
|
class="fun-card"
|
|
3300
3300
|
[class.big-space]="props.bigSpace"
|
|
3301
3301
|
[class.hoverable]="props.hoverable"
|
|
3302
|
+
[class.with-opacity]="props.withOpacity"
|
|
3303
|
+
[class.layered]="props.mode === 'layered'"
|
|
3304
|
+
[class.poster]="props.mode === 'poster'"
|
|
3302
3305
|
[ngStyle]="{
|
|
3303
3306
|
background: theme.IsDark ? 'var(--ion-background-color)' : color(props.background),
|
|
3304
3307
|
minHeight: props.withMin ? '340px' : 'auto',
|
|
3305
3308
|
}"
|
|
3306
3309
|
>
|
|
3307
|
-
|
|
3310
|
+
@if (props.mode === 'poster') {
|
|
3311
|
+
<img class="poster-image" [class.dark]="props.dark" alt="image" [src]="props.image" />
|
|
3312
|
+
}
|
|
3313
|
+
|
|
3314
|
+
@if (props.mode === 'layered') {
|
|
3315
|
+
<img class="layer-image" [class.dark]="props.dark" alt="image" [src]="props.image" />
|
|
3316
|
+
}
|
|
3308
3317
|
|
|
3309
3318
|
<val-title-block [props]="props.content" />
|
|
3310
3319
|
|
|
3311
3320
|
@if (props.actions) {
|
|
3312
|
-
<val-button-group [props]="props.actions" />
|
|
3321
|
+
<val-button-group style="margin-top: 16px;" [props]="props.actions" />
|
|
3313
3322
|
}
|
|
3314
3323
|
</div>
|
|
3315
|
-
`, isInline: true, styles: [":root{--ion-color-primary: #7026df;--ion-color-primary-rgb: 112, 38, 223;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #6321c4;--ion-color-primary-tint: #7e3ce2;--ion-color-secondary: #e2ccff;--ion-color-secondary-rgb: 226, 204, 255;--ion-color-secondary-contrast: #000000;--ion-color-secondary-contrast-rgb: 0, 0, 0;--ion-color-secondary-shade: #c7b4e0;--ion-color-secondary-tint: #e5d1ff;--ion-color-texti: #354c69;--ion-color-texti-rgb: 53, 76, 105;--ion-color-texti-contrast: #ffffff;--ion-color-texti-contrast-rgb: 255, 255, 255;--ion-color-texti-shade: #2f435c;--ion-color-texti-tint: #495e78;--ion-color-darki: #090f1b;--ion-color-darki-rgb: 9, 15, 27;--ion-color-darki-contrast: #ffffff;--ion-color-darki-contrast-rgb: 255, 255, 255;--ion-color-darki-shade: #080d18;--ion-color-darki-tint: #222732;--ion-color-medium: #9e9e9e;--ion-color-medium-rgb: 158, 158, 158;--ion-color-medium-contrast: #000000;--ion-color-medium-contrast-rgb: 0, 0, 0;--ion-color-medium-shade: #8b8b8b;--ion-color-medium-tint: #a8a8a8}@media (prefers-color-scheme: dark){:root{--ion-color-texti: #8fc1ff;--ion-color-texti-rgb: 143, 193, 255;--ion-color-texti-contrast: #000000;--ion-color-texti-contrast-rgb: 0, 0, 0;--ion-color-texti-shade: #7eaae0;--ion-color-texti-tint: #9ac7ff;--ion-color-darki: #ffffff;--ion-color-darki-rgb: 255, 255, 255;--ion-color-darki-contrast: #000000;--ion-color-darki-contrast-rgb: 0, 0, 0;--ion-color-darki-shade: #e0e0e0;--ion-color-darki-tint: #ffffff;--ion-color-primary: #8f49f8;--ion-color-primary-rgb: 143,73,248;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255,255,255;--ion-color-primary-shade: #7e40da;--ion-color-primary-tint: #9a5bf9}}.ion-color-texti{--ion-color-base: var(--ion-color-texti);--ion-color-base-rgb: var(--ion-color-texti-rgb);--ion-color-contrast: var(--ion-color-texti-contrast);--ion-color-contrast-rgb: var(--ion-color-texti-contrast-rgb);--ion-color-shade: var(--ion-color-texti-shade);--ion-color-tint: var(--ion-color-texti-tint)}.ion-color-darki{--ion-color-base: var(--ion-color-darki);--ion-color-base-rgb: var(--ion-color-darki-rgb);--ion-color-contrast: var(--ion-color-darki-contrast);--ion-color-contrast-rgb: var(--ion-color-darki-contrast-rgb);--ion-color-shade: var(--ion-color-darki-shade);--ion-color-tint: var(--ion-color-darki-tint)}.fun-card{z-index:0;position:relative;cursor:pointer;background:var(--ion-card-background, var(--ion-item-background, var(--ion-background-color, #fff)));display:flex;border-radius:1.5rem;align-items:start;padding:1rem;
|
|
3324
|
+
`, isInline: true, styles: [":root{--ion-color-primary: #7026df;--ion-color-primary-rgb: 112, 38, 223;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #6321c4;--ion-color-primary-tint: #7e3ce2;--ion-color-secondary: #e2ccff;--ion-color-secondary-rgb: 226, 204, 255;--ion-color-secondary-contrast: #000000;--ion-color-secondary-contrast-rgb: 0, 0, 0;--ion-color-secondary-shade: #c7b4e0;--ion-color-secondary-tint: #e5d1ff;--ion-color-texti: #354c69;--ion-color-texti-rgb: 53, 76, 105;--ion-color-texti-contrast: #ffffff;--ion-color-texti-contrast-rgb: 255, 255, 255;--ion-color-texti-shade: #2f435c;--ion-color-texti-tint: #495e78;--ion-color-darki: #090f1b;--ion-color-darki-rgb: 9, 15, 27;--ion-color-darki-contrast: #ffffff;--ion-color-darki-contrast-rgb: 255, 255, 255;--ion-color-darki-shade: #080d18;--ion-color-darki-tint: #222732;--ion-color-medium: #9e9e9e;--ion-color-medium-rgb: 158, 158, 158;--ion-color-medium-contrast: #000000;--ion-color-medium-contrast-rgb: 0, 0, 0;--ion-color-medium-shade: #8b8b8b;--ion-color-medium-tint: #a8a8a8}@media (prefers-color-scheme: dark){:root{--ion-color-texti: #8fc1ff;--ion-color-texti-rgb: 143, 193, 255;--ion-color-texti-contrast: #000000;--ion-color-texti-contrast-rgb: 0, 0, 0;--ion-color-texti-shade: #7eaae0;--ion-color-texti-tint: #9ac7ff;--ion-color-darki: #ffffff;--ion-color-darki-rgb: 255, 255, 255;--ion-color-darki-contrast: #000000;--ion-color-darki-contrast-rgb: 0, 0, 0;--ion-color-darki-shade: #e0e0e0;--ion-color-darki-tint: #ffffff;--ion-color-primary: #8f49f8;--ion-color-primary-rgb: 143,73,248;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255,255,255;--ion-color-primary-shade: #7e40da;--ion-color-primary-tint: #9a5bf9}}.ion-color-texti{--ion-color-base: var(--ion-color-texti);--ion-color-base-rgb: var(--ion-color-texti-rgb);--ion-color-contrast: var(--ion-color-texti-contrast);--ion-color-contrast-rgb: var(--ion-color-texti-contrast-rgb);--ion-color-shade: var(--ion-color-texti-shade);--ion-color-tint: var(--ion-color-texti-tint)}.ion-color-darki{--ion-color-base: var(--ion-color-darki);--ion-color-base-rgb: var(--ion-color-darki-rgb);--ion-color-contrast: var(--ion-color-darki-contrast);--ion-color-contrast-rgb: var(--ion-color-darki-contrast-rgb);--ion-color-shade: var(--ion-color-darki-shade);--ion-color-tint: var(--ion-color-darki-tint)}.fun-card{z-index:0;position:relative;cursor:pointer;background:var(--ion-card-background, var(--ion-item-background, var(--ion-background-color, #fff)));display:flex;border-radius:1.5rem;align-items:start;padding:1rem;justify-content:space-between;box-shadow:0 .25rem .75rem #12195412}@media (prefers-color-scheme: dark){.fun-card{border:.0625rem solid var(--ion-color-medium)}}.fun-card.layered{flex-direction:column}.fun-card.poster{flex-direction:row}.fun-card.hoverable{transition:transform .3s ease,box-shadow .3s ease}.fun-card.hoverable:hover{transform:scale(1.01);box-shadow:.1875rem .625rem .5rem #1219541a}.fun-card.big-space{padding:2.625rem}.layer-image{z-index:-1;right:3%;bottom:2%;position:absolute;max-height:100%;max-width:40%;padding:.5rem}.layer-imagewith-opacity{opacity:.1}@media (prefers-color-scheme: dark){.layer-image.dark{opacity:.2;filter:invert(1)}}.poster-image{max-height:100%;max-width:30%;padding:.5rem}.poster-imagewith-opacity{opacity:.1}@media (prefers-color-scheme: dark){.poster-image.dark{opacity:.2;filter:invert(1)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: ButtonGroupComponent, selector: "val-button-group", inputs: ["props"], outputs: ["onClick"] }, { kind: "component", type: TitleBlockComponent, selector: "val-title-block", inputs: ["props"] }] }); }
|
|
3316
3325
|
}
|
|
3317
3326
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: LayeredCardComponent, decorators: [{
|
|
3318
3327
|
type: Component,
|
|
@@ -3321,20 +3330,29 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
3321
3330
|
class="fun-card"
|
|
3322
3331
|
[class.big-space]="props.bigSpace"
|
|
3323
3332
|
[class.hoverable]="props.hoverable"
|
|
3333
|
+
[class.with-opacity]="props.withOpacity"
|
|
3334
|
+
[class.layered]="props.mode === 'layered'"
|
|
3335
|
+
[class.poster]="props.mode === 'poster'"
|
|
3324
3336
|
[ngStyle]="{
|
|
3325
3337
|
background: theme.IsDark ? 'var(--ion-background-color)' : color(props.background),
|
|
3326
3338
|
minHeight: props.withMin ? '340px' : 'auto',
|
|
3327
3339
|
}"
|
|
3328
3340
|
>
|
|
3329
|
-
|
|
3341
|
+
@if (props.mode === 'poster') {
|
|
3342
|
+
<img class="poster-image" [class.dark]="props.dark" alt="image" [src]="props.image" />
|
|
3343
|
+
}
|
|
3344
|
+
|
|
3345
|
+
@if (props.mode === 'layered') {
|
|
3346
|
+
<img class="layer-image" [class.dark]="props.dark" alt="image" [src]="props.image" />
|
|
3347
|
+
}
|
|
3330
3348
|
|
|
3331
3349
|
<val-title-block [props]="props.content" />
|
|
3332
3350
|
|
|
3333
3351
|
@if (props.actions) {
|
|
3334
|
-
<val-button-group [props]="props.actions" />
|
|
3352
|
+
<val-button-group style="margin-top: 16px;" [props]="props.actions" />
|
|
3335
3353
|
}
|
|
3336
3354
|
</div>
|
|
3337
|
-
`, styles: [":root{--ion-color-primary: #7026df;--ion-color-primary-rgb: 112, 38, 223;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #6321c4;--ion-color-primary-tint: #7e3ce2;--ion-color-secondary: #e2ccff;--ion-color-secondary-rgb: 226, 204, 255;--ion-color-secondary-contrast: #000000;--ion-color-secondary-contrast-rgb: 0, 0, 0;--ion-color-secondary-shade: #c7b4e0;--ion-color-secondary-tint: #e5d1ff;--ion-color-texti: #354c69;--ion-color-texti-rgb: 53, 76, 105;--ion-color-texti-contrast: #ffffff;--ion-color-texti-contrast-rgb: 255, 255, 255;--ion-color-texti-shade: #2f435c;--ion-color-texti-tint: #495e78;--ion-color-darki: #090f1b;--ion-color-darki-rgb: 9, 15, 27;--ion-color-darki-contrast: #ffffff;--ion-color-darki-contrast-rgb: 255, 255, 255;--ion-color-darki-shade: #080d18;--ion-color-darki-tint: #222732;--ion-color-medium: #9e9e9e;--ion-color-medium-rgb: 158, 158, 158;--ion-color-medium-contrast: #000000;--ion-color-medium-contrast-rgb: 0, 0, 0;--ion-color-medium-shade: #8b8b8b;--ion-color-medium-tint: #a8a8a8}@media (prefers-color-scheme: dark){:root{--ion-color-texti: #8fc1ff;--ion-color-texti-rgb: 143, 193, 255;--ion-color-texti-contrast: #000000;--ion-color-texti-contrast-rgb: 0, 0, 0;--ion-color-texti-shade: #7eaae0;--ion-color-texti-tint: #9ac7ff;--ion-color-darki: #ffffff;--ion-color-darki-rgb: 255, 255, 255;--ion-color-darki-contrast: #000000;--ion-color-darki-contrast-rgb: 0, 0, 0;--ion-color-darki-shade: #e0e0e0;--ion-color-darki-tint: #ffffff;--ion-color-primary: #8f49f8;--ion-color-primary-rgb: 143,73,248;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255,255,255;--ion-color-primary-shade: #7e40da;--ion-color-primary-tint: #9a5bf9}}.ion-color-texti{--ion-color-base: var(--ion-color-texti);--ion-color-base-rgb: var(--ion-color-texti-rgb);--ion-color-contrast: var(--ion-color-texti-contrast);--ion-color-contrast-rgb: var(--ion-color-texti-contrast-rgb);--ion-color-shade: var(--ion-color-texti-shade);--ion-color-tint: var(--ion-color-texti-tint)}.ion-color-darki{--ion-color-base: var(--ion-color-darki);--ion-color-base-rgb: var(--ion-color-darki-rgb);--ion-color-contrast: var(--ion-color-darki-contrast);--ion-color-contrast-rgb: var(--ion-color-darki-contrast-rgb);--ion-color-shade: var(--ion-color-darki-shade);--ion-color-tint: var(--ion-color-darki-tint)}.fun-card{z-index:0;position:relative;cursor:pointer;background:var(--ion-card-background, var(--ion-item-background, var(--ion-background-color, #fff)));display:flex;border-radius:1.5rem;align-items:start;padding:1rem;
|
|
3355
|
+
`, styles: [":root{--ion-color-primary: #7026df;--ion-color-primary-rgb: 112, 38, 223;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #6321c4;--ion-color-primary-tint: #7e3ce2;--ion-color-secondary: #e2ccff;--ion-color-secondary-rgb: 226, 204, 255;--ion-color-secondary-contrast: #000000;--ion-color-secondary-contrast-rgb: 0, 0, 0;--ion-color-secondary-shade: #c7b4e0;--ion-color-secondary-tint: #e5d1ff;--ion-color-texti: #354c69;--ion-color-texti-rgb: 53, 76, 105;--ion-color-texti-contrast: #ffffff;--ion-color-texti-contrast-rgb: 255, 255, 255;--ion-color-texti-shade: #2f435c;--ion-color-texti-tint: #495e78;--ion-color-darki: #090f1b;--ion-color-darki-rgb: 9, 15, 27;--ion-color-darki-contrast: #ffffff;--ion-color-darki-contrast-rgb: 255, 255, 255;--ion-color-darki-shade: #080d18;--ion-color-darki-tint: #222732;--ion-color-medium: #9e9e9e;--ion-color-medium-rgb: 158, 158, 158;--ion-color-medium-contrast: #000000;--ion-color-medium-contrast-rgb: 0, 0, 0;--ion-color-medium-shade: #8b8b8b;--ion-color-medium-tint: #a8a8a8}@media (prefers-color-scheme: dark){:root{--ion-color-texti: #8fc1ff;--ion-color-texti-rgb: 143, 193, 255;--ion-color-texti-contrast: #000000;--ion-color-texti-contrast-rgb: 0, 0, 0;--ion-color-texti-shade: #7eaae0;--ion-color-texti-tint: #9ac7ff;--ion-color-darki: #ffffff;--ion-color-darki-rgb: 255, 255, 255;--ion-color-darki-contrast: #000000;--ion-color-darki-contrast-rgb: 0, 0, 0;--ion-color-darki-shade: #e0e0e0;--ion-color-darki-tint: #ffffff;--ion-color-primary: #8f49f8;--ion-color-primary-rgb: 143,73,248;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255,255,255;--ion-color-primary-shade: #7e40da;--ion-color-primary-tint: #9a5bf9}}.ion-color-texti{--ion-color-base: var(--ion-color-texti);--ion-color-base-rgb: var(--ion-color-texti-rgb);--ion-color-contrast: var(--ion-color-texti-contrast);--ion-color-contrast-rgb: var(--ion-color-texti-contrast-rgb);--ion-color-shade: var(--ion-color-texti-shade);--ion-color-tint: var(--ion-color-texti-tint)}.ion-color-darki{--ion-color-base: var(--ion-color-darki);--ion-color-base-rgb: var(--ion-color-darki-rgb);--ion-color-contrast: var(--ion-color-darki-contrast);--ion-color-contrast-rgb: var(--ion-color-darki-contrast-rgb);--ion-color-shade: var(--ion-color-darki-shade);--ion-color-tint: var(--ion-color-darki-tint)}.fun-card{z-index:0;position:relative;cursor:pointer;background:var(--ion-card-background, var(--ion-item-background, var(--ion-background-color, #fff)));display:flex;border-radius:1.5rem;align-items:start;padding:1rem;justify-content:space-between;box-shadow:0 .25rem .75rem #12195412}@media (prefers-color-scheme: dark){.fun-card{border:.0625rem solid var(--ion-color-medium)}}.fun-card.layered{flex-direction:column}.fun-card.poster{flex-direction:row}.fun-card.hoverable{transition:transform .3s ease,box-shadow .3s ease}.fun-card.hoverable:hover{transform:scale(1.01);box-shadow:.1875rem .625rem .5rem #1219541a}.fun-card.big-space{padding:2.625rem}.layer-image{z-index:-1;right:3%;bottom:2%;position:absolute;max-height:100%;max-width:40%;padding:.5rem}.layer-imagewith-opacity{opacity:.1}@media (prefers-color-scheme: dark){.layer-image.dark{opacity:.2;filter:invert(1)}}.poster-image{max-height:100%;max-width:30%;padding:.5rem}.poster-imagewith-opacity{opacity:.1}@media (prefers-color-scheme: dark){.poster-image.dark{opacity:.2;filter:invert(1)}}\n"] }]
|
|
3338
3356
|
}], propDecorators: { props: [{
|
|
3339
3357
|
type: Input
|
|
3340
3358
|
}] } });
|