From 19b97392430b5a68d006cc47938ee751d2f3889d Mon Sep 17 00:00:00 2001 From: Aandeel <65628869+aandeel@users.noreply.github.com> Date: Thu, 13 Aug 2026 04:15:02 +0100 Subject: [PATCH 01/10] Init Main Bulk visual update --- src/app.html | 8 +- src/lib/MDLayout.svelte | 12 +- src/lib/Topbar.svelte | 79 +- src/lib/reusables/ArticleImage.svelte | 43 + src/lib/reusables/Discord.svelte | 27 +- src/lib/reusables/ResourceCard.svelte | 22 + src/lib/reusables/Version.svelte | 27 +- src/lib/sidebar/SearchBox.svelte | 28 +- src/lib/sidebar/Sidebar.svelte | 152 +-- src/lib/sidebar/SidebarSearchDialog.svelte | 94 +- .../sidebar/navigation/SidebarCategory.svelte | 15 +- .../sidebar/navigation/SidebarHeading.svelte | 2 +- src/lib/sidebar/navigation/SidebarPage.svelte | 7 +- .../navigation/SidebarPlaceholder.svelte | 2 +- src/lib/sidebar/tabs/VersionPicker.svelte | 23 +- src/routes/+error.svx | 18 +- src/routes/+layout.svelte | 25 +- src/routes/+page.svx | 143 ++- .../smithing-trims/+page.svx | 14 +- src/routes/guide/getting-started/+page.svx | 10 +- src/routes/resources/+page.svx | 471 ++++++--- src/styles/admonitions.css | 66 +- src/styles/app.css | 981 +++++++++++++++++- src/styles/code_theme.css | 5 +- src/styles/fonts.css | 33 +- src/styles/home.css | 485 +++++++++ src/styles/md.css | 380 ++++++- src/styles/resources.css | 153 +++ 28 files changed, 2830 insertions(+), 495 deletions(-) create mode 100644 src/lib/reusables/ArticleImage.svelte create mode 100644 src/lib/reusables/ResourceCard.svelte create mode 100644 src/styles/home.css create mode 100644 src/styles/resources.css diff --git a/src/app.html b/src/app.html index e1fda339..d776fde3 100644 --- a/src/app.html +++ b/src/app.html @@ -2,17 +2,13 @@ - - - - + - - + + export { default as img } from "./reusables/ArticleImage.svelte"; + + + + + + + + diff --git a/src/lib/reusables/Discord.svelte b/src/lib/reusables/Discord.svelte index f64c6fc3..11453e64 100644 --- a/src/lib/reusables/Discord.svelte +++ b/src/lib/reusables/Discord.svelte @@ -2,21 +2,16 @@ import IconDiscord from "~icons/tabler/brand-discord"; -
-
- -
-
- - JOIN OUR DISCORD SERVER -
-

- If you need any more help with your datapacks, don't hesitate to join the - Datapack Hub Discord server! -
- Join us now! - https://discord.gg/xHTHbZqXr6 -

+
+ diff --git a/src/lib/reusables/ResourceCard.svelte b/src/lib/reusables/ResourceCard.svelte new file mode 100644 index 00000000..197472c0 --- /dev/null +++ b/src/lib/reusables/ResourceCard.svelte @@ -0,0 +1,22 @@ + + + + {type} +

{title}

