export const width = {
  auto: "auto",
  px: "1px",
  "1": "4px",
  "2": "8px",
  "3": "12px",
  "4": "16px",
  "5": "20px",
  "6": "24px",
  "7": "28px",
  "8": "32px",
  "9": "36px",
  "10": "40px",
  "12": "48px",
  "14": "56px",
  "16": "64px",
  "18": "72px",
  "20": "80px",
  "22": "88px",
  "24": "96px",
  "28": "112px",
  "30": "120px",
  "32": "128px",
  "34": "136px",
  "36": "144px",
  "38": "152px",
  "40": "160px",
  "42": "168px",
  "44": "176px",
  "46": "184px",
  "48": "192px",
  "56": "224px",
  "64": "256px",
  "1/2": "50%",
  "1/3": "33.33333%",
  "2/3": "66.66667%",
  "1/4": "25%",
  "3/4": "75%",
  "1/5": "20%",
  "2/5": "40%",
  "3/5": "60%",
  "4/5": "80%",
  "1/6": "16.66667%",
  "5/6": "83.33333%",
  full: "100%",
  screen: "100vw",
  "max-content": "max-content",
};

export const minWidth = {
  "0": "0",
  "1": "4px",
  "2": "8px",
  "3": "12px",
  "4": "16px",
  "5": "20px",
  "6": "24px",
  "7": "28px",
  "8": "32px",
  "9": "36px",
  "10": "40px",
  "12": "48px",
  "14": "56px",
  "16": "64px",
  "18": "72px",
  "20": "80px",
  "22": "88px",
  "24": "96px",
  "28": "112px",
  "30": "120px",
  "32": "128px",
  "34": "136px",
  "36": "144px",
  "38": "152px",
  "40": "160px",
  "42": "168px",
  "44": "176px",
  "46": "184px",
  "48": "192px",
  "56": "224px",
  "64": "256px",
  full: "100%",
};

export const maxWidth = {
  xs: "20rem",
  sm: "30rem",
  md: "40rem",
  lg: "50rem",
  xl: "60rem",
  "2xl": "70rem",
  "3xl": "80rem",
  "4xl": "90rem",
  "5xl": "100rem",
  full: "100%",
  screen: "100vw",
};