@farming-labs/nuxt-theme 0.0.2-beta.17

package/styles/colorful.css

@@ -0,0 +1,148 @@
+/* @farming-labs/nuxt-theme — colorful theme overrides
+ * Fumadocs-inspired theme with warm yellow/amber accent colors.
+ * Import AFTER the base theme CSS (docs.css).
+ */
+
+/* ─── Colorful yellow accent overrides ────────────────────────────── */
+
+:root {
+  --color-fd-primary: hsl(40, 96%, 40%);
+  --color-fd-primary-foreground: hsl(0, 0%, 100%);
+  --color-fd-ring: hsl(40, 80%, 50%);
+}
+
+.dark {
+  --color-fd-primary: hsl(45, 100%, 60%);
+  --color-fd-primary-foreground: hsl(0, 0%, 5%);
+  --color-fd-ring: hsl(45, 90%, 55%);
+}
+
+/* ─── Description under title ──────────────────────────────────────── */
+
+.fd-page-description {
+  margin-bottom: 1rem;
+  font-size: 1.125rem;
+  line-height: 1.75;
+  color: var(--color-fd-muted-foreground);
+}
+
+/* ─── Sidebar dark overrides (fumadocs neutral) ────────────────────── */
+
+.dark .fd-sidebar {
+  --color-fd-muted: hsl(0, 0%, 16%);
+  --color-fd-secondary: hsl(0, 0%, 18%);
+  --color-fd-muted-foreground: hsl(0, 0%, 72%);
+}
+
+/* ─── Cards (fumadocs style) ────────────────────────────────────────── */
+
+.fd-card {
+  display: block;
+  border-radius: 0.75rem;
+  border: 1px solid var(--color-fd-border);
+  background: var(--color-fd-card);
+  padding: 1rem;
+  font-size: 0.875rem;
+  color: var(--color-fd-card-foreground);
+  box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1);
+  transition: background-color 150ms, border-color 150ms;
+}
+
+.fd-card:hover {
+  background: var(--color-fd-accent);
+}
+
+.fd-card-icon {
+  margin-bottom: 0.5rem;
+  width: fit-content;
+  border-radius: 0.375rem;
+  border: 1px solid var(--color-fd-border);
+  padding: 0.375rem;
+  color: var(--color-fd-muted-foreground);
+}
+
+.fd-card-title {
+  font-weight: 500;
+}
+
+.fd-card-description {
+  color: var(--color-fd-muted-foreground);
+  margin-top: 0.25rem;
+}
+
+.fd-cards {
+  display: grid;
+  grid-template-columns: 1fr;
+  gap: 1rem;
+}
+
+@media (min-width: 640px) {
+  .fd-cards {
+    grid-template-columns: repeat(2, 1fr);
+  }
+}
+
+/* ─── Page nav cards ───────────────────────────────────────────────── */
+
+.fd-page-nav-card {
+  border-radius: 0.75rem;
+}
+
+/* ─── Inline code ──────────────────────────────────────────────────── */
+
+.fd-docs-content :not(pre) > code {
+  padding: 3px;
+  border: 1px solid var(--color-fd-border);
+  font-size: 13px;
+  border-radius: 5px;
+  background: var(--color-fd-muted);
+}
+
+/* ─── Links in prose ───────────────────────────────────────────────── */
+
+.fd-docs-content a:not(.fd-page-nav-card):not([class]) {
+  text-decoration: underline;
+  text-underline-offset: 3.5px;
+  text-decoration-color: var(--color-fd-primary);
+  text-decoration-thickness: 1.5px;
+  font-weight: 500;
+}
+
+/* ─── Tables (rounded) ─────────────────────────────────────────────── */
+
+.fd-docs-content table {
+  border-collapse: separate;
+  border-spacing: 0;
+  background: var(--color-fd-card);
+  border-radius: 0.75rem;
+  border: 1px solid var(--color-fd-border);
+  overflow: hidden;
+}
+
+.fd-docs-content th {
+  background: var(--color-fd-muted);
+  font-weight: 600;
+}
+
+.fd-docs-content th,
+.fd-docs-content td {
+  padding: 0.625rem;
+  border-bottom: 1px solid var(--color-fd-border);
+}
+
+.fd-docs-content tr:last-child td {
+  border-bottom: none;
+}
+
+/* ─── Blockquotes ──────────────────────────────────────────────────── */
+
+.fd-docs-content blockquote {
+  border-left: 2px solid var(--color-fd-primary);
+  padding-left: 1rem;
+  color: var(--color-fd-foreground);
+  font-style: normal;
+}
+
+.fd-docs-content hr {
+  border-color: var(--color-fd-border);
+}

