+
++A quiet invitation into presence. This is a living space for reigniting the spark inside — not a performance, but a shared practice. +
-## [[markdown]] +## How to contribute -## Examples - -### Admonitions - -> Go to [documentation](https://zensical.org/docs/authoring/admonitions/) - -!!! note - -```text -This is a **note** admonition. Use it to provide helpful information. -``` - -!!! warning - -```text -This is a **warning** admonition. Be careful! -``` - -### Details - -> Go to [documentation](https://zensical.org/docs/authoring/admonitions/#collapsible-blocks) - -??? info "Click to expand for more info" - -```text -This content is hidden until you click to expand it. -Great for FAQs or long explanations. -``` - -## Code Blocks - -> Go to [documentation](https://zensical.org/docs/authoring/code-blocks/) - -```python -def greet(name): - print(f"Hello, {name}!") # (1)! - -greet("Python") -``` - -1. Go to [documentation](https://zensical.org/docs/authoring/code-blocks/#code-annotations) - -Code annotations allow to attach notes to lines of code. - -Code can also be highlighted inline: `#!python print("Hello, Python!")`. - -## Content tabs - -> Go to [documentation](https://zensical.org/docs/authoring/content-tabs/) - -=== "Python" - -````text -``` python -print("Hello from Python!") -``` -```` - -=== "Rust" - -````text -``` rs -println!("Hello from Rust!"); -``` -```` - -## Diagrams - -> Go to [documentation](https://zensical.org/docs/authoring/diagrams/) - -``` mermaid -graph LR - A[Start] --> B{Error?}; - B -->|Yes| C[Hmm...]; - C --> D[Debug]; - D --> B; - B ---->|No| E[Yay!]; -``` - -## Footnotes - -> Go to [documentation](https://zensical.org/docs/authoring/footnotes/) - -Here's a sentence with a footnote.[1](#user-content-fn-1) - -Hover it, to see a tooltip. - -## Formatting - -> Go to [documentation](https://zensical.org/docs/authoring/formatting/) - -- ==This was marked (highlight)== -- ^^This was inserted (underline)^^ -- ~~This was deleted (strikethrough)~~ -- H~~2~~O -- A^T^A -- ++ctrl+alt+del++ - -## Icons, Emojis - -> Go to [documentation](https://zensical.org/docs/authoring/icons-emojis/) - -- :sparkles: `:sparkles:` -- :rocket: `:rocket:` -- :tada: `:tada:` -- :memo: `:memo:` -- :eyes: `:eyes:` - -## Maths - -> Go to [documentation](https://zensical.org/docs/authoring/math/) - -$$ -\cos x=\sum_{k=0}^{\infty}\frac{(-1)^k}{(2k)!}x^{2k} -$$ - -!!! warning "Needs configuration"\ -Note that MathJax is included via a `script` tag on this page and is not\ -configured in the generated default configuration to avoid including it\ -in a pages that do not need it. See the documentation for details on how\ -to configure it on all your pages if they are more Maths-heavy than these\ -simple starter pages. - -## Task Lists - -> Go to [documentation](https://zensical.org/docs/authoring/lists/#using-task-lists) - -- [x] Install Zensical -- [x] Configure `zensical.toml` -- [x] Write amazing documentation -- [ ] Deploy anywhere - -## Tooltips - -> Go to [documentation](https://zensical.org/docs/authoring/tooltips/) - -[Hover me](https://example.com) - -## Footnotes - -1. This is the footnote. [↩](#user-content-fnref-1) +- **Add a reflection** — short notes, practices, or questions +- **Plant an idea** — link into new themed pages +- **Tend the tone** — kind, grounded edits keep the garden coherent diff --git a/docs/javascripts/extra.js b/docs/javascripts/extra.js index b1477a1..cb44c1b 100644 --- a/docs/javascripts/extra.js +++ b/docs/javascripts/extra.js @@ -1,161 +1,90 @@ /** - * God Spark — Zensical Theme Kit (JS) - * Zero dependencies. ~1.5 KB minified. - * - * Features - * ─ IntersectionObserver scroll-reveal (class: .godspark-reveal) - * ─ Optional cursor glow (enable via [godspark-glow] attribute) - * ─ Reduced-motion fallback baked in + * Godspark Refined — Zensical Light JS + * - Scroll reveal for `.gp-reveal` + * - Cursor glow via `[gp-glow]` attribute + * - Reduced-motion safe */ - ;(function () { - 'use strict'; + "use strict"; - /* ── Reduced-motion preference (shared) ── */ const prefersReducedMotion = window.matchMedia( - '(prefers-reduced-motion: reduce)' + "(prefers-reduced-motion: reduce)" ).matches; - /* ── 1. Scroll Reveal via IntersectionObserver ── */ - function initScrollReveal () { - if (prefersReducedMotion) return; // already handled in CSS + function initScrollReveal() { + if (prefersReducedMotion) return; - const reveals = document.querySelectorAll('.godspark-reveal'); + const nodes = document.querySelectorAll(".gp-reveal"); + if (!nodes.length) return; - if (!reveals.length) return; + const thresholdRaw = getComputedStyle(document.documentElement) + .getPropertyValue("--gp-reveal-threshold") + .trim(); - // Respect any user-set threshold via CSS variable, default 12% - const threshold = parseFloat( - getComputedStyle(document.documentElement) - .getPropertyValue('--godspark-reveal-threshold') - ) || 0.12; + const threshold = Number.isFinite(parseFloat(thresholdRaw)) + ? parseFloat(thresholdRaw) + : 0.12; const observer = new IntersectionObserver( (entries) => { entries.forEach((entry) => { if (entry.isIntersecting) { - entry.target.classList.add('is-visible'); - observer.unobserve(entry.target); // fire once + entry.target.classList.add("is-visible"); + observer.unobserve(entry.target); } }); }, - { threshold, rootMargin: '0px 0px -40px 0px' } + { threshold, rootMargin: "0px 0px -16px 0px" } ); - reveals.forEach((el) => observer.observe(el)); + nodes.forEach((el) => observer.observe(el)); } - /* ── 2. Cursor Glow ── */ - function initCursorGlow () { - // Only run if [godspark-glow] is present on or - if (!document.documentElement.hasAttribute('godspark-glow') && - !document.body.hasAttribute('godspark-glow')) { - return; + function initCursorGlow() { + const el = document.documentElement; + const enabled = + el.hasAttribute("gp-glow") || el.classList.contains("gp-glow-active"); + + if (!enabled) return; + if (prefersReducedMotion) return; + + el.classList.add("gp-glow-active"); + + let raf = false; + function setGlow(x, y) { + el.style.setProperty("--gp-cursor-x", x + "px"); + el.style.setProperty("--gp-cursor-y", y + "px"); } - if (prefersReducedMotion) return; // CSS already hides it - - // Add a class for the CSS ::after pseudo-element to pick up - document.documentElement.classList.add('godspark-glow-active'); - - const glow = document.querySelector('.godspark-glow-active::after'); - // We track position via a CSS custom property on the root element, - // letting the ::after pseudo consume it. - const styleEl = document.createElement('style'); - styleEl.id = 'godspark-glow-dynamic'; - document.head.appendChild(styleEl); - - let mouseX = -400; - let mouseY = -400; - let rafPending = false; - - function setGlowPosition (x, y) { - mouseX = x; - mouseY = y; - updateGlowStyle(); - } - - function updateGlowStyle () { - styleEl.textContent = ` - :root { - --godspark-cursor-x: ${mouseX}px; - --godspark-cursor-y: ${mouseY}px; - } - `; - } - - // Generate a unique glow element per page to act as the cursor-follower - const cursorEl = document.createElement('div'); - cursorEl.setAttribute('aria-hidden', 'true'); - cursorEl.className = 'godspark-cursor-glow'; - cursorEl.style.cssText = ` - position: fixed; - left: ${mouseX}px; - top: ${mouseY}px; - width: 380px; - height: 380px; - border-radius: 50%; - pointer-events: none; - z-index: 999999; - background: radial-gradient(circle, - rgba(195,174,214,0.22) 0%, - rgba(184,169,232,0.08) 35%, - transparent 70% - ); - transform: translate(-50%, -50%); - touch-action: none; - will-change: left, top; - transition: none; - `; - document.body.appendChild(cursorEl); - - function onPointerMove (e) { - if (rafPending) return; - rafPending = true; + function onMove(e) { + if (raf) return; + raf = true; requestAnimationFrame(() => { - const clientX = e.touches ? e.touches[0].clientX : e.clientX; - const clientY = e.touches ? e.touches[0].clientY : e.clientY; - cursorEl.style.left = clientX + 'px'; - cursorEl.style.top = clientY + 'px'; - rafPending = false; + const cx = e.touches ? e.touches[0].clientX : e.clientX; + const cy = e.touches ? e.touches[0].clientY : e.clientY; + setGlow(cx, cy); + raf = false; }); } - function onPointerLeave () { - cursorEl.style.opacity = '0'; - } + function onHide() { el.style.setProperty("--gp-glow-opacity", "0"); } + function onShow() { el.style.setProperty("--gp-glow-opacity", "1"); } - function onPointerEnter () { - cursorEl.style.opacity = '1'; - } - - document.addEventListener('mousemove', onPointerMove, { passive: true }); - document.addEventListener('touchmove', onPointerMove, { passive: true }); - document.addEventListener('mouseleave', onPointerLeave); - document.addEventListener('mouseenter', onPointerEnter); - - // Hide on idle after 4 s - let idleTimer; - function resetIdle () { - clearTimeout(idleTimer); - cursorEl.style.opacity = '1'; - idleTimer = setTimeout(() => { - cursorEl.style.opacity = '0'; - }, 4000); - } - document.addEventListener('mousemove', resetIdle, { passive: true }); - resetIdle(); + const passive = { passive: true }; + document.addEventListener("mousemove", onMove, passive); + document.addEventListener("touchmove", onMove, passive); + document.addEventListener("mouseleave", onHide); + document.addEventListener("mouseenter", onShow); } - /* ── Boot ── */ - if (document.readyState === 'loading') { - document.addEventListener('DOMContentLoaded', boot); - } else { - boot(); - } - - function boot () { + function boot() { initScrollReveal(); initCursorGlow(); } + + if (document.readyState === "loading") { + document.addEventListener("DOMContentLoaded", boot); + } else { + boot(); + } })(); diff --git a/docs/stylesheets/extra.css b/docs/stylesheets/extra.css index 6ef7921..e0506f4 100644 --- a/docs/stylesheets/extra.css +++ b/docs/stylesheets/extra.css @@ -1,78 +1,92 @@ /* - * God Spark — Zensical Theme Kit - * Nature/consciousness theme: legible, calm, organic + * Godspark Refinement — Zensical Theme + * Nature + futuristic aurora pastel/iridescent upgrade. + * Additive CSS layer. Preserves toolbar readability. */ -/* ─── Design Tokens ─── */ :root { - --godspark-bg: #f6fbf7; /* soft morning mist */ - --godspark-surface: #ffffff; - --godspark-text: #1f2e1d; /* deep forest text */ - --godspark-text-muted: #4f5d4b; - --godspark-primary: #6b8f71; /* sage */ - --godspark-secondary: #a3c4a8; /* leaf mist */ - --godspark-tertiary: #e8d5b7; /* warm sand */ - --godspark-accent: #8da87d; /* moss */ - --godspark-iridescent: linear-gradient(135deg, #e8f0e8, #c8d9c4, #a3c4a8, #d4cfb8, #c2d1c0); - --godspark-aurora: linear-gradient(160deg, - #f4f9f1 0%, #eaf2e4 25%, #f7f4ed 50%, #eef1f0 75%, #f6fbf7 100%); - --godspark-card-bg: rgba(255, 255, 255, 0.78); - --godspark-card-border: rgba(107, 143, 113, 0.22); - --godspark-glow: rgba(141, 168, 125, 0.35); - --godspark-glow-intense: rgba(107, 143, 113, 0.75); - --godspark-duration: 0.7s; - --godspark-ease: cubic-bezier(0.22, 0.61, 0.36, 1); - --godspark-distance: 24px; + /* Refined iris palette */ + --gp-bg: #f6fbf7; + --gp-surface: #ffffff; + --gp-text: #1c2b1c; + --gp-text-muted: #4e5e4b; + --gp-primary: #7aaa8e; /* sage iridescence */ + --gp-secondary: #a8c5b6; + --gp-tertiary: #e9dfc6; + --gp-accent: #b9a5d7; /* soft aurora purple */ + + /* Iridescent atmosphere tokens */ + --gp-iris-1: #f1f6f3; + --gp-iris-2: #eef3f6; + --gp-iris-3: #f6f2f8; + --gp-iris-4: #f5f1ec; + + --gp-aurora-iris: linear-gradient( + 135deg, + var(--gp-iris-1), var(--gp-iris-2), var(--gp-iris-3), var(--gp-iris-4) + ); + + --gp-card-bg: rgba(255, 255, 255, 0.74); + --gp-card-border: rgba(122, 170, 150, 0.22); + --gp-card-shadow: 0 8px 28px rgba(122, 170, 150, 0.10); + --gp-card-hover: 0 18px 40px rgba(122, 170, 150, 0.16); + + --gp-glow: rgba(141, 184, 160, 0.35); + --gp-glow-intense: rgba(160, 130, 210, 0.45); + + --gp-ease: cubic-bezier(0.22, 0.61, 0.36, 1); + --gp-duration: 0.78s; + --gp-distance: 20px; } -/* ─── Base atmosphere ─── */ +/* Base atmosphere */ body { - background-color: var(--godspark-bg); - background-image: var(--godspark-aurora); - background-size: 400% 400%; + background-color: var(--gp-bg); + background-image: + radial-gradient(ellipse at 12% -8%, rgba(210, 230, 240, 0.38), transparent 56%), + radial-gradient(ellipse at 88% 108%, rgba(215, 210, 235, 0.34), transparent 58%), + var(--gp-aurora-iris); background-attachment: fixed; - color: var(--godspark-text); + background-size: 100% 100%, 100% 100%, 200% 200%; + color: var(--gp-text); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; + text-rendering: optimizeLegibility; } -/* Subtle animated aurora — reduced-motion safe */ @media (prefers-reduced-motion: no-preference) { - body { - animation: godspark-breathe 28s ease-in-out infinite; + body.godspark-breathe { + animation: gp-breathe 36s ease-in-out infinite; } - @keyframes godspark-breathe { - 0%, 100% { background-position: 0% 50%; } - 50% { background-position: 100% 50%; } + @keyframes gp-breathe { + 0%, 100% { background-position: 0 0, 0 0, 0% 50%; } + 50% { background-position: 0 0, 0 0, 100% 50%; } } } -/* ─── Typography (solid, legible, no cycling) ─── */ +/* Typography */ h1, h2, h3, h4, h5, h6, -.zensical article h1, -.zensical article h2, -.zensical article h3 { +article h1, article h2, article h3 { font-weight: 650; - letter-spacing: -0.015em; + letter-spacing: -0.012em; line-height: 1.2; - color: var(--godspark-text); + color: var(--gp-text); } a { - color: var(--godspark-primary); + color: var(--gp-primary); text-decoration-thickness: 1px; text-underline-offset: 3px; - transition: color 0.25s var(--godspark-ease), text-decoration-color 0.25s; + transition: color 0.22s var(--gp-ease), text-decoration-color 0.22s; } a:hover { - color: var(--godspark-accent); + color: var(--gp-accent); } -/* ─── Layout helpers ─── */ +/* Layout helpers */ .zensical article, .zensical .content, -main, -article { +main, article { position: relative; z-index: 1; } @@ -85,125 +99,200 @@ section { z-index: 1; } -/* ─── Cards ─── */ +/* Cards */ .zensical .card, -.zensical article section, section.card, div.card, -article.card { - background: var(--godspark-card-bg); - border: 1px solid var(--godspark-card-border); - border-radius: 18px; - backdrop-filter: blur(12px) saturate(130%); - -webkit-backdrop-filter: blur(12px) saturate(130%); +article.card, +article section, +main section { + background: var(--gp-card-bg); + border: 1px solid var(--gp-card-border); + border-radius: 22px; + backdrop-filter: blur(14px) saturate(145%); + -webkit-backdrop-filter: blur(14px) saturate(145%); padding: 1.6rem 1.8rem; - box-shadow: - 0 4px 20px rgba(107, 143, 113, 0.08), - 0 1px 3px rgba(0, 0, 0, 0.03); + box-shadow: var(--gp-card-shadow); transition: - transform var(--godspark-duration) var(--godspark-ease), - box-shadow var(--godspark-duration) var(--godspark-ease), + transform var(--gp-duration) var(--gp-ease), + box-shadow var(--gp-duration) var(--gp-ease), border-color 0.3s ease; } .zensical .card:hover, section.card:hover, div.card:hover, article.card:hover { - transform: translateY(-3px); - box-shadow: - 0 12px 36px rgba(107, 143, 113, 0.14), - 0 2px 6px rgba(0, 0, 0, 0.04); - border-color: rgba(107, 143, 113, 0.45); + transform: translateY(-4px); + border-color: rgba(122, 170, 150, 0.48); + box-shadow: var(--gp-card-hover); } -/* ─── Code blocks — careful not to break Zensical toolbars ─── */ -pre { - background: rgba(255, 255, 255, 0.82); - border: 1px solid var(--godspark-card-border); - border-radius: 14px; - padding: 1.1rem 1.3rem; -} -code, kbd { - background: rgba(107, 143, 113, 0.10); - border: 1px solid rgba(107, 143, 113, 0.18); - border-radius: 7px; - color: var(--godspark-text); -} - -/* ─── Blockquotes ─── */ -blockquote { - border-left: 3px solid var(--godspark-secondary); - background: rgba(141, 168, 125, 0.08); - border-radius: 0 12px 12px 0; - padding: 0.9rem 1.2rem; - margin: 1.4rem 0; - color: var(--godspark-text-muted); - font-style: italic; -} - -/* ─── HR divider ─── */ -hr { - border: none; - height: 1px; - background: linear-gradient(90deg, - transparent, - var(--godspark-primary), - var(--godspark-secondary), - transparent); - margin: 2.4rem 0; -} - -/* ─── Tables ─── */ -table { - border-collapse: separate; - border-spacing: 0; - border-radius: 14px; +/* Homepage hero panels */ +.hero-media, +.godspark-hero { + margin: 1.2rem 0 2rem; + border-radius: 22px; overflow: hidden; - box-shadow: 0 2px 12px rgba(107, 143, 113, 0.07); + border: 1px solid var(--gp-card-border); + background: + linear-gradient(180deg, rgba(255,255,255,0.52), rgba(255,255,255,0.30)), + var(--gp-aurora-iris); + background-blend-mode: overlay; + backdrop-filter: blur(10px) saturate(120%); + -webkit-backdrop-filter: blur(10px) saturate(120%); + box-shadow: var(--gp-card-shadow); } -th { - background: linear-gradient(135deg, var(--godspark-primary), var(--godspark-accent)); - color: #fff; - font-weight: 550; +.hero-media img, +.godspark-hero img { + display: block; + width: 100%; + height: auto; + max-height: 380px; + object-fit: cover; } -td { - background: var(--godspark-surface); - border-bottom: 1px solid rgba(107, 143, 113, 0.12); +.hero-media figcaption, +.godspark-hero figcaption { + padding: 0.8rem 1rem; + color: var(--gp-text-muted); + font-size: 0.92rem; } -/* ─── CTA buttons only (not Zensical toolbar icons) ─── */ +.intro-lead { + font-size: 1.18rem; + line-height: 1.65; + color: var(--gp-text-muted); +} + +/* Front-page lists */ +.index main ul, +.index main ol { + padding-left: 1.2rem; + line-height: 1.75; +} +.index main ul li::marker, +.index main ol li::marker { + color: var(--gp-primary); +} + +/* CTA buttons (additive only) */ button.cta, a.cta, .zensical .cta, button[class*="godspark"], a[class*="godspark"] { - background: linear-gradient(135deg, var(--godspark-primary), var(--godspark-accent)); + background: linear-gradient(120deg, var(--gp-primary), var(--gp-accent)); color: #fff; font-weight: 550; - border: none; - border-radius: 50px; + border: 1px solid rgba(122, 170, 150, 0.24); + border-radius: 999px; padding: 0.55em 1.5em; cursor: pointer; - transition: opacity 0.25s, box-shadow 0.25s; + transition: opacity 0.28s, box-shadow 0.28s, transform 0.28s var(--gp-ease); text-decoration: none; - display: inline-block; + display: inline-flex; + align-items: center; + gap: 0.45em; + position: relative; + overflow: hidden; } button.cta:hover, a.cta:hover, .zensical .cta:hover, button[class*="godspark"]:hover, a[class*="godspark"]:hover { - opacity: 0.92; - box-shadow: 0 4px 18px var(--godspark-glow); + opacity: 0.96; + box-shadow: 0 12px 26px var(--gp-glow); + transform: translateY(-1px); +} +button.cta::after, +a.cta::after, +.zensical .cta::after, +button[class*="godspark"]::after, +a[class*="godspark"]::after { + content: ""; + position: absolute; + inset: 0; + background: + linear-gradient(120deg, transparent, rgba(255,255,255,0.42), transparent); + background-size: 220% 100%; + background-repeat: no-repeat; + background-position: -130% 0; + pointer-events: none; + border-radius: inherit; +} +.zensical .cta:hover::after, +button[class*="godspark"]:hover::after, +a[class*="godspark"]:hover::after { + animation: gp-sheen 7s var(--gp-ease) infinite; +} +@keyframes gp-sheen { + 0% { background-position: -140% 0; } + 55% { background-position: 80% 0; } + 100% { background-position: 80% 0; } } -/* ─── Scroll reveal ─── */ +/* Code (preserve toolbar button readability) */ +pre { + background: rgba(255, 255, 255, 0.82); + border: 1px solid var(--gp-card-border); + border-radius: 14px; + padding: 1.1rem 1.3rem; +} +code, kbd { + background: rgba(122, 170, 150, 0.10); + border: 1px solid rgba(122, 170, 150, 0.18); + border-radius: 7px; + color: var(--gp-text); +} + +/* Blockquotes */ +blockquote { + border-left: 3px solid var(--gp-secondary); + background: rgba(141, 184, 160, 0.08); + border-radius: 0 12px 12px 0; + padding: 0.9rem 1.2rem; + margin: 1.4rem 0; + color: var(--gp-text-muted); + font-style: italic; +} + +/* HR */ +hr { + border: none; + height: 1px; + background: linear-gradient(90deg, + transparent, + var(--gp-primary), + var(--gp-secondary), + transparent); + margin: 2.4rem 0; +} + +/* Tables */ +table { + border-collapse: separate; + border-spacing: 0; + border-radius: 14px; + overflow: hidden; + box-shadow: 0 2px 12px rgba(122, 170, 150, 0.07); +} +th { + background: linear-gradient(135deg, var(--gp-primary), var(--gp-accent)); + color: #fff; + font-weight: 550; +} +td { + background: var(--gp-surface); + border-bottom: 1px solid rgba(122, 170, 150, 0.12); +} + +/* Scroll reveals */ .godspark-reveal { opacity: 0; - transform: translateY(var(--godspark-distance)); + transform: translateY(var(--gp-distance)); transition: - opacity var(--godspark-duration) var(--godspark-ease), - transform var(--godspark-duration) var(--godspark-ease); + opacity var(--gp-duration) var(--gp-ease), + transform var(--gp-duration) var(--gp-ease); } .godspark-reveal.is-visible { opacity: 1; @@ -211,10 +300,10 @@ a[class*="godspark"]:hover { } .godspark-reveal.is-visible > * { opacity: 0; - transform: translateY(var(--godspark-distance)); + transform: translateY(var(--gp-distance)); transition: - opacity var(--godspark-duration) var(--godspark-ease), - transform var(--godspark-duration) var(--godspark-ease); + opacity var(--gp-duration) var(--gp-ease), + transform var(--gp-duration) var(--gp-ease); } .godspark-reveal.is-visible > *:nth-child(1) { transition-delay: 0.00s; } .godspark-reveal.is-visible > *:nth-child(2) { transition-delay: 0.08s; } @@ -227,56 +316,36 @@ a[class*="godspark"]:hover { transform: translateY(0); } -/* ─── Tone: disable cycling header colors ─── */ -.md-header, .md-header__inner, .md-header__button, .md-icon { - animation: none !important; -} - -/* ─── Tone: disable header color cycling backgrounds ─── */ -[data-md-color-component="header"] { - animation: none !important; -} - -/* ─── Tone: no shimmer on headings ─── */ -h1, h2, h3, h4, h5, h6, -.zensical article h1, -.zensical article h2, -.zensical article h3 { - animation: none !important; - background: none !important; - -webkit-text-fill-color: var(--godspark-text) !important; - background-clip: unset !important; - color: var(--godspark-text); -} - -/* ─── Cursor glow (opt-in via attribute) ─── */ -[godspark-glow]::after, -.godspark-glow-active::after { +/* Cursor glow (opt-in attribute) */ +[gp-glow]::after, +.gp-glow-active::after { content: ""; position: fixed; - width: 360px; - height: 360px; + width: 400px; + height: 400px; border-radius: 50%; pointer-events: none; - z-index: 999999; + z-index: 999998; background: radial-gradient( circle, - rgba(141, 168, 125, 0.22) 0%, - rgba(107, 143, 113, 0.08) 35%, - transparent 70% + rgba(141, 184, 160, 0.30) 0%, + rgba(160, 130, 210, 0.16) 32%, + transparent 68% ); transform: translate(-50%, -50%); - transition: opacity 0.4s ease; opacity: 0; - will-change: transform, opacity; + left: -400px; + top: -400px; + transition: opacity 0.45s ease; + will-change: left, top, opacity; } -[godspark-glow]::after, -.godspark-glow-active::after { +[gp-glow]::after, +.gp-glow-active::after { opacity: 1; } @media (prefers-reduced-motion: reduce) { - [godspark-glow]::after, - .godspark-glow-active::after { + [gp-glow]::after, + .gp-glow-active::after { display: none !important; } .godspark-reveal { @@ -291,33 +360,50 @@ h1, h2, h3, h4, h5, h6, } } -/* ─── Selection ─── */ -::selection { - background: var(--godspark-primary); - color: #fff; -} -:focus-visible { - outline: 2px solid var(--godspark-primary); - outline-offset: 3px; - border-radius: 4px; -} - -/* ─── Scrollbar ─── */ +/* Scrollbar */ ::-webkit-scrollbar { width: 10px; } ::-webkit-scrollbar-track { - background: var(--godspark-bg); + background: var(--gp-bg); } ::-webkit-scrollbar-thumb { background: linear-gradient(180deg, - var(--godspark-primary), - var(--godspark-accent), - var(--godspark-secondary)); + var(--gp-primary), + var(--gp-accent), + var(--gp-secondary)); border-radius: 99px; } -/* ─── Print ─── */ +/* Neutralize default Zensical color cycling without breaking toolbar icons */ +.md-header, +.md-header__inner, +.md-header__button, +.md-icon, +[data-md-color-component="header"] { + animation: none !important; +} +h1, h2, h3, h4, h5, h6, +article h1, article h2, article h3 { + animation: none !important; + background: none !important; + -webkit-text-fill-color: var(--gp-text); + background-clip: unset !important; + color: var(--gp-text); +} + +/* Selection/focus */ +::selection { + background: var(--gp-primary); + color: #fff; +} +:focus-visible { + outline: 2px solid var(--gp-primary); + outline-offset: 3px; + border-radius: 4px; +} + +/* Print */ @media print { body { background: #fff !important; @@ -326,32 +412,8 @@ h1, h2, h3, h4, h5, h6, h1, h2, h3, h4, h5, h6 { color: #000 !important; } - .godspark-glow-active::after, - [godspark-glow]::after { display: none !important; } -} - -/* ─── Hero image on homepage ─── */ -.godspark-hero { - margin: 1.2rem 0 2rem; - border-radius: 22px; - overflow: hidden; - border: 1px solid var(--godspark-card-border); - background: - linear-gradient(180deg, rgba(255,255,255,0.55), rgba(255,255,255,0.35)), - var(--godspark-aurora); - background-blend-mode: overlay; - backdrop-filter: blur(10px) saturate(120%); - -webkit-backdrop-filter: blur(10px) saturate(120%); -} -.godspark-hero img { - display: block; - width: 100%; - height: auto; - max-height: 360px; - object-fit: cover; -} -.godspark-hero figcaption { - padding: 0.8rem 1rem; - color: var(--godspark-text-muted); - font-size: 0.92rem; + .gp-glow-active::after, + [gp-glow]::after { + display: none !important; + } } diff --git a/index.md b/index.md index d596d57..8637e61 100644 --- a/index.md +++ b/index.md @@ -5,15 +5,12 @@+A quiet invitation into presence. This is a living space for reigniting the spark inside — not a performance, but a shared practice. +
-This is a living space for reigniting the spark inside. -Multiple voices are welcome. Gentle contributions grow the whole site. +## How to contribute -## What you can do here - -- **Share what calls to you** — add a short note, reflection, or practice -- **Expand the garden** — link ideas into pages that branch and bloom -- **Keep it coherent** — small, kind edits often protect the tone best - -> Awareness is not a performance. It is a presence. +- **Add a reflection** — short notes, practices, or questions +- **Plant an idea** — link into new themed pages +- **Tend the tone** — kind, grounded edits keep the garden coherent