Bommels05/Modrinth
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Run pnpm format

Browse Source
This commit is contained in:
venashial 2022-08-03 00:24:44 -07:00
parent e17eb02341
commit 13c417fcee
21 changed files with 579 additions and 565 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
theseus_gui/src/app.html
View File

@ -3,9 +3,9 @@
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="preload" href="/fonts/InterRegular.woff2" as="font" type="font/woff2" crossorigin> <link rel="preload" href="/fonts/InterRegular.woff2" as="font" type="font/woff2" crossorigin />
<link rel="preload" href="/fonts/InterBold.woff2" as="font" type="font/woff2" crossorigin> <link rel="preload" href="/fonts/InterBold.woff2" as="font" type="font/woff2" crossorigin />
<link rel="preload" href="/fonts/InterSemiBold.woff2" as="font" type="font/woff2" crossorigin> <link rel="preload" href="/fonts/InterSemiBold.woff2" as="font" type="font/woff2" crossorigin />
%sveltekit.head% %sveltekit.head%
</head> </head>
<body class="base theme-dark" style="background-color: hsl(220, 13%, 15%)"> <body class="base theme-dark" style="background-color: hsl(220, 13%, 15%)">

7
theseus_gui/src/components/CardRow.svelte
View File

@ -9,7 +9,6 @@
</div> </div>
</div> </div>
<style lang="postcss"> <style lang="postcss">
.card-row { .card-row {
display: flex; display: flex;
@ -25,8 +24,8 @@
&::after { &::after {
flex: 1 1; flex: 1 1;
content: " "; content: ' ';
background-color: hsla(0,0%,100%,0.2); background-color: hsla(0, 0%, 100%, 0.2);
height: 0.2rem; height: 0.2rem;
border-radius: var(--rounded-max); border-radius: var(--rounded-max);
} }
@ -48,7 +47,7 @@
} }
&:nth-of-type(even) { &:nth-of-type(even) {
background-color: hsla(0,0%,0%,0.2); background-color: hsla(0, 0%, 0%, 0.2);
} }
} }
</style> </style>

12
theseus_gui/src/components/GlobalSettings.svelte
View File

@ -1,7 +1,7 @@
<script lang="ts"> <script lang="ts">
import { Field, Slider, TextInput, Button } from "omorphia" import { Field, Slider, TextInput, Button } from 'omorphia';
import TitledSection from "$components/TitledSection.svelte" import TitledSection from '$components/TitledSection.svelte';
import WindowSettings from "$components/WindowSettings.svelte" import WindowSettings from '$components/WindowSettings.svelte';
export let maxConcurrentDownloads: number = 20; export let maxConcurrentDownloads: number = 20;
</script> </script>
@ -9,10 +9,10 @@
<div class="section"> <div class="section">
<TitledSection title="Downloads"> <TitledSection title="Downloads">
<Field label="Max concurrent downloads"> <Field label="Max concurrent downloads">
<Slider min=1 max=64 bind:value={maxConcurrentDownloads} /> <Slider min="1" max="64" bind:value={maxConcurrentDownloads} />
</Field> </Field>
</TitledSection> </TitledSection>
<TitledSection title="Override game resolution" toggleable=true> <TitledSection title="Override game resolution" toggleable="true">
<WindowSettings /> <WindowSettings />
</TitledSection> </TitledSection>
<TitledSection title="Profile hooks"> <TitledSection title="Profile hooks">
@ -50,7 +50,7 @@
<TextInput value="2048" /> <TextInput value="2048" />
</Field> </Field>
<Field label="Arguments"> <Field label="Arguments">
<TextInput/> <TextInput />
</Field> </Field>
</TitledSection> </TitledSection>
</div> </div>

15
theseus_gui/src/components/Instance.svelte
View File

