schreifuchs/arch-repo
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: look nice
All checks were successful
Release / publish (push) Successful in 1m26s
Details

Browse Source
This commit is contained in:
schreifuchs
2025-10-21 13:16:22 +02:00
parent 4c7ba04cbb
commit c90030075c
7 changed files with 48 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
src/app.css
View File

@@ -7,16 +7,16 @@
@custom-variant dark (&:where(.dark, .dark *)); @custom-variant dark (&:where(.dark, .dark *));
@theme { @theme {
--color-primary-50: #fff5f2; --color-primary-50: #f0f4f7;
--color-primary-100: #fff1ee; --color-primary-100: #dfe4e9;
--color-primary-200: #ffe4de; --color-primary-200: #acb4bd;
--color-primary-300: #ffd5cc; --color-primary-300: #828e9a;
--color-primary-400: #ffbcad; --color-primary-400: #596978;
--color-primary-500: #fe795d; --color-primary-500: #46596b;
--color-primary-600: #ef562f; --color-primary-600: #2f4356;
--color-primary-700: #eb4f27; --color-primary-700: #263645;
--color-primary-800: #cc4522; --color-primary-800: #1c2834;
--color-primary-900: #a5371b; --color-primary-900: #131b22;
--color-secondary-50: #f0f9ff; --color-secondary-50: #f0f9ff;
--color-secondary-100: #e0f2fe; --color-secondary-100: #e0f2fe;

2
src/app.html
View File

@@ -1,5 +1,5 @@
<!doctype html> <!doctype html>
<html lang="en"> <html lang="de">
<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" />

6
src/lib/artefact.remote.ts
View File

@@ -13,10 +13,10 @@ export const getArtefacts = query(
if (tags.length == 0) return a; if (tags.length == 0) return a;
return a.filter((a) => { return a.filter((a) => {
for (const tag of a.tags) { for (const tag of tags) {
if (tags.includes(tag)) return true; if (!a.tags.includes(tag)) return false;
} }
return false; return true;
}); });
} }
); );

30
src/lib/components/Artefact.svelte
View File

