feat: initial commit

packages/bolt/app/styles/index.scss

@@ -0,0 +1,31 @@
+@import './variables.scss';
+
+body {
+  --at-apply: bg-bolt-elements-app-backgroundColor;
+
+  font-family: 'Inter', sans-serif;
+
+  &:before {
+    --line: color-mix(in lch, canvasText, transparent 93%);
+    --size: 50px;
+
+    content: '';
+    height: 100vh;
+    mask: linear-gradient(-25deg, transparent 60%, white);
+    pointer-events: none;
+    position: fixed;
+    top: 0;
+    transform-style: flat;
+    width: 100vw;
+    z-index: -1;
+    background:
+      linear-gradient(90deg, var(--line) 1px, transparent 1px var(--size)) 50% 50% / var(--size) var(--size),
+      linear-gradient(var(--line) 1px, transparent 1px var(--size)) 50% 50% / var(--size) var(--size);
+  }
+}
+
+html,
+body {
+  height: 100%;
+  width: 100%;
+}

packages/bolt/app/styles/variables.scss

@@ -0,0 +1,21 @@
+:root,
+:root[data-theme='light'] {
+  /* Color Tokens */
+  --bolt-background-primary: theme('colors.gray.50');
+}
+
+:root,
+:root[data-theme='dark'] {
+  /* Color Tokens */
+  --bolt-background-primary: theme('colors.gray.50');
+}
+
+/*
+ * Element Tokens
+ *
+ * Hierarchy: Element Token -> (Element Token | Color Tokens) -> Primitives
+ */
+:root {
+  /* App */
+  --bolt-elements-app-backgroundColor: var(--bolt-background-primary);
+}