commit 5722b6c7b01333b59e52eea09d5ea1b4f38a3529 Author: russell@unturf.com Date: Fri Apr 3 10:54:10 2026 -0400 init chaos theory theme for foxhop.net Dark void background with dot-grid overlay, electric teal accent, Space Mono typography. Remarkbox entry point: chaostheory. diff --git a/MANIFEST.in b/MANIFEST.in new file mode 100644 index 0000000..9655d6a --- /dev/null +++ b/MANIFEST.in @@ -0,0 +1,2 @@ +recursive-include remarkbox_chaostheory/templates * +recursive-include remarkbox_chaostheory/static * diff --git a/readme.rst b/readme.rst new file mode 100644 index 0000000..5410df5 --- /dev/null +++ b/readme.rst @@ -0,0 +1,39 @@ +Remarkbox Chaos Theory Theme +============================= + +foxhop.net theme for Remarkbox. + +**Sensitive dependence on initial conditions.** + +Design +------ + +- Background: ``#06060e`` — void black with a dot-grid overlay (ordered structure from simple rules) +- Accent: ``#00e5cc`` — electric teal +- Font: Space Mono (Google Fonts) — monospace precision +- Container: dark panel with electric teal top border +- Minimal nav, right-aligned, monospace + +Install +------- + +.. code-block:: bash + + cd remarkbox-theme-chaostheory + pip install -e . + +Configure in your Remarkbox ``production.ini``:: + + app.theme = chaostheory + +Files +----- + +.. code-block:: text + + remarkbox_chaostheory/ + ├── templates/ + │ └── chaostheory-base.j2 + └── static/theme/chaostheory/ + └── css/ + └── theme.css diff --git a/remarkbox_chaostheory/__init__.py b/remarkbox_chaostheory/__init__.py new file mode 100644 index 0000000..e69de29 diff --git a/remarkbox_chaostheory/static/theme/chaostheory/css/theme.css b/remarkbox_chaostheory/static/theme/chaostheory/css/theme.css new file mode 100644 index 0000000..bad761b --- /dev/null +++ b/remarkbox_chaostheory/static/theme/chaostheory/css/theme.css @@ -0,0 +1,293 @@ +/* ============================================================ + foxhop.net — chaos theory theme + sensitive dependence on initial conditions + ============================================================ */ + +:root { + --bg: #06060e; + --bg-container: rgba(9, 9, 22, 0.98); + --bg-input: #0f0f22; + --text: #c4c4d0; + --text-muted: #52526a; + --accent: #00e5cc; + --accent-warm: #ff6b35; + --border: #1a1a30; + --border-top: #00e5cc; +} + +* { + box-sizing: border-box; +} + +body { + color: var(--text); + background-color: var(--bg); + /* dot grid — ordered system from simple rules */ + background-image: radial-gradient( + circle, + rgba(0, 229, 204, 0.07) 1px, + transparent 1px + ); + background-size: 28px 28px; + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif; + font-size: 1em; + line-height: 1.65; + margin-top: 40px; + margin-bottom: 60px; +} + +h1, h2, h3, h4, h5, h6 { + font-family: 'Space Mono', 'Courier New', monospace; + color: #e8e8f0; +} + +a, a:visited { + color: var(--accent); + text-decoration: none; + opacity: 0.85; + transition: opacity 0.15s, color 0.15s; +} + +a:hover { + opacity: 1.0; + color: #ffffff; +} + +/* ---- brand ---- */ + +h1.brand { + font-family: 'Space Mono', 'Courier New', monospace; + font-size: 2.2em; + font-weight: 700; + letter-spacing: 2px; + margin-left: 32px; + margin-bottom: 0; + color: #e8e8f0; +} + +h1.brand a { + color: #e8e8f0; + opacity: 1.0; + text-decoration: none; +} + +h1.brand a:hover { + color: #ffffff; + opacity: 1.0; +} + +.brand-dot { + color: var(--accent); +} + +.tagline { + font-family: 'Space Mono', 'Courier New', monospace; + font-size: 0.7em; + color: var(--text-muted); + letter-spacing: 1px; + margin-left: 36px; + margin-top: 4px; + margin-bottom: 18px; +} + +/* ---- search ---- */ + +.searchbox { + float: right; + margin-right: 32px; + margin-bottom: 20px; + width: 240px; +} + +/* ---- nav menu ---- */ + +#remarkbox-menu { + text-align: right; + margin-right: 32px; + margin-bottom: 24px; + font-family: 'Space Mono', 'Courier New', monospace; + font-size: 0.82em; + color: var(--text-muted); +} + +#remarkbox-menu a { + color: var(--text-muted); + opacity: 1.0; + text-decoration: none; +} + +#remarkbox-menu a:hover { + color: var(--accent); +} + +/* ---- main content container ---- */ + +.main { + width: 68%; + margin: auto; + background: var(--bg-container); + border: 1px solid var(--border); + border-top: 2px solid var(--border-top); + border-radius: 2px; + padding: 28px 32px; +} + +/* ---- content elements ---- */ + +.title { + font-size: 1.35em; + font-family: 'Space Mono', 'Courier New', monospace; +} + +.author-and-date { + color: var(--text-muted); + font-size: 0.85em; +} + +.action { + color: var(--text-muted); + font-size: 0.85em; +} + +/* ---- thread summaries ---- */ + +ul.summary { + list-style: none; + padding-left: 0; + margin: 0; +} + +li.summary { + border-bottom: 1px solid var(--border); + padding: 14px 0; +} + +li.summary:last-child { + border-bottom: none; +} + +/* ---- forms and inputs ---- */ + +input, +textarea, +.common-textarea, +#thread_title_input, +#email_input, +#email_input2 { + background-color: var(--bg-input); + color: var(--text); + border: 1px solid var(--border); + border-radius: 2px; + font-family: inherit; + transition: border-color 0.15s; +} + +input:focus, +textarea:focus, +.common-textarea:focus { + border-color: var(--accent); + outline: none; +} + +.preview { + border: 1px solid var(--border); + background-color: var(--bg-input); +} + +/* ---- buttons ---- */ + +.btn, button, input[type="submit"] { + font-family: 'Space Mono', 'Courier New', monospace; + font-size: 0.82em; + border-radius: 2px; + cursor: pointer; + transition: background-color 0.15s, color 0.15s, border-color 0.15s; +} + +/* ---- alerts ---- */ + +#alerts { + width: 36%; + margin: auto; + right: 50%; + margin-right: -18%; + position: fixed; + z-index: 100; +} + +.close { + margin-left: 10px; + float: left; +} + +.alert { + text-align: center; + color: #ffffff; + font-weight: bold; + border-radius: 2px; + margin-bottom: 6px; + padding: 8px 12px; + font-family: 'Space Mono', 'Courier New', monospace; + font-size: 0.82em; +} + +.alert-warning, +.alert-error { + background-color: #3a1510; + border: 1px solid var(--accent-warm); + color: var(--accent-warm); +} + +.alert-success, +.alert-notice { + background-color: #081a16; + border: 1px solid var(--accent); + color: var(--accent); +} + +/* ---- footer ---- */ + +#remarkbox-footer { + width: 68%; + margin: 20px auto 0; + text-align: center; + font-size: 0.78em; + color: var(--text-muted); +} + +.poweredby { + opacity: 0.35; +} + +/* ---- mobile ---- */ + +@media screen and (min-width: 0px) and (max-width: 800px) { + .mobile-hide { display: none; } + .main { width: 96%; padding: 16px 14px; } + #remarkbox-footer { width: 96%; } + .searchbox { width: 180px; margin-right: 14px; } + h1.brand { margin-left: 14px; font-size: 1.7em; } + .tagline { margin-left: 16px; } + #remarkbox-menu { margin-right: 14px; } +} + +/* ---- burger phone menu ---- */ + +.burger-label { + background-color: var(--accent); + opacity: 0.75; + transition: opacity 0.2s; +} + +.burger-label:hover { + opacity: 1.0; +} + +.burger-label span { + background-color: var(--bg); +} + +.burger-checkbox ~ .phone-menu { + background-color: var(--bg); + border-top: 2px solid var(--accent); +} diff --git a/remarkbox_chaostheory/templates/chaostheory-base.j2 b/remarkbox_chaostheory/templates/chaostheory-base.j2 new file mode 100644 index 0000000..2839641 --- /dev/null +++ b/remarkbox_chaostheory/templates/chaostheory-base.j2 @@ -0,0 +1,57 @@ +{%- import 'snippets/snippets.j2' as snippets with context -%} + + + + {% block title %}{{ request.domain }}{% endblock %} + + + + + {% include 'snippets/stylesheet-includes.j2' %} + + + + {% include 'snippets/javascript-includes.j2' %} + + + + + + +{% include 'snippets/flash-alerts.j2' %} + +
+ {% include 'snippets/search.j2' %} +
+ +

