lucalise/ghostv2
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: create theme for common styles

Browse Source
This commit is contained in:
lucalise
2026-01-18 12:17:33 -08:00
parent fb62081ca8
commit a9a69fc1db
3 changed files with 52 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
src/lib/Repos.svelte
View File

@@ -86,23 +86,20 @@
};
const languageColors: Record<string, string> = {
GDScript: 'bg-blue-500',
'C#': 'bg-green-500',
Rust: 'bg-orange-500',
C: 'bg-gray-500',
'C++': 'bg-pink-500'
GDScript: 'bg-lang-gdscript',
Rust: 'bg-lang-rust'
};
</script>
<div class="rounded-xl bg-gray-900 p-6 shadow-xl ring-1 ring-gray-800">
<div class="rounded-xl bg-surface p-6 shadow-xl ring-1 ring-border">
<div class="mb-6 flex items-center justify-between">
<div class="flex items-center gap-3">
<GitBranch class="h-6 w-6 text-gray-400" />
<h2 class="text-xl font-semibold text-white">Import Git Repository</h2>
<span class="text-xs text-gray-500">repo must be public</span>
<GitBranch class="h-6 w-6 text-icon" />
<h2 class="text-xl font-semibold text-text-primary">Import Git Repository</h2>
<span class="text-xs text-text-muted">repo must be public</span>
</div>
<Button.Root
class="flex items-center gap-2 rounded-lg px-3 py-2 text-sm text-gray-400 transition-colors hover:bg-gray-800 hover:text-white"
class="flex items-center gap-2 rounded-lg px-3 py-2 text-sm text-text-secondary transition-colors hover:bg-surface-hover hover:text-text-primary"
onclick={() => (searching ? searchResultsQuery.refetch() : query.refetch())}
>
<RefreshCw class="h-4 w-4" />
@@ -111,34 +108,35 @@
</div>
<div class="relative mb-6">
<Search class="absolute top-1/2 left-3 h-4 w-4 -translate-y-1/2 text-gray-500" />
<Search class="absolute top-1/2 left-3 h-4 w-4 -translate-y-1/2 text-icon-muted" />
<input
type="text"
bind:value={searchQuery}
placeholder="Search repositories..."
class="w-full rounded-lg border border-gray-700 bg-gray-800 py-2.5 pr-4 pl-10 text-white placeholder-gray-500 transition-colors outline-none focus:border-blue-500 focus:ring-1 focus:ring-blue-500"
class="w-full rounded-lg border border-border-hover bg-surface-hover py-2.5 pr-4 pl-10 text-text-primary placeholder-text-muted transition-colors outline-none focus:border-border-focus focus:ring-1 focus:ring-border-focus"
/>
</div>
<div class="space-y-3">
{#each repos as repo (repo.id)}
<div
class="group flex items-center justify-between rounded-lg border border-gray-800 bg-gray-800/40 p-4 transition-colors hover:border-gray-700 hover:bg-gray-800"
class="group flex items-center justify-between rounded-lg border border-border bg-surface-muted p-4 transition-colors hover:border-border-hover hover:bg-surface-hover"
>
<div class="flex-1">
<div class="flex items-center gap-2">
<h3 class="truncate font-medium text-white">{repo.name}</h3>
<h3 class="truncate font-medium text-text-primary">{repo.name}</h3>
</div>
{#if repo.description}
<p class="mt-1 truncate text-sm text-gray-400">{repo.description}</p>
<p class="mt-1 truncate text-sm text-text-secondary">{repo.description}</p>
{:else}
<p class="mt-1 text-sm text-gray-500 italic">No description</p>
<p class="mt-1 text-sm text-text-muted italic">No description</p>
{/if}
<div class="mt-2 flex items-center gap-4 text-xs text-gray-500">
<div class="mt-2 flex items-center gap-4 text-xs text-text-muted">
{#if repo.language}
<span class="flex items-center gap-1.5">
<span
class="h-2.5 w-2.5 rounded-full {languageColors[repo.language] ?? 'bg-gray-500'}"
class="h-2.5 w-2.5 rounded-full {languageColors[repo.language] ??
'bg-lang-default'}"
></span>
{repo.language}
</span>
@@ -154,11 +152,11 @@
</div>
</div>
<Button.Root
class="ml-4 flex items-center gap-2 rounded-lg px-4 py-2 text-sm font-medium text-white transition-colors {added.includes(
class="ml-4 flex items-center gap-2 rounded-lg px-4 py-2 text-sm font-medium text-text-primary transition-colors {added.includes(
repo.id
)
? 'border-green-800 bg-green-900'
: 'bg-blue-600'} disabled:cursor-default disabled:opacity-50"
? 'border-success-border bg-success'
: 'bg-primary'} disabled:cursor-default disabled:opacity-50"
disabled={adding !== null}
onclick={() => handleImport(repo)}
>
@@ -177,14 +175,14 @@
<LoaderCircle class="animate-spin" />
</div>
{:else}
<div class="py-8 text-center text-gray-500">
<div class="py-8 text-center text-text-muted">
<p>No repositories found matching "{searchQuery}"</p>
</div>
{/if}
{/each}
</div>
<p class="mt-6 text-center text-sm text-gray-500">
<p class="mt-6 text-center text-sm text-text-muted">
You must have a dist/ folder with index.html + index.wasm
</p>
</div>