From 8bc7883df1e3b3d48bc74864309f16c613539969 Mon Sep 17 00:00:00 2001 From: Glitch Date: Sat, 20 Sep 2025 17:34:45 +0000 Subject: [PATCH 1/2] feat(theme): introduce Cathedral token scaffolding (:root vars), replace a few hard-coded colors with variables, and keep SCSS colors concrete to pass build --- _sass/_base.scss | 29 ++++++++---------- _sass/_buttons.scss | 4 +-- _sass/_navigation.scss | 4 +-- _sass/_variables.scss | 18 +++++------ assets/css/main.scss | 22 +++++++++++++ .../Eye of the Cosmos.png | Bin 6 files changed, 47 insertions(+), 30 deletions(-) rename Eye of the Cosmos.png => images/Eye of the Cosmos.png (100%) diff --git a/_sass/_base.scss b/_sass/_base.scss index eec1e92..6c74fa7 100644 --- a/_sass/_base.scss +++ b/_sass/_base.scss @@ -13,8 +13,8 @@ p>code, a>code, li>code, figcaption>code, td>code { padding-top: 0.1rem; padding-bottom: 0.1rem; - background: #f2f3f3; - border: 1px solid #b2b2b2; + background: $code-background-color; + border: 1px solid $border-color; border-radius: 2px; font-size: 0.8em; } @@ -33,18 +33,16 @@ div.highlighter-rouge .highlight, figure.highlight .highlight { font-size: .8em; } -table td { - border-bottom: solid 2px #e6e6e6; -} +table td { border-bottom: solid 2px mix(#fff, $border-color, 60%); } .button-dark { display: inline-block; padding: 12px 24px; border-radius: 6px; - border: 2px solid #a33025; + border: 2px solid hsl(var(--destructive)); font-weight: bold; - background: #F2F3F3; - color: #a33025; + background: hsl(var(--muted)); + color: hsl(var(--destructive)); } @mixin clearfix { @@ -166,11 +164,11 @@ blockquote:before { position: absolute; left: -0.2em; top: -0.2em; - color: #7a7a7a; + color: mix(#fff, $text-color, 50%); } blockquote cite { - color: #999999; + color: mix(#fff, $text-color, 60%); font-size: 0.9em; display: block; margin-top: 5px; @@ -210,9 +208,9 @@ tt, code, kbd, samp, pre { pre { overflow-x: auto; - border-left: solid 0 #52d841; - color: #4fff38; - background: #404040; + border-left: solid 0 $border-color; + color: $text-color; + background: $code-background-color; line-height: 1.4; font-size: .8em; margin: 0 0 1.7em; @@ -333,10 +331,7 @@ figcaption { -webkit-transition: $global-transition; transition: $global-transition; - &:hover { - color: #000; - border-bottom-color: #000; - } + &:hover { color: $link-color-hover; border-bottom-color: $link-color-hover; } } } diff --git a/_sass/_buttons.scss b/_sass/_buttons.scss index 9d9ce21..cab65be 100644 --- a/_sass/_buttons.scss +++ b/_sass/_buttons.scss @@ -11,7 +11,7 @@ display: inline-block; margin-bottom: 0.25em; padding: 0.5em 1em; - color: #fff !important; + color: hsl(var(--primary-foreground)) !important; font-family: $caption-font-family; text-align: center; text-decoration: none; @@ -46,7 +46,7 @@ /* light outline */ &--light-outline { - border: 1px solid #fff !important; /* override*/ + border: 1px solid hsl(var(--primary-foreground)) !important; /* override*/ background-color: transparent; } diff --git a/_sass/_navigation.scss b/_sass/_navigation.scss index a830904..0cd110f 100644 --- a/_sass/_navigation.scss +++ b/_sass/_navigation.scss @@ -89,12 +89,12 @@ } &.current { - color: #fff; + color: hsl(var(--primary-foreground)); background: $theme-color; } &.disabled { - color: mix(#fff, $gray, 75%); + color: hsl(var(--muted-foreground)); pointer-events: none; cursor: not-allowed; } diff --git a/_sass/_variables.scss b/_sass/_variables.scss index 0ffb26a..33fabd7 100644 --- a/_sass/_variables.scss +++ b/_sass/_variables.scss @@ -28,17 +28,17 @@ $type-size-8 : 0.625em !default; // ~10px /* Colors ========================================================================== */ -$brand-color : #22d3ee !default; // Recursion Lab accent +$brand-color : #22d3ee !default; // Recursion Lab accent (Cathedral primary placeholder) $green : mix(#000, #c0392b, 15%); $theme-color : $brand-color !default; -$gray : #7a8288 !default; - -$body-color : #fff !default; -$background-color : #fff !default; -$code-background-color : mix(#fff, $gray, 90%) !default; -$blockquote-background-color: mix(#fff, $gray, 90%) !default; -$text-color : #404040 !default; -$border-color : #b2b2b2 !default; +$gray : #7a8288 !default; // Cathedral secondary placeholder + +$body-color : #404040 !default; // foreground +$background-color : #fff !default; // background +$code-background-color : mix(#fff, $gray, 90%) !default; // muted +$blockquote-background-color: mix(#fff, $gray, 90%) !default; // muted +$text-color : #404040 !default; // foreground +$border-color : #b2b2b2 !default; // border /* links */ diff --git a/assets/css/main.scss b/assets/css/main.scss index c52118e..b83b418 100644 --- a/assets/css/main.scss +++ b/assets/css/main.scss @@ -8,6 +8,28 @@ sitemap: ========================================================================== */ @import "variables"; +/* Central color tokens via CSS custom properties (placeholders to be replaced with Cathedral) */ +:root { + --background: 0 0% 100%; + --foreground: 0 0% 13%; + --card: 0 0% 100%; + --card-foreground: 0 0% 13%; + --popover: 0 0% 100%; + --popover-foreground: 0 0% 13%; + --primary: 188 78% 54%; /* matches current $brand-color #22d3ee */ + --primary-foreground: 0 0% 100%; + --secondary: 220 9% 46%; /* from $gray */ + --secondary-foreground: 0 0% 100%; + --muted: 210 16% 93%; + --muted-foreground: 220 9% 46%; + --accent: 188 78% 54%; + --accent-foreground: 0 0% 100%; + --destructive: 3 63% 47%; /* approx #c0392b base */ + --destructive-foreground: 0 0% 100%; + --border: 0 0% 70%; /* ~$border-color */ + --input: 0 0% 70%; + --ring: 188 78% 54%; +} /* Vendor diff --git a/Eye of the Cosmos.png b/images/Eye of the Cosmos.png similarity index 100% rename from Eye of the Cosmos.png rename to images/Eye of the Cosmos.png From 9ee897d968fc86e81a0c38c4bb7f1bd18a6f9d19 Mon Sep 17 00:00:00 2001 From: Glitch Date: Sat, 20 Sep 2025 17:45:44 +0000 Subject: [PATCH 2/2] style(theme): harmonize syntax highlight with Cathedral tokens; token-based base overrides; fix YAML; prep for PR --- _sass/_base.scss | 10 +-- _sass/_reset.scss | 8 +- _sass/_syntax.scss | 159 +++++++++++++++++++-------------------- _sass/_variables.scss | 5 +- assets/css/main.scss | 168 +++++++++++++++++++++++++++++++++++++----- index.md | 2 +- 6 files changed, 238 insertions(+), 114 deletions(-) diff --git a/_sass/_base.scss b/_sass/_base.scss index 6c74fa7..d65f6db 100644 --- a/_sass/_base.scss +++ b/_sass/_base.scss @@ -4,9 +4,9 @@ %tab-focus { /* Default*/ - outline: thin dotted #f89406; + outline: thin dotted $theme-color; /* Webkit*/ - outline: 5px auto #f89406; + outline: 5px auto $theme-color; outline-offset: -2px; } @@ -24,9 +24,9 @@ div.highlighter-rouge .highlight, figure.highlight .highlight { } /* #mastheadbackground { - height: 155px; - margin-bottom: -175px; - background-color: #F2F3F3; + height: 155px; + margin-bottom: -175px; + background-color: $code-background-color; }*/ .highligher-rouge { diff --git a/_sass/_reset.scss b/_sass/_reset.scss index 3aa8521..6330817 100644 --- a/_sass/_reset.scss +++ b/_sass/_reset.scss @@ -33,13 +33,13 @@ body { margin: 0; } /* Selected elements */ ::-moz-selection { - color: #fff; - background: #000; + color: $background-color; + background: $text-color; } ::selection { - color: #fff; - background: #000; + color: $background-color; + background: $text-color; } /* Display HTML5 elements in IE6-9 and FF3 */ diff --git a/_sass/_syntax.scss b/_sass/_syntax.scss index 1710dd3..ed6fa5c 100644 --- a/_sass/_syntax.scss +++ b/_sass/_syntax.scss @@ -41,86 +41,81 @@ figure.highlight { .highlight pre { width: 100%; } /* - Solarized Light - http://ethanschoonover.com/solarized + Cathedral syntax color mapping (on tokenized dark base) + - General text: foreground + - Comments: muted-foreground + - Keywords/Declarations/Tags/Functions/Variables: primary (gold) + - Operators: accent (purple) + - Numbers/Strings: accent (purple) + - Errors/Regex: destructive (red) + - Constants/Headings: primary (gold) + ========================================================================== */ - SOLARIZED HEX ROLE - --------- -------- ------------------------------------------ - base01 #586e75 body text / default code / primary content - base1 #93a1a1 comments / secondary content - base3 #fdf6e3 background - orange #cb4b16 constants - red #dc322f regex, special keywords - blue #22b3eb reserved keywords - cyan #2aa198 strings, numbers - green #859900 operators, other keywords - ========================================================================== */ - -.highlight .c { color: #93a1a1 } /* Comment */ -.highlight .err { color: #586e75 } /* Error */ -.highlight .g { color: #586e75 } /* Generic */ -.highlight .k { color: #859900 } /* Keyword */ -.highlight .l { color: #586e75 } /* Literal */ -.highlight .n { color: #586e75 } /* Name */ -.highlight .o { color: #859900 } /* Operator */ -.highlight .x { color: #cb4b16 } /* Other */ -.highlight .p { color: #586e75 } /* Punctuation */ -.highlight .cm { color: #93a1a1 } /* Comment.Multiline */ -.highlight .cp { color: #859900 } /* Comment.Preproc */ -.highlight .c1 { color: #93a1a1 } /* Comment.Single */ -.highlight .cs { color: #859900 } /* Comment.Special */ -.highlight .gd { color: #2aa198 } /* Generic.Deleted */ -.highlight .ge { color: #586e75; font-style: italic } /* Generic.Emph */ -.highlight .gr { color: #dc322f } /* Generic.Error */ -.highlight .gh { color: #cb4b16 } /* Generic.Heading */ -.highlight .gi { color: #859900 } /* Generic.Inserted */ -.highlight .go { color: #586e75 } /* Generic.Output */ -.highlight .gp { color: #586e75 } /* Generic.Prompt */ -.highlight .gs { color: #586e75; font-weight: bold } /* Generic.Strong */ -.highlight .gu { color: #cb4b16 } /* Generic.Subheading */ -.highlight .gt { color: #586e75 } /* Generic.Traceback */ -.highlight .kc { color: #cb4b16 } /* Keyword.Constant */ -.highlight .kd { color: #22b3eb } /* Keyword.Declaration */ -.highlight .kn { color: #859900 } /* Keyword.Namespace */ -.highlight .kp { color: #859900 } /* Keyword.Pseudo */ -.highlight .kr { color: #22b3eb } /* Keyword.Reserved */ -.highlight .kt { color: #dc322f } /* Keyword.Type */ -.highlight .ld { color: #586e75 } /* Literal.Date */ -.highlight .m { color: #2aa198 } /* Literal.Number */ -.highlight .s { color: #2aa198 } /* Literal.String */ -.highlight .na { color: #586e75 } /* Name.Attribute */ -.highlight .nb { color: #B58900 } /* Name.Builtin */ -.highlight .nc { color: #22b3eb } /* Name.Class */ -.highlight .no { color: #cb4b16 } /* Name.Constant */ -.highlight .nd { color: #22b3eb } /* Name.Decorator */ -.highlight .ni { color: #cb4b16 } /* Name.Entity */ -.highlight .ne { color: #cb4b16 } /* Name.Exception */ -.highlight .nf { color: #22b3eb } /* Name.Function */ -.highlight .nl { color: #586e75 } /* Name.Label */ -.highlight .nn { color: #586e75 } /* Name.Namespace */ -.highlight .nx { color: #586e75 } /* Name.Other */ -.highlight .py { color: #586e75 } /* Name.Property */ -.highlight .nt { color: #22b3eb } /* Name.Tag */ -.highlight .nv { color: #22b3eb } /* Name.Variable */ -.highlight .ow { color: #859900 } /* Operator.Word */ -.highlight .w { color: #586e75 } /* Text.Whitespace */ -.highlight .mf { color: #2aa198 } /* Literal.Number.Float */ -.highlight .mh { color: #2aa198 } /* Literal.Number.Hex */ -.highlight .mi { color: #2aa198 } /* Literal.Number.Integer */ -.highlight .mo { color: #2aa198 } /* Literal.Number.Oct */ -.highlight .sb { color: #93a1a1 } /* Literal.String.Backtick */ -.highlight .sc { color: #2aa198 } /* Literal.String.Char */ -.highlight .sd { color: #586e75 } /* Literal.String.Doc */ -.highlight .s2 { color: #2aa198 } /* Literal.String.Double */ -.highlight .se { color: #cb4b16 } /* Literal.String.Escape */ -.highlight .sh { color: #586e75 } /* Literal.String.Heredoc */ -.highlight .si { color: #2aa198 } /* Literal.String.Interpol */ -.highlight .sx { color: #2aa198 } /* Literal.String.Other */ -.highlight .sr { color: #dc322f } /* Literal.String.Regex */ -.highlight .s1 { color: #2aa198 } /* Literal.String.Single */ -.highlight .ss { color: #2aa198 } /* Literal.String.Symbol */ -.highlight .bp { color: #22b3eb } /* Name.Builtin.Pseudo */ -.highlight .vc { color: #22b3eb } /* Name.Variable.Class */ -.highlight .vg { color: #22b3eb } /* Name.Variable.Global */ -.highlight .vi { color: #22b3eb } /* Name.Variable.Instance */ -.highlight .il { color: #2aa198 } /* Literal.Number.Integer.Long */ \ No newline at end of file +.highlight .c { color: hsl(var(--muted-foreground)) } /* Comment */ +.highlight .err { color: hsl(var(--destructive)) } /* Error */ +.highlight .g { color: hsl(var(--foreground)) } /* Generic */ +.highlight .k { color: hsl(var(--primary)) } /* Keyword */ +.highlight .l { color: hsl(var(--foreground)) } /* Literal */ +.highlight .n { color: hsl(var(--foreground)) } /* Name */ +.highlight .o { color: hsl(var(--accent)) } /* Operator */ +.highlight .x { color: hsl(var(--primary)) } /* Other */ +.highlight .p { color: hsl(var(--foreground)) } /* Punctuation */ +.highlight .cm { color: hsl(var(--muted-foreground)) } /* Comment.Multiline */ +.highlight .cp { color: hsl(var(--accent)) } /* Comment.Preproc */ +.highlight .c1 { color: hsl(var(--muted-foreground)) } /* Comment.Single */ +.highlight .cs { color: hsl(var(--accent)) } /* Comment.Special */ +.highlight .gd { color: hsl(var(--accent)) } /* Generic.Deleted */ +.highlight .ge { color: hsl(var(--foreground)); font-style: italic } /* Generic.Emph */ +.highlight .gr { color: hsl(var(--destructive)) } /* Generic.Error */ +.highlight .gh { color: hsl(var(--primary)) } /* Generic.Heading */ +.highlight .gi { color: hsl(var(--primary)) } /* Generic.Inserted */ +.highlight .go { color: hsl(var(--foreground)) } /* Generic.Output */ +.highlight .gp { color: hsl(var(--foreground)) } /* Generic.Prompt */ +.highlight .gs { color: hsl(var(--foreground)); font-weight: bold } /* Generic.Strong */ +.highlight .gu { color: hsl(var(--primary)) } /* Generic.Subheading */ +.highlight .gt { color: hsl(var(--foreground)) } /* Generic.Traceback */ +.highlight .kc { color: hsl(var(--primary)) } /* Keyword.Constant */ +.highlight .kd { color: hsl(var(--primary)) } /* Keyword.Declaration */ +.highlight .kn { color: hsl(var(--accent)) } /* Keyword.Namespace */ +.highlight .kp { color: hsl(var(--accent)) } /* Keyword.Pseudo */ +.highlight .kr { color: hsl(var(--primary)) } /* Keyword.Reserved */ +.highlight .kt { color: hsl(var(--destructive)) } /* Keyword.Type */ +.highlight .ld { color: hsl(var(--foreground)) } /* Literal.Date */ +.highlight .m { color: hsl(var(--accent)) } /* Literal.Number */ +.highlight .s { color: hsl(var(--accent)) } /* Literal.String */ +.highlight .na { color: hsl(var(--foreground)) } /* Name.Attribute */ +.highlight .nb { color: hsl(var(--primary)) } /* Name.Builtin */ +.highlight .nc { color: hsl(var(--primary)) } /* Name.Class */ +.highlight .no { color: hsl(var(--primary)) } /* Name.Constant */ +.highlight .nd { color: hsl(var(--primary)) } /* Name.Decorator */ +.highlight .ni { color: hsl(var(--primary)) } /* Name.Entity */ +.highlight .ne { color: hsl(var(--primary)) } /* Name.Exception */ +.highlight .nf { color: hsl(var(--primary)) } /* Name.Function */ +.highlight .nl { color: hsl(var(--foreground)) } /* Name.Label */ +.highlight .nn { color: hsl(var(--foreground)) } /* Name.Namespace */ +.highlight .nx { color: hsl(var(--foreground)) } /* Name.Other */ +.highlight .py { color: hsl(var(--foreground)) } /* Name.Property */ +.highlight .nt { color: hsl(var(--primary)) } /* Name.Tag */ +.highlight .nv { color: hsl(var(--primary)) } /* Name.Variable */ +.highlight .ow { color: hsl(var(--accent)) } /* Operator.Word */ +.highlight .w { color: hsl(var(--foreground)) } /* Text.Whitespace */ +.highlight .mf { color: hsl(var(--accent)) } /* Literal.Number.Float */ +.highlight .mh { color: hsl(var(--accent)) } /* Literal.Number.Hex */ +.highlight .mi { color: hsl(var(--accent)) } /* Literal.Number.Integer */ +.highlight .mo { color: hsl(var(--accent)) } /* Literal.Number.Oct */ +.highlight .sb { color: hsl(var(--muted-foreground)) } /* Literal.String.Backtick */ +.highlight .sc { color: hsl(var(--accent)) } /* Literal.String.Char */ +.highlight .sd { color: hsl(var(--foreground)) } /* Literal.String.Doc */ +.highlight .s2 { color: hsl(var(--accent)) } /* Literal.String.Double */ +.highlight .se { color: hsl(var(--destructive)) } /* Literal.String.Escape */ +.highlight .sh { color: hsl(var(--foreground)) } /* Literal.String.Heredoc */ +.highlight .si { color: hsl(var(--accent)) } /* Literal.String.Interpol */ +.highlight .sx { color: hsl(var(--accent)) } /* Literal.String.Other */ +.highlight .sr { color: hsl(var(--destructive)) } /* Literal.String.Regex */ +.highlight .s1 { color: hsl(var(--accent)) } /* Literal.String.Single */ +.highlight .ss { color: hsl(var(--accent)) } /* Literal.String.Symbol */ +.highlight .bp { color: hsl(var(--primary)) } /* Name.Builtin.Pseudo */ +.highlight .vc { color: hsl(var(--primary)) } /* Name.Variable.Class */ +.highlight .vg { color: hsl(var(--primary)) } /* Name.Variable.Global */ +.highlight .vi { color: hsl(var(--primary)) } /* Name.Variable.Instance */ +.highlight .il { color: hsl(var(--accent)) } /* Literal.Number.Integer.Long */ \ No newline at end of file diff --git a/_sass/_variables.scss b/_sass/_variables.scss index 33fabd7..81acfaa 100644 --- a/_sass/_variables.scss +++ b/_sass/_variables.scss @@ -28,10 +28,11 @@ $type-size-8 : 0.625em !default; // ~10px /* Colors ========================================================================== */ -$brand-color : #22d3ee !default; // Recursion Lab accent (Cathedral primary placeholder) +/* Cathedral primary (gold) mapped for legacy SCSS usage */ +$brand-color : hsl(43, 74%, 66%) !default; // Cathedral primary $green : mix(#000, #c0392b, 15%); $theme-color : $brand-color !default; -$gray : #7a8288 !default; // Cathedral secondary placeholder +$gray : #7a8288 !default; // neutral gray (kept light-theme friendly) $body-color : #404040 !default; // foreground $background-color : #fff !default; // background diff --git a/assets/css/main.scss b/assets/css/main.scss index b83b418..9ee4187 100644 --- a/assets/css/main.scss +++ b/assets/css/main.scss @@ -8,27 +8,105 @@ sitemap: ========================================================================== */ @import "variables"; -/* Central color tokens via CSS custom properties (placeholders to be replaced with Cathedral) */ +/* Cathedral design tokens (HSL-based) */ :root { - --background: 0 0% 100%; - --foreground: 0 0% 13%; - --card: 0 0% 100%; - --card-foreground: 0 0% 13%; - --popover: 0 0% 100%; - --popover-foreground: 0 0% 13%; - --primary: 188 78% 54%; /* matches current $brand-color #22d3ee */ - --primary-foreground: 0 0% 100%; - --secondary: 220 9% 46%; /* from $gray */ - --secondary-foreground: 0 0% 100%; - --muted: 210 16% 93%; - --muted-foreground: 220 9% 46%; - --accent: 188 78% 54%; - --accent-foreground: 0 0% 100%; - --destructive: 3 63% 47%; /* approx #c0392b base */ - --destructive-foreground: 0 0% 100%; - --border: 0 0% 70%; /* ~$border-color */ - --input: 0 0% 70%; - --ring: 188 78% 54%; + /* Core palette */ + --background: 240 8% 6%; + --foreground: 35 15% 85%; + + --card: 240 12% 8%; + --card-foreground: 35 15% 85%; + + --popover: 240 15% 10%; + --popover-foreground: 35 15% 85%; + + /* Sacred geometry gold accent */ + --primary: 43 74% 66%; + --primary-foreground: 240 15% 8%; + + /* Deep stone secondary */ + --secondary: 240 20% 15%; + --secondary-foreground: 35 15% 85%; + + /* Muted cathedral stone */ + --muted: 240 15% 12%; + --muted-foreground: 35 8% 60%; + + /* Illuminated manuscript accent */ + --accent: 260 60% 50%; + --accent-foreground: 35 15% 85%; + + --destructive: 0 72% 51%; + --destructive-foreground: 35 15% 85%; + + --border: 240 20% 18%; + --input: 240 20% 15%; + --ring: 43 74% 66%; + + /* Sacred geometry gradients */ + --gradient-cathedral: linear-gradient(135deg, hsl(240 15% 8%), hsl(240 20% 12%)); + --gradient-sacred: linear-gradient(45deg, hsl(43 74% 66%), hsl(260 60% 50%)); + --gradient-knowledge: linear-gradient(180deg, hsl(240 12% 8%), hsl(240 8% 6%)); + + /* Mystical shadows */ + --shadow-cathedral: 0 10px 40px -10px hsl(240 15% 4% / 0.8); + --shadow-sacred: 0 0 30px hsl(43 74% 66% / 0.3); + --shadow-deep: 0 20px 60px -20px hsl(240 15% 2% / 0.9); + + /* Geometric animation */ + --transition-sacred: all 0.4s cubic-bezier(0.16, 1, 0.3, 1); + + --radius: 0.5rem; + + /* Sidebar tokens (for future components) */ + --sidebar-background: 0 0% 98%; + --sidebar-foreground: 240 5.3% 26.1%; + --sidebar-primary: 240 5.9% 10%; + --sidebar-primary-foreground: 0 0% 98%; + --sidebar-accent: 240 4.8% 95.9%; + --sidebar-accent-foreground: 240 5.9% 10%; + --sidebar-border: 220 13% 91%; + --sidebar-ring: 217.2 91.2% 59.8%; +} + +/* Dark mode overrides (activated when .dark is on or ) */ +.dark { + --background: 222.2 84% 4.9%; + --foreground: 210 40% 98%; + + --card: 222.2 84% 4.9%; + --card-foreground: 210 40% 98%; + + --popover: 222.2 84% 4.9%; + --popover-foreground: 210 40% 98%; + + --primary: 210 40% 98%; + --primary-foreground: 222.2 47.4% 11.2%; + + --secondary: 217.2 32.6% 17.5%; + --secondary-foreground: 210 40% 98%; + + --muted: 217.2 32.6% 17.5%; + --muted-foreground: 215 20.2% 65.1%; + + --accent: 217.2 32.6% 17.5%; + --accent-foreground: 210 40% 98%; + + --destructive: 0 62.8% 30.6%; + --destructive-foreground: 210 40% 98%; + + --border: 217.2 32.6% 17.5%; + --input: 217.2 32.6% 17.5%; + --ring: 212.7 26.8% 83.9%; + + --sidebar-background: 240 5.9% 10%; + --sidebar-foreground: 240 4.8% 95.9%; + --sidebar-primary: 224.3 76.3% 48%; + --sidebar-primary-foreground: 0 0% 100%; + --sidebar-accent: 240 3.7% 15.9%; + --sidebar-accent-foreground: 240 4.8% 95.9%; + --sidebar-border: 240 3.7% 15.9%; + --sidebar-ring: 217.2 91.2% 59.8%; } /* @@ -72,3 +150,53 @@ $susy: ( overflow-x: auto; overflow-y: hidden; } + +/* Sacred geometry animations and behavior */ +@keyframes fadeIn { + from { opacity: 0; transform: translateY(20px); } + to { opacity: 1; transform: translateY(0); } +} + +@keyframes sacredPulse { + 0%, 100% { opacity: 0.3; transform: scale(1); } + 50% { opacity: 0.8; transform: scale(1.05); } +} + +.animate-fade-in { + animation: fadeIn 1s ease-out; +} + +.animate-sacred-pulse { + animation: sacredPulse 3s ease-in-out infinite; +} + +html { scroll-behavior: smooth; } + +/* Custom scrollbar (WebKit-based browsers) */ +::-webkit-scrollbar { width: 8px; } +::-webkit-scrollbar-track { background: hsl(var(--muted)); } +::-webkit-scrollbar-thumb { background: hsl(var(--primary)); border-radius: 4px; } +::-webkit-scrollbar-thumb:hover { background: hsl(var(--primary) / 0.8); } + +/* Theme overrides to adopt Cathedral palette */ +body { background: hsl(var(--background)); color: hsl(var(--foreground)); } +a { color: hsl(var(--primary)); } +a:hover, a:focus { color: hsl(var(--accent)); } + +pre, +div.highlighter-rouge .highlight, +figure.highlight .highlight { + background: hsl(var(--muted)); + color: hsl(var(--foreground)); + border-color: hsl(var(--border)); +} + +p>code, a>code, li>code, figcaption>code, td>code { + background: hsl(var(--muted)); + border-color: hsl(var(--border)); + color: hsl(var(--foreground)); +} + +blockquote { background: hsl(var(--muted)); border-color: hsl(var(--border)); } +hr { border-top-color: hsl(var(--border)); } +table td { border-bottom-color: hsl(var(--border)); } diff --git a/index.md b/index.md index aa2c319..3560084 100644 --- a/index.md +++ b/index.md @@ -1,7 +1,7 @@ --- layout: home title: Recursion Lab -description: Public notes and working prototypes on recursion, cognition, and systems. We build contradiction-aware recursive engines: Koriel-ASI, Field Anatomy, ℛℐΔ, Meta-ToolOS. +description: "Public notes and working prototypes on recursion, cognition, and systems. We build contradiction-aware recursive engines: Koriel-ASI, Field Anatomy, ℛℐΔ, Meta-ToolOS." permalink: / ---