1 files changed, 168 insertions, 0 deletions
diff --git a/smoke/astro.build-main/tailwind.config.js b/smoke/astro.build-main/tailwind.config.js
new file mode 100644
index 000000000..8b33633f6
--- /dev/null
+++ b/smoke/astro.build-main/tailwind.config.js
@@ -0,0 +1,168 @@
+const FONT_FAMILY_BASE = [
+  "system-ui",
+  "-apple-system",
+  "BlinkMacSystemFont",
+  "Segoe UI",
+  "Roboto",
+  "Oxygen",
+  "Ubuntu",
+  "Cantarell",
+  "Open Sans",
+  "Helvetica Neue",
+  "sans-serif",
+];
+
+module.exports = {
+  corePlugins: {
+    container: false,
+  },
+  content: ["./src/**/*.{astro,html,js,jsx,svelte,ts,tsx,vue}"],
+  theme: {
+    colors: {
+      white: "#fff",
+      black: "#000",
+      transparent: "transparent",
+      tan: "#f4efed",
+      dawn: "#f3e9fa",
+      dusk: "#514375",
+      midnight: "#31274a",
+      blue: "#205eff",
+      red: "#ff5050",
+      yellow: "#ffd542",
+      purple: "#af43ff",
+      pink: "#fdb2b7",
+      pop: {
+        1: "linear-gradient(180deg, #205eff 0%, #c238bd 115%)",
+      },
+    },
+    fontFamily: {
+      body: FONT_FAMILY_BASE,
+      display: ["RT Alias Medium", ...FONT_FAMILY_BASE],
+      mono: [
+        "Menlo",
+        "Monaco",
+        "Lucida Console",
+        "Liberation Mono",
+        "DejaVu Sans Mono",
+        "Bitstream Vera Sans Mono",
+        "Courier New",
+        "monospace",
+      ],
+    },
+    fontSize: {
+      xs: "clamp(0.7rem, 0.66rem + 0.2vw, 0.8rem)",
+      sm: "clamp(0.88rem, 0.83rem + 0.24vw, 1rem)",
+      base: "clamp(1.09rem, 1rem + 0.47vw, 1.33rem)",
+      lg: "clamp(1.37rem, 1.21rem + 0.8vw, 1.78rem)",
+      xl: "clamp(1.71rem, 1.45rem + 1.29vw, 2.37rem)",
+      "2xl": "clamp(2.14rem, 1.74rem + 1.99vw, 3.16rem)",
+      "3xl": "clamp(2.67rem, 2.07rem + 3vw, 4.21rem)",
+      "4xl": "clamp(3.34rem, 2.45rem + 4.43vw, 5.61rem)",
+    },
+    extend: {
+      typography: ({ theme }) => {
+        const headings = {
+          "h1, h2, h3, h4, h5, h6": {
+            fontFamily: "var(--font-display)",
+            fontWeight: "bold",
+            lineHeight: 1.1,
+            textAlign: "inherit"
+          },
+          h1: {
+            fontSize: theme("fontSize.3xl"),
+          },
+          h2: {
+            fontSize: theme("fontSize.2xl"),
+          },
+          h3: {
+            fontSize: theme("fontSize.xl"),
+          },
+          h4: {
+            fontSize: theme("fontSize.lg"),
+          },
+          h5: {
+            fontSize: theme("fontSize.sm"),
+          },
+          h6: {
+            fontSize: theme("fontSize.xs"),
+          },
+        };
+
+        return {
+          DEFAULT: {
+            css: {
+              maxWidth: '75ch',
+              fontSize: "var(--size-500)",
+              lineHeight: "1.5",
+              // override @tailwindcss/typography colors
+              "--tw-prose-body": theme("colors.midnight"),
+              "--tw-prose-headings": theme("colors.dusk"),
+              "--tw-prose-links": theme("colors.blue"),
+              "--tw-prose-code": theme("colors.purple"),
+              "--tw-prose-pre-bg":
+                "linear-gradient(to bottom,var(--color-midnight),#1f1638)",
+              "--tw-prose-pre-code": theme("colors.white"),
+              "--tw-prose-bullets": "rgba(var(--color-midnight-rgb), 0.5)",
+              ":focus-visible": {
+                outline: "2px dashed var(--color-blue)",
+              },
+              ...headings,
+              a: {
+                textDecoration: "none",
+                fontWeight: 400,
+                wordBreak: "break-word",
+                "&:hover": {
+                  textDecoration: "underline",
+                },
+                "> code": {
+                  color: "var(--tw-prose-code)",
+                },
+              },
+            },
+          },
+          sm: {
+            ...headings,
+          },
+          md: {
+            ...headings,
+          },
+          lg: {
+            ...headings,
+          },
+          xl: {
+            ...headings,
+          },
+        };
+      },
+    },
+  },
+  plugins: [
+    require("@tailwindcss/typography"),
+    require("@tailwindcss/aspect-ratio"),
+    function ({ addComponents, theme }) {
+      addComponents({
+        ".container": {
+          maxWidth: "40rem",
+          marginLeft: "auto",
+          marginRight: "auto",
+          "@screen md": { maxWidth: "50rem" },
+          "@screen lg": { maxWidth: "62rem" },
+          "@screen xl": { maxWidth: "80rem" },
+          "@screen 2xl": { maxWidth: "90rem" },
+        },
+        ".head-md": {
+          fontFamily: theme("fontFamily.display"),
+          fontSize: theme("fontSize.xl"),
+          letterSpacing: -0.5,
+          lineHeight: 1.2,
+          fontWeight: "bold"
+        },
+        ".body-md": {
+          fontFamily: theme("fontFamily.body"),
+          fontSize: theme("fontSize.body"),
+          lineHeight: 1.3,
+        }
+      });
+    },
+  ],
+};