+ {#if description} +

{description}

+ {/if} +
diff --git a/src/lib/reusables/Version.svelte b/src/lib/reusables/Version.svelte index 90bba03f..b6f03f68 100644 --- a/src/lib/reusables/Version.svelte +++ b/src/lib/reusables/Version.svelte @@ -2,6 +2,7 @@ import { latestMCData } from "$lib/stores.svelte"; import IconTick from "~icons/tabler/rosette-discount-check"; import IconPencil from "~icons/tabler/pencil"; + interface Props { version: string; } @@ -10,22 +11,16 @@
-
- {#if version == latestMCData.gameVersion} - - {:else} - - {/if} + class="version-callout {version == latestMCData.gameVersion + ? 'version-callout--current' + : 'version-callout--outdated'} not-prose"> + {#if version == latestMCData.gameVersion} + + Validated for Minecraft Java {version} + {:else} + - {#if version == latestMCData.gameVersion} - This page is validated and up to date with Minecraft Java: {version} - {:else} - This page was last updated with information for Minecraft {version}, and may be missing new features and - changes. There is a chance it still works, but try it at your own risk! - {/if} + Last reviewed for Minecraft {version}. Newer releases may include changes that are not covered on this page. -
+ {/if}
diff --git a/src/lib/sidebar/SearchBox.svelte b/src/lib/sidebar/SearchBox.svelte index a51aff8e..f6878de1 100644 --- a/src/lib/sidebar/SearchBox.svelte +++ b/src/lib/sidebar/SearchBox.svelte @@ -2,28 +2,30 @@ // ! IMPORTANT: If you want to add pages or categories, this is not the place to do it! import IconSearch from "~icons/tabler/search"; - import type { SvelteComponent } from "svelte"; import SidebarSearchDialog from "./SidebarSearchDialog.svelte"; - let dialog: SvelteComponent; - + let dialog: any; let results: Page[] = $state([]); - let { keyActivated }: { keyActivated?: boolean } = $props(); + type Props = { + keyActivated?: boolean; + variant?: "sidebar" | "hero"; + }; + + let { keyActivated = false, variant = "sidebar" }: Props = $props(); + + const prompt = $derived(variant === "hero" ? "Search guides, concepts, commands..." : "Search pages"); diff --git a/src/lib/sidebar/Sidebar.svelte b/src/lib/sidebar/Sidebar.svelte index 9abbf837..8813e2b6 100644 --- a/src/lib/sidebar/Sidebar.svelte +++ b/src/lib/sidebar/Sidebar.svelte @@ -1,10 +1,9 @@ - + + +{#if windowInfo.isNavOpen} + +{/if} diff --git a/src/lib/sidebar/SidebarSearchDialog.svelte b/src/lib/sidebar/SidebarSearchDialog.svelte index 752b7046..3902ebf6 100644 --- a/src/lib/sidebar/SidebarSearchDialog.svelte +++ b/src/lib/sidebar/SidebarSearchDialog.svelte @@ -1,6 +1,7 @@ (e.key == "k" && e.ctrlKey ? showModalWithEvent(e) : null)} + onkeydown={e => (e.key.toLowerCase() === "k" && (e.ctrlKey || e.metaKey) ? showModalWithEvent(e) : null)} onclick={e => { e.target === dialog ? dialog.close() : null; }} /> - -
+ +
+ -
+ +
+ +
+ {#if searchState === "loading"} +
Preparing search...
+ {:else if searchState === "error"} +
Search could not be loaded. Please try again.
+ {:else if searchTerm.trim() === ""} +
Search guides, concepts, commands, and datapack files.
+ {:else if results.length === 0} +
No pages found for β€œ{searchTerm}”.
+ {:else} {#each results as result} { dialog.close(); - if (windowInfo.width < 640) { - windowInfo.isNavOpen = false; - } + if (windowInfo.width < 768) windowInfo.isNavOpen = false; }} href={result.url}> - -

- {searchTerm === "" - ? "" - : searchState === "waiting" - ? "Loading data..." - : results.length === 0 - ? "No results" - : results.length + " result(s) found!"} -

+ {/if} +
- +
diff --git a/src/lib/sidebar/navigation/SidebarCategory.svelte b/src/lib/sidebar/navigation/SidebarCategory.svelte index 4880955f..b49ff6d9 100644 --- a/src/lib/sidebar/navigation/SidebarCategory.svelte +++ b/src/lib/sidebar/navigation/SidebarCategory.svelte @@ -14,17 +14,20 @@ const Icon = $derived(icon); -
(windowInfo.isNavOpen = true)} class="w-full group marker:hidden"> - +
{ + if (event.currentTarget.open) windowInfo.isNavOpen = true; + }} + class="nav-category"> + {#if windowInfo.isNavOpen} -

{name}

- + {name} + {/if}
{#if windowInfo.isNavOpen} -
+ {/if} diff --git a/src/lib/sidebar/navigation/SidebarHeading.svelte b/src/lib/sidebar/navigation/SidebarHeading.svelte index 45487215..67819a16 100644 --- a/src/lib/sidebar/navigation/SidebarHeading.svelte +++ b/src/lib/sidebar/navigation/SidebarHeading.svelte @@ -4,4 +4,4 @@ const { label } = $props(); -{label} +{label} diff --git a/src/lib/sidebar/navigation/SidebarPage.svelte b/src/lib/sidebar/navigation/SidebarPage.svelte index def8d505..41040170 100644 --- a/src/lib/sidebar/navigation/SidebarPage.svelte +++ b/src/lib/sidebar/navigation/SidebarPage.svelte @@ -17,10 +17,9 @@ (windowInfo.width < 768 ? (windowInfo.isNavOpen = !windowInfo.isNavOpen) : null)} - class="hover:bg-stone-700 hover:text-white hover:font-medium py-1 rounded-lg flex gap-2 pl-1 items-center focus-visible:outline-2 focus-visible:outline-dph-orange {wikiPage === - page.route.id - ? 'bg-stone-900/70' - : ''}"> + aria-current={wikiPage === page.route.id ? "page" : undefined} + title={windowInfo.isNavOpen ? undefined : label} + class="nav-item {wikiPage === page.route.id ? 'nav-item--active' : ''}"> {#if windowInfo.isNavOpen} diff --git a/src/lib/sidebar/navigation/SidebarPlaceholder.svelte b/src/lib/sidebar/navigation/SidebarPlaceholder.svelte index 528533ea..75c6bc6d 100644 --- a/src/lib/sidebar/navigation/SidebarPlaceholder.svelte +++ b/src/lib/sidebar/navigation/SidebarPlaceholder.svelte @@ -11,7 +11,7 @@ const Icon = $derived(icon); -
+