@telia/teddy 0.0.44 → 0.0.46
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/card/card.d.ts +1 -1
- package/dist/components/navigation-menu/global-navigation/global-navigation-desktop.cjs +1 -0
- package/dist/components/navigation-menu/global-navigation/global-navigation-desktop.js +1 -0
- package/dist/components/navigation-menu/global-navigation/global-navigation-my-pages.cjs +32 -18
- package/dist/components/navigation-menu/global-navigation/global-navigation-my-pages.js +32 -18
- package/dist/components/navigation-menu/global-navigation/utils.cjs +2 -1
- package/dist/components/navigation-menu/global-navigation/utils.d.ts +2 -2
- package/dist/components/navigation-menu/global-navigation/utils.js +2 -1
- package/dist/components/navigation-menu/navigation-menu.cjs +20 -20
- package/dist/components/navigation-menu/navigation-menu.js +20 -20
- package/dist/style.css +130 -151
- package/package.json +1 -1
|
@@ -4,7 +4,7 @@ import { Variant } from './utils';
|
|
|
4
4
|
|
|
5
5
|
export declare const rootClassName = "teddy-card";
|
|
6
6
|
export declare const actionElementIdentifier = "teddy-card__action";
|
|
7
|
-
export type Layout = 'navigation-vertical' | 'navigation-horizontal-small' | 'navigation-horizontal-large' | 'rich-card';
|
|
7
|
+
export type Layout = 'navigation-vertical' | 'navigation-horizontal-small' | 'navigation-horizontal-large' | 'rich-card' | 'default';
|
|
8
8
|
type Gradient = 'light' | 'dark' | 'default';
|
|
9
9
|
export declare const RootContext: React.Context<{
|
|
10
10
|
buttonRef: React.RefObject<HTMLButtonElement>;
|
|
@@ -9,4 +9,5 @@ require("../../box/box.cjs");
|
|
|
9
9
|
require("../../../utils/useSize.cjs");
|
|
10
10
|
require("../../../utils/generate-styling/index.cjs");
|
|
11
11
|
require("../../../utils/useCallbackRef.cjs");
|
|
12
|
+
require("../../../tokens/motion/variables.cjs");
|
|
12
13
|
exports.Desktop = components_navigationMenu_globalNavigation_globalNavigationMyPages.Desktop;
|
|
@@ -22,26 +22,24 @@ const components_badge_counterBadge = require("../../badge/counter-badge.cjs");
|
|
|
22
22
|
const utils_useSize = require("../../../utils/useSize.cjs");
|
|
23
23
|
const utils_generateStyling_index = require("../../../utils/generate-styling/index.cjs");
|
|
24
24
|
const utils_useCallbackRef = require("../../../utils/useCallbackRef.cjs");
|
|
25
|
+
const tokens_motion_variables = require("../../../tokens/motion/variables.cjs");
|
|
25
26
|
const components_flex_flex = require("../../flex/flex.cjs");
|
|
26
27
|
const components_accordion_index = require("../../accordion/index.cjs");
|
|
27
28
|
const components_visuallyHidden_visuallyHidden = require("../../visually-hidden/visually-hidden.cjs");
|
|
28
29
|
const components_link_link = require("../../link/link.cjs");
|
|
29
30
|
const components_list_index = require("../../list/index.cjs");
|
|
30
31
|
const styles = {
|
|
31
|
-
"teddy-global-navigation": "_teddy-global-
|
|
32
|
-
"teddy-global-navigation__mobile-trigger": "_teddy-global-navigation__mobile-
|
|
33
|
-
"teddy-global-navigation__mobile-header": "_teddy-global-navigation__mobile-
|
|
34
|
-
"teddy-global-navigation__mobile": "_teddy-global-
|
|
35
|
-
"teddy-global-navigation__link": "_teddy-global-
|
|
36
|
-
"teddy-global-navigation__viewport": "_teddy-global-
|
|
37
|
-
"teddy-global-navigation__item-wrapper": "_teddy-global-navigation__item-
|
|
38
|
-
"teddy-global-navigation__item-count": "_teddy-global-navigation__item-
|
|
39
|
-
"teddy-global-navigation__viewport-wrapper": "_teddy-global-navigation__viewport-
|
|
40
|
-
"
|
|
41
|
-
"
|
|
42
|
-
"teddy-global-navigation__top-menu-wrapper": "_teddy-global-navigation__top-menu-wrapper_1ue02_53",
|
|
43
|
-
"expand-top-menu": "_expand-top-menu_1ue02_1",
|
|
44
|
-
"close-top-menu": "_close-top-menu_1ue02_1"
|
|
32
|
+
"teddy-global-navigation": "_teddy-global-navigation_xrrz1_1",
|
|
33
|
+
"teddy-global-navigation__mobile-trigger": "_teddy-global-navigation__mobile-trigger_xrrz1_6",
|
|
34
|
+
"teddy-global-navigation__mobile-header": "_teddy-global-navigation__mobile-header_xrrz1_9",
|
|
35
|
+
"teddy-global-navigation__mobile": "_teddy-global-navigation__mobile_xrrz1_6",
|
|
36
|
+
"teddy-global-navigation__link": "_teddy-global-navigation__link_xrrz1_26",
|
|
37
|
+
"teddy-global-navigation__viewport": "_teddy-global-navigation__viewport_xrrz1_29",
|
|
38
|
+
"teddy-global-navigation__item-wrapper": "_teddy-global-navigation__item-wrapper_xrrz1_32",
|
|
39
|
+
"teddy-global-navigation__item-count": "_teddy-global-navigation__item-count_xrrz1_35",
|
|
40
|
+
"teddy-global-navigation__viewport-wrapper": "_teddy-global-navigation__viewport-wrapper_xrrz1_43",
|
|
41
|
+
"close-viewport": "_close-viewport_xrrz1_1",
|
|
42
|
+
"teddy-global-navigation__top-menu-wrapper": "_teddy-global-navigation__top-menu-wrapper_xrrz1_54"
|
|
45
43
|
};
|
|
46
44
|
function MyPages(props) {
|
|
47
45
|
var _a, _b;
|
|
@@ -200,7 +198,7 @@ const scrollDistanceUpThreshold = 50;
|
|
|
200
198
|
const ANIMATION_DURATION = 300;
|
|
201
199
|
const Desktop = React.forwardRef(() => {
|
|
202
200
|
const rootContext = React.useContext(RootContext);
|
|
203
|
-
const [hideMenu, setHideMenu] = React.useState(
|
|
201
|
+
const [hideMenu, setHideMenu] = React.useState(null);
|
|
204
202
|
const lastScrollDirection = React.useRef();
|
|
205
203
|
const scrollStartPos = React.useRef(0);
|
|
206
204
|
const lastScrollPos = React.useRef(0);
|
|
@@ -211,6 +209,16 @@ const Desktop = React.forwardRef(() => {
|
|
|
211
209
|
const topMenuHeight = (topMenuSize == null ? void 0 : topMenuSize.height) ? `${topMenuSize.height}px` : void 0;
|
|
212
210
|
const viewPortHeight = (viewPortSize == null ? void 0 : viewPortSize.height) ? `${viewPortSize.height}px` : void 0;
|
|
213
211
|
const animationTimer = React.useRef(0);
|
|
212
|
+
const [allowAnimationOfHeight, setAllowAnimationOfHeight] = React.useState(false);
|
|
213
|
+
const timerRef = React.useRef(void 0);
|
|
214
|
+
React.useEffect(() => {
|
|
215
|
+
timerRef.current = setTimeout(() => {
|
|
216
|
+
setAllowAnimationOfHeight(true);
|
|
217
|
+
}, 500);
|
|
218
|
+
return () => {
|
|
219
|
+
timerRef.current && clearTimeout(timerRef.current);
|
|
220
|
+
};
|
|
221
|
+
}, []);
|
|
214
222
|
const handleScroll = () => {
|
|
215
223
|
let compensateHight = 0;
|
|
216
224
|
if (animationTimer.current > 0) {
|
|
@@ -261,7 +269,10 @@ const Desktop = React.forwardRef(() => {
|
|
|
261
269
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
262
270
|
"div",
|
|
263
271
|
{
|
|
264
|
-
style: utils_generateStyling_index.mergeStyles(
|
|
272
|
+
style: utils_generateStyling_index.mergeStyles(
|
|
273
|
+
{ ["--teddy-top-menu-height"]: topMenuHeight },
|
|
274
|
+
allowAnimationOfHeight ? { ["--teddy-motion-duration-controlled"]: tokens_motion_variables.teddyMotionDuration300 } : {}
|
|
275
|
+
),
|
|
265
276
|
className: styles[`${rootClassName}__top-menu-wrapper`],
|
|
266
277
|
"data-state": hideMenu ? "closed" : "open",
|
|
267
278
|
children: /* @__PURE__ */ jsxRuntime.jsx(components_navigationMenu_navigationMenu.NavigationMenu.TopMenuList, { onFocus: resetAndShowMenu, ref: topMenuRef, children: components_navigationMenu_globalNavigation_utils.LINKS.map((link) => /* @__PURE__ */ jsxRuntime.jsx(components_navigationMenu_navigationMenu.NavigationMenu.TopMenuItem, { children: /* @__PURE__ */ jsxRuntime.jsx(components_navigationMenu_navigationMenu.NavigationMenu.TopMenuTrigger, { value: link.name, asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(Link, { href: link.link, children: link.name }) }) }, link.name)) })
|
|
@@ -315,9 +326,12 @@ const Desktop = React.forwardRef(() => {
|
|
|
315
326
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
316
327
|
"div",
|
|
317
328
|
{
|
|
318
|
-
style: utils_generateStyling_index.mergeStyles(
|
|
329
|
+
style: utils_generateStyling_index.mergeStyles(
|
|
330
|
+
{ ["--teddy-viewport-wrapper-height"]: viewPortHeight },
|
|
331
|
+
allowAnimationOfHeight ? { ["--teddy-motion-duration-controlled"]: tokens_motion_variables.teddyMotionDuration300 } : {}
|
|
332
|
+
),
|
|
319
333
|
className: styles[`${rootClassName}__viewport-wrapper`],
|
|
320
|
-
"data-state": hideMenu ? "closed" : "open",
|
|
334
|
+
"data-state": hideMenu === null ? "" : hideMenu ? "closed" : "open",
|
|
321
335
|
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
322
336
|
components_navigationMenu_navigationMenu.NavigationMenu.Viewport,
|
|
323
337
|
{
|
|
@@ -20,26 +20,24 @@ import { CounterBadge } from "../../badge/counter-badge.js";
|
|
|
20
20
|
import { useSize } from "../../../utils/useSize.js";
|
|
21
21
|
import { mergeStyles } from "../../../utils/generate-styling/index.js";
|
|
22
22
|
import { useCallbackRef } from "../../../utils/useCallbackRef.js";
|
|
23
|
+
import { teddyMotionDuration300 } from "../../../tokens/motion/variables.js";
|
|
23
24
|
import { Flex } from "../../flex/flex.js";
|
|
24
25
|
import { Accordion } from "../../accordion/index.js";
|
|
25
26
|
import { VisuallyHidden } from "../../visually-hidden/visually-hidden.js";
|
|
26
27
|
import { Link } from "../../link/link.js";
|
|
27
28
|
import { List } from "../../list/index.js";
|
|
28
29
|
const styles = {
|
|
29
|
-
"teddy-global-navigation": "_teddy-global-
|
|
30
|
-
"teddy-global-navigation__mobile-trigger": "_teddy-global-navigation__mobile-
|
|
31
|
-
"teddy-global-navigation__mobile-header": "_teddy-global-navigation__mobile-
|
|
32
|
-
"teddy-global-navigation__mobile": "_teddy-global-
|
|
33
|
-
"teddy-global-navigation__link": "_teddy-global-
|
|
34
|
-
"teddy-global-navigation__viewport": "_teddy-global-
|
|
35
|
-
"teddy-global-navigation__item-wrapper": "_teddy-global-navigation__item-
|
|
36
|
-
"teddy-global-navigation__item-count": "_teddy-global-navigation__item-
|
|
37
|
-
"teddy-global-navigation__viewport-wrapper": "_teddy-global-navigation__viewport-
|
|
38
|
-
"
|
|
39
|
-
"
|
|
40
|
-
"teddy-global-navigation__top-menu-wrapper": "_teddy-global-navigation__top-menu-wrapper_1ue02_53",
|
|
41
|
-
"expand-top-menu": "_expand-top-menu_1ue02_1",
|
|
42
|
-
"close-top-menu": "_close-top-menu_1ue02_1"
|
|
30
|
+
"teddy-global-navigation": "_teddy-global-navigation_xrrz1_1",
|
|
31
|
+
"teddy-global-navigation__mobile-trigger": "_teddy-global-navigation__mobile-trigger_xrrz1_6",
|
|
32
|
+
"teddy-global-navigation__mobile-header": "_teddy-global-navigation__mobile-header_xrrz1_9",
|
|
33
|
+
"teddy-global-navigation__mobile": "_teddy-global-navigation__mobile_xrrz1_6",
|
|
34
|
+
"teddy-global-navigation__link": "_teddy-global-navigation__link_xrrz1_26",
|
|
35
|
+
"teddy-global-navigation__viewport": "_teddy-global-navigation__viewport_xrrz1_29",
|
|
36
|
+
"teddy-global-navigation__item-wrapper": "_teddy-global-navigation__item-wrapper_xrrz1_32",
|
|
37
|
+
"teddy-global-navigation__item-count": "_teddy-global-navigation__item-count_xrrz1_35",
|
|
38
|
+
"teddy-global-navigation__viewport-wrapper": "_teddy-global-navigation__viewport-wrapper_xrrz1_43",
|
|
39
|
+
"close-viewport": "_close-viewport_xrrz1_1",
|
|
40
|
+
"teddy-global-navigation__top-menu-wrapper": "_teddy-global-navigation__top-menu-wrapper_xrrz1_54"
|
|
43
41
|
};
|
|
44
42
|
function MyPages(props) {
|
|
45
43
|
var _a, _b;
|
|
@@ -198,7 +196,7 @@ const scrollDistanceUpThreshold = 50;
|
|
|
198
196
|
const ANIMATION_DURATION = 300;
|
|
199
197
|
const Desktop = React__default.forwardRef(() => {
|
|
200
198
|
const rootContext = React__default.useContext(RootContext);
|
|
201
|
-
const [hideMenu, setHideMenu] = React__default.useState(
|
|
199
|
+
const [hideMenu, setHideMenu] = React__default.useState(null);
|
|
202
200
|
const lastScrollDirection = React__default.useRef();
|
|
203
201
|
const scrollStartPos = React__default.useRef(0);
|
|
204
202
|
const lastScrollPos = React__default.useRef(0);
|
|
@@ -209,6 +207,16 @@ const Desktop = React__default.forwardRef(() => {
|
|
|
209
207
|
const topMenuHeight = (topMenuSize == null ? void 0 : topMenuSize.height) ? `${topMenuSize.height}px` : void 0;
|
|
210
208
|
const viewPortHeight = (viewPortSize == null ? void 0 : viewPortSize.height) ? `${viewPortSize.height}px` : void 0;
|
|
211
209
|
const animationTimer = React__default.useRef(0);
|
|
210
|
+
const [allowAnimationOfHeight, setAllowAnimationOfHeight] = React__default.useState(false);
|
|
211
|
+
const timerRef = React__default.useRef(void 0);
|
|
212
|
+
React__default.useEffect(() => {
|
|
213
|
+
timerRef.current = setTimeout(() => {
|
|
214
|
+
setAllowAnimationOfHeight(true);
|
|
215
|
+
}, 500);
|
|
216
|
+
return () => {
|
|
217
|
+
timerRef.current && clearTimeout(timerRef.current);
|
|
218
|
+
};
|
|
219
|
+
}, []);
|
|
212
220
|
const handleScroll = () => {
|
|
213
221
|
let compensateHight = 0;
|
|
214
222
|
if (animationTimer.current > 0) {
|
|
@@ -259,7 +267,10 @@ const Desktop = React__default.forwardRef(() => {
|
|
|
259
267
|
/* @__PURE__ */ jsx(
|
|
260
268
|
"div",
|
|
261
269
|
{
|
|
262
|
-
style: mergeStyles(
|
|
270
|
+
style: mergeStyles(
|
|
271
|
+
{ ["--teddy-top-menu-height"]: topMenuHeight },
|
|
272
|
+
allowAnimationOfHeight ? { ["--teddy-motion-duration-controlled"]: teddyMotionDuration300 } : {}
|
|
273
|
+
),
|
|
263
274
|
className: styles[`${rootClassName}__top-menu-wrapper`],
|
|
264
275
|
"data-state": hideMenu ? "closed" : "open",
|
|
265
276
|
children: /* @__PURE__ */ jsx(NavigationMenu.TopMenuList, { onFocus: resetAndShowMenu, ref: topMenuRef, children: LINKS.map((link) => /* @__PURE__ */ jsx(NavigationMenu.TopMenuItem, { children: /* @__PURE__ */ jsx(NavigationMenu.TopMenuTrigger, { value: link.name, asChild: true, children: /* @__PURE__ */ jsx(Link2, { href: link.link, children: link.name }) }) }, link.name)) })
|
|
@@ -313,9 +324,12 @@ const Desktop = React__default.forwardRef(() => {
|
|
|
313
324
|
/* @__PURE__ */ jsx(
|
|
314
325
|
"div",
|
|
315
326
|
{
|
|
316
|
-
style: mergeStyles(
|
|
327
|
+
style: mergeStyles(
|
|
328
|
+
{ ["--teddy-viewport-wrapper-height"]: viewPortHeight },
|
|
329
|
+
allowAnimationOfHeight ? { ["--teddy-motion-duration-controlled"]: teddyMotionDuration300 } : {}
|
|
330
|
+
),
|
|
317
331
|
className: styles[`${rootClassName}__viewport-wrapper`],
|
|
318
|
-
"data-state": hideMenu ? "closed" : "open",
|
|
332
|
+
"data-state": hideMenu === null ? "" : hideMenu ? "closed" : "open",
|
|
319
333
|
children: /* @__PURE__ */ jsx(
|
|
320
334
|
NavigationMenu.Viewport,
|
|
321
335
|
{
|
|
@@ -215,7 +215,7 @@ export declare const PRIVATE_LINKS: {
|
|
|
215
215
|
}];
|
|
216
216
|
}, {
|
|
217
217
|
readonly name: "Hjelp";
|
|
218
|
-
readonly link: "/
|
|
218
|
+
readonly link: "/kundeservice/";
|
|
219
219
|
readonly appKey: "open-pages";
|
|
220
220
|
readonly links: readonly [{
|
|
221
221
|
readonly name: "Hjelp Mobil";
|
|
@@ -413,7 +413,7 @@ export declare const LINKS: readonly [{
|
|
|
413
413
|
}];
|
|
414
414
|
}, {
|
|
415
415
|
readonly name: "Hjelp";
|
|
416
|
-
readonly link: "/
|
|
416
|
+
readonly link: "/kundeservice/";
|
|
417
417
|
readonly appKey: "open-pages";
|
|
418
418
|
readonly links: readonly [{
|
|
419
419
|
readonly name: "Hjelp Mobil";
|
|
@@ -28,31 +28,31 @@ function _interopNamespaceDefault(e) {
|
|
|
28
28
|
return Object.freeze(n);
|
|
29
29
|
}
|
|
30
30
|
const NavigationMenuPrimitive__namespace = /* @__PURE__ */ _interopNamespaceDefault(NavigationMenuPrimitive);
|
|
31
|
-
const enterFromLeft = "
|
|
32
|
-
const enterFromRight = "
|
|
33
|
-
const exitToLeft = "
|
|
34
|
-
const exitToRight = "
|
|
35
|
-
const scaleIn = "
|
|
36
|
-
const scaleOut = "
|
|
31
|
+
const enterFromLeft = "_enterFromLeft_15tta_1";
|
|
32
|
+
const enterFromRight = "_enterFromRight_15tta_1";
|
|
33
|
+
const exitToLeft = "_exitToLeft_15tta_1";
|
|
34
|
+
const exitToRight = "_exitToRight_15tta_1";
|
|
35
|
+
const scaleIn = "_scaleIn_15tta_1";
|
|
36
|
+
const scaleOut = "_scaleOut_15tta_1";
|
|
37
37
|
const styles = {
|
|
38
|
-
"teddy-navigation-menu": "_teddy-navigation-
|
|
39
|
-
"teddy-navigation-menu__viewport": "_teddy-navigation-
|
|
40
|
-
"teddy-navigation-menu__list": "_teddy-navigation-
|
|
41
|
-
"teddy-navigation-menu__top-menu-list": "_teddy-navigation-menu__top-menu-
|
|
42
|
-
"teddy-navigation-menu__top-menu-trigger": "_teddy-navigation-menu__top-menu-
|
|
43
|
-
"teddy-navigation-menu__top-menu-trigger--small": "_teddy-navigation-menu__top-menu-trigger--
|
|
44
|
-
"teddy-navigation-menu__top-menu-trigger--button": "_teddy-navigation-menu__top-menu-trigger--
|
|
45
|
-
"teddy-navigation-menu__content": "_teddy-navigation-
|
|
38
|
+
"teddy-navigation-menu": "_teddy-navigation-menu_15tta_1",
|
|
39
|
+
"teddy-navigation-menu__viewport": "_teddy-navigation-menu__viewport_15tta_34",
|
|
40
|
+
"teddy-navigation-menu__list": "_teddy-navigation-menu__list_15tta_37",
|
|
41
|
+
"teddy-navigation-menu__top-menu-list": "_teddy-navigation-menu__top-menu-list_15tta_59",
|
|
42
|
+
"teddy-navigation-menu__top-menu-trigger": "_teddy-navigation-menu__top-menu-trigger_15tta_83",
|
|
43
|
+
"teddy-navigation-menu__top-menu-trigger--small": "_teddy-navigation-menu__top-menu-trigger--small_15tta_102",
|
|
44
|
+
"teddy-navigation-menu__top-menu-trigger--button": "_teddy-navigation-menu__top-menu-trigger--button_15tta_108",
|
|
45
|
+
"teddy-navigation-menu__content": "_teddy-navigation-menu__content_15tta_182",
|
|
46
46
|
enterFromLeft,
|
|
47
47
|
enterFromRight,
|
|
48
48
|
exitToLeft,
|
|
49
49
|
exitToRight,
|
|
50
|
-
"teddy-navigation-menu__trigger": "_teddy-navigation-
|
|
51
|
-
"teddy-navigation-menu__trigger--small": "_teddy-navigation-menu__trigger--
|
|
52
|
-
"teddy-navigation-menu__trigger--button": "_teddy-navigation-menu__trigger--
|
|
53
|
-
"teddy-navigation-menu__link": "_teddy-navigation-
|
|
54
|
-
"teddy-navigation-menu__link--small": "_teddy-navigation-menu__link--
|
|
55
|
-
"teddy-navigation-menu__link--button": "_teddy-navigation-menu__link--
|
|
50
|
+
"teddy-navigation-menu__trigger": "_teddy-navigation-menu__trigger_15tta_230",
|
|
51
|
+
"teddy-navigation-menu__trigger--small": "_teddy-navigation-menu__trigger--small_15tta_250",
|
|
52
|
+
"teddy-navigation-menu__trigger--button": "_teddy-navigation-menu__trigger--button_15tta_256",
|
|
53
|
+
"teddy-navigation-menu__link": "_teddy-navigation-menu__link_15tta_323",
|
|
54
|
+
"teddy-navigation-menu__link--small": "_teddy-navigation-menu__link--small_15tta_343",
|
|
55
|
+
"teddy-navigation-menu__link--button": "_teddy-navigation-menu__link--button_15tta_349",
|
|
56
56
|
scaleIn,
|
|
57
57
|
scaleOut
|
|
58
58
|
};
|
|
@@ -9,31 +9,31 @@ import { Slot } from "@radix-ui/react-slot";
|
|
|
9
9
|
import { useControllableState } from "@radix-ui/react-use-controllable-state";
|
|
10
10
|
import { mergeStyles } from "../../utils/generate-styling/index.js";
|
|
11
11
|
import { teddyMotionDuration300 } from "../../tokens/motion/variables.js";
|
|
12
|
-
const enterFromLeft = "
|
|
13
|
-
const enterFromRight = "
|
|
14
|
-
const exitToLeft = "
|
|
15
|
-
const exitToRight = "
|
|
16
|
-
const scaleIn = "
|
|
17
|
-
const scaleOut = "
|
|
12
|
+
const enterFromLeft = "_enterFromLeft_15tta_1";
|
|
13
|
+
const enterFromRight = "_enterFromRight_15tta_1";
|
|
14
|
+
const exitToLeft = "_exitToLeft_15tta_1";
|
|
15
|
+
const exitToRight = "_exitToRight_15tta_1";
|
|
16
|
+
const scaleIn = "_scaleIn_15tta_1";
|
|
17
|
+
const scaleOut = "_scaleOut_15tta_1";
|
|
18
18
|
const styles = {
|
|
19
|
-
"teddy-navigation-menu": "_teddy-navigation-
|
|
20
|
-
"teddy-navigation-menu__viewport": "_teddy-navigation-
|
|
21
|
-
"teddy-navigation-menu__list": "_teddy-navigation-
|
|
22
|
-
"teddy-navigation-menu__top-menu-list": "_teddy-navigation-menu__top-menu-
|
|
23
|
-
"teddy-navigation-menu__top-menu-trigger": "_teddy-navigation-menu__top-menu-
|
|
24
|
-
"teddy-navigation-menu__top-menu-trigger--small": "_teddy-navigation-menu__top-menu-trigger--
|
|
25
|
-
"teddy-navigation-menu__top-menu-trigger--button": "_teddy-navigation-menu__top-menu-trigger--
|
|
26
|
-
"teddy-navigation-menu__content": "_teddy-navigation-
|
|
19
|
+
"teddy-navigation-menu": "_teddy-navigation-menu_15tta_1",
|
|
20
|
+
"teddy-navigation-menu__viewport": "_teddy-navigation-menu__viewport_15tta_34",
|
|
21
|
+
"teddy-navigation-menu__list": "_teddy-navigation-menu__list_15tta_37",
|
|
22
|
+
"teddy-navigation-menu__top-menu-list": "_teddy-navigation-menu__top-menu-list_15tta_59",
|
|
23
|
+
"teddy-navigation-menu__top-menu-trigger": "_teddy-navigation-menu__top-menu-trigger_15tta_83",
|
|
24
|
+
"teddy-navigation-menu__top-menu-trigger--small": "_teddy-navigation-menu__top-menu-trigger--small_15tta_102",
|
|
25
|
+
"teddy-navigation-menu__top-menu-trigger--button": "_teddy-navigation-menu__top-menu-trigger--button_15tta_108",
|
|
26
|
+
"teddy-navigation-menu__content": "_teddy-navigation-menu__content_15tta_182",
|
|
27
27
|
enterFromLeft,
|
|
28
28
|
enterFromRight,
|
|
29
29
|
exitToLeft,
|
|
30
30
|
exitToRight,
|
|
31
|
-
"teddy-navigation-menu__trigger": "_teddy-navigation-
|
|
32
|
-
"teddy-navigation-menu__trigger--small": "_teddy-navigation-menu__trigger--
|
|
33
|
-
"teddy-navigation-menu__trigger--button": "_teddy-navigation-menu__trigger--
|
|
34
|
-
"teddy-navigation-menu__link": "_teddy-navigation-
|
|
35
|
-
"teddy-navigation-menu__link--small": "_teddy-navigation-menu__link--
|
|
36
|
-
"teddy-navigation-menu__link--button": "_teddy-navigation-menu__link--
|
|
31
|
+
"teddy-navigation-menu__trigger": "_teddy-navigation-menu__trigger_15tta_230",
|
|
32
|
+
"teddy-navigation-menu__trigger--small": "_teddy-navigation-menu__trigger--small_15tta_250",
|
|
33
|
+
"teddy-navigation-menu__trigger--button": "_teddy-navigation-menu__trigger--button_15tta_256",
|
|
34
|
+
"teddy-navigation-menu__link": "_teddy-navigation-menu__link_15tta_323",
|
|
35
|
+
"teddy-navigation-menu__link--small": "_teddy-navigation-menu__link--small_15tta_343",
|
|
36
|
+
"teddy-navigation-menu__link--button": "_teddy-navigation-menu__link--button_15tta_349",
|
|
37
37
|
scaleIn,
|
|
38
38
|
scaleOut
|
|
39
39
|
};
|
package/dist/style.css
CHANGED
|
@@ -2307,7 +2307,7 @@
|
|
|
2307
2307
|
}
|
|
2308
2308
|
._teddy-visually-hidden--focusable_15nus_15:not(:focus):not(:focus-within):not(caption) {
|
|
2309
2309
|
position: absolute;
|
|
2310
|
-
}._teddy-navigation-
|
|
2310
|
+
}._teddy-navigation-menu_15tta_1 {
|
|
2311
2311
|
--item-gap: var(--teddy-spacing-200);
|
|
2312
2312
|
--width-for-centering-element: calc((100% - var(--teddy-breakpoint-xl) + var(--teddy-spacing-600) * 2) / 2);
|
|
2313
2313
|
--inline-padding: calc(var(--teddy-spacing-200) - var(--item-gap));
|
|
@@ -2318,16 +2318,16 @@
|
|
|
2318
2318
|
background-color: var(--teddy-color-background-primary);
|
|
2319
2319
|
}
|
|
2320
2320
|
@media (min-width: 600px) {
|
|
2321
|
-
._teddy-navigation-
|
|
2321
|
+
._teddy-navigation-menu_15tta_1 {
|
|
2322
2322
|
--inline-padding: calc(var(--teddy-spacing-300) - var(--item-gap));
|
|
2323
2323
|
}
|
|
2324
2324
|
}
|
|
2325
2325
|
@media (min-width: 1440px) {
|
|
2326
|
-
._teddy-navigation-
|
|
2326
|
+
._teddy-navigation-menu_15tta_1 {
|
|
2327
2327
|
--inline-padding: calc(var(--teddy-spacing-400) - var(--item-gap));
|
|
2328
2328
|
}
|
|
2329
2329
|
}
|
|
2330
|
-
._teddy-navigation-
|
|
2330
|
+
._teddy-navigation-menu_15tta_1::after {
|
|
2331
2331
|
content: "";
|
|
2332
2332
|
position: absolute;
|
|
2333
2333
|
inset: 0;
|
|
@@ -2336,14 +2336,14 @@
|
|
|
2336
2336
|
opacity: 0;
|
|
2337
2337
|
}
|
|
2338
2338
|
@media (prefers-reduced-motion: no-preference) {
|
|
2339
|
-
._teddy-navigation-
|
|
2339
|
+
._teddy-navigation-menu_15tta_1::after {
|
|
2340
2340
|
transition: opacity var(--teddy-motion-duration-300) ease;
|
|
2341
2341
|
}
|
|
2342
2342
|
}
|
|
2343
|
-
._teddy-navigation-
|
|
2343
|
+
._teddy-navigation-menu_15tta_1:has(._teddy-navigation-menu__viewport_15tta_34[data-state=open])::after {
|
|
2344
2344
|
opacity: 1;
|
|
2345
2345
|
}
|
|
2346
|
-
._teddy-navigation-
|
|
2346
|
+
._teddy-navigation-menu__list_15tta_37 {
|
|
2347
2347
|
all: unset;
|
|
2348
2348
|
list-style-type: none;
|
|
2349
2349
|
display: flex;
|
|
@@ -2352,17 +2352,20 @@
|
|
|
2352
2352
|
padding-inline: var(--inline-padding);
|
|
2353
2353
|
border-bottom: var(--teddy-border-width-sm) solid var(--teddy-color-border-weak);
|
|
2354
2354
|
}
|
|
2355
|
-
._teddy-navigation-
|
|
2355
|
+
._teddy-navigation-menu__list_15tta_37::before {
|
|
2356
2356
|
content: "";
|
|
2357
2357
|
display: block;
|
|
2358
2358
|
width: var(--width-for-centering-element);
|
|
2359
2359
|
}
|
|
2360
|
-
._teddy-navigation-
|
|
2360
|
+
._teddy-navigation-menu__list_15tta_37::after {
|
|
2361
2361
|
content: "";
|
|
2362
2362
|
display: block;
|
|
2363
2363
|
width: var(--width-for-centering-element);
|
|
2364
2364
|
}
|
|
2365
|
-
._teddy-navigation-
|
|
2365
|
+
._teddy-navigation-menu__list_15tta_37 li {
|
|
2366
|
+
line-height: 1.2;
|
|
2367
|
+
}
|
|
2368
|
+
._teddy-navigation-menu__top-menu-list_15tta_59 {
|
|
2366
2369
|
all: unset;
|
|
2367
2370
|
position: relative;
|
|
2368
2371
|
list-style-type: none;
|
|
@@ -2372,17 +2375,21 @@
|
|
|
2372
2375
|
align-items: center;
|
|
2373
2376
|
padding-inline: var(--inline-padding);
|
|
2374
2377
|
}
|
|
2375
|
-
._teddy-navigation-menu__top-menu-
|
|
2378
|
+
._teddy-navigation-menu__top-menu-list_15tta_59::before {
|
|
2376
2379
|
content: "";
|
|
2377
2380
|
display: block;
|
|
2378
2381
|
width: var(--width-for-centering-element);
|
|
2379
2382
|
}
|
|
2380
|
-
._teddy-navigation-menu__top-menu-
|
|
2383
|
+
._teddy-navigation-menu__top-menu-list_15tta_59::after {
|
|
2381
2384
|
content: "";
|
|
2382
2385
|
display: block;
|
|
2383
2386
|
width: var(--width-for-centering-element);
|
|
2384
2387
|
}
|
|
2385
|
-
._teddy-navigation-menu__top-menu-
|
|
2388
|
+
._teddy-navigation-menu__top-menu-list_15tta_59 li {
|
|
2389
|
+
display: grid;
|
|
2390
|
+
line-height: 1.2;
|
|
2391
|
+
}
|
|
2392
|
+
._teddy-navigation-menu__top-menu-trigger_15tta_83 {
|
|
2386
2393
|
all: unset;
|
|
2387
2394
|
position: relative;
|
|
2388
2395
|
cursor: pointer;
|
|
@@ -2398,18 +2405,18 @@
|
|
|
2398
2405
|
min-width: var(--teddy-spacing-400);
|
|
2399
2406
|
font-size: var(--teddy-typography-scale-100);
|
|
2400
2407
|
line-height: var(--teddy-typography-line-height-loose);
|
|
2401
|
-
padding: var(--teddy-spacing-
|
|
2408
|
+
padding: var(--teddy-spacing-200) var(--teddy-spacing-100);
|
|
2402
2409
|
text-align: center;
|
|
2403
2410
|
}
|
|
2404
|
-
._teddy-navigation-menu__top-menu-trigger--
|
|
2405
|
-
padding: var(--teddy-spacing-
|
|
2411
|
+
._teddy-navigation-menu__top-menu-trigger--small_15tta_102 {
|
|
2412
|
+
padding: calc(var(--teddy-spacing-100) + var(--teddy-spacing-25) + var(--teddy-spacing-10)) var(--teddy-spacing-100);
|
|
2406
2413
|
font-size: var(--teddy-typography-scale-75);
|
|
2407
2414
|
line-height: var(--teddy-typography-line-height-loose);
|
|
2408
2415
|
outline-offset: -2px;
|
|
2409
2416
|
}
|
|
2410
|
-
._teddy-navigation-menu__top-menu-trigger--
|
|
2417
|
+
._teddy-navigation-menu__top-menu-trigger--button_15tta_108 {
|
|
2411
2418
|
padding: var(--teddy-spacing-100);
|
|
2412
|
-
min-height: var(--teddy-spacing-
|
|
2419
|
+
min-height: calc(var(--teddy-spacing-400) + var(--teddy-spacing-100));
|
|
2413
2420
|
border-radius: var(--teddy-border-radius-md);
|
|
2414
2421
|
display: flex;
|
|
2415
2422
|
place-items: center;
|
|
@@ -2419,11 +2426,11 @@
|
|
|
2419
2426
|
row-gap: var(--teddy-spacing-50);
|
|
2420
2427
|
}
|
|
2421
2428
|
@media (max-width: 600px) {
|
|
2422
|
-
._teddy-navigation-menu__top-menu-trigger--
|
|
2429
|
+
._teddy-navigation-menu__top-menu-trigger--button_15tta_108 {
|
|
2423
2430
|
font-size: var(--teddy-typography-scale-75);
|
|
2424
2431
|
}
|
|
2425
2432
|
}
|
|
2426
|
-
._teddy-navigation-menu__top-menu-
|
|
2433
|
+
._teddy-navigation-menu__top-menu-trigger_15tta_83::after {
|
|
2427
2434
|
content: "";
|
|
2428
2435
|
display: block;
|
|
2429
2436
|
position: absolute;
|
|
@@ -2434,10 +2441,10 @@
|
|
|
2434
2441
|
pointer-events: none;
|
|
2435
2442
|
border-bottom: var(--teddy-border-width-sm) solid var(--teddy-color-purple-500);
|
|
2436
2443
|
}
|
|
2437
|
-
._teddy-navigation-menu__top-menu-trigger--
|
|
2444
|
+
._teddy-navigation-menu__top-menu-trigger--button_15tta_108::after {
|
|
2438
2445
|
border: var(--teddy-border-width-sm) solid var(--teddy-color-purple-500);
|
|
2439
2446
|
}
|
|
2440
|
-
._teddy-navigation-menu__top-menu-
|
|
2447
|
+
._teddy-navigation-menu__top-menu-trigger_15tta_83:not(._teddy-navigation-menu__top-menu-trigger--button_15tta_108)::before {
|
|
2441
2448
|
content: attr(data-text);
|
|
2442
2449
|
content: attr(data-text)/"";
|
|
2443
2450
|
height: 0;
|
|
@@ -2448,43 +2455,40 @@
|
|
|
2448
2455
|
font-weight: var(--teddy-typography-weight-bold);
|
|
2449
2456
|
}
|
|
2450
2457
|
@media speech {
|
|
2451
|
-
._teddy-navigation-menu__top-menu-
|
|
2458
|
+
._teddy-navigation-menu__top-menu-trigger_15tta_83:not(._teddy-navigation-menu__top-menu-trigger--button_15tta_108)::before {
|
|
2452
2459
|
display: none;
|
|
2453
2460
|
}
|
|
2454
2461
|
}
|
|
2455
|
-
._teddy-navigation-menu__top-menu-
|
|
2462
|
+
._teddy-navigation-menu__top-menu-trigger_15tta_83:hover {
|
|
2456
2463
|
background-color: var(--teddy-color-background-interactive-transparent-hover);
|
|
2457
2464
|
}
|
|
2458
|
-
._teddy-navigation-menu__top-menu-
|
|
2465
|
+
._teddy-navigation-menu__top-menu-trigger_15tta_83:hover::after {
|
|
2459
2466
|
opacity: 1;
|
|
2460
2467
|
}
|
|
2461
|
-
._teddy-navigation-menu__top-menu-
|
|
2468
|
+
._teddy-navigation-menu__top-menu-trigger_15tta_83:active {
|
|
2462
2469
|
background-color: var(--teddy-color-background-interactive-transparent-active);
|
|
2463
2470
|
}
|
|
2464
|
-
._teddy-navigation-menu__top-menu-
|
|
2471
|
+
._teddy-navigation-menu__top-menu-trigger_15tta_83:active::after {
|
|
2465
2472
|
opacity: 1;
|
|
2466
2473
|
}
|
|
2467
|
-
._teddy-navigation-menu__top-menu-
|
|
2468
|
-
font-weight: var(--teddy-typography-weight-bold);
|
|
2469
|
-
}
|
|
2470
|
-
._teddy-navigation-menu__top-menu-trigger_h8tnl_76:has([data-active]), ._teddy-navigation-menu__top-menu-trigger_h8tnl_76[data-active] {
|
|
2474
|
+
._teddy-navigation-menu__top-menu-trigger_15tta_83[data-state=open], ._teddy-navigation-menu__top-menu-trigger_15tta_83:has([data-active]), ._teddy-navigation-menu__top-menu-trigger_15tta_83[data-active] {
|
|
2471
2475
|
font-weight: var(--teddy-typography-weight-bold);
|
|
2472
2476
|
}
|
|
2473
|
-
._teddy-navigation-menu__top-menu-
|
|
2477
|
+
._teddy-navigation-menu__top-menu-trigger_15tta_83[data-state=open]::after, ._teddy-navigation-menu__top-menu-trigger_15tta_83:has([data-active])::after, ._teddy-navigation-menu__top-menu-trigger_15tta_83[data-active]::after {
|
|
2474
2478
|
border-color: var(--teddy-color-text-interactive-primary);
|
|
2475
2479
|
opacity: 1;
|
|
2476
2480
|
}
|
|
2477
|
-
._teddy-navigation-menu__top-menu-
|
|
2481
|
+
._teddy-navigation-menu__top-menu-trigger_15tta_83:focus-visible {
|
|
2478
2482
|
outline: solid var(--teddy-border-width-sm) var(--teddy-color-border-interactive-focus);
|
|
2479
2483
|
}
|
|
2480
|
-
._teddy-navigation-menu__top-menu-
|
|
2484
|
+
._teddy-navigation-menu__top-menu-trigger_15tta_83[data-state=open] {
|
|
2481
2485
|
font-weight: var(--teddy-typography-weight-bold);
|
|
2482
2486
|
}
|
|
2483
|
-
._teddy-navigation-menu__top-menu-
|
|
2487
|
+
._teddy-navigation-menu__top-menu-trigger_15tta_83[data-state=open]::after {
|
|
2484
2488
|
border-color: var(--teddy-color-text-interactive-primary);
|
|
2485
2489
|
opacity: 1;
|
|
2486
2490
|
}
|
|
2487
|
-
._teddy-navigation-
|
|
2491
|
+
._teddy-navigation-menu__content_15tta_182 {
|
|
2488
2492
|
all: unset;
|
|
2489
2493
|
list-style-type: none;
|
|
2490
2494
|
display: flex;
|
|
@@ -2498,37 +2502,41 @@
|
|
|
2498
2502
|
padding-inline: calc(var(--inline-padding) + var(--teddy-spacing-200));
|
|
2499
2503
|
overflow: clip;
|
|
2500
2504
|
}
|
|
2501
|
-
._teddy-navigation-
|
|
2505
|
+
._teddy-navigation-menu__content_15tta_182 > ul {
|
|
2502
2506
|
list-style: none;
|
|
2503
2507
|
display: flex;
|
|
2504
2508
|
margin: 0;
|
|
2505
2509
|
padding: 0;
|
|
2506
2510
|
}
|
|
2511
|
+
._teddy-navigation-menu__content_15tta_182 > ul > li {
|
|
2512
|
+
display: grid;
|
|
2513
|
+
line-height: 1.2;
|
|
2514
|
+
}
|
|
2507
2515
|
@media (prefers-reduced-motion: no-preference) {
|
|
2508
|
-
._teddy-navigation-
|
|
2516
|
+
._teddy-navigation-menu__content_15tta_182 {
|
|
2509
2517
|
animation-duration: var(--teddy-motion-duration-300);
|
|
2510
2518
|
animation-timing-function: ease;
|
|
2511
2519
|
}
|
|
2512
|
-
._teddy-navigation-
|
|
2513
|
-
animation-name:
|
|
2520
|
+
._teddy-navigation-menu__content_15tta_182[data-motion=from-start] {
|
|
2521
|
+
animation-name: _enterFromLeft_15tta_1;
|
|
2514
2522
|
}
|
|
2515
|
-
._teddy-navigation-
|
|
2516
|
-
animation-name:
|
|
2523
|
+
._teddy-navigation-menu__content_15tta_182[data-motion=from-end] {
|
|
2524
|
+
animation-name: _enterFromRight_15tta_1;
|
|
2517
2525
|
}
|
|
2518
|
-
._teddy-navigation-
|
|
2519
|
-
animation-name:
|
|
2526
|
+
._teddy-navigation-menu__content_15tta_182[data-motion=to-start] {
|
|
2527
|
+
animation-name: _exitToLeft_15tta_1;
|
|
2520
2528
|
}
|
|
2521
|
-
._teddy-navigation-
|
|
2522
|
-
animation-name:
|
|
2529
|
+
._teddy-navigation-menu__content_15tta_182[data-motion=to-end] {
|
|
2530
|
+
animation-name: _exitToRight_15tta_1;
|
|
2523
2531
|
}
|
|
2524
2532
|
}
|
|
2525
|
-
._teddy-navigation-
|
|
2533
|
+
._teddy-navigation-menu__content_15tta_182::before {
|
|
2526
2534
|
content: "";
|
|
2527
2535
|
position: absolute;
|
|
2528
2536
|
inset: 0;
|
|
2529
2537
|
box-shadow: 0 var(--teddy-border-width-lg) var(--teddy-border-width-lg) calc(var(--teddy-border-width-md) * -1) var(--teddy-color-border-weak);
|
|
2530
2538
|
}
|
|
2531
|
-
._teddy-navigation-
|
|
2539
|
+
._teddy-navigation-menu__trigger_15tta_230 {
|
|
2532
2540
|
position: relative;
|
|
2533
2541
|
all: unset;
|
|
2534
2542
|
position: relative;
|
|
@@ -2545,18 +2553,18 @@
|
|
|
2545
2553
|
min-width: var(--teddy-spacing-400);
|
|
2546
2554
|
font-size: var(--teddy-typography-scale-100);
|
|
2547
2555
|
line-height: var(--teddy-typography-line-height-loose);
|
|
2548
|
-
padding: var(--teddy-spacing-
|
|
2556
|
+
padding: var(--teddy-spacing-200) var(--teddy-spacing-100);
|
|
2549
2557
|
text-align: center;
|
|
2550
2558
|
}
|
|
2551
|
-
._teddy-navigation-menu__trigger--
|
|
2552
|
-
padding: var(--teddy-spacing-
|
|
2559
|
+
._teddy-navigation-menu__trigger--small_15tta_250 {
|
|
2560
|
+
padding: calc(var(--teddy-spacing-100) + var(--teddy-spacing-25) + var(--teddy-spacing-10)) var(--teddy-spacing-100);
|
|
2553
2561
|
font-size: var(--teddy-typography-scale-75);
|
|
2554
2562
|
line-height: var(--teddy-typography-line-height-loose);
|
|
2555
2563
|
outline-offset: -2px;
|
|
2556
2564
|
}
|
|
2557
|
-
._teddy-navigation-menu__trigger--
|
|
2565
|
+
._teddy-navigation-menu__trigger--button_15tta_256 {
|
|
2558
2566
|
padding: var(--teddy-spacing-100);
|
|
2559
|
-
min-height: var(--teddy-spacing-
|
|
2567
|
+
min-height: calc(var(--teddy-spacing-400) + var(--teddy-spacing-100));
|
|
2560
2568
|
border-radius: var(--teddy-border-radius-md);
|
|
2561
2569
|
display: flex;
|
|
2562
2570
|
place-items: center;
|
|
@@ -2566,11 +2574,11 @@
|
|
|
2566
2574
|
row-gap: var(--teddy-spacing-50);
|
|
2567
2575
|
}
|
|
2568
2576
|
@media (max-width: 600px) {
|
|
2569
|
-
._teddy-navigation-menu__trigger--
|
|
2577
|
+
._teddy-navigation-menu__trigger--button_15tta_256 {
|
|
2570
2578
|
font-size: var(--teddy-typography-scale-75);
|
|
2571
2579
|
}
|
|
2572
2580
|
}
|
|
2573
|
-
._teddy-navigation-
|
|
2581
|
+
._teddy-navigation-menu__trigger_15tta_230::after {
|
|
2574
2582
|
content: "";
|
|
2575
2583
|
display: block;
|
|
2576
2584
|
position: absolute;
|
|
@@ -2581,10 +2589,10 @@
|
|
|
2581
2589
|
pointer-events: none;
|
|
2582
2590
|
border-bottom: var(--teddy-border-width-sm) solid var(--teddy-color-purple-500);
|
|
2583
2591
|
}
|
|
2584
|
-
._teddy-navigation-menu__trigger--
|
|
2592
|
+
._teddy-navigation-menu__trigger--button_15tta_256::after {
|
|
2585
2593
|
border: var(--teddy-border-width-sm) solid var(--teddy-color-purple-500);
|
|
2586
2594
|
}
|
|
2587
|
-
._teddy-navigation-
|
|
2595
|
+
._teddy-navigation-menu__trigger_15tta_230:not(._teddy-navigation-menu__trigger--button_15tta_256)::before {
|
|
2588
2596
|
content: attr(data-text);
|
|
2589
2597
|
content: attr(data-text)/"";
|
|
2590
2598
|
height: 0;
|
|
@@ -2595,36 +2603,33 @@
|
|
|
2595
2603
|
font-weight: var(--teddy-typography-weight-bold);
|
|
2596
2604
|
}
|
|
2597
2605
|
@media speech {
|
|
2598
|
-
._teddy-navigation-
|
|
2606
|
+
._teddy-navigation-menu__trigger_15tta_230:not(._teddy-navigation-menu__trigger--button_15tta_256)::before {
|
|
2599
2607
|
display: none;
|
|
2600
2608
|
}
|
|
2601
2609
|
}
|
|
2602
|
-
._teddy-navigation-
|
|
2610
|
+
._teddy-navigation-menu__trigger_15tta_230:hover {
|
|
2603
2611
|
background-color: var(--teddy-color-background-interactive-transparent-hover);
|
|
2604
2612
|
}
|
|
2605
|
-
._teddy-navigation-
|
|
2613
|
+
._teddy-navigation-menu__trigger_15tta_230:hover::after {
|
|
2606
2614
|
opacity: 1;
|
|
2607
2615
|
}
|
|
2608
|
-
._teddy-navigation-
|
|
2616
|
+
._teddy-navigation-menu__trigger_15tta_230:active {
|
|
2609
2617
|
background-color: var(--teddy-color-background-interactive-transparent-active);
|
|
2610
2618
|
}
|
|
2611
|
-
._teddy-navigation-
|
|
2619
|
+
._teddy-navigation-menu__trigger_15tta_230:active::after {
|
|
2612
2620
|
opacity: 1;
|
|
2613
2621
|
}
|
|
2614
|
-
._teddy-navigation-
|
|
2615
|
-
font-weight: var(--teddy-typography-weight-bold);
|
|
2616
|
-
}
|
|
2617
|
-
._teddy-navigation-menu__trigger_h8tnl_222:has([data-active]), ._teddy-navigation-menu__trigger_h8tnl_222[data-active] {
|
|
2622
|
+
._teddy-navigation-menu__trigger_15tta_230[data-state=open], ._teddy-navigation-menu__trigger_15tta_230:has([data-active]), ._teddy-navigation-menu__trigger_15tta_230[data-active] {
|
|
2618
2623
|
font-weight: var(--teddy-typography-weight-bold);
|
|
2619
2624
|
}
|
|
2620
|
-
._teddy-navigation-
|
|
2625
|
+
._teddy-navigation-menu__trigger_15tta_230[data-state=open]::after, ._teddy-navigation-menu__trigger_15tta_230:has([data-active])::after, ._teddy-navigation-menu__trigger_15tta_230[data-active]::after {
|
|
2621
2626
|
border-color: var(--teddy-color-text-interactive-primary);
|
|
2622
2627
|
opacity: 1;
|
|
2623
2628
|
}
|
|
2624
|
-
._teddy-navigation-
|
|
2629
|
+
._teddy-navigation-menu__trigger_15tta_230:focus-visible {
|
|
2625
2630
|
outline: solid var(--teddy-border-width-sm) var(--teddy-color-border-interactive-focus);
|
|
2626
2631
|
}
|
|
2627
|
-
._teddy-navigation-
|
|
2632
|
+
._teddy-navigation-menu__link_15tta_323 {
|
|
2628
2633
|
all: unset;
|
|
2629
2634
|
position: relative;
|
|
2630
2635
|
cursor: pointer;
|
|
@@ -2640,19 +2645,19 @@
|
|
|
2640
2645
|
min-width: var(--teddy-spacing-400);
|
|
2641
2646
|
font-size: var(--teddy-typography-scale-100);
|
|
2642
2647
|
line-height: var(--teddy-typography-line-height-loose);
|
|
2643
|
-
padding: var(--teddy-spacing-
|
|
2648
|
+
padding: var(--teddy-spacing-200) var(--teddy-spacing-100);
|
|
2644
2649
|
text-align: center;
|
|
2645
2650
|
text-decoration: none;
|
|
2646
2651
|
}
|
|
2647
|
-
._teddy-navigation-menu__link--
|
|
2648
|
-
padding: var(--teddy-spacing-
|
|
2652
|
+
._teddy-navigation-menu__link--small_15tta_343 {
|
|
2653
|
+
padding: calc(var(--teddy-spacing-100) + var(--teddy-spacing-25) + var(--teddy-spacing-10)) var(--teddy-spacing-100);
|
|
2649
2654
|
font-size: var(--teddy-typography-scale-75);
|
|
2650
2655
|
line-height: var(--teddy-typography-line-height-loose);
|
|
2651
2656
|
outline-offset: -2px;
|
|
2652
2657
|
}
|
|
2653
|
-
._teddy-navigation-menu__link--
|
|
2658
|
+
._teddy-navigation-menu__link--button_15tta_349 {
|
|
2654
2659
|
padding: var(--teddy-spacing-100);
|
|
2655
|
-
min-height: var(--teddy-spacing-
|
|
2660
|
+
min-height: calc(var(--teddy-spacing-400) + var(--teddy-spacing-100));
|
|
2656
2661
|
border-radius: var(--teddy-border-radius-md);
|
|
2657
2662
|
display: flex;
|
|
2658
2663
|
place-items: center;
|
|
@@ -2662,11 +2667,11 @@
|
|
|
2662
2667
|
row-gap: var(--teddy-spacing-50);
|
|
2663
2668
|
}
|
|
2664
2669
|
@media (max-width: 600px) {
|
|
2665
|
-
._teddy-navigation-menu__link--
|
|
2670
|
+
._teddy-navigation-menu__link--button_15tta_349 {
|
|
2666
2671
|
font-size: var(--teddy-typography-scale-75);
|
|
2667
2672
|
}
|
|
2668
2673
|
}
|
|
2669
|
-
._teddy-navigation-
|
|
2674
|
+
._teddy-navigation-menu__link_15tta_323::after {
|
|
2670
2675
|
content: "";
|
|
2671
2676
|
display: block;
|
|
2672
2677
|
position: absolute;
|
|
@@ -2677,10 +2682,10 @@
|
|
|
2677
2682
|
pointer-events: none;
|
|
2678
2683
|
border-bottom: var(--teddy-border-width-sm) solid var(--teddy-color-purple-500);
|
|
2679
2684
|
}
|
|
2680
|
-
._teddy-navigation-menu__link--
|
|
2685
|
+
._teddy-navigation-menu__link--button_15tta_349::after {
|
|
2681
2686
|
border: var(--teddy-border-width-sm) solid var(--teddy-color-purple-500);
|
|
2682
2687
|
}
|
|
2683
|
-
._teddy-navigation-
|
|
2688
|
+
._teddy-navigation-menu__link_15tta_323:not(._teddy-navigation-menu__link--button_15tta_349)::before {
|
|
2684
2689
|
content: attr(data-text);
|
|
2685
2690
|
content: attr(data-text)/"";
|
|
2686
2691
|
height: 0;
|
|
@@ -2691,36 +2696,33 @@
|
|
|
2691
2696
|
font-weight: var(--teddy-typography-weight-bold);
|
|
2692
2697
|
}
|
|
2693
2698
|
@media speech {
|
|
2694
|
-
._teddy-navigation-
|
|
2699
|
+
._teddy-navigation-menu__link_15tta_323:not(._teddy-navigation-menu__link--button_15tta_349)::before {
|
|
2695
2700
|
display: none;
|
|
2696
2701
|
}
|
|
2697
2702
|
}
|
|
2698
|
-
._teddy-navigation-
|
|
2703
|
+
._teddy-navigation-menu__link_15tta_323:hover {
|
|
2699
2704
|
background-color: var(--teddy-color-background-interactive-transparent-hover);
|
|
2700
2705
|
}
|
|
2701
|
-
._teddy-navigation-
|
|
2706
|
+
._teddy-navigation-menu__link_15tta_323:hover::after {
|
|
2702
2707
|
opacity: 1;
|
|
2703
2708
|
}
|
|
2704
|
-
._teddy-navigation-
|
|
2709
|
+
._teddy-navigation-menu__link_15tta_323:active {
|
|
2705
2710
|
background-color: var(--teddy-color-background-interactive-transparent-active);
|
|
2706
2711
|
}
|
|
2707
|
-
._teddy-navigation-
|
|
2712
|
+
._teddy-navigation-menu__link_15tta_323:active::after {
|
|
2708
2713
|
opacity: 1;
|
|
2709
2714
|
}
|
|
2710
|
-
._teddy-navigation-
|
|
2711
|
-
font-weight: var(--teddy-typography-weight-bold);
|
|
2712
|
-
}
|
|
2713
|
-
._teddy-navigation-menu__link_h8tnl_318:has([data-active]), ._teddy-navigation-menu__link_h8tnl_318[data-active] {
|
|
2715
|
+
._teddy-navigation-menu__link_15tta_323[data-state=open], ._teddy-navigation-menu__link_15tta_323:has([data-active]), ._teddy-navigation-menu__link_15tta_323[data-active] {
|
|
2714
2716
|
font-weight: var(--teddy-typography-weight-bold);
|
|
2715
2717
|
}
|
|
2716
|
-
._teddy-navigation-
|
|
2718
|
+
._teddy-navigation-menu__link_15tta_323[data-state=open]::after, ._teddy-navigation-menu__link_15tta_323:has([data-active])::after, ._teddy-navigation-menu__link_15tta_323[data-active]::after {
|
|
2717
2719
|
border-color: var(--teddy-color-text-interactive-primary);
|
|
2718
2720
|
opacity: 1;
|
|
2719
2721
|
}
|
|
2720
|
-
._teddy-navigation-
|
|
2722
|
+
._teddy-navigation-menu__link_15tta_323:focus-visible {
|
|
2721
2723
|
outline: solid var(--teddy-border-width-sm) var(--teddy-color-border-interactive-focus);
|
|
2722
2724
|
}
|
|
2723
|
-
._teddy-navigation-
|
|
2725
|
+
._teddy-navigation-menu__viewport_15tta_34 {
|
|
2724
2726
|
position: relative;
|
|
2725
2727
|
background-color: var(--teddy-color-background-primary);
|
|
2726
2728
|
height: var(--radix-navigation-menu-viewport-height);
|
|
@@ -2728,17 +2730,17 @@
|
|
|
2728
2730
|
overflow: clip;
|
|
2729
2731
|
}
|
|
2730
2732
|
@media (prefers-reduced-motion: no-preference) {
|
|
2731
|
-
._teddy-navigation-
|
|
2733
|
+
._teddy-navigation-menu__viewport_15tta_34 {
|
|
2732
2734
|
transition: height var(--teddy-motion-duration-controlled, 0) ease;
|
|
2733
2735
|
}
|
|
2734
|
-
._teddy-navigation-
|
|
2735
|
-
animation:
|
|
2736
|
+
._teddy-navigation-menu__viewport_15tta_34[data-state=open] {
|
|
2737
|
+
animation: _scaleIn_15tta_1 var(--teddy-motion-duration-controlled, 0) ease;
|
|
2736
2738
|
}
|
|
2737
|
-
._teddy-navigation-
|
|
2738
|
-
animation:
|
|
2739
|
+
._teddy-navigation-menu__viewport_15tta_34[data-state=closed] {
|
|
2740
|
+
animation: _scaleOut_15tta_1 var(--teddy-motion-duration-300) ease;
|
|
2739
2741
|
}
|
|
2740
2742
|
}
|
|
2741
|
-
@keyframes
|
|
2743
|
+
@keyframes _scaleIn_15tta_1 {
|
|
2742
2744
|
from {
|
|
2743
2745
|
opacity: 0;
|
|
2744
2746
|
transform: scale(0.9);
|
|
@@ -2750,7 +2752,7 @@
|
|
|
2750
2752
|
height: var(--radix-navigation-menu-viewport-height);
|
|
2751
2753
|
}
|
|
2752
2754
|
}
|
|
2753
|
-
@keyframes
|
|
2755
|
+
@keyframes _scaleOut_15tta_1 {
|
|
2754
2756
|
from {
|
|
2755
2757
|
opacity: 1;
|
|
2756
2758
|
transform: scale(1);
|
|
@@ -2761,7 +2763,7 @@
|
|
|
2761
2763
|
height: 0;
|
|
2762
2764
|
}
|
|
2763
2765
|
}
|
|
2764
|
-
@keyframes
|
|
2766
|
+
@keyframes _enterFromRight_15tta_1 {
|
|
2765
2767
|
from {
|
|
2766
2768
|
opacity: 0;
|
|
2767
2769
|
transform: translateX(200px);
|
|
@@ -2771,7 +2773,7 @@
|
|
|
2771
2773
|
transform: translateX(0);
|
|
2772
2774
|
}
|
|
2773
2775
|
}
|
|
2774
|
-
@keyframes
|
|
2776
|
+
@keyframes _enterFromLeft_15tta_1 {
|
|
2775
2777
|
from {
|
|
2776
2778
|
opacity: 0;
|
|
2777
2779
|
transform: translateX(-200px);
|
|
@@ -2781,7 +2783,7 @@
|
|
|
2781
2783
|
transform: translateX(0);
|
|
2782
2784
|
}
|
|
2783
2785
|
}
|
|
2784
|
-
@keyframes
|
|
2786
|
+
@keyframes _exitToRight_15tta_1 {
|
|
2785
2787
|
from {
|
|
2786
2788
|
opacity: 1;
|
|
2787
2789
|
transform: translateX(0);
|
|
@@ -2791,7 +2793,7 @@
|
|
|
2791
2793
|
transform: translateX(200px);
|
|
2792
2794
|
}
|
|
2793
2795
|
}
|
|
2794
|
-
@keyframes
|
|
2796
|
+
@keyframes _exitToLeft_15tta_1 {
|
|
2795
2797
|
from {
|
|
2796
2798
|
opacity: 1;
|
|
2797
2799
|
transform: translateX(0);
|
|
@@ -3320,41 +3322,41 @@
|
|
|
3320
3322
|
height: 0;
|
|
3321
3323
|
}
|
|
3322
3324
|
}
|
|
3323
|
-
}._teddy-global-
|
|
3325
|
+
}._teddy-global-navigation_xrrz1_1 {
|
|
3324
3326
|
position: sticky;
|
|
3325
3327
|
inset: 0 0 auto 0;
|
|
3326
3328
|
z-index: 39;
|
|
3327
3329
|
}
|
|
3328
|
-
._teddy-global-navigation__mobile-
|
|
3330
|
+
._teddy-global-navigation__mobile-trigger_xrrz1_6 {
|
|
3329
3331
|
border-inline: var(--teddy-border-width-xs) solid var(--teddy-color-border-weak);
|
|
3330
3332
|
}
|
|
3331
|
-
._teddy-global-navigation__mobile-
|
|
3333
|
+
._teddy-global-navigation__mobile-header_xrrz1_9[data-state=open] {
|
|
3332
3334
|
border-bottom: var(--teddy-border-width-xs) solid var(--teddy-color-border-weak);
|
|
3333
3335
|
}
|
|
3334
|
-
._teddy-global-
|
|
3336
|
+
._teddy-global-navigation__mobile_xrrz1_6 {
|
|
3335
3337
|
padding: var(--teddy-spacing-25) var(--teddy-spacing-200);
|
|
3336
3338
|
border-bottom: var(--teddy-border-width-sm) solid var(--teddy-color-border-weak);
|
|
3337
3339
|
}
|
|
3338
|
-
._teddy-global-
|
|
3340
|
+
._teddy-global-navigation__mobile_xrrz1_6::before {
|
|
3339
3341
|
content: "";
|
|
3340
3342
|
display: block;
|
|
3341
3343
|
width: var(--width-for-centering-element);
|
|
3342
3344
|
}
|
|
3343
|
-
._teddy-global-
|
|
3345
|
+
._teddy-global-navigation__mobile_xrrz1_6::after {
|
|
3344
3346
|
content: "";
|
|
3345
3347
|
display: block;
|
|
3346
3348
|
width: var(--width-for-centering-element);
|
|
3347
3349
|
}
|
|
3348
|
-
._teddy-global-
|
|
3350
|
+
._teddy-global-navigation__link_xrrz1_26 {
|
|
3349
3351
|
text-decoration: none;
|
|
3350
3352
|
}
|
|
3351
|
-
._teddy-global-
|
|
3352
|
-
height: var(--radix-navigation-menu-viewport-height, calc(
|
|
3353
|
+
._teddy-global-navigation__viewport_xrrz1_29 {
|
|
3354
|
+
height: var(--radix-navigation-menu-viewport-height, calc(47px * var(--teddy-scale)));
|
|
3353
3355
|
}
|
|
3354
|
-
._teddy-global-navigation__item-
|
|
3356
|
+
._teddy-global-navigation__item-wrapper_xrrz1_32 {
|
|
3355
3357
|
position: relative;
|
|
3356
3358
|
}
|
|
3357
|
-
._teddy-global-navigation__item-
|
|
3359
|
+
._teddy-global-navigation__item-count_xrrz1_35 {
|
|
3358
3360
|
display: flex;
|
|
3359
3361
|
justify-content: center;
|
|
3360
3362
|
align-items: center;
|
|
@@ -3362,57 +3364,34 @@
|
|
|
3362
3364
|
left: 15px;
|
|
3363
3365
|
top: -6px;
|
|
3364
3366
|
}
|
|
3365
|
-
._teddy-global-navigation__viewport-
|
|
3367
|
+
._teddy-global-navigation__viewport-wrapper_xrrz1_43 {
|
|
3366
3368
|
overflow: hidden;
|
|
3369
|
+
transition: max-height var(--teddy-motion-duration-controlled, 0) ease;
|
|
3367
3370
|
}
|
|
3368
|
-
._teddy-global-navigation__viewport-
|
|
3369
|
-
|
|
3371
|
+
._teddy-global-navigation__viewport-wrapper_xrrz1_43[data-state=open] {
|
|
3372
|
+
max-height: var(--teddy-top-menu-height);
|
|
3370
3373
|
}
|
|
3371
|
-
._teddy-global-navigation__viewport-
|
|
3372
|
-
animation: _close-
|
|
3373
|
-
height: 0;
|
|
3374
|
+
._teddy-global-navigation__viewport-wrapper_xrrz1_43[data-state=closed] {
|
|
3375
|
+
animation: _close-viewport_xrrz1_1 var(--teddy-motion-duration-controlled, 0) ease;
|
|
3376
|
+
max-height: 0;
|
|
3374
3377
|
}
|
|
3375
|
-
._teddy-global-navigation__top-menu-
|
|
3378
|
+
._teddy-global-navigation__top-menu-wrapper_xrrz1_54 {
|
|
3376
3379
|
overflow: hidden;
|
|
3377
|
-
transition: height var(--teddy-motion-duration-
|
|
3380
|
+
transition: max-height var(--teddy-motion-duration-controlled, 0) ease;
|
|
3378
3381
|
}
|
|
3379
|
-
._teddy-global-navigation__top-menu-
|
|
3380
|
-
height: var(--teddy-top-menu-height,
|
|
3382
|
+
._teddy-global-navigation__top-menu-wrapper_xrrz1_54[data-state=open] {
|
|
3383
|
+
max-height: var(--teddy-top-menu-height, 47px);
|
|
3381
3384
|
}
|
|
3382
|
-
._teddy-global-navigation__top-menu-
|
|
3383
|
-
height: 0;
|
|
3385
|
+
._teddy-global-navigation__top-menu-wrapper_xrrz1_54[data-state=closed] {
|
|
3386
|
+
max-height: 0;
|
|
3384
3387
|
}
|
|
3385
3388
|
|
|
3386
|
-
@keyframes
|
|
3387
|
-
0% {
|
|
3388
|
-
height: 0;
|
|
3389
|
-
}
|
|
3390
|
-
100% {
|
|
3391
|
-
height: var(--teddy-viewport-wrapper-height);
|
|
3392
|
-
}
|
|
3393
|
-
}
|
|
3394
|
-
@keyframes _close-viewport_1ue02_1 {
|
|
3395
|
-
0% {
|
|
3396
|
-
height: var(--teddy-viewport-wrapper-height);
|
|
3397
|
-
}
|
|
3398
|
-
100% {
|
|
3399
|
-
height: 0;
|
|
3400
|
-
}
|
|
3401
|
-
}
|
|
3402
|
-
@keyframes _expand-top-menu_1ue02_1 {
|
|
3403
|
-
0% {
|
|
3404
|
-
height: 0;
|
|
3405
|
-
}
|
|
3406
|
-
100% {
|
|
3407
|
-
height: var(--teddy-top-menu-height);
|
|
3408
|
-
}
|
|
3409
|
-
}
|
|
3410
|
-
@keyframes _close-top-menu_1ue02_1 {
|
|
3389
|
+
@keyframes _close-viewport_xrrz1_1 {
|
|
3411
3390
|
0% {
|
|
3412
|
-
height: var(--teddy-
|
|
3391
|
+
max-height: var(--teddy-viewport-wrapper-height);
|
|
3413
3392
|
}
|
|
3414
3393
|
100% {
|
|
3415
|
-
height: 0;
|
|
3394
|
+
max-height: 0;
|
|
3416
3395
|
}
|
|
3417
3396
|
}@layer icon, toggle;
|
|
3418
3397
|
._teddy-toggle__input_m5h3g_2::before {
|