@hitachivantara/uikit-react-core/dist/esm/ScrollToVertical/ScrollToVertical.styles.js

Core React components for the NEXT Design System.

import { createClasses } from "@hitachivantara/uikit-react-utils";
import { theme } from "@hitachivantara/uikit-styles";
const { staticClasses, useClasses } = createClasses(
  "HvScrollToVertical",
  {
    root: {
      display: "flex",
      width: "32px",
      padding: "0",
      margin: 0,
      listStyleType: "none",
      flexWrap: "wrap",
      flexDirection: "column",
      backdropFilter: `blur(4px)`,
      backgroundColor: theme.alpha("bgPage", 0.9)
    },
    positionAbsolute: {
      width: "32px",
      position: "absolute",
      zIndex: `calc(${theme.zIndices.banner} - 2)`,
      right: "0"
    },
    positionFixed: {
      width: "32px",
      position: "fixed",
      zIndex: `calc(${theme.zIndices.banner} - 2)`,
      right: "0"
    }
  }
);
const calculateOffset = (quantityOfOptions) => {
  const itemSize = 32;
  const halfOptions = Math.round(quantityOfOptions * 0.5);
  return halfOptions * itemSize;
};
export {
  calculateOffset,
  staticClasses,
  useClasses
};