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;
--orange: #FE9201;
--periwinkle: #655BAF;
--accent2: var(--green);
}
@media (prefers-color-scheme: dark) {
:root {
--main: #251D44;
--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)
.paddingTop(2, em)
.gap(0, em)
.borderRight("1px solid var(--periwinkle)")
.borderRight("1px solid var(--accent2)")
VStack(() => {
h3("Conversations")
@@ -69,11 +69,11 @@ class Messages extends Shadow {
.paddingRight(2, em)
.paddingTop(2, em)
.gap(0, em)
.borderRight("1px solid var(--periwinkle)")
.borderRight("1px solid var(--accent2)")
})
.width(100, "%")
.x(0).y(13, vh)
.borderTop("1px solid var(--periwinkle)")
.borderTop("1px solid var(--accent2)")
p("0 Items")
.position("absolute")
@@ -88,7 +88,7 @@ class Messages extends Shadow {
.fontSize(1.1, em)
.paddingLeft(1.3, em)
.background("transparent")
.border("1px solid var(--periwinkle)")
.border("1px solid var(--accent2)")
.outline("none")
.color("var(--accent)")
.borderRadius(10, px)
@@ -97,7 +97,7 @@ class Messages extends Shadow {
.marginLeft(2, em)
.borderRadius(10, px)
.background("transparent")
.border("1px solid var(--periwinkle)")
.border("1px solid var(--accent2)")
.color("var(--accent)")
.fontFamily("Bona Nova")
.onHover(function (hovering) {
@@ -115,7 +115,7 @@ class Messages extends Shadow {
.marginLeft(1, em)
.borderRadius(10, px)
.background("transparent")
.border("1px solid var(--periwinkle)")
.border("1px solid var(--accent2)")
.color("var(--accent)")
.fontFamily("Bona Nova")
.onHover(function (hovering) {
@@ -150,7 +150,7 @@ class Messages extends Shadow {
.alignItems("center")
.width(1.5, em)
.height(1.5, em)
.border("1px solid var(--periwinkle)")
.border("1px solid var(--accent2)")
.borderRadius(100, "%")
p(name)
.marginLeft(1, em)

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

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

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

@@ -21,7 +21,7 @@ class JobsGrid extends Shadow {
.marginTop(0.1, em)
.marginBottom(1, em)
.marginLeft(0.4, em)
.color("var(--periwinkle)")
.color("var(--accent2)")
if (this.jobs.length > 0) {
ZStack(() => {
@@ -37,7 +37,7 @@ class JobsGrid extends Shadow {
p(this.boldUntilFirstSpace(this.jobs[i].salary))
})
.padding(1, em)
.border("1px solid var(--periwinkle)")
.border("1px solid var(--accent2)")
.borderRadius(5, "px")
}
})
@@ -54,7 +54,7 @@ class JobsGrid extends Shadow {
.paddingTop(2, em)
.gap(0, em)
.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() {
VStack(() => {
h3("Location")
.color("var(--periwinkle)")
.color("var(--accent2)")
})
@@ -10,8 +10,8 @@ class JobsSidebar extends Shadow {
.paddingLeft(3, em)
.paddingRight(3, em)
.gap(1, em)
.borderRight("1px solid var(--periwinkle)")
.borderTop("1px solid var(--periwinkle)")
.borderRight("1px solid var(--accent2)")
.borderTop("1px solid var(--accent2)")
.minWidth(10, vw)
}
}

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

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

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

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

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

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

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

@@ -57,7 +57,7 @@ class Home extends Shadow {
.top("5vh")
.right("2em")
.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)")
.borderRadius(5, px)
.onHover(function (hovering) {
@@ -72,7 +72,7 @@ class Home extends Shadow {
this.style.border = "1px solid var(--tan)"
this.style.color = "var(--tan)"
} else {
this.style.border = "1px solid var(--periwinkle)"
this.style.border = "1px solid var(--accent2)"
this.style.color = "var(--accent)"
}
})

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

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

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

@@ -5,7 +5,7 @@ css(`
left: 0;
height: 100vh;
width: 16vw;
border-right: 0.5px solid var(--periwinkle);
border-right: 0.5px solid var(--accent2);
display: flex;
flex-direction: column;
padding-top: 13vh;
@@ -14,7 +14,7 @@ css(`
side-bar button {
color: var(--darkbrown);
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-radius: 12px;
padding: 0.5em;