@ -1,6 +1,6 @@
<script lang="ts"> <script lang="ts">
import IconPlayFilled from "virtual:icons/carbon/play-filled-alt" import IconPlayFilled from 'virtual:icons/carbon/play-filled-alt';
import IconBadgeCheck from "virtual:icons/heroicons-solid/badge-check" import IconBadgeCheck from 'virtual:icons/heroicons-solid/badge-check';
export let title: string; export let title: string;
export let id: string; export let id: string;
@ -9,9 +9,14 @@
export let image: string; export let image: string;
</script> </script>
<a class="instance" href="/library/instance/{id}/settings" <a
style:background-image="linear-gradient(5deg, hsla(0,0%,0%,0.8) 0%, hsla(0,0%,0%,0) 100%), url('{image}')"> class="instance"
<div class="instance__version">{version}{#if modpack}<IconBadgeCheck />{/if}</div> href="/library/instance/{id}/settings"
style:background-image="linear-gradient(5deg, hsla(0,0%,0%,0.8) 0%, hsla(0,0%,0%,0) 100%), url('{image}')"
>
<div class="instance__version">
{version}{#if modpack}<IconBadgeCheck />{/if}
</div>
<div class="instance__title">{title}</div> <div class="instance__title">{title}</div>
<button class="play-button"> <button class="play-button">
<IconPlayFilled /> <IconPlayFilled />

10
theseus_gui/src/components/TitledSection.svelte
View File

@ -1,10 +1,10 @@
<script lang="ts"> <script lang="ts">
import { Checkbox } from "omorphia" import { Checkbox } from 'omorphia';
export let title: string export let title: string;
export let toggleable: boolean = false export let toggleable: boolean = false;
export let enabled: boolean = false export let enabled: boolean = false;
</script> </script>
<div class="section"> <div class="section">
@ -32,7 +32,7 @@
&::after { &::after {
flex: 1 1; flex: 1 1;
content: " "; content: ' ';
background-color: hsla(0, 0%, 100%, 0.2); background-color: hsla(0, 0%, 100%, 0.2);
height: 0.2rem; height: 0.2rem;
border-radius: var(--rounded-max); border-radius: var(--rounded-max);

14
theseus_gui/src/components/VerticalNav.svelte
View File

@ -1,21 +1,19 @@
<script lang="ts"> <script lang="ts">
import { SvelteComponent } from 'svelte' import { SvelteComponent } from 'svelte';
import { page } from "$app/stores"; import { page } from '$app/stores';
export let items: { export let items: {
label: string, label: string;
/** Page href, without slash prefix */ /** Page href, without slash prefix */
href: string, href: string;
icon: SvelteComponent icon: SvelteComponent;
}[]; }[];
/** Path level in URL, zero-indexed */ /** Path level in URL, zero-indexed */
export let level = 0; export let level = 0;
let path: string[]; let path: string[];
$: path = $page.url.pathname $: path = $page.url.pathname.substring(1).split('/');
.substring(1)
.split('/')
</script> </script>
<div class="vertical-nav"> <div class="vertical-nav">

2
theseus_gui/src/components/WindowSettings.svelte
View File

@ -1,5 +1,5 @@
<script lang="ts"> <script lang="ts">
import { Field, TextInput } from "omorphia" import { Field, TextInput } from 'omorphia';
</script> </script>
<div class="section"> <div class="section">

2
theseus_gui/src/hooks.ts
View File

@ -1,6 +1,6 @@
/** @type {import('@sveltejs/kit').Handle} */ /** @type {import('@sveltejs/kit').Handle} */
export async function handle({ event, resolve }) { export async function handle({ event, resolve }) {
return await resolve(event, { return await resolve(event, {
ssr: false, ssr: false
}); });
} }

8
theseus_gui/src/layout/Page.svelte
View File

@ -1,8 +1,8 @@
<script lang="ts"> <script lang="ts">
import { Svrollbar } from 'svrollbar' import { Svrollbar } from 'svrollbar';
let viewport: Element let viewport: Element;
let contents: Element let contents: Element;
</script> </script>
<div class="page"> <div class="page">
@ -24,7 +24,7 @@
--svrollbar-track-opacity: 0; --svrollbar-track-opacity: 0;
--svrollbar-thumb-width: 8px; --svrollbar-thumb-width: 8px;
--svrollbar-thumb-background: hsla(216,5%,60%); --svrollbar-thumb-background: hsla(216, 5%, 60%);
--svrollbar-thumb-opacity: 0.9; --svrollbar-thumb-opacity: 0.9;
} }

28
theseus_gui/src/layout/Sidebar.svelte
View File

@ -1,18 +1,18 @@
<script lang="ts"> <script lang="ts">
import VerticalNav from '../components/VerticalNav.svelte' import VerticalNav from '../components/VerticalNav.svelte';
import IconHome from 'virtual:icons/lucide/home' import IconHome from 'virtual:icons/lucide/home';
import IconSearch from 'virtual:icons/heroicons-outline/search' import IconSearch from 'virtual:icons/heroicons-outline/search';
import IconPlus from 'virtual:icons/heroicons-outline/plus' import IconPlus from 'virtual:icons/heroicons-outline/plus';
import IconLibrary from 'virtual:icons/lucide/library'; import IconLibrary from 'virtual:icons/lucide/library';
import IconSettings from 'virtual:icons/lucide/settings' import IconSettings from 'virtual:icons/lucide/settings';
import { page } from "$app/stores"; import { page } from '$app/stores';
import { Button } from 'omorphia' import { Button } from 'omorphia';
</script> </script>
<div class="sidebar"> <div class="sidebar">
<div class="account"> <div class="account">
<div class="account__heads"> <div class="account__heads">
<img src="https://mc-heads.net/avatar/venashial" alt="Minecraft head"/> <img src="https://mc-heads.net/avatar/venashial" alt="Minecraft head" />
</div> </div>
<a class="account__info" href="/settings/accounts"> <a class="account__info" href="/settings/accounts">
@ -21,23 +21,25 @@
</a> </a>
</div> </div>
<VerticalNav items={[ <VerticalNav
items={[
{ {
label: 'Home', label: 'Home',
href: '', href: '',
icon: IconHome, icon: IconHome
}, },
{ {
label: 'Search', label: 'Search',
href: 'search', href: 'search',
icon: IconSearch, icon: IconSearch
}, },
{ {
label: 'Library', label: 'Library',
href: 'library', href: 'library',
icon: IconLibrary, icon: IconLibrary
} }
]}/> ]}
/>
<div class="instance-list"> <div class="instance-list">
<div class="instance-list__title">Instances</div> <div class="instance-list__title">Instances</div>

8
theseus_gui/src/layout/StatusBar.svelte
View File

@ -2,12 +2,10 @@
import IconChevronLeft from 'virtual:icons/lucide/chevron-left'; import IconChevronLeft from 'virtual:icons/lucide/chevron-left';
import IconChevronRight from 'virtual:icons/lucide/chevron-right'; import IconChevronRight from 'virtual:icons/lucide/chevron-right';
import IconCaretRight from 'virtual:icons/carbon/caret-right'; import IconCaretRight from 'virtual:icons/carbon/caret-right';
import { page } from '$app/stores' import { page } from '$app/stores';
let path: string[]; let path: string[];
$: path = $page.url.pathname $: path = $page.url.pathname.substring(1).split('/');
.substring(1)
.split('/')
</script> </script>
<div class="status-bar"> <div class="status-bar">
@ -58,7 +56,7 @@
} }
:global(.icon) { :global(.icon) {
color: var(--color-text-lightest) color: var(--color-text-lightest);
} }
} }

