From f1bb9b80ca381e41f09a48573a0e8d496c874d2a Mon Sep 17 00:00:00 2001 From: Firq Date: Sun, 14 Jul 2024 21:15:16 +0200 Subject: [PATCH] Redesign --- package-lock.json | 10 +- package.json | 3 +- src/components/hero.astro | 31 +++-- src/components/smallTitle.astro | 95 +++++++++++++++ src/components/title.astro | 84 +++++++++++++ src/content/config.ts | 8 +- src/content/groups/lostbelt-6.json | 8 ++ .../taInfoData/{ => lostbelt-6}/albion.json | 4 +- .../{ => lostbelt-6}/cernunnos.json | 4 +- .../taInfoData/{ => lostbelt-6}/morgan.json | 4 +- .../teslafest/eq-2021-green-comet.json | 4 +- src/layouts/Layout.astro | 2 + src/layouts/databaseSection.astro | 6 +- src/pages/database/[...slug].astro | 115 ++++++++++++++++++ src/pages/database/[slug].astro | 13 -- src/pages/database/index.astro | 17 ++- src/pages/index.astro | 4 +- src/pages/teslafest/index.astro | 3 +- 18 files changed, 372 insertions(+), 43 deletions(-) create mode 100644 src/components/smallTitle.astro create mode 100644 src/components/title.astro create mode 100644 src/content/groups/lostbelt-6.json rename src/content/taInfoData/{ => lostbelt-6}/albion.json (98%) rename src/content/taInfoData/{ => lostbelt-6}/cernunnos.json (97%) rename src/content/taInfoData/{ => lostbelt-6}/morgan.json (98%) create mode 100644 src/pages/database/[...slug].astro delete mode 100644 src/pages/database/[slug].astro diff --git a/package-lock.json b/package-lock.json index 4e7e86a..b85fdf1 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,16 +1,17 @@ { "name": "fgo-ta-com-website", - "version": "0.2.1", + "version": "0.2.2-pre.1", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "fgo-ta-com-website", - "version": "0.2.1", + "version": "0.2.2-pre.1", "dependencies": { "@astro-community/astro-embed-youtube": "^0.4.3", "@astrojs/check": "^0.5.10", "@astrojs/sitemap": "^3.1.4", + "@fontsource/work-sans": "^5.0.18", "astro": "^4.7.0", "astro-meta-tags": "^0.1.3", "autoprefixer": "^10.4.16", @@ -1746,6 +1747,11 @@ "node": ">=12" } }, + "node_modules/@fontsource/work-sans": { + "version": "5.0.18", + "resolved": "https://registry.npmjs.org/@fontsource/work-sans/-/work-sans-5.0.18.tgz", + "integrity": "sha512-kFZEEPfWhALOweNTc+J60Jnok1bNuKC/L6wbM05f716pZFU9AAlKl0zmOYbJSkY4yhpHsYDL/X7A4zF9vPpE2g==" + }, "node_modules/@img/sharp-darwin-arm64": { "version": "0.33.3", "resolved": "https://registry.npmjs.org/@img/sharp-darwin-arm64/-/sharp-darwin-arm64-0.33.3.tgz", diff --git a/package.json b/package.json index a3027e3..27a5ec4 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "fgo-ta-com-website", "type": "module", - "version": "0.2.2-pre.1", + "version": "0.2.2-pre.2", "scripts": { "dev": "astro dev", "start": "astro dev", @@ -13,6 +13,7 @@ "@astro-community/astro-embed-youtube": "^0.4.3", "@astrojs/check": "^0.5.10", "@astrojs/sitemap": "^3.1.4", + "@fontsource/work-sans": "^5.0.18", "astro": "^4.7.0", "astro-meta-tags": "^0.1.3", "autoprefixer": "^10.4.16", diff --git a/src/components/hero.astro b/src/components/hero.astro index d40e708..e81458a 100644 --- a/src/components/hero.astro +++ b/src/components/hero.astro @@ -1,5 +1,11 @@ --- import packagejson from '../../package.json' +export interface Props { + fadeout?: boolean +} +const { fadeout } = Astro.props +const display = fadeout ? "": "display: none" + const version = packagejson.version const release = `https://forgejo.neshweb.net/Firq/fgo-ta-com-website/releases/tag/${version}` --- @@ -8,36 +14,34 @@ const release = `https://forgejo.neshweb.net/Firq/fgo-ta-com-website/releases/ta This site is a project by Firq.
- In the future, it will be used to catalogue information around FGO TA and the - game in general. -
Feel free to check out my personal site.
( Website version: Website version: {version} )
- +
diff --git a/src/components/smallTitle.astro b/src/components/smallTitle.astro new file mode 100644 index 0000000..c548afd --- /dev/null +++ b/src/components/smallTitle.astro @@ -0,0 +1,95 @@ +--- +import '@fontsource/work-sans/800.css' +import '@fontsource/work-sans/600.css' +export interface Props { + maintext: string + subtext: string + fadeout?: boolean + baseurl?: string +} +const { maintext, subtext, fadeout, baseurl } = Astro.props +const display = fadeout ? "": "display: none" +--- + +
+
{maintext}
+
{subtext}
+ << Back to database +
+
+ + diff --git a/src/components/title.astro b/src/components/title.astro new file mode 100644 index 0000000..272997a --- /dev/null +++ b/src/components/title.astro @@ -0,0 +1,84 @@ +--- +import '@fontsource/work-sans/800.css' +export interface Props { + maintext: string + subtext: string + fadeout?: boolean +} +const { maintext, subtext, fadeout } = Astro.props +const display = fadeout ? "": "display: none" +--- + +
+
{maintext}
+
{subtext}
+
+
+ + diff --git a/src/content/config.ts b/src/content/config.ts index c464a6b..95cbf6d 100644 --- a/src/content/config.ts +++ b/src/content/config.ts @@ -14,7 +14,7 @@ const entry = z.object({ const quest = z.object({ questTitle: z.string(), description: z.string(), - data: z.array(entry) + data: z.array(entry), }) // Basic info block for page @@ -34,7 +34,13 @@ const taData = defineCollection({ }), }) +const groupDescription = defineCollection({ + type: 'data', + schema: z.object({ info: info }), +}) + export const collections = { taInfoData: taData, teslafest: taData, + groups: groupDescription, } diff --git a/src/content/groups/lostbelt-6.json b/src/content/groups/lostbelt-6.json new file mode 100644 index 0000000..0c276c7 --- /dev/null +++ b/src/content/groups/lostbelt-6.json @@ -0,0 +1,8 @@ +{ + "info": { + "title": "Lostbelt 6", + "releaseDate": "2023-07-10", + "shortdescription": "Lostbelt 6", + "releaseNumber": 1 + } +} diff --git a/src/content/taInfoData/albion.json b/src/content/taInfoData/lostbelt-6/albion.json similarity index 98% rename from src/content/taInfoData/albion.json rename to src/content/taInfoData/lostbelt-6/albion.json index 38a51f0..bcdb4d0 100644 --- a/src/content/taInfoData/albion.json +++ b/src/content/taInfoData/lostbelt-6/albion.json @@ -1,13 +1,13 @@ { "info": { - "title": "[Lostbelt 6] Albion", + "title": "Albion", "releaseDate": "2023-07-10", "shortdescription": "Albion shows up with a new mechanic, but will it be enough?", "releaseNumber": 1 }, "quests": [ { - "questTitle": "[Lostbelt 6] Albion", + "questTitle": "Albion", "description": "Albion shows up with a new mechanic, but will it be enough? No, because the mechanics are only seen as a small challenge and were quickly rendered a sideeffect during this quest - to the dismay of Melusine", "data": [ { diff --git a/src/content/taInfoData/cernunnos.json b/src/content/taInfoData/lostbelt-6/cernunnos.json similarity index 97% rename from src/content/taInfoData/cernunnos.json rename to src/content/taInfoData/lostbelt-6/cernunnos.json index 66da99e..46bf53d 100644 --- a/src/content/taInfoData/cernunnos.json +++ b/src/content/taInfoData/lostbelt-6/cernunnos.json @@ -1,13 +1,13 @@ { "info": { - "title": "[Lostbelt 6] Cernunnos", + "title": "Cernunnos", "releaseDate": "2023-07-10", "shortdescription": "One of FGOs most notorious boss fights due to up to 100% special defense, strong DoT damage and powerful field effects", "releaseNumber": 2 }, "quests": [ { - "questTitle": "[Lostbelt 6] Cernunnos", + "questTitle": "Cernunnos", "description": "One of FGOs most notorious boss fights due to up to 100% special defense, strong DoT damage and powerful field effects - and still, the TA community prevailed and created some of the most amazing runs of all time", "data": [ { diff --git a/src/content/taInfoData/morgan.json b/src/content/taInfoData/lostbelt-6/morgan.json similarity index 98% rename from src/content/taInfoData/morgan.json rename to src/content/taInfoData/lostbelt-6/morgan.json index a38ae07..508dafc 100644 --- a/src/content/taInfoData/morgan.json +++ b/src/content/taInfoData/lostbelt-6/morgan.json @@ -1,13 +1,13 @@ { "info": { - "title": "[Lostbelt 6] Queen Morgan", + "title": "Queen Morgan", "releaseDate": "2023-06-20", "shortdescription": "The fight against the Lostbelt 6 Queen as the conclusion of LB 6 Part 2", "releaseNumber": 1 }, "quests": [ { - "questTitle": "[Lostbelt 6] Queen Morgan", + "questTitle": "Queen Morgan", "description": "The fight against the Lostbelt 6 Queen as the conclusion of LB 6 Part 2 - Interesting field effects and a berserker enemy were making this fight interesting, as Morgan is hitting like an actual truck, meaning support cycling was a lot easier than usual.", "data": [ { diff --git a/src/content/teslafest/eq-2021-green-comet.json b/src/content/teslafest/eq-2021-green-comet.json index 086e519..4be58eb 100644 --- a/src/content/teslafest/eq-2021-green-comet.json +++ b/src/content/teslafest/eq-2021-green-comet.json @@ -2,13 +2,13 @@ "info": { "title": "The Green Comet", "releaseDate": "2024-03-21", - "shortdescription": "When Achillis decends, he brings swith him destruction ...", + "shortdescription": "When Achillis decends, he brings with him destruction ...", "releaseNumber": 6 }, "quests": [ { "questTitle": "The Green Comet", - "description": "When Achillis decends, he brings swith him destruction - time to teach him that this is a bad thing!", + "description": "When Achillis decends, he brings with him destruction - time to teach him that this is a bad thing!", "data": [ { "title": "Kama 2T", diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro index abced95..669267d 100644 --- a/src/layouts/Layout.astro +++ b/src/layouts/Layout.astro @@ -103,6 +103,8 @@ const mapped_navdata = navdata.map((item) => ({ --c-lighterpurple: #c98fff; --c-purplepink: #c105ff; --c-darkergray: #1b1b1b; + --c-reddish: #ff0077; + --c-lighter: #eee; } body { background: var(--c-lightgray); diff --git a/src/layouts/databaseSection.astro b/src/layouts/databaseSection.astro index ba99361..7fc349e 100644 --- a/src/layouts/databaseSection.astro +++ b/src/layouts/databaseSection.astro @@ -1,13 +1,15 @@ --- export interface Props { title: string + titlehidden?: boolean } -const { title } = Astro.props +const { title, titlehidden } = Astro.props +const display = titlehidden ? "display: none" : "" ---
-

{title}

+

{title}

diff --git a/src/pages/database/[...slug].astro b/src/pages/database/[...slug].astro new file mode 100644 index 0000000..62ea14a --- /dev/null +++ b/src/pages/database/[...slug].astro @@ -0,0 +1,115 @@ +--- +import { getCollection } from 'astro:content' +import TaShowcaseLayout from '../../layouts/taShowcaseLayout.astro' +import Layout from '../../layouts/Layout.astro' +import DatabaseSection from '../../layouts/databaseSection.astro' +import QuestListing from '../../components/questListing.astro' +import SmallTitle from '../../components/smallTitle.astro' + +interface store { + slug: string + group: boolean + questinfo: + | undefined + | { + slug: string + info: { + title: string + releaseDate: Date + shortdescription: string + releaseNumber: number + } + }[] + pageinfo: + | undefined + | { + title: string + shortdescription: string + } +} + +export async function getStaticPaths() { + const fulldata = await getCollection('taInfoData') + const slugdata: store[] = fulldata.map((data) => { + return { + slug: data.id, + group: false, + questinfo: undefined, + pageinfo: undefined, + } + }) + + const groupdata = await getCollection('groups') + const groups: store[] = groupdata.map((data) => { + return { + slug: data.id, + group: true, + questinfo: undefined, + pageinfo: undefined, + } + }) + + const full = slugdata.concat(groups as any) + full.map((data) => { + if (data.group) { + const coll = fulldata.filter((d) => d.id.startsWith(data.slug)) + data.questinfo = coll.map((d) => { + return { slug: d.id, info: d.data.info } + }) + data.questinfo.sort( + (a, b) => + b.info.releaseDate.valueOf() - a.info.releaseDate.valueOf() || + b.info.releaseNumber - a.info.releaseNumber + ) + const page = groupdata.find((d) => d.id === data.slug) + data.pageinfo = page?.data.info + } + }) + + return full.map((data) => ({ + params: { slug: data.slug }, + props: { + key: data.slug, + group: data.group, + questinfo: data.questinfo, + pageinfo: data.pageinfo, + }, + })) +} + +const { key, group, questinfo, pageinfo } = Astro.props +--- + +{ + !group && ( + + ) +} +{ + group && ( + + + + {questinfo!.map((quest) => ( + + ))} + + + ) +} diff --git a/src/pages/database/[slug].astro b/src/pages/database/[slug].astro deleted file mode 100644 index 94bd6f2..0000000 --- a/src/pages/database/[slug].astro +++ /dev/null @@ -1,13 +0,0 @@ ---- -import { getCollection } from 'astro:content'; -import TaShowcaseLayout from '../../layouts/taShowcaseLayout.astro' - -export async function getStaticPaths() { - const fulldata = (await getCollection('taInfoData')).map((data) => data.id) - return fulldata.map((slug) => ({ params: { slug } })) -} - -const { slug } = Astro.params ---- - - diff --git a/src/pages/database/index.astro b/src/pages/database/index.astro index bb35b72..3a6ac57 100644 --- a/src/pages/database/index.astro +++ b/src/pages/database/index.astro @@ -3,11 +3,19 @@ import { getCollection } from 'astro:content'; import Layout from '../../layouts/Layout.astro' import QuestListing from '../../components/questListing.astro' import DatabaseSection from '../../layouts/databaseSection.astro' +import Title from '../../components/title.astro'; const description = 'FGO NA TA Database' -const fulldata = await getCollection('taInfoData') +const fulldata = await getCollection('taInfoData') +const groups = await getCollection('groups') +let combined = fulldata -fulldata.sort( +for (const group of groups) { + combined = combined.filter(data => !data.id.startsWith(group.id)) +} +combined = combined.concat(groups as any) + +combined.sort( (a, b) => b.data.info.releaseDate.valueOf() - a.data.info.releaseDate.valueOf() || b.data.info.releaseNumber - a.data.info.releaseNumber ) @@ -18,8 +26,9 @@ fulldata.sort( currentpage="database" descriptionOverride={description} > - - {fulldata.map((quest) => )} + + <DatabaseSection title="NA Runs" titlehidden={true}> + {combined.map((quest) => <QuestListing { ...{...quest.data.info, slug: quest.id} } baseurl="database" />)} </DatabaseSection> </Layout> diff --git a/src/pages/index.astro b/src/pages/index.astro index 27d0182..e407c5d 100644 --- a/src/pages/index.astro +++ b/src/pages/index.astro @@ -1,6 +1,7 @@ --- import Layout from '../layouts/Layout.astro' import Hero from '../components/hero.astro' +import Title from '../components/title.astro' const description = 'This site is a WIP project by Firq. In the future, it will be used to catalogue information around FGO TA and the game in general.' @@ -11,7 +12,8 @@ const description = currentpage="home" descriptionOverride={description} > - <Hero /> + <Title maintext='FGO NA TA DATA­BASE' subtext='The all-in-one lookup for your all TA needs'/> + <Hero fadeout={true}/> </Layout> <style></style> diff --git a/src/pages/teslafest/index.astro b/src/pages/teslafest/index.astro index 19826e9..850fe73 100644 --- a/src/pages/teslafest/index.astro +++ b/src/pages/teslafest/index.astro @@ -4,6 +4,7 @@ import Layout from '../../layouts/Layout.astro' import QuestListing from '../../components/questListing.astro' import DatabaseSection from '../../layouts/databaseSection.astro' import GenericHero from '../../components/genericHero.astro'; +import Title from '../../components/title.astro'; const description = 'One of the most anticipated events of 2024 - Teslafest. Were the two weeks of time enough for all those quests, even with a parallel lottery?' const fulldata = await getCollection('teslafest') @@ -25,7 +26,7 @@ const eq_2020 = fulldata.filter((value) => value.id.startsWith("eq-2020")) currentpage="teslafest" descriptionOverride={description} > - <GenericHero text="TESLAFEST"></GenericHero> + <Title maintext='TESLA­FEST' subtext='' fadeout={true}/> <DatabaseSection title="Challenge Quest"> {cq.map((quest) => <QuestListing { ...{...quest.data.info, slug: quest.id} } baseurl="teslafest" />)} </DatabaseSection>