package/styles/darksharp-bundle.css

@@ -0,0 +1,6 @@
+/* @farming-labs/svelte-theme — darksharp theme (bundled)
+ * Single import: includes base docs.css + darksharp overrides.
+ * Usage: @import "@farming-labs/svelte-theme/darksharp/css";
+ */
+@import "./docs.css";
+@import "./darksharp.css";

package/styles/darksharp.css

@@ -0,0 +1,206 @@
+/* @farming-labs/svelte-theme — darksharp theme overrides
+ * All-black, sharp edges, zero-radius look.
+ * Applied on top of docs.css base styles.
+ */
+
+/* ─── Color overrides (light) ─────────────────────────────────────── */
+
+:root {
+  --color-fd-background: oklch(1 0 0);
+  --color-fd-foreground: oklch(0.147 0.004 49.25);
+  --color-fd-card: oklch(1 0 0);
+  --color-fd-card-foreground: oklch(0.147 0.004 49.25);
+  --color-fd-popover: oklch(1 0 0);
+  --color-fd-popover-foreground: oklch(0.147 0.004 49.25);
+  --color-fd-primary: oklch(0.216 0.006 56.043);
+  --color-fd-primary-foreground: oklch(0.985 0.001 106.423);
+  --color-fd-secondary: oklch(0.97 0.001 106.424);
+  --color-fd-secondary-foreground: oklch(0.216 0.006 56.043);
+  --color-fd-muted: oklch(0.97 0.001 106.424);
+  --color-fd-muted-foreground: oklch(0.553 0.013 58.071);
+  --color-fd-accent: oklch(0.97 0.001 106.424);
+  --color-fd-accent-foreground: oklch(0.216 0.006 56.043);
+  --color-fd-border: oklch(0.923 0.003 48.717);
+  --color-fd-ring: oklch(0.709 0.01 56.259);
+}
+
+/* ─── Color overrides (dark) ──────────────────────────────────────── */
+
+.dark {
+  --color-fd-background: hsl(0 0% 0%);
+  --color-fd-foreground: oklch(0.985 0.001 106.423);
+  --color-fd-card: hsl(0 0% 0%);
+  --color-fd-card-foreground: oklch(0.985 0.001 106.423);
+  --color-fd-popover: hsl(0 0% 6%);
+  --color-fd-popover-foreground: oklch(0.985 0.001 106.423);
+  --color-fd-primary: oklch(0.985 0.001 106.423);
+  --color-fd-primary-foreground: oklch(0.216 0.006 56.043);
+  --color-fd-secondary: hsl(0 0% 10%);
+  --color-fd-secondary-foreground: oklch(0.985 0.001 106.423);
+  --color-fd-muted: hsl(0 0% 10%);
+  --color-fd-muted-foreground: hsl(0 0% 55%);
+  --color-fd-accent: hsl(0 0% 12%);
+  --color-fd-accent-foreground: oklch(0.985 0.001 106.423);
+  --color-fd-border: hsl(0 0% 14%);
+  --color-fd-ring: hsl(0 0% 30%);
+}
+
+/* ═══════════════════════════════════════════════════════════════════
+ * Sharp radius — override all rounded utilities
+ * ═══════════════════════════════════════════════════════════════════ */
+
+.fd-sidebar,
+.fd-nav,
+.fd-card,
+.fd-callout,
+.fd-code-block,
+.fd-search-dialog,
+.fd-toc,
+[class*="rounded-lg"] {
+  border-radius: 0.2rem !important;
+}
+
+[class*="rounded-md"] {
+  border-radius: 0.1rem !important;
+}
+
+[class*="rounded-xl"],
+[class*="rounded-2xl"] {
+  border-radius: 0.2rem !important;
+}
+
+/* ─── Tables ──────────────────────────────────────────────────────── */
+
+table {
+  border-radius: 0 !important;
+  border-collapse: collapse;
+}
+
+.dark th {
+  background: hsl(0 0% 8%);
+  color: hsl(0 0% 80%);
+  font-weight: 500;
+}
+
+.dark td {
+  background: hsl(0 0% 2%);
+}
+
+.dark tr {
+  border-color: hsl(0 0% 14%);
+}
+
+/* ─── Code blocks ─────────────────────────────────────────────────── */
+
+.fd-code-block,
+.fd-code-block pre {
+  border-radius: 0.2rem !important;
+}
+
+.fd-code-block button {
+  border-radius: 0.1rem !important;
+}
+
+/* ─── Inline code ─────────────────────────────────────────────────── */
+
+code:not(pre code) {
+  border-radius: 0.1rem !important;
+}
+
+.dark code:not(pre code) {
+  background: hsl(0 0% 10%);
+  border: 1px solid hsl(0 0% 16%);
+  color: hsl(0 0% 85%);
+}
+
+/* ─── Callouts ────────────────────────────────────────────────────── */
+
+.dark .fd-card,
+.dark .fd-callout {
+  border-color: hsl(0 0% 14%);
+}
+
+/* ─── Selection ───────────────────────────────────────────────────── */
+
+::selection {
+  background: var(--color-fd-foreground);
+  color: var(--color-fd-background);
+}
+
+/* ─── Sidebar (dark) ──────────────────────────────────────────────── */
+
+.dark .fd-sidebar {
+  background: hsl(0 0% 0%);
+  border-color: hsl(0 0% 12%);
+}
+
+.dark .fd-sidebar a[data-active="true"] {
+  background: hsl(0 0% 14%) !important;
+  color: hsl(0 0% 96%) !important;
+}
+
+.dark .fd-sidebar a:hover {
+  background: hsl(0 0% 10%);
+  color: hsl(0 0% 90%);
+}
+
+/* ─── TOC ─────────────────────────────────────────────────────────── */
+
+.dark .fd-toc {
+  border-color: hsl(0 0% 12%);
+}
+
+/* ─── Separator ───────────────────────────────────────────────────── */
+
+.dark hr {
+  border-color: hsl(0 0% 14%);
+}
+
+/* ─── Nav cards (prev/next) ───────────────────────────────────────── */
+
+.dark .fd-nav-card {
+  border-color: hsl(0 0% 14%);
+}
+
+.dark .fd-nav-card:hover {
+  background: hsl(0 0% 8%);
+  border-color: hsl(0 0% 20%);
+}
+
+/* ─── Search dialog ───────────────────────────────────────────────── */
+
+.fd-search-dialog {
+  border-radius: 0.2rem !important;
+}
+
+/* ─── AI Chat (sharp edges) ───────────────────────────────────────── */
+
+.fd-ai-dialog,
+.fd-ai-bubble-user,
+.fd-ai-bubble-ai,
+.fd-ai-input-wrap,
+.fd-ai-send-btn,
+.fd-ai-close-btn,
+.fd-ai-floating-btn,
+.fd-ai-suggestion,
+.fd-ai-result,
+.fd-ai-esc,
+.fd-ai-clear-btn,
+.fd-ai-fm-input-container,
+.fd-ai-fm-send-btn,
+.fd-ai-fm-close-btn,
+.fd-ai-fm-suggestion,
+.fd-ai-fm-trigger-btn,
+.fd-ai-code-block,
+.fd-ai-code-copy {
+  border-radius: 2px !important;
+}
+
+.fd-ai-floating-btn:hover {
+  box-shadow: 0 0 0 1px var(--color-fd-ring);
+  transform: none;
+}
+
+.fd-ai-fm-trigger-btn:hover {
+  transform: none;
+}