gitbutlerapp/gitbutler
1
1
Fork 0
mirror of https://github.com/gitbutlerapp/gitbutler.git synced 2024-10-26 13:12:25 +03:00
Code Issues Packages Projects Releases Wiki Activity

prettied up some stuff

Browse Source
This commit is contained in:
Ian Donahue 2023-03-20 17:14:35 +01:00
parent 0ffbcd5d13
commit 7e7e093684
2 changed files with 40 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/routes/projects/[projectId]/+page.svelte
View File

@ -191,7 +191,7 @@
</div>
<div>
<a class="text-orange-200" href={datePlayerURL(dateMilliseconds)}
>Play Changes</a
>Replay Changes</a
>
</div>
</div>

74
src/routes/projects/[projectId]/commit/+page.svelte
View File

@ -13,9 +13,9 @@
const { project, user, filesStatus } = data;
let commitSubject: string;
let placeholderSubject = 'One line summary of changes';
let placeholderSubject = 'Summary (required)';
let commitMessage: string;
let placeholderMessage = 'Optional fuller description of changes';
let placeholderMessage = 'Optional description of changes';
let messageRows = 6;
let filesSelectedForCommit: string[] = [];
@ -127,7 +127,7 @@
}
</script>
<div class="flex flex-row">
<div class="flex flex-row h-full">
<div class="flex w-[500px] min-w-[500px] flex-shrink-0 flex-col p-2">
<div
class="button group mb-2 flex max-w-[500px] rounded border border-zinc-600 bg-zinc-700 py-2 px-4 text-zinc-300 shadow"
@ -160,23 +160,51 @@
</svg>
</div>
</div>
<div transition:slide={{ duration: 150 }}>
<h3 class="mb-2 text-base font-semibold text-zinc-200">Commit Message</h3>
<div class="changed-files-list-container mt-2 mb-4">
<div class="changed-files-list rounded border font-mono text-zinc-900 border-t-[0.5px] border-r-[0.5px] border-b-[0.5px] border-l-[0.5px] border-gb-700 bg-gb-900">
<div
class="mb-2 flex flex-row space-x-2 rounded-t border-b border-b-gb-750 bg-gb-800 p-2 text-zinc-200"
>
<h3 class="text-base font-semibold ">File Changes</h3>
<a href="#" class="text-yellow-200" on:click={toggleAllOn}>all</a>
<a href="#" class="text-yellow-200" on:click={toggleAllOff}>none</a>
</div>
<ul class="w-80 truncate px-2 pb-2">
{#each $filesStatus as activity}
<li class="list-none text-zinc-300">
<input
type="checkbox"
on:click={showMessage}
bind:group={filesSelectedForCommit}
value={activity.path}
/>
{activity.status.slice(0, 1)}
{shortPath(activity.path)}
</li>
{/each}
</ul>
</div>
</div>
<div class="commit-input-container" transition:slide={{ duration: 150 }}>
<h3 class="mb-2 text-base font-semibold text-zinc-300">Commit Message</h3>
<input
type="text"
name="subject"
bind:value={commitSubject}
placeholder={placeholderSubject}
class="mb-2 block w-full rounded-md border-0 p-4 text-zinc-200 ring-1 ring-inset ring-gray-600 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-blue-600 sm:py-1.5 sm:text-sm sm:leading-6"
class="mb-2 block w-full rounded-md p-4 bg-zinc-700 border-zinc-600 text-zinc-200 ring-1 ring-inset ring-gray-600 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-blue-600 sm:py-1.5 sm:text-sm sm:leading-6"
/>
<textarea
rows={messageRows}
name="message"
placeholder={placeholderMessage}
bind:value={commitMessage}
class="mb-2 block w-full rounded-md border-0 p-4 text-zinc-200 ring-1 ring-inset ring-gray-600 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-blue-600 sm:py-1.5 sm:text-sm sm:leading-6"
class="mb-2 block w-full rounded-md p-4 bg-zinc-700 border-zinc-600 text-zinc-200 ring-1 ring-inset ring-gray-600 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-blue-600 sm:py-1.5 sm:text-sm sm:leading-6"
/>
</div>
<div class="flex flex-row justify-between">
{#if filesSelectedForCommit.length == 0}
<div>Select at least one file.</div>
@ -194,8 +222,8 @@
>
{/if}
{#if !generatedMessage}
<a class="cursor-pointer rounded bg-green-800 p-2" on:click={fetchCommitMessage}
>Generate a message for me.</a
<a class="cursor-pointer rounded bg-green-800 p-2 text-zinc-50 bg-gradient-to-b from-[#623871] to-[#502E5C] shadow" on:click={fetchCommitMessage}
>✨ Generate commit message</a
>
{:else if generatedMessage == 'loading'}
<div class="flex flex-col">
@ -210,33 +238,9 @@
</div>
{/if}
</div>
<div class="mt-2">
<div class="rounded border border-zinc-400 bg-zinc-500 font-mono text-zinc-900">
<div
class="mb-2 flex flex-row space-x-2 rounded-t border-b border-zinc-600 bg-zinc-800 p-2 text-zinc-200"
>
<h3 class="text-base font-semibold ">File Changes</h3>
<a href="#" class="text-yellow-200" on:click={toggleAllOn}>all</a>
<a href="#" class="text-yellow-200" on:click={toggleAllOff}>none</a>
</div>
<ul class="w-80 truncate px-2 pb-2">
{#each $filesStatus as activity}
<li class="list-none">
<input
type="checkbox"
on:click={showMessage}
bind:group={filesSelectedForCommit}
value={activity.path}
/>
{activity.status.slice(0, 1)}
{shortPath(activity.path)}
</li>
{/each}
</ul>
</div>
</div>
</div>
<div class="h-full max-h-screen flex-grow overflow-auto p-2">
<div class="h-full max-h-screen flex-grow overflow-auto p-2 h-100">
{#if gitDiff}
{#each Object.entries(gitDiff) as [key, value]}
{#if key}