Small visual tweeks to look more like designs

This commit is contained in:
idonahue 2023-06-14 18:32:48 +02:00
parent 61a83f2386
commit 9d8e10834b
5 changed files with 8 additions and 8 deletions

View File

@ -76,7 +76,7 @@
</header>
<ul class="all-files-changed flex flex-col rounded pl-3">
{#each Object.entries(fileDeltas) as [filepath, deltas]}
<li class="changed-file flex items-center justify-between gap-4 ">
<li class="changed-file flex items-center justify-between gap-4 bg-[#212121] ">
<a
class="file-name max-w- flex w-full max-w-[360px] overflow-auto py-2 font-mono hover:underline"
href="/projects/{$page.params.projectId}/player/{format(

View File

@ -42,7 +42,7 @@
</script>
<section
class="flex h-full w-full gap-x-4 overflow-x-scroll p-2"
class="swimlane-container flex h-full w-full gap-x-4 overflow-x-scroll p-4 bg-zinc-900"
use:dndzone={{
items: branches,
flipDurationMs,
@ -54,7 +54,7 @@
>
{#each branches.filter((c) => c.active) as { id, name, files } (id)}
<div
class="flex h-full w-96 rounded-lg border border-zinc-700 bg-zinc-900"
class="swimlane flex h-full w-96 rounded-lg border border-zinc-700 bg-zinc-900"
animate:flip={{ duration: flipDurationMs }}
>
<Lane {name} bind:files on:empty={handleEmpty} />

View File

@ -42,7 +42,7 @@
}
</script>
<div class="flex h-full w-full flex-col">
<div class="flex h-full w-full flex-col bg-[#2C2C2C]">
<div class="mb-4 flex items-center justify-center border-b border-zinc-700 py-4 font-bold">
{name}
</div>

View File

@ -22,7 +22,7 @@
<div
use:animateHeight
class="flex w-full flex-col justify-center gap-2 overflow-hidden rounded border border-dotted border-zinc-600 bg-zinc-900 p-2"
class="changed-file flex w-full flex-col justify-center gap-2 overflow-hidden rounded border-[0.5px] border-[#393939] bg-[#212121] p-2"
>
<button
class="flex items-center gap-2 font-bold text-zinc-200"
@ -41,7 +41,7 @@
</button>
<div
class="flex flex-col gap-1"
class="flex flex-col gap-2"
use:dndzone={{
items: file.hunks,
flipDurationMs,
@ -57,7 +57,7 @@
{#each file.hunks || [] as hunk (hunk.id)}
<div
animate:flip={{ duration: flipDurationMs }}
class="w-full rounded border border-zinc-500 bg-zinc-600 p-1"
class="changed-hunk w-full rounded border-t-[0.5px] border-t-[#4C4C4C] border-b-[0.5px] border-b-[#252525] bg-[#2C2C2C] p-1"
>
<div class="w-full text-ellipsis">
{hunk.name}

View File

@ -6,7 +6,7 @@
export let branches: Branch[];
</script>
<section class="flex h-full w-64 flex-col gap-y-2 border-r border-zinc-700 bg-[#2F2F33] p-4">
<section class="flex h-full w-64 flex-col gap-y-2 border-r border-zinc-700 bg-[#2C2C2C] p-4">
<div class="flex flex-col gap-y-2 py-2">
{#each branches as branch (branch.id)}
<div animate:flip={{ duration: 300 }} class="rounded border border-zinc-600 bg-zinc-700 p-2">