import { CSSProperties } from "react";

type Variant = "primary" | "secondary";

type ThemeVariants = {
  [K in Variant]?: CSSProperties;
};

type Element = "text" | "background" | "border";

type Theme = {
  [K in Element]: ThemeVariants;
};

/**
 * Quick hack with minimal info until webflow publishes a components lib
 */
export const theme: Theme = {
  text: {
    primary: { color: "#D9D9D9" },
  },
  background: {
    secondary: { backgroundColor: "#5E5E5E" },
  },
  border: {
    primary: {
      borderColor: "#363636",
      borderWidth: 1,
      borderRadius: 1,
      borderStyle: "solid",
    },
  },
};
