@telia/teddy 0.0.66 → 0.0.68
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/dist/components/accordion/accordion-content.cjs +1 -1
- package/dist/components/accordion/accordion-content.js +1 -1
- package/dist/components/accordion/accordion-root.cjs +13 -13
- package/dist/components/accordion/accordion-root.js +13 -13
- package/dist/components/card/card-price.cjs +10 -1
- package/dist/components/card/card-price.js +10 -1
- package/dist/components/card/card.cjs +47 -46
- package/dist/components/card/card.js +47 -46
- package/dist/style.css +150 -140
- package/package.json +1 -1
|
@@ -25,7 +25,7 @@ const AccordionPrimitive__namespace = /* @__PURE__ */ _interopNamespaceDefault(A
|
|
|
25
25
|
const Content = React.forwardRef(
|
|
26
26
|
({ className, children, ...props }, forwardRef) => {
|
|
27
27
|
const classes = clsx([components_accordion_accordionRoot.styles[`${components_accordion_accordionRoot.rootClassName}__content`]], className);
|
|
28
|
-
return /* @__PURE__ */ jsxRuntime.jsx(AccordionPrimitive__namespace.Content, { ...props, ref: forwardRef, className: classes, children });
|
|
28
|
+
return /* @__PURE__ */ jsxRuntime.jsx(AccordionPrimitive__namespace.Content, { ...props, ref: forwardRef, className: classes, forceMount: true, children });
|
|
29
29
|
}
|
|
30
30
|
);
|
|
31
31
|
Content.displayName = "Content";
|
|
@@ -6,7 +6,7 @@ import * as AccordionPrimitive from "@radix-ui/react-accordion";
|
|
|
6
6
|
const Content = React__default.forwardRef(
|
|
7
7
|
({ className, children, ...props }, forwardRef) => {
|
|
8
8
|
const classes = clsx([styles[`${rootClassName}__content`]], className);
|
|
9
|
-
return /* @__PURE__ */ jsx(AccordionPrimitive.Content, { ...props, ref: forwardRef, className: classes, children });
|
|
9
|
+
return /* @__PURE__ */ jsx(AccordionPrimitive.Content, { ...props, ref: forwardRef, className: classes, forceMount: true, children });
|
|
10
10
|
}
|
|
11
11
|
);
|
|
12
12
|
Content.displayName = "Content";
|
|
@@ -22,22 +22,22 @@ function _interopNamespaceDefault(e) {
|
|
|
22
22
|
return Object.freeze(n);
|
|
23
23
|
}
|
|
24
24
|
const AccordionPrimitive__namespace = /* @__PURE__ */ _interopNamespaceDefault(AccordionPrimitive);
|
|
25
|
-
const slideDown = "
|
|
26
|
-
const slideUp = "
|
|
25
|
+
const slideDown = "_slideDown_nueyr_1";
|
|
26
|
+
const slideUp = "_slideUp_nueyr_1";
|
|
27
27
|
const styles = {
|
|
28
|
-
"teddy-accordion": "_teddy-
|
|
29
|
-
"teddy-accordion--indented": "_teddy-accordion--
|
|
30
|
-
"teddy-accordion__header": "_teddy-
|
|
31
|
-
"teddy-accordion__content": "_teddy-
|
|
32
|
-
"teddy-accordion--negative": "_teddy-accordion--
|
|
33
|
-
"teddy-accordion__title": "_teddy-
|
|
34
|
-
"teddy-accordion__trigger": "_teddy-
|
|
35
|
-
"teddy-accordion__item": "_teddy-
|
|
36
|
-
"teddy-accordion__indicator": "_teddy-
|
|
37
|
-
"teddy-accordion__indicator--rotate": "_teddy-accordion__indicator--
|
|
28
|
+
"teddy-accordion": "_teddy-accordion_nueyr_3",
|
|
29
|
+
"teddy-accordion--indented": "_teddy-accordion--indented_nueyr_11",
|
|
30
|
+
"teddy-accordion__header": "_teddy-accordion__header_nueyr_11",
|
|
31
|
+
"teddy-accordion__content": "_teddy-accordion__content_nueyr_14",
|
|
32
|
+
"teddy-accordion--negative": "_teddy-accordion--negative_nueyr_17",
|
|
33
|
+
"teddy-accordion__title": "_teddy-accordion__title_nueyr_21",
|
|
34
|
+
"teddy-accordion__trigger": "_teddy-accordion__trigger_nueyr_24",
|
|
35
|
+
"teddy-accordion__item": "_teddy-accordion__item_nueyr_32",
|
|
36
|
+
"teddy-accordion__indicator": "_teddy-accordion__indicator_nueyr_101",
|
|
37
|
+
"teddy-accordion__indicator--rotate": "_teddy-accordion__indicator--rotate_nueyr_112",
|
|
38
38
|
slideDown,
|
|
39
39
|
slideUp,
|
|
40
|
-
"teddy-accordion--info-area": "_teddy-accordion--info-
|
|
40
|
+
"teddy-accordion--info-area": "_teddy-accordion--info-area_nueyr_142"
|
|
41
41
|
};
|
|
42
42
|
const rootClassName = "teddy-accordion";
|
|
43
43
|
const RootContext = React.createContext({ value: void 0, variant: void 0 });
|
|
@@ -3,22 +3,22 @@ import clsx from "clsx";
|
|
|
3
3
|
import React__default from "react";
|
|
4
4
|
import * as AccordionPrimitive from "@radix-ui/react-accordion";
|
|
5
5
|
import { useControllableState } from "@radix-ui/react-use-controllable-state";
|
|
6
|
-
const slideDown = "
|
|
7
|
-
const slideUp = "
|
|
6
|
+
const slideDown = "_slideDown_nueyr_1";
|
|
7
|
+
const slideUp = "_slideUp_nueyr_1";
|
|
8
8
|
const styles = {
|
|
9
|
-
"teddy-accordion": "_teddy-
|
|
10
|
-
"teddy-accordion--indented": "_teddy-accordion--
|
|
11
|
-
"teddy-accordion__header": "_teddy-
|
|
12
|
-
"teddy-accordion__content": "_teddy-
|
|
13
|
-
"teddy-accordion--negative": "_teddy-accordion--
|
|
14
|
-
"teddy-accordion__title": "_teddy-
|
|
15
|
-
"teddy-accordion__trigger": "_teddy-
|
|
16
|
-
"teddy-accordion__item": "_teddy-
|
|
17
|
-
"teddy-accordion__indicator": "_teddy-
|
|
18
|
-
"teddy-accordion__indicator--rotate": "_teddy-accordion__indicator--
|
|
9
|
+
"teddy-accordion": "_teddy-accordion_nueyr_3",
|
|
10
|
+
"teddy-accordion--indented": "_teddy-accordion--indented_nueyr_11",
|
|
11
|
+
"teddy-accordion__header": "_teddy-accordion__header_nueyr_11",
|
|
12
|
+
"teddy-accordion__content": "_teddy-accordion__content_nueyr_14",
|
|
13
|
+
"teddy-accordion--negative": "_teddy-accordion--negative_nueyr_17",
|
|
14
|
+
"teddy-accordion__title": "_teddy-accordion__title_nueyr_21",
|
|
15
|
+
"teddy-accordion__trigger": "_teddy-accordion__trigger_nueyr_24",
|
|
16
|
+
"teddy-accordion__item": "_teddy-accordion__item_nueyr_32",
|
|
17
|
+
"teddy-accordion__indicator": "_teddy-accordion__indicator_nueyr_101",
|
|
18
|
+
"teddy-accordion__indicator--rotate": "_teddy-accordion__indicator--rotate_nueyr_112",
|
|
19
19
|
slideDown,
|
|
20
20
|
slideUp,
|
|
21
|
-
"teddy-accordion--info-area": "_teddy-accordion--info-
|
|
21
|
+
"teddy-accordion--info-area": "_teddy-accordion--info-area_nueyr_142"
|
|
22
22
|
};
|
|
23
23
|
const rootClassName = "teddy-accordion";
|
|
24
24
|
const RootContext = React__default.createContext({ value: void 0, variant: void 0 });
|
|
@@ -24,7 +24,16 @@ const Price = React.forwardRef(
|
|
|
24
24
|
children: /* @__PURE__ */ jsxRuntime.jsxs(components_text_text.Text, { variant: "paragraph-100", as: "p", children: [
|
|
25
25
|
pricePrefix,
|
|
26
26
|
" ",
|
|
27
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
27
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
28
|
+
components_text_text.Text,
|
|
29
|
+
{
|
|
30
|
+
variant: "paragraph-100-bold",
|
|
31
|
+
as: "span",
|
|
32
|
+
ml: "100",
|
|
33
|
+
className: components_card_card.styles[`${rootColorDotsClass}--big`],
|
|
34
|
+
children: priceText
|
|
35
|
+
}
|
|
36
|
+
)
|
|
28
37
|
] })
|
|
29
38
|
}
|
|
30
39
|
);
|
|
@@ -22,7 +22,16 @@ const Price = React__default.forwardRef(
|
|
|
22
22
|
children: /* @__PURE__ */ jsxs(Text, { variant: "paragraph-100", as: "p", children: [
|
|
23
23
|
pricePrefix,
|
|
24
24
|
" ",
|
|
25
|
-
/* @__PURE__ */ jsx(
|
|
25
|
+
/* @__PURE__ */ jsx(
|
|
26
|
+
Text,
|
|
27
|
+
{
|
|
28
|
+
variant: "paragraph-100-bold",
|
|
29
|
+
as: "span",
|
|
30
|
+
ml: "100",
|
|
31
|
+
className: styles[`${rootColorDotsClass}--big`],
|
|
32
|
+
children: priceText
|
|
33
|
+
}
|
|
34
|
+
)
|
|
26
35
|
] })
|
|
27
36
|
}
|
|
28
37
|
);
|
|
@@ -7,52 +7,53 @@ const utils_composeEventHandlers = require("../../utils/composeEventHandlers.cjs
|
|
|
7
7
|
const components_grid_grid = require("../grid/grid.cjs");
|
|
8
8
|
const tokens_color_variables = require("../../tokens/color/variables.cjs");
|
|
9
9
|
const styles = {
|
|
10
|
-
"teddy-card": "_teddy-
|
|
11
|
-
"teddy-card__slot": "_teddy-
|
|
12
|
-
"teddy-card__slot--bottom": "_teddy-card__slot--
|
|
13
|
-
"teddy-card__slot--center": "_teddy-card__slot--
|
|
14
|
-
"teddy-card--shadow": "_teddy-card--
|
|
15
|
-
"teddy-card__action": "_teddy-
|
|
16
|
-
"teddy-card__action--disabled": "_teddy-card__action--
|
|
17
|
-
"teddy-card--border": "_teddy-card--
|
|
18
|
-
"teddy-card--layout": "_teddy-card--
|
|
19
|
-
"teddy-card__illustration": "_teddy-
|
|
20
|
-
"teddy-card__content": "_teddy-
|
|
21
|
-
"teddy-card__heading": "_teddy-
|
|
22
|
-
"teddy-card__action-wrapper": "_teddy-card__action-
|
|
23
|
-
"teddy-card__footer": "_teddy-
|
|
24
|
-
"teddy-card__overline": "_teddy-
|
|
25
|
-
"teddy-card__description": "_teddy-
|
|
26
|
-
"teddy-card__color-dots": "_teddy-card__color-
|
|
27
|
-
"teddy-card__availability": "_teddy-
|
|
28
|
-
"teddy-card__price": "_teddy-
|
|
29
|
-
"teddy-card--default": "_teddy-card--
|
|
30
|
-
"teddy-card--navigation-vertical": "_teddy-card--navigation-
|
|
31
|
-
"teddy-card--navigation-horizontal-small": "_teddy-card--navigation-horizontal-
|
|
32
|
-
"teddy-card--navigation-horizontal-large": "_teddy-card--navigation-horizontal-
|
|
33
|
-
"teddy-card--rich-card": "_teddy-card--rich-
|
|
34
|
-
"teddy-card__line": "_teddy-
|
|
35
|
-
"teddy-card--purple-light": "_teddy-card--purple-
|
|
36
|
-
"teddy-card--purple-dark": "_teddy-card--purple-
|
|
37
|
-
"teddy-card--white": "_teddy-card--
|
|
38
|
-
"teddy-card--gray": "_teddy-card--
|
|
39
|
-
"teddy-card--beige": "_teddy-card--
|
|
40
|
-
"teddy-card--product": "_teddy-card--
|
|
41
|
-
"teddy-
|
|
42
|
-
"teddy-
|
|
43
|
-
"teddy-
|
|
44
|
-
"teddy-
|
|
45
|
-
"teddy-card__inset
|
|
46
|
-
"teddy-card__inset--
|
|
47
|
-
"teddy-card__inset--
|
|
48
|
-
"teddy-card__inset--
|
|
49
|
-
"teddy-
|
|
50
|
-
"teddy-card__availability--
|
|
51
|
-
"teddy-card__availability--
|
|
52
|
-
"teddy-card__availability--
|
|
53
|
-
"teddy-card__availability--
|
|
54
|
-
"teddy-card__availability--
|
|
55
|
-
"teddy-card__availability--
|
|
10
|
+
"teddy-card": "_teddy-card_18mto_3",
|
|
11
|
+
"teddy-card__slot": "_teddy-card__slot_18mto_13",
|
|
12
|
+
"teddy-card__slot--bottom": "_teddy-card__slot--bottom_18mto_16",
|
|
13
|
+
"teddy-card__slot--center": "_teddy-card__slot--center_18mto_19",
|
|
14
|
+
"teddy-card--shadow": "_teddy-card--shadow_18mto_41",
|
|
15
|
+
"teddy-card__action": "_teddy-card__action_18mto_45",
|
|
16
|
+
"teddy-card__action--disabled": "_teddy-card__action--disabled_18mto_45",
|
|
17
|
+
"teddy-card--border": "_teddy-card--border_18mto_52",
|
|
18
|
+
"teddy-card--layout": "_teddy-card--layout_18mto_55",
|
|
19
|
+
"teddy-card__illustration": "_teddy-card__illustration_18mto_55",
|
|
20
|
+
"teddy-card__content": "_teddy-card__content_18mto_58",
|
|
21
|
+
"teddy-card__heading": "_teddy-card__heading_18mto_61",
|
|
22
|
+
"teddy-card__action-wrapper": "_teddy-card__action-wrapper_18mto_64",
|
|
23
|
+
"teddy-card__footer": "_teddy-card__footer_18mto_67",
|
|
24
|
+
"teddy-card__overline": "_teddy-card__overline_18mto_70",
|
|
25
|
+
"teddy-card__description": "_teddy-card__description_18mto_73",
|
|
26
|
+
"teddy-card__color-dots": "_teddy-card__color-dots_18mto_76",
|
|
27
|
+
"teddy-card__availability": "_teddy-card__availability_18mto_79",
|
|
28
|
+
"teddy-card__price": "_teddy-card__price_18mto_82",
|
|
29
|
+
"teddy-card--default": "_teddy-card--default_18mto_85",
|
|
30
|
+
"teddy-card--navigation-vertical": "_teddy-card--navigation-vertical_18mto_90",
|
|
31
|
+
"teddy-card--navigation-horizontal-small": "_teddy-card--navigation-horizontal-small_18mto_109",
|
|
32
|
+
"teddy-card--navigation-horizontal-large": "_teddy-card--navigation-horizontal-large_18mto_121",
|
|
33
|
+
"teddy-card--rich-card": "_teddy-card--rich-card_18mto_133",
|
|
34
|
+
"teddy-card__line": "_teddy-card__line_18mto_151",
|
|
35
|
+
"teddy-card--purple-light": "_teddy-card--purple-light_18mto_155",
|
|
36
|
+
"teddy-card--purple-dark": "_teddy-card--purple-dark_18mto_169",
|
|
37
|
+
"teddy-card--white": "_teddy-card--white_18mto_188",
|
|
38
|
+
"teddy-card--gray": "_teddy-card--gray_18mto_202",
|
|
39
|
+
"teddy-card--beige": "_teddy-card--beige_18mto_216",
|
|
40
|
+
"teddy-card--product": "_teddy-card--product_18mto_230",
|
|
41
|
+
"teddy-card__price--big": "_teddy-card__price--big_18mto_281",
|
|
42
|
+
"teddy-card__image--as-background": "_teddy-card__image--as-background_18mto_284",
|
|
43
|
+
"teddy-card--background-image": "_teddy-card--background-image_18mto_290",
|
|
44
|
+
"teddy-card__illustration--rounded": "_teddy-card__illustration--rounded_18mto_295",
|
|
45
|
+
"teddy-card__inset": "_teddy-card__inset_18mto_299",
|
|
46
|
+
"teddy-card__inset--top": "_teddy-card__inset--top_18mto_302",
|
|
47
|
+
"teddy-card__inset--left": "_teddy-card__inset--left_18mto_305",
|
|
48
|
+
"teddy-card__inset--right": "_teddy-card__inset--right_18mto_308",
|
|
49
|
+
"teddy-card__inset--bottom": "_teddy-card__inset--bottom_18mto_311",
|
|
50
|
+
"teddy-card__availability--badge": "_teddy-card__availability--badge_18mto_326",
|
|
51
|
+
"teddy-card__availability--success": "_teddy-card__availability--success_18mto_329",
|
|
52
|
+
"teddy-card__availability--warning": "_teddy-card__availability--warning_18mto_332",
|
|
53
|
+
"teddy-card__availability--error": "_teddy-card__availability--error_18mto_335",
|
|
54
|
+
"teddy-card__availability--special": "_teddy-card__availability--special_18mto_338",
|
|
55
|
+
"teddy-card__availability--neutral": "_teddy-card__availability--neutral_18mto_341",
|
|
56
|
+
"teddy-card__availability--information": "_teddy-card__availability--information_18mto_344"
|
|
56
57
|
};
|
|
57
58
|
const rootClassName = "teddy-card";
|
|
58
59
|
const actionElementIdentifier = `${rootClassName}__action`;
|
|
@@ -5,52 +5,53 @@ import { composeEventHandlers } from "../../utils/composeEventHandlers.js";
|
|
|
5
5
|
import { Grid } from "../grid/grid.js";
|
|
6
6
|
import { teddyColorTransparentWhite850, teddyColorTransparentWhite800, teddyColorTransparentWhite100, teddyColorTransparentBlack600, teddyColorTransparentBlack200 } from "../../tokens/color/variables.js";
|
|
7
7
|
const styles = {
|
|
8
|
-
"teddy-card": "_teddy-
|
|
9
|
-
"teddy-card__slot": "_teddy-
|
|
10
|
-
"teddy-card__slot--bottom": "_teddy-card__slot--
|
|
11
|
-
"teddy-card__slot--center": "_teddy-card__slot--
|
|
12
|
-
"teddy-card--shadow": "_teddy-card--
|
|
13
|
-
"teddy-card__action": "_teddy-
|
|
14
|
-
"teddy-card__action--disabled": "_teddy-card__action--
|
|
15
|
-
"teddy-card--border": "_teddy-card--
|
|
16
|
-
"teddy-card--layout": "_teddy-card--
|
|
17
|
-
"teddy-card__illustration": "_teddy-
|
|
18
|
-
"teddy-card__content": "_teddy-
|
|
19
|
-
"teddy-card__heading": "_teddy-
|
|
20
|
-
"teddy-card__action-wrapper": "_teddy-card__action-
|
|
21
|
-
"teddy-card__footer": "_teddy-
|
|
22
|
-
"teddy-card__overline": "_teddy-
|
|
23
|
-
"teddy-card__description": "_teddy-
|
|
24
|
-
"teddy-card__color-dots": "_teddy-card__color-
|
|
25
|
-
"teddy-card__availability": "_teddy-
|
|
26
|
-
"teddy-card__price": "_teddy-
|
|
27
|
-
"teddy-card--default": "_teddy-card--
|
|
28
|
-
"teddy-card--navigation-vertical": "_teddy-card--navigation-
|
|
29
|
-
"teddy-card--navigation-horizontal-small": "_teddy-card--navigation-horizontal-
|
|
30
|
-
"teddy-card--navigation-horizontal-large": "_teddy-card--navigation-horizontal-
|
|
31
|
-
"teddy-card--rich-card": "_teddy-card--rich-
|
|
32
|
-
"teddy-card__line": "_teddy-
|
|
33
|
-
"teddy-card--purple-light": "_teddy-card--purple-
|
|
34
|
-
"teddy-card--purple-dark": "_teddy-card--purple-
|
|
35
|
-
"teddy-card--white": "_teddy-card--
|
|
36
|
-
"teddy-card--gray": "_teddy-card--
|
|
37
|
-
"teddy-card--beige": "_teddy-card--
|
|
38
|
-
"teddy-card--product": "_teddy-card--
|
|
39
|
-
"teddy-
|
|
40
|
-
"teddy-
|
|
41
|
-
"teddy-
|
|
42
|
-
"teddy-
|
|
43
|
-
"teddy-card__inset
|
|
44
|
-
"teddy-card__inset--
|
|
45
|
-
"teddy-card__inset--
|
|
46
|
-
"teddy-card__inset--
|
|
47
|
-
"teddy-
|
|
48
|
-
"teddy-card__availability--
|
|
49
|
-
"teddy-card__availability--
|
|
50
|
-
"teddy-card__availability--
|
|
51
|
-
"teddy-card__availability--
|
|
52
|
-
"teddy-card__availability--
|
|
53
|
-
"teddy-card__availability--
|
|
8
|
+
"teddy-card": "_teddy-card_18mto_3",
|
|
9
|
+
"teddy-card__slot": "_teddy-card__slot_18mto_13",
|
|
10
|
+
"teddy-card__slot--bottom": "_teddy-card__slot--bottom_18mto_16",
|
|
11
|
+
"teddy-card__slot--center": "_teddy-card__slot--center_18mto_19",
|
|
12
|
+
"teddy-card--shadow": "_teddy-card--shadow_18mto_41",
|
|
13
|
+
"teddy-card__action": "_teddy-card__action_18mto_45",
|
|
14
|
+
"teddy-card__action--disabled": "_teddy-card__action--disabled_18mto_45",
|
|
15
|
+
"teddy-card--border": "_teddy-card--border_18mto_52",
|
|
16
|
+
"teddy-card--layout": "_teddy-card--layout_18mto_55",
|
|
17
|
+
"teddy-card__illustration": "_teddy-card__illustration_18mto_55",
|
|
18
|
+
"teddy-card__content": "_teddy-card__content_18mto_58",
|
|
19
|
+
"teddy-card__heading": "_teddy-card__heading_18mto_61",
|
|
20
|
+
"teddy-card__action-wrapper": "_teddy-card__action-wrapper_18mto_64",
|
|
21
|
+
"teddy-card__footer": "_teddy-card__footer_18mto_67",
|
|
22
|
+
"teddy-card__overline": "_teddy-card__overline_18mto_70",
|
|
23
|
+
"teddy-card__description": "_teddy-card__description_18mto_73",
|
|
24
|
+
"teddy-card__color-dots": "_teddy-card__color-dots_18mto_76",
|
|
25
|
+
"teddy-card__availability": "_teddy-card__availability_18mto_79",
|
|
26
|
+
"teddy-card__price": "_teddy-card__price_18mto_82",
|
|
27
|
+
"teddy-card--default": "_teddy-card--default_18mto_85",
|
|
28
|
+
"teddy-card--navigation-vertical": "_teddy-card--navigation-vertical_18mto_90",
|
|
29
|
+
"teddy-card--navigation-horizontal-small": "_teddy-card--navigation-horizontal-small_18mto_109",
|
|
30
|
+
"teddy-card--navigation-horizontal-large": "_teddy-card--navigation-horizontal-large_18mto_121",
|
|
31
|
+
"teddy-card--rich-card": "_teddy-card--rich-card_18mto_133",
|
|
32
|
+
"teddy-card__line": "_teddy-card__line_18mto_151",
|
|
33
|
+
"teddy-card--purple-light": "_teddy-card--purple-light_18mto_155",
|
|
34
|
+
"teddy-card--purple-dark": "_teddy-card--purple-dark_18mto_169",
|
|
35
|
+
"teddy-card--white": "_teddy-card--white_18mto_188",
|
|
36
|
+
"teddy-card--gray": "_teddy-card--gray_18mto_202",
|
|
37
|
+
"teddy-card--beige": "_teddy-card--beige_18mto_216",
|
|
38
|
+
"teddy-card--product": "_teddy-card--product_18mto_230",
|
|
39
|
+
"teddy-card__price--big": "_teddy-card__price--big_18mto_281",
|
|
40
|
+
"teddy-card__image--as-background": "_teddy-card__image--as-background_18mto_284",
|
|
41
|
+
"teddy-card--background-image": "_teddy-card--background-image_18mto_290",
|
|
42
|
+
"teddy-card__illustration--rounded": "_teddy-card__illustration--rounded_18mto_295",
|
|
43
|
+
"teddy-card__inset": "_teddy-card__inset_18mto_299",
|
|
44
|
+
"teddy-card__inset--top": "_teddy-card__inset--top_18mto_302",
|
|
45
|
+
"teddy-card__inset--left": "_teddy-card__inset--left_18mto_305",
|
|
46
|
+
"teddy-card__inset--right": "_teddy-card__inset--right_18mto_308",
|
|
47
|
+
"teddy-card__inset--bottom": "_teddy-card__inset--bottom_18mto_311",
|
|
48
|
+
"teddy-card__availability--badge": "_teddy-card__availability--badge_18mto_326",
|
|
49
|
+
"teddy-card__availability--success": "_teddy-card__availability--success_18mto_329",
|
|
50
|
+
"teddy-card__availability--warning": "_teddy-card__availability--warning_18mto_332",
|
|
51
|
+
"teddy-card__availability--error": "_teddy-card__availability--error_18mto_335",
|
|
52
|
+
"teddy-card__availability--special": "_teddy-card__availability--special_18mto_338",
|
|
53
|
+
"teddy-card__availability--neutral": "_teddy-card__availability--neutral_18mto_341",
|
|
54
|
+
"teddy-card__availability--information": "_teddy-card__availability--information_18mto_344"
|
|
54
55
|
};
|
|
55
56
|
const rootClassName = "teddy-card";
|
|
56
57
|
const actionElementIdentifier = `${rootClassName}__action`;
|
package/dist/style.css
CHANGED
|
@@ -2474,29 +2474,29 @@
|
|
|
2474
2474
|
}
|
|
2475
2475
|
}@layer heading, flex, grid, button, card;
|
|
2476
2476
|
@layer card {
|
|
2477
|
-
._teddy-
|
|
2477
|
+
._teddy-card_18mto_3 {
|
|
2478
2478
|
border-radius: var(--teddy-border-radius-md);
|
|
2479
2479
|
padding: var(--teddy-spacing-250);
|
|
2480
2480
|
position: relative;
|
|
2481
2481
|
}
|
|
2482
2482
|
@media (prefers-reduced-motion: no-preference) {
|
|
2483
|
-
._teddy-
|
|
2483
|
+
._teddy-card_18mto_3 {
|
|
2484
2484
|
transition: background-color var(--teddy-motion-duration-300) ease;
|
|
2485
2485
|
}
|
|
2486
2486
|
}
|
|
2487
|
-
._teddy-
|
|
2487
|
+
._teddy-card__slot_18mto_13 {
|
|
2488
2488
|
transform: translateY(-50%);
|
|
2489
2489
|
}
|
|
2490
|
-
._teddy-card__slot--
|
|
2490
|
+
._teddy-card__slot--bottom_18mto_16 {
|
|
2491
2491
|
transform: translateY(50%);
|
|
2492
2492
|
}
|
|
2493
|
-
._teddy-card__slot--
|
|
2493
|
+
._teddy-card__slot--center_18mto_19 {
|
|
2494
2494
|
transform: translate(-50%, -50%);
|
|
2495
2495
|
}
|
|
2496
|
-
._teddy-card__slot--
|
|
2496
|
+
._teddy-card__slot--bottom_18mto_16._teddy-card__slot--center_18mto_19 {
|
|
2497
2497
|
transform: translate(-50%, 50%);
|
|
2498
2498
|
}
|
|
2499
|
-
._teddy-
|
|
2499
|
+
._teddy-card_18mto_3::before {
|
|
2500
2500
|
content: "";
|
|
2501
2501
|
display: block;
|
|
2502
2502
|
position: absolute;
|
|
@@ -2507,201 +2507,201 @@
|
|
|
2507
2507
|
box-shadow: var(--teddy-shadow-md);
|
|
2508
2508
|
}
|
|
2509
2509
|
@media (prefers-reduced-motion: no-preference) {
|
|
2510
|
-
._teddy-
|
|
2510
|
+
._teddy-card_18mto_3::before {
|
|
2511
2511
|
transition: var(--teddy-motion-duration-300) ease;
|
|
2512
2512
|
transition-property: opacity, box-shadow;
|
|
2513
2513
|
}
|
|
2514
2514
|
}
|
|
2515
|
-
._teddy-card--
|
|
2515
|
+
._teddy-card--shadow_18mto_41::before {
|
|
2516
2516
|
opacity: 1;
|
|
2517
2517
|
box-shadow: var(--teddy-shadow-sm-2);
|
|
2518
2518
|
}
|
|
2519
|
-
._teddy-
|
|
2519
|
+
._teddy-card_18mto_3:has(._teddy-card__action_18mto_45:not(._teddy-card__action--disabled_18mto_45)) {
|
|
2520
2520
|
cursor: pointer;
|
|
2521
2521
|
}
|
|
2522
|
-
._teddy-
|
|
2522
|
+
._teddy-card_18mto_3:has(._teddy-card__action_18mto_45:not(._teddy-card__action--disabled_18mto_45)):hover:not(:has(button:hover), :has(a:hover)):has(._teddy-card__action_18mto_45:not(._teddy-card__action--disabled_18mto_45))::before {
|
|
2523
2523
|
opacity: 1;
|
|
2524
2524
|
box-shadow: var(--teddy-shadow-md);
|
|
2525
2525
|
}
|
|
2526
|
-
._teddy-card--
|
|
2526
|
+
._teddy-card--border_18mto_52 {
|
|
2527
2527
|
border: var(--teddy-border-width-xs) solid transparent;
|
|
2528
2528
|
}
|
|
2529
|
-
._teddy-card--
|
|
2529
|
+
._teddy-card--layout_18mto_55 ._teddy-card__illustration_18mto_55 {
|
|
2530
2530
|
grid-area: illustration;
|
|
2531
2531
|
}
|
|
2532
|
-
._teddy-card--
|
|
2532
|
+
._teddy-card--layout_18mto_55 ._teddy-card__content_18mto_58 {
|
|
2533
2533
|
grid-area: content;
|
|
2534
2534
|
}
|
|
2535
|
-
._teddy-card--
|
|
2535
|
+
._teddy-card--layout_18mto_55 ._teddy-card__heading_18mto_61 {
|
|
2536
2536
|
grid-area: heading;
|
|
2537
2537
|
}
|
|
2538
|
-
._teddy-card--
|
|
2538
|
+
._teddy-card--layout_18mto_55 ._teddy-card__action-wrapper_18mto_64 {
|
|
2539
2539
|
grid-area: action;
|
|
2540
2540
|
}
|
|
2541
|
-
._teddy-card--
|
|
2541
|
+
._teddy-card--layout_18mto_55 ._teddy-card__footer_18mto_67 {
|
|
2542
2542
|
grid-area: footer;
|
|
2543
2543
|
}
|
|
2544
|
-
._teddy-card--
|
|
2544
|
+
._teddy-card--layout_18mto_55 ._teddy-card__overline_18mto_70 {
|
|
2545
2545
|
grid-area: overline;
|
|
2546
2546
|
}
|
|
2547
|
-
._teddy-card--
|
|
2547
|
+
._teddy-card--layout_18mto_55 ._teddy-card__description_18mto_73 {
|
|
2548
2548
|
grid-area: description;
|
|
2549
2549
|
}
|
|
2550
|
-
._teddy-card--
|
|
2550
|
+
._teddy-card--layout_18mto_55 ._teddy-card__color-dots_18mto_76 {
|
|
2551
2551
|
grid-area: colors;
|
|
2552
2552
|
}
|
|
2553
|
-
._teddy-card--
|
|
2553
|
+
._teddy-card--layout_18mto_55 ._teddy-card__availability_18mto_79 {
|
|
2554
2554
|
grid-area: availability;
|
|
2555
2555
|
}
|
|
2556
|
-
._teddy-card--
|
|
2556
|
+
._teddy-card--layout_18mto_55 ._teddy-card__price_18mto_82 {
|
|
2557
2557
|
grid-area: price;
|
|
2558
2558
|
}
|
|
2559
|
-
._teddy-card--
|
|
2559
|
+
._teddy-card--default_18mto_85 {
|
|
2560
2560
|
display: flex;
|
|
2561
2561
|
flex-direction: column;
|
|
2562
2562
|
gap: var(--teddy-spacing-200);
|
|
2563
2563
|
}
|
|
2564
|
-
._teddy-card--navigation-
|
|
2564
|
+
._teddy-card--navigation-vertical_18mto_90 {
|
|
2565
2565
|
grid-template-rows: auto auto 1fr auto;
|
|
2566
2566
|
justify-items: start;
|
|
2567
2567
|
align-items: baseline;
|
|
2568
2568
|
grid-template-areas: "illustration" "heading" "content" "action";
|
|
2569
2569
|
}
|
|
2570
|
-
._teddy-card--navigation-
|
|
2570
|
+
._teddy-card--navigation-vertical_18mto_90 ._teddy-card__illustration_18mto_55 {
|
|
2571
2571
|
margin-bottom: var(--teddy-spacing-200);
|
|
2572
2572
|
}
|
|
2573
|
-
._teddy-card--navigation-
|
|
2573
|
+
._teddy-card--navigation-vertical_18mto_90 ._teddy-card__content_18mto_58 {
|
|
2574
2574
|
margin-bottom: var(--teddy-spacing-200);
|
|
2575
2575
|
}
|
|
2576
|
-
._teddy-card--navigation-
|
|
2576
|
+
._teddy-card--navigation-vertical_18mto_90 ._teddy-card__heading_18mto_61 {
|
|
2577
2577
|
margin-bottom: var(--teddy-spacing-100);
|
|
2578
2578
|
}
|
|
2579
|
-
._teddy-card--navigation-
|
|
2579
|
+
._teddy-card--navigation-vertical_18mto_90 ._teddy-card__action_18mto_45 {
|
|
2580
2580
|
margin-top: auto;
|
|
2581
2581
|
justify-self: end;
|
|
2582
2582
|
}
|
|
2583
|
-
._teddy-card--navigation-horizontal-
|
|
2583
|
+
._teddy-card--navigation-horizontal-small_18mto_109 {
|
|
2584
2584
|
grid-template-columns: auto 1fr auto;
|
|
2585
2585
|
grid-template-rows: auto 1fr;
|
|
2586
2586
|
grid-template-areas: "illustration heading action" "illustration content action";
|
|
2587
2587
|
column-gap: var(--teddy-spacing-200);
|
|
2588
2588
|
}
|
|
2589
|
-
._teddy-card--navigation-horizontal-
|
|
2589
|
+
._teddy-card--navigation-horizontal-small_18mto_109 ._teddy-card__heading_18mto_61 {
|
|
2590
2590
|
margin-bottom: var(--teddy-spacing-100);
|
|
2591
2591
|
}
|
|
2592
|
-
._teddy-card--navigation-horizontal-
|
|
2592
|
+
._teddy-card--navigation-horizontal-small_18mto_109 ._teddy-card__action_18mto_45 {
|
|
2593
2593
|
margin-top: auto;
|
|
2594
2594
|
}
|
|
2595
|
-
._teddy-card--navigation-horizontal-
|
|
2595
|
+
._teddy-card--navigation-horizontal-large_18mto_121 {
|
|
2596
2596
|
grid-template-columns: 1fr auto;
|
|
2597
2597
|
grid-template-rows: auto auto 1fr;
|
|
2598
2598
|
grid-template-areas: "illustration action" "heading action" "content action";
|
|
2599
2599
|
column-gap: var(--teddy-spacing-200);
|
|
2600
2600
|
}
|
|
2601
|
-
._teddy-card--navigation-horizontal-
|
|
2601
|
+
._teddy-card--navigation-horizontal-large_18mto_121 ._teddy-card__heading_18mto_61 {
|
|
2602
2602
|
margin-bottom: var(--teddy-spacing-100);
|
|
2603
2603
|
}
|
|
2604
|
-
._teddy-card--navigation-horizontal-
|
|
2604
|
+
._teddy-card--navigation-horizontal-large_18mto_121 ._teddy-card__action_18mto_45 {
|
|
2605
2605
|
margin-top: auto;
|
|
2606
2606
|
}
|
|
2607
|
-
._teddy-card--rich-
|
|
2607
|
+
._teddy-card--rich-card_18mto_133 {
|
|
2608
2608
|
justify-items: start;
|
|
2609
2609
|
align-items: baseline;
|
|
2610
2610
|
grid-template-rows: auto auto 1fr auto;
|
|
2611
2611
|
grid-template-areas: "illustration" "heading" "content" "action";
|
|
2612
2612
|
}
|
|
2613
|
-
._teddy-card--rich-
|
|
2613
|
+
._teddy-card--rich-card_18mto_133 ._teddy-card__illustration_18mto_55 {
|
|
2614
2614
|
margin-bottom: var(--teddy-spacing-200);
|
|
2615
2615
|
}
|
|
2616
|
-
._teddy-card--rich-
|
|
2616
|
+
._teddy-card--rich-card_18mto_133 ._teddy-card__content_18mto_58 {
|
|
2617
2617
|
margin-bottom: var(--teddy-spacing-200);
|
|
2618
2618
|
}
|
|
2619
|
-
._teddy-card--rich-
|
|
2619
|
+
._teddy-card--rich-card_18mto_133 ._teddy-card__heading_18mto_61 {
|
|
2620
2620
|
margin-bottom: var(--teddy-spacing-100);
|
|
2621
2621
|
}
|
|
2622
|
-
._teddy-card--rich-
|
|
2622
|
+
._teddy-card--rich-card_18mto_133 ._teddy-card__action_18mto_45 {
|
|
2623
2623
|
margin-top: auto;
|
|
2624
2624
|
}
|
|
2625
|
-
._teddy-
|
|
2625
|
+
._teddy-card__line_18mto_151 {
|
|
2626
2626
|
border: 0;
|
|
2627
2627
|
border-top: var(--teddy-border-width-xs) solid var(--teddy-color-border-weak);
|
|
2628
2628
|
}
|
|
2629
|
-
._teddy-card--purple-
|
|
2629
|
+
._teddy-card--purple-light_18mto_155 {
|
|
2630
2630
|
background-color: var(--teddy-color-background-interactive-primary-negative);
|
|
2631
2631
|
color: var(--teddy-color-text-default);
|
|
2632
2632
|
border-color: var(--teddy-color-background-interactive-primary-negative);
|
|
2633
2633
|
}
|
|
2634
|
-
._teddy-card--purple-
|
|
2634
|
+
._teddy-card--purple-light_18mto_155:hover:has(._teddy-card__action_18mto_45:not(._teddy-card__action--disabled_18mto_45)) {
|
|
2635
2635
|
background-color: var(--teddy-color-background-interactive-primary-negative-hover);
|
|
2636
2636
|
}
|
|
2637
|
-
._teddy-card--purple-
|
|
2637
|
+
._teddy-card--purple-light_18mto_155:active:has(._teddy-card__action_18mto_45:not(._teddy-card__action--disabled_18mto_45)) {
|
|
2638
2638
|
background-color: var(--teddy-color-background-interactive-primary-negative-active);
|
|
2639
2639
|
}
|
|
2640
|
-
._teddy-card--purple-
|
|
2640
|
+
._teddy-card--purple-light_18mto_155:has(._teddy-card__action--disabled_18mto_45) {
|
|
2641
2641
|
background-color: var(--teddy-color-background-interactive-disabled);
|
|
2642
2642
|
}
|
|
2643
|
-
._teddy-card--purple-
|
|
2643
|
+
._teddy-card--purple-dark_18mto_169 {
|
|
2644
2644
|
background-color: var(--teddy-color-brand-deep-purple);
|
|
2645
2645
|
color: var(--teddy-color-text-default-negative);
|
|
2646
2646
|
border-color: var(--teddy-color-brand-deep-purple);
|
|
2647
2647
|
}
|
|
2648
|
-
._teddy-card--purple-
|
|
2648
|
+
._teddy-card--purple-dark_18mto_169:hover:has(._teddy-card__action_18mto_45:not(._teddy-card__action--disabled_18mto_45)) {
|
|
2649
2649
|
background-color: var(--teddy-color-background-interactive-transparent-negative-hover);
|
|
2650
2650
|
}
|
|
2651
|
-
._teddy-card--purple-
|
|
2651
|
+
._teddy-card--purple-dark_18mto_169:active:has(._teddy-card__action_18mto_45:not(._teddy-card__action--disabled_18mto_45)) {
|
|
2652
2652
|
background-color: var(--teddy-color-background-interactive-transparent-negative-active);
|
|
2653
2653
|
}
|
|
2654
|
-
._teddy-card--purple-
|
|
2654
|
+
._teddy-card--purple-dark_18mto_169:has(._teddy-card__action--disabled_18mto_45) {
|
|
2655
2655
|
color: var(--teddy-color-text-default);
|
|
2656
2656
|
background-color: var(--teddy-color-background-interactive-disabled);
|
|
2657
2657
|
}
|
|
2658
|
-
._teddy-card--purple-
|
|
2658
|
+
._teddy-card--purple-dark_18mto_169:has(._teddy-card__action--disabled_18mto_45) ._teddy-card__action_18mto_45 {
|
|
2659
2659
|
color: var(--teddy-color-text-weak);
|
|
2660
2660
|
background-color: var(--teddy-color-background-interactive-disabled);
|
|
2661
2661
|
}
|
|
2662
|
-
._teddy-card--
|
|
2662
|
+
._teddy-card--white_18mto_188 {
|
|
2663
2663
|
background-color: var(--teddy-color-brand-white);
|
|
2664
2664
|
color: var(--teddy-color-text-default);
|
|
2665
2665
|
border-color: var(--teddy-color-border-interactive-subtle);
|
|
2666
2666
|
}
|
|
2667
|
-
._teddy-card--
|
|
2667
|
+
._teddy-card--white_18mto_188:hover:has(._teddy-card__action_18mto_45:not(._teddy-card__action--disabled_18mto_45)) {
|
|
2668
2668
|
background-color: var(--teddy-color-background-interactive-transparent-hover);
|
|
2669
2669
|
}
|
|
2670
|
-
._teddy-card--
|
|
2670
|
+
._teddy-card--white_18mto_188:active:has(._teddy-card__action_18mto_45:not(._teddy-card__action--disabled_18mto_45)) {
|
|
2671
2671
|
background-color: var(--teddy-color-background-interactive-transparent-active);
|
|
2672
2672
|
}
|
|
2673
|
-
._teddy-card--
|
|
2673
|
+
._teddy-card--white_18mto_188:has(._teddy-card__action--disabled_18mto_45) {
|
|
2674
2674
|
background-color: var(--teddy-color-background-interactive-disabled);
|
|
2675
2675
|
}
|
|
2676
|
-
._teddy-card--
|
|
2676
|
+
._teddy-card--gray_18mto_202 {
|
|
2677
2677
|
background-color: var(--teddy-color-background-secondary);
|
|
2678
2678
|
color: var(--teddy-color-text-default);
|
|
2679
2679
|
border-color: var(--teddy-color-border-interactive-subtle);
|
|
2680
2680
|
}
|
|
2681
|
-
._teddy-card--
|
|
2681
|
+
._teddy-card--gray_18mto_202:hover:has(._teddy-card__action_18mto_45:not(._teddy-card__action--disabled_18mto_45)) {
|
|
2682
2682
|
background-color: var(--teddy-color-gray-100);
|
|
2683
2683
|
}
|
|
2684
|
-
._teddy-card--
|
|
2684
|
+
._teddy-card--gray_18mto_202:active:has(._teddy-card__action_18mto_45:not(._teddy-card__action--disabled_18mto_45)) {
|
|
2685
2685
|
background-color: var(--teddy-color-gray-200);
|
|
2686
2686
|
}
|
|
2687
|
-
._teddy-card--
|
|
2687
|
+
._teddy-card--gray_18mto_202:has(._teddy-card__action--disabled_18mto_45) {
|
|
2688
2688
|
background-color: var(--teddy-color-background-interactive-disabled);
|
|
2689
2689
|
}
|
|
2690
|
-
._teddy-card--
|
|
2690
|
+
._teddy-card--beige_18mto_216 {
|
|
2691
2691
|
background-color: var(--teddy-color-beige-100);
|
|
2692
2692
|
color: var(--teddy-color-text-default);
|
|
2693
2693
|
border-color: var(--teddy-color-beige-300);
|
|
2694
2694
|
}
|
|
2695
|
-
._teddy-card--
|
|
2695
|
+
._teddy-card--beige_18mto_216:hover:has(._teddy-card__action_18mto_45:not(._teddy-card__action--disabled_18mto_45)) {
|
|
2696
2696
|
background-color: var(--teddy-color-beige-200);
|
|
2697
2697
|
}
|
|
2698
|
-
._teddy-card--
|
|
2698
|
+
._teddy-card--beige_18mto_216:active:has(._teddy-card__action_18mto_45:not(._teddy-card__action--disabled_18mto_45)) {
|
|
2699
2699
|
background-color: var(--teddy-color-beige-300);
|
|
2700
2700
|
}
|
|
2701
|
-
._teddy-card--
|
|
2701
|
+
._teddy-card--beige_18mto_216:has(._teddy-card__action--disabled_18mto_45) {
|
|
2702
2702
|
background-color: var(--teddy-color-background-interactive-disabled);
|
|
2703
2703
|
}
|
|
2704
|
-
._teddy-card--
|
|
2704
|
+
._teddy-card--product_18mto_230 {
|
|
2705
2705
|
grid-template-columns: 1fr;
|
|
2706
2706
|
grid-template-rows: auto auto auto auto auto auto 1fr auto auto;
|
|
2707
2707
|
grid-template-areas: "illustration" "overline" "heading" "colors" "description" "content" "price" "action" "availability";
|
|
@@ -2712,104 +2712,110 @@
|
|
|
2712
2712
|
padding-bottom: var(--teddy-spacing-100);
|
|
2713
2713
|
width: 100%;
|
|
2714
2714
|
}
|
|
2715
|
-
._teddy-card--
|
|
2715
|
+
._teddy-card--product_18mto_230:hover:has(._teddy-card__action_18mto_45:not(._teddy-card__action--disabled_18mto_45)) {
|
|
2716
2716
|
background-color: var(--teddy-color-brand-white);
|
|
2717
2717
|
outline: var(--teddy-border-width-sm) solid var(--teddy-color-border-interactive-primary);
|
|
2718
2718
|
outline-offset: calc(var(--teddy-border-width-sm) * -1);
|
|
2719
2719
|
}
|
|
2720
|
-
._teddy-card--
|
|
2720
|
+
._teddy-card--product_18mto_230:active:has(._teddy-card__action_18mto_45:not(._teddy-card__action--disabled_18mto_45)) {
|
|
2721
2721
|
background-color: var(--teddy-color-background-interactive-transparent-active);
|
|
2722
2722
|
}
|
|
2723
|
-
._teddy-card--
|
|
2723
|
+
._teddy-card--product_18mto_230:has(._teddy-card__action--disabled_18mto_45) {
|
|
2724
2724
|
background-color: var(--teddy-color-background-interactive-disabled);
|
|
2725
2725
|
}
|
|
2726
|
-
._teddy-card--
|
|
2726
|
+
._teddy-card--product_18mto_230 ._teddy-card__illustration_18mto_55 {
|
|
2727
2727
|
height: 180px;
|
|
2728
2728
|
display: grid;
|
|
2729
2729
|
place-items: center;
|
|
2730
2730
|
place-self: center;
|
|
2731
2731
|
margin-bottom: var(--teddy-spacing-400);
|
|
2732
2732
|
}
|
|
2733
|
-
._teddy-card--
|
|
2733
|
+
._teddy-card--product_18mto_230 ._teddy-card__illustration_18mto_55 img {
|
|
2734
2734
|
max-width: 200px;
|
|
2735
2735
|
max-height: 180px;
|
|
2736
2736
|
object-fit: contain;
|
|
2737
2737
|
}
|
|
2738
|
-
._teddy-card--
|
|
2738
|
+
._teddy-card--product_18mto_230 ._teddy-card__overline_18mto_70 {
|
|
2739
2739
|
margin-bottom: var(--teddy-spacing-100);
|
|
2740
2740
|
}
|
|
2741
|
-
._teddy-card--
|
|
2741
|
+
._teddy-card--product_18mto_230 ._teddy-card__heading_18mto_61 {
|
|
2742
2742
|
margin-bottom: var(--teddy-spacing-200);
|
|
2743
2743
|
}
|
|
2744
|
-
._teddy-card--
|
|
2744
|
+
._teddy-card--product_18mto_230 ._teddy-card__description_18mto_73 {
|
|
2745
2745
|
margin-bottom: var(--teddy-spacing-200);
|
|
2746
2746
|
}
|
|
2747
|
-
._teddy-card--
|
|
2747
|
+
._teddy-card--product_18mto_230 ._teddy-card__action_18mto_45 {
|
|
2748
2748
|
margin-top: auto;
|
|
2749
2749
|
margin-left: auto;
|
|
2750
2750
|
justify-self: end;
|
|
2751
2751
|
}
|
|
2752
|
-
._teddy-
|
|
2752
|
+
._teddy-card--product_18mto_230 ._teddy-card__price_18mto_82 {
|
|
2753
|
+
display: flex;
|
|
2754
|
+
}
|
|
2755
|
+
._teddy-card--product_18mto_230 ._teddy-card__price--big_18mto_281 {
|
|
2756
|
+
font-size: var(--teddy-typography-scale-400);
|
|
2757
|
+
}
|
|
2758
|
+
._teddy-card_18mto_3:has(._teddy-card__image--as-background_18mto_284) {
|
|
2753
2759
|
background-color: transparent;
|
|
2754
2760
|
}
|
|
2755
|
-
._teddy-
|
|
2761
|
+
._teddy-card__heading_18mto_61 {
|
|
2756
2762
|
color: inherit;
|
|
2757
2763
|
}
|
|
2758
|
-
._teddy-card--background-
|
|
2764
|
+
._teddy-card--background-image_18mto_290 {
|
|
2759
2765
|
background-repeat: no-repeat;
|
|
2760
2766
|
background-size: cover;
|
|
2761
2767
|
background-position: center;
|
|
2762
2768
|
}
|
|
2763
|
-
._teddy-card__illustration--
|
|
2769
|
+
._teddy-card__illustration--rounded_18mto_295 {
|
|
2764
2770
|
border-radius: inherit;
|
|
2765
2771
|
overflow: hidden;
|
|
2766
2772
|
}
|
|
2767
|
-
._teddy-
|
|
2773
|
+
._teddy-card__inset_18mto_299 {
|
|
2768
2774
|
overflow: hidden;
|
|
2769
2775
|
}
|
|
2770
|
-
._teddy-card__inset--
|
|
2776
|
+
._teddy-card__inset--top_18mto_302 {
|
|
2771
2777
|
margin-top: calc(var(--teddy-spacing-250) * -1);
|
|
2772
2778
|
}
|
|
2773
|
-
._teddy-card__inset--
|
|
2779
|
+
._teddy-card__inset--top_18mto_302._teddy-card__inset--left_18mto_305 {
|
|
2774
2780
|
border-top-left-radius: inherit;
|
|
2775
2781
|
}
|
|
2776
|
-
._teddy-card__inset--
|
|
2782
|
+
._teddy-card__inset--top_18mto_302._teddy-card__inset--right_18mto_308 {
|
|
2777
2783
|
border-top-right-radius: inherit;
|
|
2778
2784
|
}
|
|
2779
|
-
._teddy-card__inset--
|
|
2785
|
+
._teddy-card__inset--bottom_18mto_311 {
|
|
2780
2786
|
margin-bottom: calc(var(--teddy-spacing-250) * -1);
|
|
2781
2787
|
}
|
|
2782
|
-
._teddy-card__inset--
|
|
2788
|
+
._teddy-card__inset--bottom_18mto_311._teddy-card__inset--left_18mto_305 {
|
|
2783
2789
|
border-bottom-left-radius: inherit;
|
|
2784
2790
|
}
|
|
2785
|
-
._teddy-card__inset--
|
|
2791
|
+
._teddy-card__inset--bottom_18mto_311._teddy-card__inset--right_18mto_308 {
|
|
2786
2792
|
border-bottom-right-radius: inherit;
|
|
2787
2793
|
}
|
|
2788
|
-
._teddy-card__inset--
|
|
2794
|
+
._teddy-card__inset--left_18mto_305 {
|
|
2789
2795
|
margin-left: calc(var(--teddy-spacing-250) * -1);
|
|
2790
2796
|
}
|
|
2791
|
-
._teddy-card__inset--
|
|
2797
|
+
._teddy-card__inset--right_18mto_308 {
|
|
2792
2798
|
margin-right: calc(var(--teddy-spacing-250) * -1);
|
|
2793
2799
|
}
|
|
2794
|
-
._teddy-card__availability--
|
|
2800
|
+
._teddy-card__availability--badge_18mto_326 {
|
|
2795
2801
|
margin-right: var(--teddy-spacing-150);
|
|
2796
2802
|
}
|
|
2797
|
-
._teddy-card__availability--
|
|
2803
|
+
._teddy-card__availability--success_18mto_329 {
|
|
2798
2804
|
color: var(--teddy-color-text-status-success-strong);
|
|
2799
2805
|
}
|
|
2800
|
-
._teddy-card__availability--
|
|
2806
|
+
._teddy-card__availability--warning_18mto_332 {
|
|
2801
2807
|
color: var(--teddy-color-text-status-warning-strong);
|
|
2802
2808
|
}
|
|
2803
|
-
._teddy-card__availability--
|
|
2809
|
+
._teddy-card__availability--error_18mto_335 {
|
|
2804
2810
|
color: var(--teddy-color-text-status-error-strong);
|
|
2805
2811
|
}
|
|
2806
|
-
._teddy-card__availability--
|
|
2812
|
+
._teddy-card__availability--special_18mto_338 {
|
|
2807
2813
|
color: var(--teddy-color-text-status-special);
|
|
2808
2814
|
}
|
|
2809
|
-
._teddy-card__availability--
|
|
2815
|
+
._teddy-card__availability--neutral_18mto_341 {
|
|
2810
2816
|
color: var(--teddy-color-text-status-neutral);
|
|
2811
2817
|
}
|
|
2812
|
-
._teddy-card__availability--
|
|
2818
|
+
._teddy-card__availability--information_18mto_344 {
|
|
2813
2819
|
color: var(--teddy-color-text-status-info-strong);
|
|
2814
2820
|
}
|
|
2815
2821
|
}._teddy-badge_wlyo5_1 {
|
|
@@ -3191,62 +3197,62 @@
|
|
|
3191
3197
|
}
|
|
3192
3198
|
}@layer heading, link, accordion;
|
|
3193
3199
|
@layer accordion {
|
|
3194
|
-
._teddy-
|
|
3200
|
+
._teddy-accordion_nueyr_3 {
|
|
3195
3201
|
--indented-spacing: var(--teddy-spacing-200);
|
|
3196
3202
|
}
|
|
3197
3203
|
@media (min-width: 600px) {
|
|
3198
|
-
._teddy-
|
|
3204
|
+
._teddy-accordion_nueyr_3 {
|
|
3199
3205
|
--indented-spacing: var(--teddy-spacing-300);
|
|
3200
3206
|
}
|
|
3201
3207
|
}
|
|
3202
|
-
._teddy-accordion--
|
|
3208
|
+
._teddy-accordion--indented_nueyr_11 ._teddy-accordion__header_nueyr_11 > *:first-child {
|
|
3203
3209
|
padding-left: var(--indented-spacing);
|
|
3204
3210
|
}
|
|
3205
|
-
._teddy-accordion--
|
|
3211
|
+
._teddy-accordion--indented_nueyr_11 ._teddy-accordion__content_nueyr_14 {
|
|
3206
3212
|
padding-inline: var(--indented-spacing);
|
|
3207
3213
|
}
|
|
3208
|
-
._teddy-accordion--
|
|
3214
|
+
._teddy-accordion--negative_nueyr_17 ._teddy-accordion__header_nueyr_11 {
|
|
3209
3215
|
color: var(--teddy-color-text-interactive-primary-negative);
|
|
3210
3216
|
}
|
|
3211
|
-
._teddy-accordion--
|
|
3212
|
-
._teddy-accordion--
|
|
3217
|
+
._teddy-accordion--negative_nueyr_17 ._teddy-accordion__content_nueyr_14,
|
|
3218
|
+
._teddy-accordion--negative_nueyr_17 ._teddy-accordion__title_nueyr_21 {
|
|
3213
3219
|
color: var(--teddy-color-text-default-negative);
|
|
3214
3220
|
}
|
|
3215
|
-
._teddy-accordion--
|
|
3221
|
+
._teddy-accordion--negative_nueyr_17 ._teddy-accordion__trigger_nueyr_24:hover {
|
|
3216
3222
|
background-color: var(--teddy-color-background-interactive-transparent-negative-hover);
|
|
3217
3223
|
}
|
|
3218
3224
|
@media (prefers-reduced-motion: no-preference) {
|
|
3219
|
-
._teddy-accordion--
|
|
3225
|
+
._teddy-accordion--negative_nueyr_17 ._teddy-accordion__trigger_nueyr_24:active {
|
|
3220
3226
|
background-color: var(--teddy-color-background-interactive-transparent-negative-active);
|
|
3221
3227
|
}
|
|
3222
3228
|
}
|
|
3223
|
-
._teddy-accordion--
|
|
3229
|
+
._teddy-accordion--negative_nueyr_17 ._teddy-accordion__item_nueyr_32 {
|
|
3224
3230
|
border-color: var(--teddy-color-border-medium-negative);
|
|
3225
3231
|
}
|
|
3226
|
-
._teddy-accordion--
|
|
3232
|
+
._teddy-accordion--negative_nueyr_17 ._teddy-accordion__item_nueyr_32:last-child {
|
|
3227
3233
|
border-color: var(--teddy-color-border-medium-negative);
|
|
3228
3234
|
}
|
|
3229
|
-
._teddy-
|
|
3235
|
+
._teddy-accordion_nueyr_3:disabled {
|
|
3230
3236
|
background-color: var(--teddy-color-background-interactive-transparent);
|
|
3231
3237
|
}
|
|
3232
|
-
._teddy-
|
|
3238
|
+
._teddy-accordion__title_nueyr_21 {
|
|
3233
3239
|
margin-bottom: var(--teddy-spacing-300);
|
|
3234
3240
|
}
|
|
3235
3241
|
@media (min-width: 600px) {
|
|
3236
|
-
._teddy-
|
|
3242
|
+
._teddy-accordion__title_nueyr_21 {
|
|
3237
3243
|
margin-bottom: var(--teddy-spacing-400);
|
|
3238
3244
|
}
|
|
3239
3245
|
}
|
|
3240
|
-
._teddy-
|
|
3246
|
+
._teddy-accordion__item_nueyr_32 {
|
|
3241
3247
|
border-top: var(--teddy-border-width-xs) solid var(--teddy-color-border-weak);
|
|
3242
3248
|
}
|
|
3243
|
-
._teddy-
|
|
3249
|
+
._teddy-accordion__item_nueyr_32:first-child {
|
|
3244
3250
|
margin-top: 0;
|
|
3245
3251
|
}
|
|
3246
|
-
._teddy-
|
|
3252
|
+
._teddy-accordion__item_nueyr_32:last-child {
|
|
3247
3253
|
border-bottom: var(--teddy-border-width-xs) solid var(--teddy-color-border-weak);
|
|
3248
3254
|
}
|
|
3249
|
-
._teddy-
|
|
3255
|
+
._teddy-accordion__header_nueyr_11 {
|
|
3250
3256
|
background-color: var(--teddy-color-background-interactive-transparent);
|
|
3251
3257
|
display: grid;
|
|
3252
3258
|
grid-template-columns: minmax(0, 1fr) auto;
|
|
@@ -3255,7 +3261,7 @@
|
|
|
3255
3261
|
color: var(--teddy-color-text-interactive-primary);
|
|
3256
3262
|
font-weight: var(--teddy-typography-weight-bold);
|
|
3257
3263
|
}
|
|
3258
|
-
._teddy-
|
|
3264
|
+
._teddy-accordion__trigger_nueyr_24 {
|
|
3259
3265
|
all: unset;
|
|
3260
3266
|
font-family: inherit;
|
|
3261
3267
|
background-color: transparent;
|
|
@@ -3269,88 +3275,92 @@
|
|
|
3269
3275
|
transition-timing-function: var(--teddy-motion-easing-ease-in-out);
|
|
3270
3276
|
transition-property: background-color, color;
|
|
3271
3277
|
}
|
|
3272
|
-
._teddy-
|
|
3278
|
+
._teddy-accordion__trigger_nueyr_24:hover {
|
|
3273
3279
|
background-color: var(--teddy-color-background-interactive-transparent-hover);
|
|
3274
3280
|
}
|
|
3275
3281
|
@media (prefers-reduced-motion: no-preference) {
|
|
3276
|
-
._teddy-
|
|
3282
|
+
._teddy-accordion__trigger_nueyr_24:active {
|
|
3277
3283
|
background-color: var(--teddy-color-background-interactive-transparent-active);
|
|
3278
3284
|
}
|
|
3279
3285
|
}
|
|
3280
|
-
._teddy-
|
|
3286
|
+
._teddy-accordion__trigger_nueyr_24:focus-within {
|
|
3281
3287
|
outline: solid var(--teddy-border-width-sm) var(--teddy-color-border-interactive-focus);
|
|
3282
3288
|
outline-offset: var(--teddy-spacing-25);
|
|
3283
3289
|
z-index: 1;
|
|
3284
3290
|
}
|
|
3285
|
-
._teddy-
|
|
3291
|
+
._teddy-accordion__trigger_nueyr_24:focus-within:not(:focus-visible) {
|
|
3286
3292
|
outline: 0;
|
|
3287
3293
|
}
|
|
3288
|
-
._teddy-
|
|
3294
|
+
._teddy-accordion__trigger_nueyr_24:disabled {
|
|
3289
3295
|
cursor: not-allowed;
|
|
3290
3296
|
background-color: var(--teddy-color-background-interactive-disabled);
|
|
3291
3297
|
}
|
|
3292
|
-
._teddy-
|
|
3298
|
+
._teddy-accordion__trigger_nueyr_24 ._teddy-accordion__indicator_nueyr_101 {
|
|
3293
3299
|
flex-shrink: 0;
|
|
3294
3300
|
transform: rotate(0);
|
|
3295
3301
|
margin: var(--indented-spacing);
|
|
3296
3302
|
}
|
|
3297
3303
|
@media (min-width: 1024px) {
|
|
3298
|
-
._teddy-
|
|
3304
|
+
._teddy-accordion__trigger_nueyr_24 ._teddy-accordion__indicator_nueyr_101 {
|
|
3299
3305
|
margin-block: var(--teddy-spacing-400);
|
|
3300
3306
|
}
|
|
3301
3307
|
}
|
|
3302
3308
|
@media (prefers-reduced-motion: no-preference) {
|
|
3303
|
-
._teddy-
|
|
3309
|
+
._teddy-accordion__trigger_nueyr_24 ._teddy-accordion__indicator--rotate_nueyr_112 {
|
|
3304
3310
|
transition: transform var(--teddy-motion-duration-300) var(--teddy-motion-easing-ease-in-out);
|
|
3305
3311
|
}
|
|
3306
3312
|
}
|
|
3307
|
-
._teddy-
|
|
3313
|
+
._teddy-accordion__trigger_nueyr_24[data-state=open] ._teddy-accordion__indicator_nueyr_101 {
|
|
3308
3314
|
transform: rotate(180deg);
|
|
3309
3315
|
}
|
|
3310
|
-
._teddy-
|
|
3316
|
+
._teddy-accordion__content_nueyr_14 {
|
|
3311
3317
|
overflow: hidden;
|
|
3312
3318
|
color: var(--teddy-color-text-default);
|
|
3313
3319
|
padding: 0 var(--teddy-spacing-300) 0 0;
|
|
3314
3320
|
}
|
|
3315
3321
|
@media (prefers-reduced-motion: no-preference) {
|
|
3316
|
-
._teddy-
|
|
3317
|
-
animation:
|
|
3322
|
+
._teddy-accordion__content_nueyr_14[data-state=open] {
|
|
3323
|
+
animation: _slideDown_nueyr_1 var(--teddy-motion-duration-300) var(--teddy-motion-easing-ease-in-out);
|
|
3324
|
+
height: auto;
|
|
3325
|
+
visibility: visible;
|
|
3318
3326
|
}
|
|
3319
|
-
._teddy-
|
|
3320
|
-
|
|
3327
|
+
._teddy-accordion__content_nueyr_14[data-state=closed] {
|
|
3328
|
+
visibility: hidden;
|
|
3329
|
+
height: 0;
|
|
3330
|
+
animation: _slideUp_nueyr_1 var(--teddy-motion-duration-300) var(--teddy-motion-easing-ease-in-out);
|
|
3321
3331
|
}
|
|
3322
3332
|
}
|
|
3323
|
-
._teddy-
|
|
3333
|
+
._teddy-accordion__content_nueyr_14::after {
|
|
3324
3334
|
content: "";
|
|
3325
3335
|
display: block;
|
|
3326
3336
|
height: var(--teddy-spacing-400);
|
|
3327
3337
|
width: 100%;
|
|
3328
3338
|
}
|
|
3329
|
-
._teddy-accordion--info-
|
|
3339
|
+
._teddy-accordion--info-area_nueyr_142 ._teddy-accordion__header_nueyr_11 {
|
|
3330
3340
|
color: var(--teddy-color-text-default);
|
|
3331
3341
|
font-size: var(--teddy-typography-scale-100);
|
|
3332
3342
|
}
|
|
3333
|
-
._teddy-accordion--info-
|
|
3343
|
+
._teddy-accordion--info-area_nueyr_142 ._teddy-accordion__content_nueyr_14::after {
|
|
3334
3344
|
height: var(--teddy-spacing-200);
|
|
3335
3345
|
}
|
|
3336
|
-
._teddy-accordion--info-
|
|
3346
|
+
._teddy-accordion--info-area_nueyr_142 ._teddy-accordion__indicator_nueyr_101 {
|
|
3337
3347
|
margin-block: var(--teddy-spacing-200);
|
|
3338
3348
|
}
|
|
3339
|
-
._teddy-accordion--info-
|
|
3340
|
-
._teddy-accordion--info-
|
|
3349
|
+
._teddy-accordion--info-area_nueyr_142 ._teddy-accordion__content_nueyr_14,
|
|
3350
|
+
._teddy-accordion--info-area_nueyr_142 ._teddy-accordion__title_nueyr_21 {
|
|
3341
3351
|
color: var(--teddy-color-text-default);
|
|
3342
3352
|
}
|
|
3343
|
-
._teddy-accordion--info-
|
|
3353
|
+
._teddy-accordion--info-area_nueyr_142 ._teddy-accordion__item_nueyr_32 {
|
|
3344
3354
|
background-color: var(--teddy-color-background-interactive-inactive);
|
|
3345
3355
|
border: none;
|
|
3346
3356
|
}
|
|
3347
|
-
._teddy-accordion--info-
|
|
3357
|
+
._teddy-accordion--info-area_nueyr_142 ._teddy-accordion__item_nueyr_32:last-child {
|
|
3348
3358
|
border: none;
|
|
3349
3359
|
}
|
|
3350
|
-
._teddy-accordion--info-
|
|
3360
|
+
._teddy-accordion--info-area_nueyr_142 ._teddy-accordion__item_nueyr_32:not(:last-child) {
|
|
3351
3361
|
position: relative;
|
|
3352
3362
|
}
|
|
3353
|
-
._teddy-accordion--info-
|
|
3363
|
+
._teddy-accordion--info-area_nueyr_142 ._teddy-accordion__item_nueyr_32:not(:last-child)::after {
|
|
3354
3364
|
content: "";
|
|
3355
3365
|
display: block;
|
|
3356
3366
|
position: absolute;
|
|
@@ -3359,21 +3369,21 @@
|
|
|
3359
3369
|
transform: translateY(50%);
|
|
3360
3370
|
background-color: var(--teddy-color-border-weak);
|
|
3361
3371
|
}
|
|
3362
|
-
._teddy-accordion--info-
|
|
3372
|
+
._teddy-accordion--info-area_nueyr_142 ._teddy-accordion__item_nueyr_32:first-of-type {
|
|
3363
3373
|
border-radius: var(--teddy-border-radius-md) var(--teddy-border-radius-md) 0 0;
|
|
3364
3374
|
}
|
|
3365
|
-
._teddy-accordion--info-
|
|
3375
|
+
._teddy-accordion--info-area_nueyr_142 ._teddy-accordion__item_nueyr_32:last-of-type {
|
|
3366
3376
|
border-radius: 0 0 var(--teddy-border-radius-md) var(--teddy-border-radius-md);
|
|
3367
3377
|
}
|
|
3368
|
-
._teddy-accordion--info-
|
|
3378
|
+
._teddy-accordion--info-area_nueyr_142 ._teddy-accordion__trigger_nueyr_24:hover {
|
|
3369
3379
|
background-color: var(--teddy-color-background-interactive-inactive);
|
|
3370
3380
|
}
|
|
3371
3381
|
@media (prefers-reduced-motion: no-preference) {
|
|
3372
|
-
._teddy-accordion--info-
|
|
3382
|
+
._teddy-accordion--info-area_nueyr_142 ._teddy-accordion__trigger_nueyr_24:active {
|
|
3373
3383
|
background-color: var(--teddy-color-background-interactive-disabled);
|
|
3374
3384
|
}
|
|
3375
3385
|
}
|
|
3376
|
-
@keyframes
|
|
3386
|
+
@keyframes _slideDown_nueyr_1 {
|
|
3377
3387
|
from {
|
|
3378
3388
|
height: 0;
|
|
3379
3389
|
}
|
|
@@ -3381,7 +3391,7 @@
|
|
|
3381
3391
|
height: var(--radix-accordion-content-height);
|
|
3382
3392
|
}
|
|
3383
3393
|
}
|
|
3384
|
-
@keyframes
|
|
3394
|
+
@keyframes _slideUp_nueyr_1 {
|
|
3385
3395
|
from {
|
|
3386
3396
|
height: var(--radix-accordion-content-height);
|
|
3387
3397
|
}
|