sam/frm.so
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

basic public page

Browse Source
This commit is contained in:
metacryst
2026-01-05 05:52:06 -06:00
parent 6a435ac11a
commit 58cbc31fba
28 changed files with 261 additions and 7506 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
ui/public/index.html
View File

@@ -1,9 +1,9 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>Hyperia</title>
<title>Parchment</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" href="/_/icons/logo.svg">
<link rel="icon" href="/_/icons/quill.svg">
<link rel="stylesheet" href="/_/code/shared.css">
<link
rel="preload"
@@ -22,7 +22,7 @@
<style>
body {
background: #FEBA7D;
background: black;
}
</style>
<script src="/_/code/quill.js"></script>

154
ui/public/pages/Home.js
View File

@@ -1,5 +1,5 @@
import "../components/NavBar.js"
import "../components/SignupForm.js"
import "./SignupForm.js"
import "./Why.js"
import "./Events.js"
import "./Join.js"
@@ -7,55 +7,119 @@ import "./SignIn.js"
import "./Success.js"
class Home extends Shadow {
MainContent() {
return VStack(() => {
HStack(() => {
img("/_/icons/quill.svg", "6em")
p("PARCHMENT")
.fontFamily("Nabla")
.fontSize(6.5, em)
.marginLeft(1, rem)
.color("var(--accent)")
})
.marginBottom(1, rem)
HStack(() => {
VStack(() => {
HStack(() => {
span("The Network OS")
.fontFamily("Canterbury")
.color("var(--accent)")
.fontSize(2.5, em)
.paddingBottom(1, rem)
})
.height(5, em)
.verticalAlign("center")
.horizontalAlign("center")
p("Parchment helps you connect to every group you are a part of.")
.color("var(--red)")
.borderTop("1px solid var(--red)")
.borderHorizontal("1px solid var(--red)")
.height(5, em)
.fontSize(1.2, em)
.paddingTop(2, rem)
.paddingHorizontal(2, rem)
})
VStack(() => {
HStack(() => {
p("Log In")
.color("var(--red)")
.paddingVertical(1.2, rem)
.paddingHorizontal(3, rem)
.fontSize(1.2, em)
.cursor("default")
.onHover(function (hovering) {
console.log("hover")
if(hovering) {
this.style.background = "var(--red)"
this.style.color = "black"
} else {
this.style.background = ""
this.style.color = "var(--red)"
}
})
.onClick(() => {
window.navigateTo("/login")
})
p("Sign Up")
.color("var(--red)")
.borderLeft("1px solid var(--red)")
.paddingVertical(1.2, rem)
.paddingHorizontal(3, rem)
.fontSize(1.2, em)
.cursor("default")
.onHover(function (hovering) {
console.log("hover")
if(hovering) {
this.style.background = "var(--red)"
this.style.color = "black"
} else {
this.style.background = ""
this.style.color = "var(--red)"
}
})
.onClick(() => {
window.navigateTo("/signup")
})
})
.height(5, em)
.border("1px solid var(--red)")
div()
.height(5, em)
})
})
ZStack(() => {
img("/_/images/nodes.svg", "20vw")
.marginHorizontal(50, pct)
.marginTop(13, em)
.center()
})
.width(100, pct)
.marginBottom(10, em)
.border("1px solid var(--red)")
})
.marginHorizontal(27, vw)
.width(46, vw)
.marginTop(10, vh)
.fontFamily("Nanum")
}
render() {
ZStack(() => {
NavBar()
img("/_/icons/logo.svg", "2.5em")
.onClick((done) => {
if(!done) return
window.navigateTo("/")
})
.position("absolute")
.left(50, vw).top(4, em)
.center()
.transform(`translate(${window.isMobile() ? "-50%" : "-2em"}, -50%)`)
switch(window.location.pathname) {
case "/":
img("/_/images/knight.webp", "29vmax")
.position("absolute")
.left(50, vw).top(isMobile() ? 50 : 53, vh)
.center()
if(!isMobile()) {
p("H &nbsp; Y &nbsp; P &nbsp; E &nbsp; R &nbsp; I &nbsp; A &nbsp;")
.x(50, vw).y(53, vh)
.textAlign("center")
.center()
.color("var(--gold)")
.fontSize(5, vw)
.maxWidth(isMobile() ? 1000 : 100, em)
} else {
p("H &nbsp; Y &nbsp; P &nbsp; E &nbsp; R &nbsp; I &nbsp; A &nbsp;")
.x(46, vw).y(isMobile() ? 50 : 53, vh)
.textAlign("center")
.color("var(--gold)")
.fontSize(5, vw)
}
if(!isMobile()) {
let text = "A Classical Christian Network"
p(isMobile() ? text : text.toUpperCase())
.x(50, vw).yBottom(isMobile() ? 1 : 3, vh)
.center()
.letterSpacing(0.1, em)
.width(isMobile() ? 80 : 100, vw)
.fontSize(isMobile() ? 0.8 : 1, em)
.textAlign("center")
}
this.MainContent()
break;
case "/why":
Why()
@@ -73,7 +137,7 @@ class Home extends Shadow {
default:
if(window.location.pathname.startsWith("/signup")) {
SignupForm()
} else if(window.location.pathname.startsWith("/signin")) {
} else if(window.location.pathname.startsWith("/login")) {
SignIn()
}
}

36
ui/public/components/SignupForm.js → ui/public/pages/SignupForm.js
View File

@@ -45,39 +45,11 @@ class SignupForm extends Shadow {
.attr({name: "password", type: "password", required: "true"})
.styles(this.inputStyles)
})
.width(50, "%")
.gap(1, em)
VStack(() => {
input("Street Address*")
.attr({ name: "address1", type: "text", autocomplete: "address-line1", required: "true" })
.styles(this.inputStyles)
input("Apt, Suite, Unit (optional)")
.attr({ name: "address2", type: "text", autocomplete: "address-line2" })
.styles(this.inputStyles)
input("City*")
.attr({ name: "city", type: "text", autocomplete: "address-level2", required: "true" })
.styles(this.inputStyles)
input("State*")
.attr({ name: "state", type: "text", autocomplete: "address-level1", required: "true" })
.styles(this.inputStyles)
input("ZIP Code*")
.attr({ name: "zip", type: "text", autocomplete: "postal-code", required: "true" })
.styles(this.inputStyles)
input("Country*")
.attr({ name: "country", type: "text", autocomplete: "country-name", required: "true" })
.styles(this.inputStyles)
})
.width(50, "%")
.gap(1, em)
.width(100, "%")
.gap(1, em)
})
.gap(2, em)
.width(100, pct)
button("Submit")
})
@@ -129,7 +101,7 @@ class SignupForm extends Shadow {
}
})
.x(50, vw).y(53, vh)
.width(60, vw)
.width(30, vmax)
.center()
})
}