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

Update +page.svelte

Browse Source
This commit is contained in:
Ian Donahue 2023-03-10 17:17:43 +01:00
parent 1d978282cf
commit 1d3deba8cb
1 changed files with 59 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -81,20 +81,23 @@
} }
</script> </script>
<div class="mt-4 px-8 flex flex-col">
<div class="project-section-component">
<div class="flex">
<div class="main-column-containercol-span-2 pr-6 mt-4 px-8" style="width: calc(100% * 0.66)">
<h1 class="flex text-xl text-zinc-200"> <h1 class="flex text-xl text-zinc-200">
{$project?.title} <span class="text-zinc-600 ml-2">Project</span> {$project?.title} <span class="ml-2 text-zinc-600">Project</span>
</h1> </h1>
<div class="grid grid-cols-3 mt-4"> <div class="mt-4">
<div class="col-span-2 pr-6"> <div class="recent-file-changes-container w-full">
<h2 class="text-lg font-bold text-zinc-500 mb-4">Recent File Changes</h2> <h2 class="mb-4 text-lg font-bold text-zinc-300">Recent File Changes</h2>
{#if $dateSessions === undefined} {#if $dateSessions === undefined}
<span>Loading...</span> <span>Loading...</span>
{:else} {:else}
<div class="flex flex-col space-y-4"> <div class="flex flex-col space-y-4">
{#each orderedSessions($dateSessions) as [dateMilliseconds, fileSessions]} {#each orderedSessions($dateSessions) as [dateMilliseconds, fileSessions]}
<div class="flex flex-col"> <div class="flex flex-col">
<div class="text-zinc-400 text-lg text-zinc-200 mb-1"> <div class="mb-1 text-lg text-zinc-400 text-zinc-200">
{new Date(parseInt(dateMilliseconds)).toLocaleDateString('en-us', { {new Date(parseInt(dateMilliseconds)).toLocaleDateString('en-us', {
weekday: 'long', weekday: 'long',
year: 'numeric', year: 'numeric',
@ -102,11 +105,13 @@
day: 'numeric' day: 'numeric'
})} })}
</div> </div>
<div class="bg-zinc-700 rounded p-4"> <div class="rounded bg-zinc-700 p-4">
{#each Object.entries(fileSessions) as filetime} {#each Object.entries(fileSessions) as filetime}
<div class="flex flex-row justify-between"> <div class="flex flex-row justify-between">
<div class="text-zinc-200 font-mono">{filetime[0]}</div> <div class="font-mono text-zinc-100">{filetime[0]}</div>
<div class="text-zinc-400">{@html timestampsToSpark(filetime[1])}</div> <div class="font-mono text-zinc-400">
{@html timestampsToSpark(filetime[1])}
</div>
</div> </div>
{/each} {/each}
</div> </div>
@ -115,15 +120,34 @@
</div> </div>
{/if} {/if}
</div> </div>
<div class="col-span-1 space-y-6">
</div>
</div>
<div class="secondary-column-container col-span-1 space-y-6 pt-4 px-4 border-l-zinc-700" style="width: 37%; height: calc(100vh - 110px); overflow-y: auto;">
<div> <div>
<h2 class="text-lg font-bold text-zinc-500">Work in Progress</h2> <h2 class="text-lg font-bold text-zinc-500">Work in Progress</h2>
<div class="text-zinc-400 mt-4 mb-1 bg-zinc-700 rounded p-4">No uncommitted work</div> <div class="text-zinc-400 mt-4 mb-1 bg-zinc-700 rounded p-4">No uncommitted work</div>
</div> </div>
<div class="">
<div> <h2 class="text-lg font-bold text-zinc-300">Recent Activity</h2>
<h2 class="text-lg font-bold text-zinc-500">Recent Activity</h2> {#each recentActivity($dateSessions) as activity}
<div class="text-zinc-400 mt-4 mb-1 bg-zinc-700 rounded p-4">No recent activity</div> <div class="recent-activity-card mt-4 mb-1 text-zinc-400 border border-zinc-700 rounded">
<div class="flex flex-col">
<div class="flex flex-row justify-between rounded-t bg-[#2F2F33] p-2">
<div class="text-zinc-300">
{new Date(parseInt(activity.timestampMs)).toLocaleDateString('en-us', {
weekday: 'long',
year: 'numeric',
month: 'short',
day: 'numeric'
})}
</div>
<div class="font-mono text-right">{activity.type}</div>
</div>
<div class="rounded-b bg-[#2F2F33] p-2">{activity.message}</div>
</div>
</div>
{/each}
</div> </div>
</div> </div>
</div> </div>