Initial Commit

static/css/app.css

@@ -0,0 +1 @@
+/* static/css/app.css — add any custom tweaks separate from Tailwind CDN (optional) */

static/css/tailwind.css

@@ -0,0 +1,45 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+
+/* --- Design tokens (light/dark) --- */
+@layer base {
+  :root {
+    --bg: 10 10 10;
+    --fg: 245 245 245;
+    --muted: 165 165 165;
+    --accent: 249 115 22; /* orange-500 */
+    --border: 38 38 38;
+    --card: 18 18 18;
+  }
+  :root[data-theme="light"] {
+    --bg: 255 255 255;
+    --fg: 17 17 17;
+    --muted: 115 115 115;
+    --accent: 234 88 12; /* orange-600 */
+    --border: 229 231 235;
+    --card: 250 250 250;
+  }
+
+  html, body { height: 100%; }
+  body { background: rgb(var(--bg)); color: rgb(var(--fg)); }
+}
+
+/* --- Component classes --- */
+@layer components {
+  .container-page { @apply max-w-7xl mx-auto px-4 sm:px-6 lg:px-8; }
+  .btn { @apply inline-flex items-center gap-2 rounded-xl px-4 py-2 font-medium border transition; }
+  .btn-primary { @apply border-transparent bg-[rgb(var(--accent))] text-white hover:opacity-90; }
+  .btn-ghost { @apply border-[rgb(var(--border))] bg-transparent text-[rgb(var(--fg))] hover:bg-[rgb(var(--card))]; }
+  .card { @apply rounded-2xl border border-[rgb(var(--border))] bg-[rgb(var(--card))] p-6 shadow; }
+  .heading-hero { @apply font-extrabold tracking-tight text-4xl sm:text-6xl; }
+  .subtle { color: rgb(var(--muted)); }
+  .nav-link { @apply text-sm text-[rgb(var(--muted))] hover:text-[rgb(var(--fg))] transition; }
+}
+
+/* --- Pretty shadow --- */
+@layer utilities {
+  .shadow-glass { box-shadow: 0 8px 30px rgba(0,0,0,.18), inset 0 1px rgba(255,255,255,.06); }
+}
+

static/favicon.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><rect width="64" height="64" rx="12" fill="#fff"/><text x="50%" y="50%" dominant-baseline="middle" text-anchor="middle" font-family="Arial, Helvetica, sans-serif" font-size="28" fill="#000">BH</text></svg>

static/js/main.js

@@ -0,0 +1,4 @@
+// Minimal JS placeholder.
+// Add: copy-to-clipboard, smooth anchor scroll tweaks, form enhancements, etc.
+console.debug("BuffTEKS site loaded.");
+

static/src/app.css

@@ -0,0 +1,44 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+
+/* Fonts (host locally if you want; leaving CSS hooks here) */
+@layer base {
+:root {
+--bg: #0a0a0a;
+}
+html, body { background: var(--bg); }
+.font-bebas { font-family: "Bebas Neue", ui-sans-serif, system-ui; }
+}
+
+
+/* Utilities */
+@layer utilities {
+.bg-grid {
+background-image:
+linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px),
+linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px);
+background-size: 48px 48px;
+background-position: -1px -1px;
+}
+.mask-fade { -webkit-mask-image: linear-gradient(to bottom, black, rgba(0,0,0,.85) 40%, transparent 80%); mask-image: linear-gradient(to bottom, black, rgba(0,0,0,.85) 40%, transparent 80%); }
+.glass { backdrop-filter: blur(12px); background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); }
+.dot { display: inline-flex; align-items: center; gap: .5rem; }
+.dot::before { content: ""; width: .5rem; height: .5rem; border-radius: 9999px; background: rgb(52 211 153); }
+}
+
+
+/* Components */
+@layer components {
+.btn-primary { @apply inline-flex items-center justify-center px-5 py-3 rounded-xl bg-white text-black font-semibold hover:opacity-90 transition; }
+.btn-ghost { @apply inline-flex items-center justify-center px-5 py-3 rounded-xl glass font-semibold hover:bg-white/10 transition; }
+.label { @apply text-sm text-white/70; }
+.input { @apply w-full mt-1 bg-white/5 border border-white/10 rounded-xl px-4 py-3 outline-none focus:border-white/30; }
+.textarea { @apply w-full mt-1 bg-white/5 border border-white/10 rounded-xl px-4 py-3 outline-none focus:border-white/30; }
+.link { @apply underline underline-offset-4 hover:no-underline; }
+.card { @apply glass rounded-2xl p-6; }
+.card-title { @apply font-semibold text-lg; }
+.card-body { @apply mt-2 text-sm text-white/80; }
+.card-list { @apply mt-4 space-y-2 text-sm text-white/70 list-disc pl-4; }
+}

static/tailwind.config.js

@@ -0,0 +1,28 @@
+module.exports = {
+  content: ["./templates/**/*.html", "./static/js/**/*.js"],
+  theme: {
+    extend: {
+      fontFamily: {
+        display: ['"Bebas Neue"', "Inter", "system-ui", "sans-serif"],
+        sans: ["Inter", "system-ui", "sans-serif"],
+	archivo: ['Archivo', 'sans-serif'],      
+      },
+	backgroundImage: {
+      'bh-hero': 'linear-gradient(to bottom right, rgba(249,115,22,0.2), rgba(244,63,94,0.1), rgba(217,70,239,0.1))',
+    },    
+      colors: {
+        bg: "rgb(var(--bg))",
+        fg: "rgb(var(--fg))",
+        accent: "rgb(var(--accent))",
+        card: "rgb(var(--card))",
+        border: "rgb(var(--border))",
+      },
+      boxShadow: {
+        glass: "0 8px 30px rgba(0,0,0,.18), inset 0 1px rgba(255,255,255,.06)",
+      },
+      borderRadius: { xl: "1rem", "2xl": "1.25rem" },
+    },
+  },
+  plugins: [],
+};
+