matiasc18
834d5e763e
- Modified handlers.js to be the same as on frm.so - Added --trash-src to shared.css - Modified Event and Job cards to include a trash icon for deleting - Deleting works, it just does not smoothly re-render yet - Adjusted visual bug on Events/Jobs where the contents of the AppWindow would overflow vertically. They now scroll and the title/search bar remain fixed. - Refactored part of People.js into PeopleCard.js
91 lines
2.3 KiB
JavaScript
91 lines
2.3 KiB
JavaScript
import "./PeopleCard.js"
|
|
|
|
css(`
|
|
people- {
|
|
font-family: 'Arial';
|
|
}
|
|
|
|
people- h1 {
|
|
font-family: 'Bona';
|
|
}
|
|
|
|
people- p {
|
|
color: var(--accent);
|
|
}
|
|
|
|
people- p b {
|
|
color: var(--darkbrown);
|
|
}
|
|
`)
|
|
|
|
class People extends Shadow {
|
|
people = "";
|
|
|
|
constructor() {
|
|
super()
|
|
this.people = global.currentNetwork.data.members;
|
|
}
|
|
|
|
render() {
|
|
VStack(() => {
|
|
h1("People")
|
|
.color("rgb(158 136 105)")
|
|
.textAlign("center")
|
|
.marginBottom(0.25, em)
|
|
h3(global.currentNetwork.name)
|
|
.color("var(--quillred)")
|
|
.textAlign("center")
|
|
.margin(0)
|
|
.marginBottom(0.5, em)
|
|
.fontFamily("Bona")
|
|
|
|
if (this.people == "") {
|
|
LoadingCircle()
|
|
} else if (this.people.length > 0) {
|
|
for (let i = 0; i < this.people.length; i++) {
|
|
PeopleCard(this.people[i])
|
|
}
|
|
} else {
|
|
h2("No Members")
|
|
.color("var(--brown)")
|
|
.fontWeight("bold")
|
|
.marginTop(7.5, em)
|
|
.marginBottom(0.5, em)
|
|
.textAlign("center")
|
|
p("Invite people to this network!")
|
|
.textAlign("center")
|
|
.color("var(--darkbrown)")
|
|
}
|
|
})
|
|
.position("relative")
|
|
.boxSizing("border-box")
|
|
.paddingVertical(1, em)
|
|
.height(100, pct)
|
|
.width(100, pct)
|
|
}
|
|
|
|
convertDate(rawDate) {
|
|
const parsed = new Date(rawDate);
|
|
|
|
if (isNaN(parsed.getTime())) return rawDate;
|
|
|
|
const month = parsed.toLocaleString("en-US", { month: "long", timeZone: "UTC" });
|
|
const day = parsed.getUTCDate();
|
|
const year = parsed.getUTCFullYear();
|
|
|
|
const ordinal = (n) => {
|
|
const mod100 = n % 100;
|
|
if (mod100 >= 11 && mod100 <= 13) return `${n}th`;
|
|
switch (n % 10) {
|
|
case 1: return `${n}st`;
|
|
case 2: return `${n}nd`;
|
|
case 3: return `${n}rd`;
|
|
default: return `${n}th`;
|
|
}
|
|
};
|
|
|
|
return `${month} ${ordinal(day)}, ${year}`;
|
|
}
|
|
}
|
|
|
|
register(People) |