foxhop.

+

sensitive dependence on initial conditions

+ +
+{%- block menu %} + home | + new thread | + {%- if request.user %} + {{ snippets.user_link(request.user) }} [log out] + {%- else %} + join or log in + {%- endif %} +{%- endblock %} +
+ +
+{% block content %} +{% endblock %} +
+ +{% include 'snippets/phone-menu.j2' %} + + + + + diff --git a/setup.py b/setup.py new file mode 100644 index 0000000..c58795d --- /dev/null +++ b/setup.py @@ -0,0 +1,31 @@ +# A Remarkbox theme is a python package with the following paths: +# +# templates/-base.j2 +# static/theme// +# +# Register to 'remarkbox.themes' entry_point group to load in Remarkbox. + +from setuptools import setup, find_packages + +setup( + name='remarkbox_chaostheory', + version='0.1.0', + description='remarkbox chaos theory theme — foxhop.net', + classifiers=[ + "Programming Language :: Python", + "Framework :: Pyramid", + "Topic :: Internet :: WWW/HTTP", + "Topic :: Internet :: WWW/HTTP :: WSGI :: Application", + ], + author='fox', + url='https://foxhop.net', + keywords='remarkbox chaostheory theme foxhop', + packages=find_packages(), + include_package_data=True, + zip_safe=False, + entry_points={ + 'remarkbox.themes': [ + 'chaostheory = remarkbox_chaostheory', + ], + }, +)