sam/Hyperia
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

light mode better colors

Browse Source
This commit is contained in:
metacryst
2025-11-10 09:02:24 -06:00
parent 41c0bb57a3
commit fa67271ae8
11 changed files with 36 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
ui/_/code/shared.css
View File

@@ -10,12 +10,15 @@
--darkbrown: #60320c; --darkbrown: #60320c;
--orange: #FE9201; --orange: #FE9201;
--periwinkle: #655BAF; --periwinkle: #655BAF;
--accent2: var(--green);
} }
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: dark) {
:root { :root {
--main: #251D44; --main: #251D44;
--accent: #AF7323; --accent: #AF7323;
--accent2: var(--periwinkle);
} }
} }

14
ui/site/apps/Forum/Forum.js
View File

@@ -48,7 +48,7 @@ class Messages extends Shadow {
.paddingRight(2, em) .paddingRight(2, em)
.paddingTop(2, em) .paddingTop(2, em)
.gap(0, em) .gap(0, em)
.borderRight("1px solid var(--periwinkle)") .borderRight("1px solid var(--accent2)")
VStack(() => { VStack(() => {
h3("Conversations") h3("Conversations")
@@ -69,11 +69,11 @@ class Messages extends Shadow {
.paddingRight(2, em) .paddingRight(2, em)
.paddingTop(2, em) .paddingTop(2, em)
.gap(0, em) .gap(0, em)
.borderRight("1px solid var(--periwinkle)") .borderRight("1px solid var(--accent2)")
}) })
.width(100, "%") .width(100, "%")
.x(0).y(13, vh) .x(0).y(13, vh)
.borderTop("1px solid var(--periwinkle)") .borderTop("1px solid var(--accent2)")
p("0 Items") p("0 Items")
.position("absolute") .position("absolute")
@@ -88,7 +88,7 @@ class Messages extends Shadow {
.fontSize(1.1, em) .fontSize(1.1, em)
.paddingLeft(1.3, em) .paddingLeft(1.3, em)
.background("transparent") .background("transparent")
.border("1px solid var(--periwinkle)") .border("1px solid var(--accent2)")
.outline("none") .outline("none")
.color("var(--accent)") .color("var(--accent)")
.borderRadius(10, px) .borderRadius(10, px)
@@ -97,7 +97,7 @@ class Messages extends Shadow {
.marginLeft(2, em) .marginLeft(2, em)
.borderRadius(10, px) .borderRadius(10, px)
.background("transparent") .background("transparent")
.border("1px solid var(--periwinkle)") .border("1px solid var(--accent2)")
.color("var(--accent)") .color("var(--accent)")
.fontFamily("Bona Nova") .fontFamily("Bona Nova")
.onHover(function (hovering) { .onHover(function (hovering) {
@@ -115,7 +115,7 @@ class Messages extends Shadow {
.marginLeft(1, em) .marginLeft(1, em)
.borderRadius(10, px) .borderRadius(10, px)
.background("transparent") .background("transparent")
.border("1px solid var(--periwinkle)") .border("1px solid var(--accent2)")
.color("var(--accent)") .color("var(--accent)")
.fontFamily("Bona Nova") .fontFamily("Bona Nova")
.onHover(function (hovering) { .onHover(function (hovering) {
@@ -150,7 +150,7 @@ class Messages extends Shadow {
.alignItems("center") .alignItems("center")
.width(1.5, em) .width(1.5, em)
.height(1.5, em) .height(1.5, em)
.border("1px solid var(--periwinkle)") .border("1px solid var(--accent2)")
.borderRadius(100, "%") .borderRadius(100, "%")
p(name) p(name)
.marginLeft(1, em) .marginLeft(1, em)

6
ui/site/apps/Jobs/Jobs.js
View File

@@ -61,7 +61,7 @@ class Jobs extends Shadow {
.fontSize(1.1, em) .fontSize(1.1, em)
.paddingLeft(1.3, em) .paddingLeft(1.3, em)
.background("transparent") .background("transparent")
.border("1px solid var(--periwinkle)") .border("1px solid var(--accent2)")
.outline("none") .outline("none")
.color("var(--accent)") .color("var(--accent)")
.borderRadius(10, px) .borderRadius(10, px)
@@ -70,7 +70,7 @@ class Jobs extends Shadow {
.marginLeft(2, em) .marginLeft(2, em)
.borderRadius(10, px) .borderRadius(10, px)
.background("transparent") .background("transparent")
.border("1px solid var(--periwinkle)") .border("1px solid var(--accent2)")
.color("var(--accent)") .color("var(--accent)")
.fontFamily("Bona Nova") .fontFamily("Bona Nova")
.onHover(function (hovering) { .onHover(function (hovering) {
@@ -88,7 +88,7 @@ class Jobs extends Shadow {
.marginLeft(1, em) .marginLeft(1, em)
.borderRadius(10, px) .borderRadius(10, px)
.background("transparent") .background("transparent")
.border("1px solid var(--periwinkle)") .border("1px solid var(--accent2)")
.color("var(--accent)") .color("var(--accent)")
.fontFamily("Bona Nova") .fontFamily("Bona Nova")
.onHover(function (hovering) { .onHover(function (hovering) {

6
ui/site/apps/Jobs/JobsGrid.js
View File

@@ -21,7 +21,7 @@ class JobsGrid extends Shadow {
.marginTop(0.1, em) .marginTop(0.1, em)
.marginBottom(1, em) .marginBottom(1, em)
.marginLeft(0.4, em) .marginLeft(0.4, em)
.color("var(--periwinkle)") .color("var(--accent2)")
if (this.jobs.length > 0) { if (this.jobs.length > 0) {
ZStack(() => { ZStack(() => {
@@ -37,7 +37,7 @@ class JobsGrid extends Shadow {
p(this.boldUntilFirstSpace(this.jobs[i].salary)) p(this.boldUntilFirstSpace(this.jobs[i].salary))
}) })
.padding(1, em) .padding(1, em)
.border("1px solid var(--periwinkle)") .border("1px solid var(--accent2)")
.borderRadius(5, "px") .borderRadius(5, "px")
} }
}) })
@@ -54,7 +54,7 @@ class JobsGrid extends Shadow {
.paddingTop(2, em) .paddingTop(2, em)
.gap(0, em) .gap(0, em)
.width(100, "%") .width(100, "%")
.borderTop("1px solid var(--periwinkle)") .borderTop("1px solid var(--accent2)")
} }
} }

6
ui/site/apps/Jobs/JobsSidebar.js
View File

@@ -2,7 +2,7 @@ class JobsSidebar extends Shadow {
render() { render() {
VStack(() => { VStack(() => {
h3("Location") h3("Location")
.color("var(--periwinkle)") .color("var(--accent2)")
}) })
@@ -10,8 +10,8 @@ class JobsSidebar extends Shadow {
.paddingLeft(3, em) .paddingLeft(3, em)
.paddingRight(3, em) .paddingRight(3, em)
.gap(1, em) .gap(1, em)
.borderRight("1px solid var(--periwinkle)") .borderRight("1px solid var(--accent2)")
.borderTop("1px solid var(--periwinkle)") .borderTop("1px solid var(--accent2)")
.minWidth(10, vw) .minWidth(10, vw)
} }
} }

6
ui/site/apps/Market/Market.js
View File

@@ -57,7 +57,7 @@ class Market extends Shadow {
.fontSize(1.1, em) .fontSize(1.1, em)
.paddingLeft(1.3, em) .paddingLeft(1.3, em)
.background("transparent") .background("transparent")
.border("1px solid var(--periwinkle)") .border("1px solid var(--accent2)")
.outline("none") .outline("none")
.color("var(--accent)") .color("var(--accent)")
.borderRadius(10, px) .borderRadius(10, px)
@@ -66,7 +66,7 @@ class Market extends Shadow {
.marginLeft(2, em) .marginLeft(2, em)
.borderRadius(10, px) .borderRadius(10, px)
.background("transparent") .background("transparent")
.border("1px solid var(--periwinkle)") .border("1px solid var(--accent2)")
.color("var(--accent)") .color("var(--accent)")
.fontFamily("Bona Nova") .fontFamily("Bona Nova")
.onHover(function (hovering) { .onHover(function (hovering) {
@@ -84,7 +84,7 @@ class Market extends Shadow {
.marginLeft(1, em) .marginLeft(1, em)
.borderRadius(10, px) .borderRadius(10, px)
.background("transparent") .background("transparent")
.border("1px solid var(--periwinkle)") .border("1px solid var(--accent2)")
.color("var(--accent)") .color("var(--accent)")
.fontFamily("Bona Nova") .fontFamily("Bona Nova")
.onHover(function (hovering) { .onHover(function (hovering) {

4
ui/site/apps/Market/MarketGrid.js
View File

@@ -22,7 +22,7 @@ class MarketGrid extends Shadow {
.marginTop(0.1, em) .marginTop(0.1, em)
.marginBottom(1, em) .marginBottom(1, em)
.marginLeft(0.4, em) .marginLeft(0.4, em)
.color("var(--periwinkle)") .color("var(--accent2)")
if (this.listings.length > 0) { if (this.listings.length > 0) {
ZStack(() => { ZStack(() => {
@@ -77,7 +77,7 @@ class MarketGrid extends Shadow {
}) })
.padding(1, em) .padding(1, em)
.border("1px solid var(--periwinkle)") .border("1px solid var(--accent2)")
.borderRadius(5, "px") .borderRadius(5, "px")
} }
}) })

14
ui/site/apps/Messages.js
View File

@@ -48,7 +48,7 @@ class Messages extends Shadow {
.paddingRight(2, em) .paddingRight(2, em)
.paddingTop(2, em) .paddingTop(2, em)
.gap(0, em) .gap(0, em)
.borderRight("1px solid var(--periwinkle)") .borderRight("1px solid var(--accent2)")
VStack(() => { VStack(() => {
h3("Conversations") h3("Conversations")
@@ -69,11 +69,11 @@ class Messages extends Shadow {
.paddingRight(2, em) .paddingRight(2, em)
.paddingTop(2, em) .paddingTop(2, em)
.gap(0, em) .gap(0, em)
.borderRight("1px solid var(--periwinkle)") .borderRight("1px solid var(--accent2)")
}) })
.width(100, "%") .width(100, "%")
.x(0).y(13, vh) .x(0).y(13, vh)
.borderTop("1px solid var(--periwinkle)") .borderTop("1px solid var(--accent2)")
p("0 Items") p("0 Items")
.position("absolute") .position("absolute")
@@ -88,7 +88,7 @@ class Messages extends Shadow {
.fontSize(1.1, em) .fontSize(1.1, em)
.paddingLeft(1.3, em) .paddingLeft(1.3, em)
.background("transparent") .background("transparent")
.border("1px solid var(--periwinkle)") .border("1px solid var(--accent2)")
.outline("none") .outline("none")
.color("var(--accent)") .color("var(--accent)")
.borderRadius(10, px) .borderRadius(10, px)
@@ -97,7 +97,7 @@ class Messages extends Shadow {
.marginLeft(2, em) .marginLeft(2, em)
.borderRadius(10, px) .borderRadius(10, px)
.background("transparent") .background("transparent")
.border("1px solid var(--periwinkle)") .border("1px solid var(--accent2)")
.color("var(--accent)") .color("var(--accent)")
.fontFamily("Bona Nova") .fontFamily("Bona Nova")
.onHover(function (hovering) { .onHover(function (hovering) {
@@ -115,7 +115,7 @@ class Messages extends Shadow {
.marginLeft(1, em) .marginLeft(1, em)
.borderRadius(10, px) .borderRadius(10, px)
.background("transparent") .background("transparent")
.border("1px solid var(--periwinkle)") .border("1px solid var(--accent2)")
.color("var(--accent)") .color("var(--accent)")
.fontFamily("Bona Nova") .fontFamily("Bona Nova")
.onHover(function (hovering) { .onHover(function (hovering) {
@@ -150,7 +150,7 @@ class Messages extends Shadow {
.alignItems("center") .alignItems("center")
.width(1.5, em) .width(1.5, em)
.height(1.5, em) .height(1.5, em)
.border("1px solid var(--periwinkle)") .border("1px solid var(--accent2)")
.borderRadius(100, "%") .borderRadius(100, "%")
p(name) p(name)
.marginLeft(1, em) .marginLeft(1, em)

4
ui/site/components/Home.js
View File

@@ -57,7 +57,7 @@ class Home extends Shadow {
.top("5vh") .top("5vh")
.right("2em") .right("2em")
.background("transparent") .background("transparent")
.border(window.location.pathname === "/" ? "1px solid var(--tan)" : "1px solid var(--periwinkle)") .border(window.location.pathname === "/" ? "1px solid var(--tan)" : "1px solid var(--accent2)")
.color(window.location.pathname === "/" ? "var(--tan)" : "var(--accent)") .color(window.location.pathname === "/" ? "var(--tan)" : "var(--accent)")
.borderRadius(5, px) .borderRadius(5, px)
.onHover(function (hovering) { .onHover(function (hovering) {
@@ -72,7 +72,7 @@ class Home extends Shadow {
this.style.border = "1px solid var(--tan)" this.style.border = "1px solid var(--tan)"
this.style.color = "var(--tan)" this.style.color = "var(--tan)"
} else { } else {
this.style.border = "1px solid var(--periwinkle)" this.style.border = "1px solid var(--accent2)"
this.style.color = "var(--accent)" this.style.color = "var(--accent)"
} }
}) })

2
ui/site/components/InputBox.js
View File

@@ -9,7 +9,7 @@ css(`
.input { .input {
width: 100%; width: 100%;
background-color: var(--periwinkle); background-color: var(--accent2);
opacity: 0.5; opacity: 0.5;
border-radius: 12px; border-radius: 12px;
border: none; border: none;

4
ui/site/components/Sidebar.js
View File

@@ -5,7 +5,7 @@ css(`
left: 0; left: 0;
height: 100vh; height: 100vh;
width: 16vw; width: 16vw;
border-right: 0.5px solid var(--periwinkle); border-right: 0.5px solid var(--accent2);
display: flex; display: flex;
flex-direction: column; flex-direction: column;
padding-top: 13vh; padding-top: 13vh;
@@ -14,7 +14,7 @@ css(`
side-bar button { side-bar button {
color: var(--darkbrown); color: var(--darkbrown);
margin: 1.5em; margin: 1.5em;
background-color: color-mix(in srgb, var(--periwinkle) 35%, var(--orange) 65%); background-color: color-mix(in srgb, var(--accent2) 35%, var(--orange) 65%);
border: 1px solid var(--orange); border: 1px solid var(--orange);
border-radius: 12px; border-radius: 12px;
padding: 0.5em; padding: 0.5em;