@@ -25,15 +25,15 @@
function getStatusColor(status: Status): string { function getStatusColor(status: Status): string {
switch (status) { switch (status) {
case 'Fehlt': case 'Fehlt':
return 'bg-red-500'; // Missing return 'bg-red-600 text-white'; // Missing
case 'In Bearbeitung': case 'In Bearbeitung':
return 'bg-yellow-400'; // In progress return 'bg-yellow-400 text-black'; // In progress
case 'Erledigt': case 'Erledigt':
return 'bg-green-500'; // Done return 'bg-green-600 text-white'; // Done
case 'Geprüft': case 'Geprüft':
return 'bg-green-800'; // Checked return 'bg-green-800 text-white'; // Checked
default: default:
return 'bg-red-500'; // Fallback return 'bg-red-500 text-white'; // Fallback
} }
} }
function tagParts(tag: string): string[] { function tagParts(tag: string): string[] {
@@ -45,8 +45,8 @@
} }
</script> </script>
<Card class="grid min-w-full grid-cols-2 gap-5 p-5"> <Card class="flex min-w-full flex-col justify-start gap-5 p-5">
<h1 class="col-span-2 break-words hyphens-auto">{artefact.title}</h1> <h3 class="col-span-2 break-words hyphens-auto">{artefact.title}</h3>
<div class="col-span-2 flex flex-wrap items-start justify-start"> <div class="col-span-2 flex flex-wrap items-start justify-start">
{#each artefact.tags as tag} {#each artefact.tags as tag}
<button <button
@@ -76,14 +76,16 @@
{/await} {/await}
{/each} {/each}
</div> </div>
<p class="col-span-2 my-5">{artefact.description}</p> <p class="col-span-2 grow-1">{artefact.description}</p>
<p <div class=" grid w-full grid-cols-2 gap-5 self-end">
class={`flex items-center justify-center rounded-3xl p-2 text-white ${getStatusColor(artefact.status)}`} <p
> class={`flex items-center justify-center rounded-lg p-2 ${getStatusColor(artefact.status)}`}
{artefact.status} >
</p> {artefact.status}
<Button onclick={() => (edit = true)}>Edit</Button> </p>
<Button onclick={() => (edit = true)}>Edit</Button>
</div>
</Card> </Card>
<Modal bind:open={edit}> <Modal bind:open={edit}>

6
src/lib/components/ArtefactsView.svelte
View File

@@ -2,7 +2,7 @@
import { getArtefacts } from '$lib/artefact.remote'; import { getArtefacts } from '$lib/artefact.remote';
import Artefact from '$lib/components/Artefact.svelte'; import Artefact from '$lib/components/Artefact.svelte';
import { Button, Input } from 'flowbite-svelte'; import { Button, Input } from 'flowbite-svelte';
import { TrashBinOutline } from 'flowbite-svelte-icons'; import { PlusOutline, TrashBinOutline } from 'flowbite-svelte-icons';
let { view }: { view: string } = $props(); let { view }: { view: string } = $props();
@@ -17,7 +17,7 @@
color="red" color="red"
onclick={() => { onclick={() => {
tags = tags.filter((t) => t != tag); tags = tags.filter((t) => t != tag);
}}><TrashBinOutline /></Button }}><TrashBinOutline class="size-10" /></Button
> >
{/each} {/each}
<Input class="col-span-4" bind:value={newTag}></Input> <Input class="col-span-4" bind:value={newTag}></Input>
@@ -25,7 +25,7 @@
onclick={() => { onclick={() => {
tags.push(newTag); tags.push(newTag);
newTag = ''; newTag = '';
}}>+</Button }}><PlusOutline /></Button
> >
</div> </div>

13
src/routes/+layout.svelte
View File

@@ -2,15 +2,18 @@
import { views } from '$lib/artefact'; import { views } from '$lib/artefact';
import { state } from '$lib/view.svelte'; import { state } from '$lib/view.svelte';
import '../app.css'; import '../app.css';
import { Navbar, NavBrand, NavLi, NavUl, NavHamburger, Select } from 'flowbite-svelte'; import { Navbar, NavBrand, NavLi, NavUl, NavHamburger, Select, Label } from 'flowbite-svelte';
let { children } = $props(); let { children } = $props();
$inspect(state.view); $inspect(state.view);
</script> </script>
<!-- <svelte:head>Repo Mod</svelte:head> --> <svelte:head>
<title>Repo Mod</title>
<meta name="description" content="This is where the description goes for SEO" />
</svelte:head>
<Navbar> <Navbar class="shadow">
<NavBrand href="/"> <NavBrand href="/">
<span class="self-center text-xl font-semibold whitespace-nowrap dark:text-white">Repo Mod</span <span class="self-center text-xl font-semibold whitespace-nowrap dark:text-white">Repo Mod</span
> >
@@ -29,7 +32,7 @@
}))} }))}
/> />
<!-- <NavLi href="/">Home</NavLi> --> <NavLi href="/">Projekte</NavLi>
<!-- <NavLi href="/about">About</NavLi> --> <!-- <NavLi href="/about">About</NavLi> -->
<!-- <NavLi href="/docs/components/navbar">Navbar</NavLi> --> <!-- <NavLi href="/docs/components/navbar">Navbar</NavLi> -->
<!-- <NavLi href="/pricing">Pricing</NavLi> --> <!-- <NavLi href="/pricing">Pricing</NavLi> -->
@@ -37,6 +40,6 @@
</NavUl> </NavUl>
</Navbar> </Navbar>
<main class="mx-10 mt-5 xl:mx-44"> <main class="mx-10 mt-5 mb-5 xl:mx-44">
{@render children?.()} {@render children?.()}
</main> </main>

13
src/routes/+page.svelte
View File

@@ -5,13 +5,14 @@
<div class="grid grid-cols-1 gap-5 sm:grid-cols-2 lg:grid-cols-3"> <div class="grid grid-cols-1 gap-5 sm:grid-cols-2 lg:grid-cols-3">
{#each state.projects as project (project.uuid)} {#each state.projects as project (project.uuid)}
<Card class="flex min-w-full flex-col gap-5 p-5"> <Card class="flex min-w-full flex-col justify-between gap-5 p-5">
<h1 class="col-span-2 break-words hyphens-auto">{project.name}</h1> <h1 class="col-span-2 break-words hyphens-auto">{project.name}</h1>
<div class="flex flex-col justify-between gap-5">
<p class={`flex items-center justify-center rounded-3xl p-2 `}> <p class={`flex items-center justify-center rounded-3xl p-2 `}>
{project.status}% {project.status}%
</p> </p>
<Button href={`/project/${project.uuid}`}>Edit</Button> <Button href={`/project/${project.uuid}`}>Edit</Button>
</div>
</Card> </Card>
{/each} {/each}
</div> </div>