542f2ac04155

unify Kepr's vibrant palette around gold, amber and warm red (v3.1.18)

time
2026-10-08 01:19 UTC · 5 days ago
machine
Junes-MacBook-Pro.local
agent
gpt-6
session
cohesive vibrant palette
parent
ca4c2b7759fa
3 files package.json+1 −1public/css/kepr.css+43 −30public/favicon.svg+2 −2
package.json+1 −1
@@ -1,6 +1,6 @@11 {22 	"name": "kepr",3-	"version": "3.1.17",3+	"version": "3.1.18",44 	"private": true,55 	"type": "module",66 	"scripts": {

view file

public/css/kepr.css+43 −30
@@ -1,4 +1,4 @@1-/* Kepr 3: Kepr 2's look (kepr.uk, gold theme), its palette made richer and more saturated (June, 2026-10-07), ported only as far as the pages that exist use it. */1+/* Amber carries the brand; neighbouring gold and warm red keep the palette cohesive. */22 33 :root {44 	--bg: #0d0805;@@ -7,8 +7,8 @@77 	--border: #3d2814;88 	--text: #efe3d3;99 	--text-secondary: #c9ab9c;10-	--text-muted: #9a7d70;11-	--text-faint: #6a4c40;10+	--text-muted: #ad9385;11+	--text-faint: #978779;1212 	--text-heading: #fff4e8;1313 	--accent: #ffad33;1414 	--accent-bright: #ffd166;@@ -17,14 +17,28 @@1717 	--accent-tint-04: rgba(255, 173, 51, 0.04);1818 	--accent-tint-12: rgba(255, 173, 51, 0.12);1919 	--sage: #9ad65f;20-	--coral: #ff8a5c;21-	--coral-dim: #a8502e;22-	--rose: #ff8ab4;23-	--lavender: #c9a0ff;20+	--syntax-red: #ff8f86;2421 	--sans: "Quicksand", system-ui, sans-serif;2522 	--mono: "Martian Mono", ui-monospace, monospace;23+	caret-color: var(--accent);24+	accent-color: var(--accent);2625 }2726 27+::selection {28+	background: var(--accent-bright);29+	color: var(--bg);30+}31+32+a:focus-visible,33+button:focus-visible,34+input:focus-visible,35+textarea:focus-visible,36+select:focus-visible,37+summary:focus-visible {38+	outline: 1px solid var(--accent);39+	outline-offset: 4px;40+}41+2842 * {2943 	box-sizing: border-box;3044 	scrollbar-width: thin;@@ -44,7 +58,7 @@4458 }4559 body {4660 	background:47-		radial-gradient(ellipse 90% 60% at 50% -15%, rgba(255, 120, 30, 0.12), transparent 70%) fixed,61+		radial-gradient(ellipse 90% 60% at 50% -15%, rgba(255, 173, 51, 0.12), transparent 70%) fixed,4862 		var(--bg);4963 }5064 @@ -103,7 +117,7 @@103117 .tri-inner {104118 	animation:105119 		tri-cw 8s linear infinite,106-		red-flash 11s ease-in-out infinite;120+		amber-flash 11s ease-in-out infinite;107121 }108122 @keyframes tri-ccw {109123 	to {@@ -115,14 +129,14 @@115129 		transform: rotate(360deg);116130 	}117131 }118-@keyframes red-flash {132+@keyframes amber-flash {119133 	0%,120134 	90%,121135 	100% {122136 		color: var(--accent);123137 	}124138 	95% {125-		color: var(--red);139+		color: var(--accent-bright);126140 	}127141 }128142 .wordmark-by {@@ -292,11 +306,12 @@292306 .repo-contributor {293307 	margin: 4px 0 0;294308 	font-size: 0.8125rem;295-	color: var(--coral);309+	color: var(--text-secondary);296310 	animation: fadeUp 280ms 40ms ease both;297311 }298312 .repo-contributor a:hover {299-	text-decoration-color: var(--coral);313+	color: var(--accent);314+	text-decoration-color: var(--accent);300315 }301316 .repo-desc,302317 .repo-homepage {@@ -1089,26 +1104,24 @@10891104 	text-decoration: none;10901105 }10911106 1092-/* Shiki's CSS-variables theme roles in five colours: amber, red, green, rose and lavender. */1107+/* A gold-to-amber-to-red range keeps syntax vivid without colouring every identifier. */10931108 .tk-comment {10941109 	color: var(--text-muted);10951110 	font-style: italic;10961111 }1097-.tk-keyword {1112+.tk-keyword,1113+.tk-constant {10981114 	color: var(--accent);10991115 }11001116 .tk-string,11011117 .tk-string-expression {1102-	color: var(--sage);1118+	color: var(--accent-bright);11031119 }1104-.tk-constant {1105-	color: var(--rose);1106-}11071120 .tk-function {1108-	color: var(--red);1121+	color: var(--syntax-red);11091122 }11101123 .tk-parameter {1111-	color: var(--lavender);1124+	color: var(--text);11121125 }11131126 .tk-punctuation {11141127 	color: var(--text-secondary);@@ -1612,7 +1625,7 @@16121625 }16131626 .issue-reporter {16141627 	font-size: 0.6875rem;1615-	color: var(--coral);1628+	color: var(--text-secondary);16161629 	overflow-wrap: anywhere;16171630 }16181631 .issues-filter {@@ -1629,7 +1642,7 @@16291642 	background: var(--bg-surface);16301643 }16311644 .issue-post--operator {1632-	border-color: var(--coral);1645+	border-color: var(--accent-dim);16331646 }16341647 .issue-post-head {16351648 	display: flex;@@ -1638,10 +1651,10 @@16381651 	margin: 0 0 8px;16391652 }16401653 .issue-author {1641-	color: var(--coral);1654+	color: var(--text-secondary);16421655 }16431656 .issue-badge {1644-	color: var(--coral);1657+	color: var(--accent-bright);16451658 	text-transform: uppercase;16461659 	letter-spacing: 0.08em;16471660 }@@ -2017,7 +2030,7 @@20172030 	font-family: var(--mono);20182031 	font-size: 13px;20192032 	line-height: 16px;2020-	color: var(--coral-dim);2033+	color: var(--accent-dim);20212034 }20222035 /* Characters top to bottom, columns right to left, each breathing on its own clock. */20232036 .hex-col {@@ -2031,7 +2044,7 @@20312044 		text-shadow 1.6s ease;20322045 }20332046 .hex-col:nth-child(3n) {2034-	color: var(--coral);2047+	color: var(--accent);20352048 	animation-duration: 23s;20362049 	animation-delay: -7s;20372050 }@@ -2048,7 +2061,7 @@20482061 }20492062 .hex-col.glow {20502063 	color: var(--text-heading);2051-	text-shadow: 0 0 6px rgba(255, 138, 92, 0.3);2064+	text-shadow: 0 0 6px rgba(255, 173, 51, 0.2);20522065 }20532066 @keyframes hex-breathe {20542067 	0%,@@ -2085,7 +2098,7 @@20852098 	line-height: 1;20862099 	letter-spacing: -0.02em;20872100 	text-transform: lowercase;2088-	color: var(--coral);2101+	color: var(--text-heading);20892102 	user-select: none;20902103 	animation: fadeUp 500ms ease both;20912104 }@@ -2105,7 +2118,7 @@21052118 	display: block;21062119 	font-size: 0.6875rem;21072120 	letter-spacing: 0.18em;2108-	color: var(--coral);2121+	color: var(--accent-bright);21092122 }21102123 21112124 .profile-portrait-section {

view file

public/favicon.svg+2 −2
@@ -1,5 +1,5 @@11 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32">22   <title>kepr</title>3-  <polygon points="16,3 27,23 5,23" fill="none" stroke="#c89a5a" stroke-width="2" stroke-linejoin="round"/>4-  <polygon points="16,10 22,21 10,21" fill="none" stroke="#c89a5a" stroke-width="1.5" stroke-linejoin="round"/>3+  <polygon points="16,3 27,23 5,23" fill="none" stroke="#ffad33" stroke-width="2" stroke-linejoin="round"/>4+  <polygon points="16,10 22,21 10,21" fill="none" stroke="#ffad33" stroke-width="1.5" stroke-linejoin="round"/>55 </svg>\ No newline at end of file

view file