@hitachivantara/uikit-react-core
Version:
Core React components for the NEXT Design System.
66 lines (65 loc) • 1.56 kB
JavaScript
"use strict";
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
const uikitStyles = require("@hitachivantara/uikit-styles");
const show = {
top: uikitStyles.theme.header.height,
transition: ["top"],
boxShadow: uikitStyles.theme.colors.shadow,
transitionDuration: "500ms",
backgroundColor: uikitStyles.theme.colors.bgPage
};
const hide = {
top: 0,
transition: ["top"],
boxShadow: "none",
transitionDuration: "300ms"
};
const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvHeader-MenuBar", {
root: {
left: 0,
width: "100%",
height: "100%",
display: "flex",
justifyContent: "center",
alignItems: "center"
},
menu: {
position: "absolute",
zIndex: -2,
height: uikitStyles.theme.header.secondLevelHeight,
backgroundColor: uikitStyles.theme.colors.bgPage,
"& li > div": {
marginTop: 0
}
},
menubar: {
position: "relative",
backgroundColor: uikitStyles.theme.colors.bgContainer
},
hidden: { ...hide },
active: { ...show },
list: {
margin: 0,
padding: 0,
display: "inherit",
alignItems: "center",
height: "100%",
"&:hover $active": {
...hide
},
"& li:hover > $hidden": {
...show
},
"&:focus-within $active": {
...hide,
zIndex: -2
},
"& li:focus-within > $hidden": {
...show,
zIndex: -1
}
}
});
exports.staticClasses = staticClasses;
exports.useClasses = useClasses;