28
theseus_gui/src/routes/index.svelte
View File

@ -1,27 +1,41 @@
<script lang="ts"> <script lang="ts">
import Instance from '$components/Instance.svelte';
import Instance from "$components/Instance.svelte"; import CardRow from '$components/CardRow.svelte';
import CardRow from "$components/CardRow.svelte";
</script> </script>
<CardRow title="Jump back in"> <CardRow title="Jump back in">
{#each Array(5) as _, i} {#each Array(5) as _, i}
<Instance title="New Caves" id="234" version="1.18" image="https://i.ibb.co/8KDxBwq/patchnotes-cavesandcliffs.jpg" /> <Instance
title="New Caves"
id="234"
version="1.18"
image="https://i.ibb.co/8KDxBwq/patchnotes-cavesandcliffs.jpg"
/>
{/each} {/each}
</CardRow> </CardRow>
<CardRow title="Popular packs"> <CardRow title="Popular packs">
{#each Array(5) as _, i} {#each Array(5) as _, i}
<Instance title="All of Fabric 5" id="567" version="1.18.1" image="https://media.forgecdn.net/avatars/458/829/637733746768258525.png" modpack /> <Instance
title="All of Fabric 5"
id="567"
version="1.18.1"
image="https://media.forgecdn.net/avatars/458/829/637733746768258525.png"
modpack
/>
{/each} {/each}
</CardRow> </CardRow>
<CardRow title="New releases"> <CardRow title="New releases">
{#each Array(5) as _, i} {#each Array(5) as _, i}
<Instance title="New Caves" id="234" version="1.18.2" image="https://i.ibb.co/8KDxBwq/patchnotes-cavesandcliffs.jpg" /> <Instance
title="New Caves"
id="234"
version="1.18.2"
image="https://i.ibb.co/8KDxBwq/patchnotes-cavesandcliffs.jpg"
/>
{/each} {/each}
</CardRow> </CardRow>
<style lang="postcss"> <style lang="postcss">
</style> </style>

3
theseus_gui/src/routes/library/index.svelte
View File

@ -1,11 +1,8 @@
<script context="module" lang="ts"> <script context="module" lang="ts">
</script> </script>
<script lang="ts"> <script lang="ts">
</script> </script>
<style lang="postcss"> <style lang="postcss">
</style> </style>

21
theseus_gui/src/routes/library/instance/[id]/__layout.svelte
View File

@ -1,29 +1,32 @@
<script lang="ts"> <script lang="ts">
import VerticalNav from "$components/VerticalNav.svelte"; import VerticalNav from '$components/VerticalNav.svelte';
import IconPackage from 'virtual:icons/lucide/package' import IconPackage from 'virtual:icons/lucide/package';
import IconAdjustments from 'virtual:icons/heroicons-outline/adjustments' import IconAdjustments from 'virtual:icons/heroicons-outline/adjustments';
import IconFileText from 'virtual:icons/lucide/file-text' import IconFileText from 'virtual:icons/lucide/file-text';
</script> </script>
<div class="layout-instance"> <div class="layout-instance">
<div class="instance-sidebar"> <div class="instance-sidebar">
<VerticalNav level={3} items={[ <VerticalNav
level={3}
items={[
{ {
label: 'Mods', label: 'Mods',
href: 'mods', href: 'mods',
icon: IconPackage, icon: IconPackage
}, },
{ {
label: 'Settings', label: 'Settings',
href: 'settings', href: 'settings',
icon: IconAdjustments, icon: IconAdjustments
}, },
{ {
label: 'Logs', label: 'Logs',
href: 'logs', href: 'logs',
icon: IconFileText, icon: IconFileText
} }
]}/> ]}
/>
</div> </div>
<div class="layout-instance__page"> <div class="layout-instance__page">

9
theseus_gui/src/routes/library/instance/[id]/settings.svelte
View File

@ -1,16 +1,15 @@
<script context="module" lang="ts"> <script context="module" lang="ts">
</script> </script>
<script lang="ts"> <script lang="ts">
import GlobalSettings from "$components/GlobalSettings.svelte" import GlobalSettings from '$components/GlobalSettings.svelte';
import TitledSection from "$components/TitledSection.svelte" import TitledSection from '$components/TitledSection.svelte';
export let overrideGlobalSettings = false export let overrideGlobalSettings = false;
</script> </script>
<div class="section"> <div class="section">
<TitledSection title="Override global settings" toggleable=true> <TitledSection title="Override global settings" toggleable="true">
<GlobalSettings /> <GlobalSettings />
</TitledSection> </TitledSection>
</div> </div>

3
theseus_gui/src/routes/settings.svelte
View File

@ -1,9 +1,8 @@
<script context="module" lang="ts"> <script context="module" lang="ts">
</script> </script>
<script lang="ts"> <script lang="ts">
import GlobalSettings from "$components/GlobalSettings.svelte" import GlobalSettings from '$components/GlobalSettings.svelte';
</script> </script>
<div class="section"> <div class="section">

4
theseus_gui/src/stores/account.ts
View File

@ -1,3 +1,3 @@
import { writable } from 'svelte/store' import { writable } from 'svelte/store';
export const token = writable('') export const token = writable('');

6
theseus_gui/src/styles/components.postcss
View File

@ -5,11 +5,11 @@
padding: 0.5rem 0.75rem; padding: 0.5rem 0.75rem;
border-radius: var(--rounded-sm); border-radius: var(--rounded-sm);
box-shadow: var(--shadow-inset-sm) var(--shadow-raised); box-shadow: var(--shadow-inset-sm) var(--shadow-raised);
transition: background-color 0.2s ease-in-out, transition: background-color 0.2s ease-in-out, color 0.1s ease-in-out;
color 0.1s ease-in-out;
color: var(--color-text-light); color: var(--color-text-light);
&:hover, &.active { &:hover,
&.active {
color: var(--color-text); color: var(--color-text);
} }

2
theseus_gui/src/styles/global.postcss
View File

@ -8,5 +8,5 @@
--color-bg: hsl(217, 9%, 18%); --color-bg: hsl(217, 9%, 18%);
--color-brand: hsl(145, 75%, 45%); --color-brand: hsl(145, 75%, 45%);
--color-brand-contrast: black; --color-brand-contrast: black;
--sub-page-bg: hsl(220, 9%, 13%) --sub-page-bg: hsl(220, 9%, 13%);
} }