mirror of
https://github.com/gitbutlerapp/gitbutler.git
synced 2024-12-23 09:33:01 +03:00
setup prettier-plugin-tailwindcss
This commit is contained in:
Nikita Galaiko
parent
efc07705e4
commit
e49e3433ed
@ -65,6 +65,7 @@
|
||||
"postcss-load-config": "^4.0.1",
|
||||
"prettier": "^2.8.0",
|
||||
"prettier-plugin-svelte": "^2.8.1",
|
||||
"prettier-plugin-tailwindcss": "^0.2.4",
|
||||
"svelte": "^3.55.1",
|
||||
"svelte-check": "^3.0.1",
|
||||
"tailwindcss": "^3.1.5",
|
||||
|
||||
@ -48,6 +48,7 @@ specifiers:
|
||||
posthog-js: ^1.46.1
|
||||
prettier: ^2.8.0
|
||||
prettier-plugin-svelte: ^2.8.1
|
||||
prettier-plugin-tailwindcss: ^0.2.4
|
||||
seti-icons: ^0.0.4
|
||||
svelte: ^3.55.1
|
||||
svelte-check: ^3.0.1
|
||||
@ -62,7 +63,7 @@ dependencies:
|
||||
'@codemirror/autocomplete': 6.4.2_yom6siklgbeshd7shgtg2sdiku
|
||||
'@codemirror/commands': 6.2.0
|
||||
'@codemirror/lang-angular': github.com/codemirror/lang-angular/ee6151b55668b2941c71b0d1db9f5a526ef29710
|
||||
'@codemirror/lang-css': github.com/codemirror/lang-css/9f5b41703dff289d94731c5caba72cf3b57fff43_nzpoxphwgc7witc3f5hdaoweju
|
||||
'@codemirror/lang-css': github.com/codemirror/lang-css/2cde46bf378ae36413e7fca5e24a2606f3cdf840_nzpoxphwgc7witc3f5hdaoweju
|
||||
'@codemirror/lang-html': github.com/codemirror/lang-html/0420487e1ac04bfd59129c243e3b7b802ffca30c
|
||||
'@codemirror/lang-java': github.com/codemirror/lang-java/834c534e7d689b0d88c15e3af55b0ee551d985d2
|
||||
'@codemirror/lang-javascript': 6.1.4
|
||||
@ -82,7 +83,7 @@ dependencies:
|
||||
'@lezer/lr': 1.3.3
|
||||
'@nextjournal/lang-clojure': 1.0.0
|
||||
'@replit/codemirror-lang-csharp': 6.1.0_dbd6aqsmfpystthdbxnrle4dwe
|
||||
'@replit/codemirror-lang-svelte': 6.0.0_zlhskyhbzw2pn2yfpaeuivpmfu
|
||||
'@replit/codemirror-lang-svelte': 6.0.0_yycrqtt34ynecrgehdjoffcaie
|
||||
'@square/svelte-store': 1.0.14
|
||||
'@tabler/icons-svelte': 2.6.0_svelte@3.55.1
|
||||
'@tauri-apps/api': 1.2.0
|
||||
@ -94,7 +95,7 @@ dependencies:
|
||||
posthog-js: 1.46.1
|
||||
seti-icons: 0.0.4
|
||||
svelte-french-toast: 1.0.3_svelte@3.55.1
|
||||
tauri-plugin-log-api: github.com/tauri-apps/tauri-plugin-log/921afb3366b14ac43e3d8041a7def4b85d4d7192
|
||||
tauri-plugin-log-api: github.com/tauri-apps/tauri-plugin-log/05a9bfd9edb9b5f4ab95412bb607691708b65a25
|
||||
|
||||
devDependencies:
|
||||
'@sveltejs/adapter-static': 1.0.0-next.50_l5ueyfihz3gpzzvvyo2ean5u3e
|
||||
@ -111,6 +112,7 @@ devDependencies:
|
||||
postcss-load-config: 4.0.1_postcss@8.4.21
|
||||
prettier: 2.8.4
|
||||
prettier-plugin-svelte: 2.9.0_jrsxveqmsx2uadbqiuq74wlc4u
|
||||
prettier-plugin-tailwindcss: 0.2.4_yjdjpc7im5hvpskij45owfsns4
|
||||
svelte: 3.55.1
|
||||
svelte-check: 3.0.3_gqx7lw3sljhsd4bstor5m2aa2u
|
||||
tailwindcss: 3.2.4_postcss@8.4.21
|
||||
@ -143,8 +145,8 @@ packages:
|
||||
'@lezer/common': 1.0.2
|
||||
dev: false
|
||||
|
||||
/@codemirror/lang-css/6.0.2_nzpoxphwgc7witc3f5hdaoweju:
|
||||
resolution: {integrity: sha512-4V4zmUOl2Glx0GWw0HiO1oGD4zvMlIQ3zx5hXOE6ipCjhohig2bhWRAasrZylH9pRNTcl1VMa59Lsl8lZWlTzw==}
|
||||
/@codemirror/lang-css/6.1.0_nzpoxphwgc7witc3f5hdaoweju:
|
||||
resolution: {integrity: sha512-GYn4TyMvQLrkrhdisFh8HCTDAjPY/9pzwN12hG9UdrTUxRUMicF+8GS24sFEYaleaG1KZClIFLCj0Rol/WO24w==}
|
||||
dependencies:
|
||||
'@codemirror/autocomplete': 6.4.2_yom6siklgbeshd7shgtg2sdiku
|
||||
'@codemirror/language': 6.6.0
|
||||
@ -159,7 +161,7 @@ packages:
|
||||
resolution: {integrity: sha512-bqCBASkteKySwtIbiV/WCtGnn/khLRbbiV5TE+d9S9eQJD7BA4c5dTRm2b3bVmSpilff5EYxvB4PQaZzM/7cNw==}
|
||||
dependencies:
|
||||
'@codemirror/autocomplete': 6.4.2_yom6siklgbeshd7shgtg2sdiku
|
||||
'@codemirror/lang-css': 6.0.2_nzpoxphwgc7witc3f5hdaoweju
|
||||
'@codemirror/lang-css': 6.1.0_nzpoxphwgc7witc3f5hdaoweju
|
||||
'@codemirror/lang-javascript': 6.1.4
|
||||
'@codemirror/language': 6.6.0
|
||||
'@codemirror/state': 6.2.0
|
||||
@ -608,7 +610,7 @@ packages:
|
||||
'@lezer/lr': 1.3.3
|
||||
dev: false
|
||||
|
||||
/@replit/codemirror-lang-svelte/6.0.0_zlhskyhbzw2pn2yfpaeuivpmfu:
|
||||
/@replit/codemirror-lang-svelte/6.0.0_yycrqtt34ynecrgehdjoffcaie:
|
||||
resolution: {integrity: sha512-U2OqqgMM6jKelL0GNWbAmqlu1S078zZNoBqlJBW+retTc5M4Mha6/Y2cf4SVg6ddgloJvmcSpt4hHrVoM4ePRA==}
|
||||
peerDependencies:
|
||||
'@codemirror/autocomplete': ^6.0.0
|
||||
@ -624,7 +626,7 @@ packages:
|
||||
'@lezer/lr': ^1.0.0
|
||||
dependencies:
|
||||
'@codemirror/autocomplete': 6.4.2_yom6siklgbeshd7shgtg2sdiku
|
||||
'@codemirror/lang-css': github.com/codemirror/lang-css/9f5b41703dff289d94731c5caba72cf3b57fff43_nzpoxphwgc7witc3f5hdaoweju
|
||||
'@codemirror/lang-css': github.com/codemirror/lang-css/2cde46bf378ae36413e7fca5e24a2606f3cdf840_nzpoxphwgc7witc3f5hdaoweju
|
||||
'@codemirror/lang-html': github.com/codemirror/lang-html/0420487e1ac04bfd59129c243e3b7b802ffca30c
|
||||
'@codemirror/lang-javascript': 6.1.4
|
||||
'@codemirror/language': 6.6.0
|
||||
@ -2505,6 +2507,62 @@ packages:
|
||||
svelte: 3.55.1
|
||||
dev: true
|
||||
|
||||
/prettier-plugin-tailwindcss/0.2.4_yjdjpc7im5hvpskij45owfsns4:
|
||||
resolution: {integrity: sha512-wMyugRI2yD8gqmMpZSS8kTA0gGeKozX/R+w8iWE+yiCZL09zY0SvfiHfHabNhjGhzxlQ2S2VuTxPE3T72vppCQ==}
|
||||
engines: {node: '>=12.17.0'}
|
||||
peerDependencies:
|
||||
'@ianvs/prettier-plugin-sort-imports': '*'
|
||||
'@prettier/plugin-php': '*'
|
||||
'@prettier/plugin-pug': '*'
|
||||
'@shopify/prettier-plugin-liquid': '*'
|
||||
'@shufo/prettier-plugin-blade': '*'
|
||||
'@trivago/prettier-plugin-sort-imports': '*'
|
||||
prettier: '>=2.2.0'
|
||||
prettier-plugin-astro: '*'
|
||||
prettier-plugin-css-order: '*'
|
||||
prettier-plugin-import-sort: '*'
|
||||
prettier-plugin-jsdoc: '*'
|
||||
prettier-plugin-organize-attributes: '*'
|
||||
prettier-plugin-organize-imports: '*'
|
||||
prettier-plugin-style-order: '*'
|
||||
prettier-plugin-svelte: '*'
|
||||
prettier-plugin-twig-melody: '*'
|
||||
peerDependenciesMeta:
|
||||
'@ianvs/prettier-plugin-sort-imports':
|
||||
optional: true
|
||||
'@prettier/plugin-php':
|
||||
optional: true
|
||||
'@prettier/plugin-pug':
|
||||
optional: true
|
||||
'@shopify/prettier-plugin-liquid':
|
||||
optional: true
|
||||
'@shufo/prettier-plugin-blade':
|
||||
optional: true
|
||||
'@trivago/prettier-plugin-sort-imports':
|
||||
optional: true
|
||||
prettier-plugin-astro:
|
||||
optional: true
|
||||
prettier-plugin-css-order:
|
||||
optional: true
|
||||
prettier-plugin-import-sort:
|
||||
optional: true
|
||||
prettier-plugin-jsdoc:
|
||||
optional: true
|
||||
prettier-plugin-organize-attributes:
|
||||
optional: true
|
||||
prettier-plugin-organize-imports:
|
||||
optional: true
|
||||
prettier-plugin-style-order:
|
||||
optional: true
|
||||
prettier-plugin-svelte:
|
||||
optional: true
|
||||
prettier-plugin-twig-melody:
|
||||
optional: true
|
||||
dependencies:
|
||||
prettier: 2.8.4
|
||||
prettier-plugin-svelte: 2.9.0_jrsxveqmsx2uadbqiuq74wlc4u
|
||||
dev: true
|
||||
|
||||
/prettier/2.8.4:
|
||||
resolution: {integrity: sha512-vIS4Rlc2FNh0BySk3Wkd6xmwxB0FpOndW5fisM5H8hsZSxU2VWVB5CWIkIjWvrHjIhxk2g3bfMKM87zNTrZddw==}
|
||||
engines: {node: '>=10.13.0'}
|
||||
@ -3192,11 +3250,11 @@ packages:
|
||||
'@lezer/highlight': 1.1.3
|
||||
dev: false
|
||||
|
||||
github.com/codemirror/lang-css/9f5b41703dff289d94731c5caba72cf3b57fff43_nzpoxphwgc7witc3f5hdaoweju:
|
||||
resolution: {tarball: https://codeload.github.com/codemirror/lang-css/tar.gz/9f5b41703dff289d94731c5caba72cf3b57fff43}
|
||||
id: github.com/codemirror/lang-css/9f5b41703dff289d94731c5caba72cf3b57fff43
|
||||
github.com/codemirror/lang-css/2cde46bf378ae36413e7fca5e24a2606f3cdf840_nzpoxphwgc7witc3f5hdaoweju:
|
||||
resolution: {tarball: https://codeload.github.com/codemirror/lang-css/tar.gz/2cde46bf378ae36413e7fca5e24a2606f3cdf840}
|
||||
id: github.com/codemirror/lang-css/2cde46bf378ae36413e7fca5e24a2606f3cdf840
|
||||
name: '@codemirror/lang-css'
|
||||
version: 6.0.2
|
||||
version: 6.1.0
|
||||
prepare: true
|
||||
requiresBuild: true
|
||||
dependencies:
|
||||
@ -3217,7 +3275,7 @@ packages:
|
||||
requiresBuild: true
|
||||
dependencies:
|
||||
'@codemirror/autocomplete': 6.4.2_yom6siklgbeshd7shgtg2sdiku
|
||||
'@codemirror/lang-css': 6.0.2_nzpoxphwgc7witc3f5hdaoweju
|
||||
'@codemirror/lang-css': 6.1.0_nzpoxphwgc7witc3f5hdaoweju
|
||||
'@codemirror/lang-javascript': 6.1.4
|
||||
'@codemirror/language': 6.6.0
|
||||
'@codemirror/state': 6.2.0
|
||||
@ -3321,8 +3379,8 @@ packages:
|
||||
'@lezer/lr': 1.3.3
|
||||
dev: false
|
||||
|
||||
github.com/tauri-apps/tauri-plugin-log/921afb3366b14ac43e3d8041a7def4b85d4d7192:
|
||||
resolution: {tarball: https://codeload.github.com/tauri-apps/tauri-plugin-log/tar.gz/921afb3366b14ac43e3d8041a7def4b85d4d7192}
|
||||
github.com/tauri-apps/tauri-plugin-log/05a9bfd9edb9b5f4ab95412bb607691708b65a25:
|
||||
resolution: {tarball: https://codeload.github.com/tauri-apps/tauri-plugin-log/tar.gz/05a9bfd9edb9b5f4ab95412bb607691708b65a25}
|
||||
name: tauri-plugin-log-api
|
||||
version: 0.0.0
|
||||
dependencies:
|
||||
|
||||
@ -6,7 +6,7 @@
|
||||
%sveltekit.head%
|
||||
</head>
|
||||
|
||||
<body class="fixed h-full w-full overflow-hidden font-sans antialiased text-base bg-zinc-800">
|
||||
<body class="fixed h-full w-full overflow-hidden bg-zinc-800 font-sans text-base antialiased">
|
||||
<div style="display: contents">%sveltekit.body%</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@ -5,11 +5,11 @@
|
||||
|
||||
<div class="flex items-center justify-center space-x-3 text-zinc-400">
|
||||
<button
|
||||
class="p-2 rounded-md hover:text-zinc-200 hover:bg-zinc-700"
|
||||
class="rounded-md p-2 hover:bg-zinc-700 hover:text-zinc-200"
|
||||
title="Go back"
|
||||
on:click={() => history.back()}
|
||||
>
|
||||
<div class="w-4 h-4 flex justify-center items-center">
|
||||
<div class="flex h-4 w-4 items-center justify-center">
|
||||
<svg
|
||||
width="16"
|
||||
height="12"
|
||||
@ -27,11 +27,11 @@
|
||||
</div>
|
||||
</button>
|
||||
<button
|
||||
class="p-2 rounded-md hover:text-zinc-200 hover:bg-zinc-700"
|
||||
class="rounded-md p-2 hover:bg-zinc-700 hover:text-zinc-200"
|
||||
title="Go forward"
|
||||
on:click={() => history.forward()}
|
||||
>
|
||||
<div class="w-4 h-4 flex justify-center items-center">
|
||||
<div class="flex h-4 w-4 items-center justify-center">
|
||||
<svg
|
||||
width="16"
|
||||
height="12"
|
||||
|
||||
@ -12,8 +12,8 @@
|
||||
</script>
|
||||
|
||||
<div class="flex flex-row items-center text-zinc-400">
|
||||
<a class="p-2 rounded-md hover:text-zinc-200 hover:bg-zinc-700" href="/">
|
||||
<div class="w-4 h-4 flex justify-center items-center">
|
||||
<a class="rounded-md p-2 hover:bg-zinc-700 hover:text-zinc-200" href="/">
|
||||
<div class="flex h-4 w-4 items-center justify-center">
|
||||
<svg
|
||||
width="14"
|
||||
height="14"
|
||||
@ -31,19 +31,19 @@
|
||||
{#if $project}
|
||||
<div class="ml-1">
|
||||
<Popover>
|
||||
<div slot="button" class="flex align-item-centerh-5 py-2 px-2 rounded-md hover:bg-zinc-700">
|
||||
<div class="h-4 flex items-center">
|
||||
<div slot="button" class="align-item-centerh-5 flex rounded-md py-2 px-2 hover:bg-zinc-700">
|
||||
<div class="flex h-4 items-center">
|
||||
{$project.title}
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-col">
|
||||
<ul class="flex flex-col overflow-y-auto p-2 max-h-[289px]">
|
||||
<ul class="flex max-h-[289px] flex-col overflow-y-auto p-2">
|
||||
{#each $projects || [] as p}
|
||||
<a
|
||||
href="/projects/{p.id}"
|
||||
class="
|
||||
flex items-center
|
||||
p-2 rounded hover:bg-zinc-700 cursor-pointer"
|
||||
flex cursor-pointer
|
||||
items-center rounded p-2 hover:bg-zinc-700"
|
||||
>
|
||||
<span class="truncate">
|
||||
{p.title}
|
||||
@ -73,7 +73,7 @@
|
||||
<span class="w-full border-t border-zinc-700" />
|
||||
<!-- svelte-ignore a11y-click-events-have-key-events -->
|
||||
<div class="m-2 flex">
|
||||
<a href="/" class="p-2 w-full rounded hover:bg-zinc-700 cursor-pointer"
|
||||
<a href="/" class="w-full cursor-pointer rounded p-2 hover:bg-zinc-700"
|
||||
>Add repository...</a
|
||||
>
|
||||
</div>
|
||||
|
||||
@ -7,4 +7,4 @@
|
||||
export let filepath: string;
|
||||
</script>
|
||||
|
||||
<code class="w-full h-full" use:codeviewer={{ doc, deltas, filepath }} />
|
||||
<code class="h-full w-full" use:codeviewer={{ doc, deltas, filepath }} />
|
||||
|
||||
@ -27,7 +27,7 @@
|
||||
|
||||
<div>
|
||||
{#if $user}
|
||||
<button class="text-zinc-400 hover:underline hover:text-red-400" on:click={() => user.delete()}
|
||||
<button class="text-zinc-400 hover:text-red-400 hover:underline" on:click={() => user.delete()}
|
||||
>Log out</button
|
||||
>
|
||||
{:else if $token !== null}
|
||||
@ -40,7 +40,7 @@
|
||||
</p>
|
||||
{:else}
|
||||
<button
|
||||
class="py-1 px-3 rounded text-white bg-blue-400"
|
||||
class="rounded bg-blue-400 py-1 px-3 text-white"
|
||||
on:click={() => api.login.token.create().then(token.set)}>Sign up or Log in</button
|
||||
>
|
||||
{/if}
|
||||
|
||||
@ -66,7 +66,7 @@
|
||||
in:fadeAndZoomIn={{ duration: 150 }}
|
||||
out:fade={{ duration: 100 }}
|
||||
on:mouseup={() => (showPopover = false)}
|
||||
class="wrapper z-[999] bg-zinc-800 border border-zinc-700 text-zinc-50 rounded shadow-2xl min-w-[180px] max-w-[512px]"
|
||||
class="wrapper z-[999] min-w-[180px] max-w-[512px] rounded border border-zinc-700 bg-zinc-800 text-zinc-50 shadow-2xl"
|
||||
style="--popover-top: {`${bottom}px`}; --popover-left: {`${left}px`}"
|
||||
>
|
||||
<slot />
|
||||
|
||||
@ -53,7 +53,7 @@
|
||||
<span class="relative inline-flex">
|
||||
<a
|
||||
id="block"
|
||||
class="inline-flex flex-grow items-center truncate transition ease-in-out duration-150 border px-4 py-2 text-slate-50 rounded-lg {colorFromBranchName(
|
||||
class="inline-flex flex-grow items-center truncate rounded-lg border px-4 py-2 text-slate-50 transition duration-150 ease-in-out {colorFromBranchName(
|
||||
session.meta.branch
|
||||
)}"
|
||||
title={session.meta.branch}
|
||||
@ -62,12 +62,12 @@
|
||||
{toHumanBranchName(session.meta.branch)}
|
||||
</a>
|
||||
{#if !session.hash}
|
||||
<span class="flex absolute h-3 w-3 top-0 right-0 -mt-1 -mr-1" title="Current session">
|
||||
<span class="absolute top-0 right-0 -mt-1 -mr-1 flex h-3 w-3" title="Current session">
|
||||
<span
|
||||
class="animate-ping absolute inline-flex h-full w-full rounded-full bg-orange-200 opacity-75"
|
||||
class="absolute inline-flex h-full w-full animate-ping rounded-full bg-orange-200 opacity-75"
|
||||
/>
|
||||
<span
|
||||
class="relative inline-flex rounded-full h-3 w-3 bg-zinc-200 border border-orange-200"
|
||||
class="relative inline-flex h-3 w-3 rounded-full border border-orange-200 bg-zinc-200"
|
||||
/>
|
||||
</span>
|
||||
{/if}
|
||||
@ -91,11 +91,11 @@
|
||||
<div id="files">
|
||||
{#await list({ projectId: projectId, sessionId: session.id }) then deltas}
|
||||
{#each Object.keys(deltas) as delta}
|
||||
<div class="flex flex-row w-32 items-center">
|
||||
<div class="w-6 h-6 text-white fill-blue-400">
|
||||
<div class="flex w-32 flex-row items-center">
|
||||
<div class="h-6 w-6 fill-blue-400 text-white">
|
||||
{@html pathToIconSvg(delta)}
|
||||
</div>
|
||||
<div class="text-white w-24 truncate">
|
||||
<div class="w-24 truncate text-white">
|
||||
{pathToName(delta)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -25,26 +25,26 @@
|
||||
</script>
|
||||
|
||||
<div class="relative">
|
||||
<hr class="h-px bg-slate-400 border-0 z-0" />
|
||||
<hr class="z-0 h-px border-0 bg-slate-400" />
|
||||
<div class="absolute inset-0 -mt-1.5">
|
||||
{#each activities as activity}
|
||||
<div
|
||||
class="flex -mx-1.5"
|
||||
class="-mx-1.5 flex"
|
||||
style="position:relative; left: {proportionOfTime(activity.timestampMs)}%;"
|
||||
>
|
||||
<div
|
||||
class="w-3 h-3 text-slate-700 z-50 absolute inset-0"
|
||||
class="absolute inset-0 z-50 h-3 w-3 text-slate-700"
|
||||
style=""
|
||||
title="{activity.type}: {activity.message} at {toHumanReadableTime(activity.timestampMs)}"
|
||||
>
|
||||
{#if activity.type.startsWith('commit')}
|
||||
<IconSquareRoundedFilled class="w-3 h-3 text-sky-500 hover:text-sky-600" />
|
||||
<IconSquareRoundedFilled class="h-3 w-3 text-sky-500 hover:text-sky-600" />
|
||||
{:else if activity.type.startsWith('merge')}
|
||||
<IconMapPinFilled class="w-3 h-3 text-green-500 hover:text-green-600" />
|
||||
<IconMapPinFilled class="h-3 w-3 text-green-500 hover:text-green-600" />
|
||||
{:else if activity.type.startsWith('rebase')}
|
||||
<IconCircleHalf2 class="w-3 h-3 text-orange-500 hover:text-orange-600" />
|
||||
<IconCircleHalf2 class="h-3 w-3 text-orange-500 hover:text-orange-600" />
|
||||
{:else if activity.type.startsWith('push')}
|
||||
<IconCircleFilled class="w-3 h-3 text-purple-500 hover:text-purple-600" />
|
||||
<IconCircleFilled class="h-3 w-3 text-purple-500 hover:text-purple-600" />
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -38,7 +38,7 @@
|
||||
<a
|
||||
{href}
|
||||
title={startTime.toLocaleTimeString()}
|
||||
class="group absolute inset-1 flex flex-col items-center justify-center rounded-lg bg-zinc-300 p-3 leading-5 hover:bg-zinc-200 shadow"
|
||||
class="group absolute inset-1 flex flex-col items-center justify-center rounded-lg bg-zinc-300 p-3 leading-5 shadow hover:bg-zinc-200"
|
||||
>
|
||||
<p class="order-1 font-semibold text-zinc-800">
|
||||
{toHumanBranchName(label)}
|
||||
|
||||
@ -15,7 +15,7 @@
|
||||
: 'Something went wrong';
|
||||
</script>
|
||||
|
||||
<div class="flex flex-1 h-full">
|
||||
<div class="flex h-full flex-1">
|
||||
<h1 class="m-auto text-xl">
|
||||
{message} :(
|
||||
</h1>
|
||||
|
||||
@ -18,20 +18,20 @@
|
||||
user.subscribe(posthog.identify);
|
||||
</script>
|
||||
|
||||
<div class="flex flex-col min-h-full max-h-full h-full text-zinc-400">
|
||||
<div class="flex h-full max-h-full min-h-full flex-col text-zinc-400">
|
||||
<header
|
||||
data-tauri-drag-region
|
||||
class="flex flex-row items-center border-b select-none pt-1 pb-1 text-zinc-400 border-zinc-700"
|
||||
class="flex select-none flex-row items-center border-b border-zinc-700 pt-1 pb-1 text-zinc-400"
|
||||
>
|
||||
<div class="ml-24">
|
||||
<BackForwardButtons />
|
||||
</div>
|
||||
<div class="ml-6"><Breadcrumbs /></div>
|
||||
<div class="flex-grow" />
|
||||
<a href="/users/" class="flex items-center gap-1 mr-4 font-medium hover:text-zinc-200">
|
||||
<a href="/users/" class="mr-4 flex items-center gap-1 font-medium hover:text-zinc-200">
|
||||
{#if $user}
|
||||
{#if $user.picture}
|
||||
<img class="inline-block w-5 h-5 rounded-full" src={$user.picture} alt="Avatar" />
|
||||
<img class="inline-block h-5 w-5 rounded-full" src={$user.picture} alt="Avatar" />
|
||||
{/if}
|
||||
<span>{$user.name}</span>
|
||||
{:else}
|
||||
|
||||
@ -24,15 +24,15 @@
|
||||
};
|
||||
</script>
|
||||
|
||||
<div class="w-full h-full p-8">
|
||||
<div class="flex flex-col h-full">
|
||||
<div class="h-full w-full p-8">
|
||||
<div class="flex h-full flex-col">
|
||||
{#if $projects.length == 0}
|
||||
<div class="h-fill grid grid-cols-2 gap-4 items-center h-full">
|
||||
<div class="h-fill grid h-full grid-cols-2 items-center gap-4">
|
||||
<!-- right box, welcome text -->
|
||||
<div class="flex flex-col space-y-4 content-center p-4">
|
||||
<div class="text-xl text-zinc-300 p-0 m-0">
|
||||
<div class="flex flex-col content-center space-y-4 p-4">
|
||||
<div class="m-0 p-0 text-xl text-zinc-300">
|
||||
<div class="font-bold">Welcome to GitButler.</div>
|
||||
<div class="text-lg text-zinc-300 mb-1">More than just version control.</div>
|
||||
<div class="mb-1 text-lg text-zinc-300">More than just version control.</div>
|
||||
</div>
|
||||
<div class="">
|
||||
GitButler is a tool to help you manage all the local work you do on your code projects.
|
||||
@ -41,7 +41,7 @@
|
||||
Think of us as a <strong>code concierge</strong>, a smart assistant for all the coding
|
||||
related tasks you need to do every day.
|
||||
</div>
|
||||
<ul class="text-zinc-400 pt-2 pb-4 space-y-4">
|
||||
<ul class="space-y-4 pt-2 pb-4 text-zinc-400">
|
||||
<li class="flex flex-row space-x-3">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
@ -49,7 +49,7 @@
|
||||
viewBox="0 0 24 24"
|
||||
stroke-width="1.5"
|
||||
stroke="currentColor"
|
||||
class="w-8 h-8 flex-none"
|
||||
class="h-8 w-8 flex-none"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
@ -69,7 +69,7 @@
|
||||
viewBox="0 0 24 24"
|
||||
stroke-width="1.5"
|
||||
stroke="currentColor"
|
||||
class="w-8 h-8 flex-none"
|
||||
class="h-8 w-8 flex-none"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
@ -90,7 +90,7 @@
|
||||
viewBox="0 0 24 24"
|
||||
stroke-width="1.5"
|
||||
stroke="currentColor"
|
||||
class="w-8 h-8 flex-none"
|
||||
class="h-8 w-8 flex-none"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
@ -110,7 +110,7 @@
|
||||
rel="noreferrer"
|
||||
target="_blank"
|
||||
href="https://help.gitbutler.com"
|
||||
class="text-base font-semibold leading-7 text-white bg-zinc-700 px-4 py-3 rounded-lg mt-4"
|
||||
class="mt-4 rounded-lg bg-zinc-700 px-4 py-3 text-base font-semibold leading-7 text-white"
|
||||
>
|
||||
Learn more <span aria-hidden="true">→</span></a
|
||||
>
|
||||
@ -150,9 +150,9 @@
|
||||
<div class="select-none p-8">
|
||||
<div class="flex flex-col">
|
||||
<div class="flex flex-row justify-between">
|
||||
<div class="text-xl text-zinc-300 mb-1">
|
||||
<div class="mb-1 text-xl text-zinc-300">
|
||||
My Projects
|
||||
<div class="text-lg text-zinc-500 mb-1">
|
||||
<div class="mb-1 text-lg text-zinc-500">
|
||||
All the projects that I am currently assisting you with.
|
||||
</div>
|
||||
</div>
|
||||
@ -167,31 +167,31 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="h-full max-h-screen overflow-auto">
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 mt-4">
|
||||
<div class="mt-4 grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3">
|
||||
{#each $projects as project}
|
||||
<a class="hover:text-zinc-200 text-zinc-300 text-lg" href="/projects/{project.id}/">
|
||||
<a class="text-lg text-zinc-300 hover:text-zinc-200" href="/projects/{project.id}/">
|
||||
<div
|
||||
class="flex flex-col justify-between space-y-1 bg-zinc-700 rounded-lg shadow"
|
||||
class="flex flex-col justify-between space-y-1 rounded-lg bg-zinc-700 shadow"
|
||||
>
|
||||
<div class="px-4 py-4 flex-grow-0">
|
||||
<div class="hover:text-zinc-200 text-zinc-300 text-lg">
|
||||
<div class="flex-grow-0 px-4 py-4">
|
||||
<div class="text-lg text-zinc-300 hover:text-zinc-200">
|
||||
{project.title}
|
||||
</div>
|
||||
<div class="text-zinc-500 font-mono break-words">
|
||||
<div class="font-mono break-words text-zinc-500">
|
||||
{project.path}
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex-grow-0 text-zinc-500 font-mono border-t border-zinc-600 bg-zinc-600 rounded-b-lg px-3 py-1"
|
||||
class="font-mono flex-grow-0 rounded-b-lg border-t border-zinc-600 bg-zinc-600 px-3 py-1 text-zinc-500"
|
||||
>
|
||||
{#if project.api}
|
||||
<div class="flex flex-row items-center space-x-2 ">
|
||||
<div class="w-2 h-2 bg-green-700 rounded-full" />
|
||||
<div class="h-2 w-2 rounded-full bg-green-700" />
|
||||
<div class="text-zinc-400">syncing</div>
|
||||
</div>
|
||||
{:else}
|
||||
<div class="flex flex-row items-center space-x-2 ">
|
||||
<div class="w-2 h-2 bg-gray-400 rounded-full" />
|
||||
<div class="h-2 w-2 rounded-full bg-gray-400" />
|
||||
<div class="text-zinc-400">offline</div>
|
||||
</div>
|
||||
{/if}
|
||||
@ -205,7 +205,7 @@
|
||||
</div>
|
||||
|
||||
<div class="absolute bottom-0 left-0 w-full">
|
||||
<div class="flex items-center flex-shrink-0 p-4 h-18 border-t select-none border-zinc-700">
|
||||
<div class="h-18 flex flex-shrink-0 select-none items-center border-t border-zinc-700 p-4">
|
||||
<div class="text-sm text-zinc-300">Timeline</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -29,16 +29,16 @@
|
||||
$: selection = $page?.route?.id?.split('/')?.[3];
|
||||
</script>
|
||||
|
||||
<div class="flex w-full h-full flex-col">
|
||||
<div class="flex h-full w-full flex-col">
|
||||
<nav
|
||||
class="flex items-center flex-none justify-between py-1 px-8 space-x-3 border-b select-none text-zinc-300 border-zinc-700"
|
||||
class="flex flex-none select-none items-center justify-between space-x-3 border-b border-zinc-700 py-1 px-8 text-zinc-300"
|
||||
>
|
||||
<div />
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<a href="/projects/{$project?.id}/settings" class="text-zinc-400 hover:text-zinc-300">
|
||||
<div class="p-1 rounded-md hover:text-zinc-200 hover:bg-zinc-700 hover:bg-zinc-700">
|
||||
<div class="rounded-md p-1 hover:bg-zinc-700 hover:bg-zinc-700 hover:text-zinc-200">
|
||||
<div class="h-6 w-6 ">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
@ -46,7 +46,7 @@
|
||||
viewBox="0 0 24 24"
|
||||
stroke-width="1.5"
|
||||
stroke="currentColor"
|
||||
class="w-6 h-6"
|
||||
class="h-6 w-6"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
@ -72,13 +72,13 @@
|
||||
|
||||
<footer class="w-full text-sm font-medium">
|
||||
<div
|
||||
class="flex items-center flex-shrink-0 h-6 border-t select-none border-zinc-700 bg-zinc-800 "
|
||||
class="flex h-6 flex-shrink-0 select-none items-center border-t border-zinc-700 bg-zinc-800 "
|
||||
>
|
||||
<div class="flex flex-row mx-4 items-center space-x-2 justify-between w-full">
|
||||
<div class="mx-4 flex w-full flex-row items-center justify-between space-x-2">
|
||||
{#if $project?.api?.sync}
|
||||
<a href="/projects/{$project?.id}/settings" class="text-zinc-400 hover:text-zinc-300">
|
||||
<div class="flex flex-row items-center space-x-2 ">
|
||||
<div class="w-2 h-2 bg-green-700 rounded-full" />
|
||||
<div class="h-2 w-2 rounded-full bg-green-700" />
|
||||
<div>Syncing</div>
|
||||
</div>
|
||||
</a>
|
||||
@ -87,7 +87,7 @@
|
||||
{:else}
|
||||
<a href="/projects/{$project?.id}/settings" class="text-zinc-400 hover:text-zinc-300">
|
||||
<div class="flex flex-row items-center space-x-2 ">
|
||||
<div class="w-2 h-2 bg-red-700 rounded-full" />
|
||||
<div class="h-2 w-2 rounded-full bg-red-700" />
|
||||
<div>Offline</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
@ -5,15 +5,15 @@
|
||||
$: project = data.project;
|
||||
</script>
|
||||
|
||||
<div class="flex flex-col mt-12">
|
||||
<h1 class="text-zinc-200 text-xl flex justify-center">
|
||||
<div class="mt-12 flex flex-col">
|
||||
<h1 class="flex justify-center text-xl text-zinc-200">
|
||||
Overview of {$project?.title}
|
||||
</h1>
|
||||
<div class="flex justify-center space-x-2 text-lg">
|
||||
<a href="/projects/{$project?.id}/timeline" class="hover:text-zinc-200 text-orange-400"
|
||||
<a href="/projects/{$project?.id}/timeline" class="text-orange-400 hover:text-zinc-200"
|
||||
>Timeline</a
|
||||
>
|
||||
<a href="/projects/{$project?.id}/search" class="hover:text-zinc-200 text-orange-400"
|
||||
<a href="/projects/{$project?.id}/search" class="text-orange-400 hover:text-zinc-200"
|
||||
>search (test)</a
|
||||
>
|
||||
</div>
|
||||
|
||||
@ -30,7 +30,7 @@
|
||||
<input on:input={fetchResults} type="text" name="query" bind:value={query} />
|
||||
</figcaption>
|
||||
|
||||
<ul class="flex flex-col gap-q">
|
||||
<ul class="gap-q flex flex-col">
|
||||
{#each $results as result}
|
||||
<li>{JSON.stringify(result)}</li>
|
||||
{/each}
|
||||
|
||||
@ -78,9 +78,9 @@
|
||||
};
|
||||
</script>
|
||||
|
||||
<div class="p-4 mx-auto h-full overflow-auto">
|
||||
<div class="max-w-2xl mx-auto p-4">
|
||||
<div class="flex flex-col text-zinc-100 space-y-6">
|
||||
<div class="mx-auto h-full overflow-auto p-4">
|
||||
<div class="mx-auto max-w-2xl p-4">
|
||||
<div class="flex flex-col space-y-6 text-zinc-100">
|
||||
<div class="space-y-0">
|
||||
<div class="text-xl font-medium">Project Settings</div>
|
||||
<div class="text-zinc-400">
|
||||
@ -92,7 +92,7 @@
|
||||
<div class="space-y-2">
|
||||
<div class="ml-1">GitButler Cloud</div>
|
||||
<div
|
||||
class="flex flex-row justify-between border border-zinc-600 rounded-lg p-2 items-center"
|
||||
class="flex flex-row items-center justify-between rounded-lg border border-zinc-600 p-2"
|
||||
>
|
||||
<div class="flex flex-row space-x-3">
|
||||
<svg
|
||||
@ -101,7 +101,7 @@
|
||||
viewBox="0 0 24 24"
|
||||
stroke-width="1.5"
|
||||
stroke="white"
|
||||
class="w-6 h-6"
|
||||
class="h-6 w-6"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
@ -113,11 +113,11 @@
|
||||
{#if $project?.api?.git_url}
|
||||
<div class="flex flex-col">
|
||||
<div class="text-zinc-300">Git Host</div>
|
||||
<div class="text-zinc-400 font-mono">
|
||||
<div class="font-mono text-zinc-400">
|
||||
{hostname($project?.api?.git_url)}
|
||||
</div>
|
||||
<div class="text-zinc-300 mt-3">Repository ID</div>
|
||||
<div class="text-zinc-400 font-mono">
|
||||
<div class="mt-3 text-zinc-300">Repository ID</div>
|
||||
<div class="font-mono text-zinc-400">
|
||||
{repo_id($project?.api?.git_url)}
|
||||
</div>
|
||||
</div>
|
||||
@ -140,7 +140,7 @@
|
||||
</div>
|
||||
{:else}
|
||||
<div class="space-y-2">
|
||||
<div class="flex flex-row space-x-2 items-end">
|
||||
<div class="flex flex-row items-end space-x-2">
|
||||
<div class="">GitButler Cloud</div>
|
||||
<div class="text-zinc-400">backup your work and access advanced features</div>
|
||||
</div>
|
||||
@ -158,7 +158,7 @@
|
||||
id="path"
|
||||
name="path"
|
||||
type="text"
|
||||
class="p-2 text-zinc-300 bg-black border border-zinc-600 rounded-lg w-full"
|
||||
class="w-full rounded-lg border border-zinc-600 bg-black p-2 text-zinc-300"
|
||||
value={$project?.path}
|
||||
/>
|
||||
</div>
|
||||
@ -168,7 +168,7 @@
|
||||
id="name"
|
||||
name="name"
|
||||
type="text"
|
||||
class="p-2 text-zinc-300 bg-black border border-zinc-600 rounded-lg w-full"
|
||||
class="w-full rounded-lg border border-zinc-600 bg-black p-2 text-zinc-300"
|
||||
value={$project?.title}
|
||||
required
|
||||
/>
|
||||
@ -179,7 +179,7 @@
|
||||
id="description"
|
||||
name="description"
|
||||
rows="3"
|
||||
class="p-2 text-zinc-300 bg-black border border-zinc-600 rounded-lg w-full"
|
||||
class="w-full rounded-lg border border-zinc-600 bg-black p-2 text-zinc-300"
|
||||
value={$project?.api?.description}
|
||||
/>
|
||||
</div>
|
||||
@ -188,13 +188,13 @@
|
||||
<footer>
|
||||
{#if saving}
|
||||
<div
|
||||
class="flex w-32 flex-row w-content items-center gap-1 justify-center py-2 px-3 rounded text-white bg-blue-400"
|
||||
class="w-content flex w-32 flex-row items-center justify-center gap-1 rounded bg-blue-400 py-2 px-3 text-white"
|
||||
>
|
||||
<IconRotateClockwise2 class="w-5 h-5 animate-spin" />
|
||||
<IconRotateClockwise2 class="h-5 w-5 animate-spin" />
|
||||
<span>Updating...</span>
|
||||
</div>
|
||||
{:else}
|
||||
<button type="submit" class="py-2 px-3 rounded text-white bg-blue-600"
|
||||
<button type="submit" class="rounded bg-blue-600 py-2 px-3 text-white"
|
||||
>Update profile</button
|
||||
>
|
||||
{/if}
|
||||
|
||||
@ -151,31 +151,31 @@
|
||||
{#if $dateSessions === undefined}
|
||||
<span>Loading...</span>
|
||||
{:else}
|
||||
<div class="h-full flex flex-row space-x-12 px-4 py-4 pb-6">
|
||||
<div class="flex h-full flex-row space-x-12 px-4 py-4 pb-6">
|
||||
{#each Object.entries($dateSessions) as [dateMilliseconds, uiSessions]}
|
||||
<!-- Day -->
|
||||
<div
|
||||
id={dateMilliseconds}
|
||||
class="session-day-component flex flex-col bg-zinc-800/50 rounded-lg border border-zinc-700"
|
||||
class="session-day-component flex flex-col rounded-lg border border-zinc-700 bg-zinc-800/50"
|
||||
class:min-w-full={selection.dateMilliseconds == +dateMilliseconds}
|
||||
>
|
||||
<div
|
||||
class="session-day-container font-medium border-b border-zinc-700 bg-zinc-700/30 flex items-center py-2 px-4"
|
||||
class="session-day-container flex items-center border-b border-zinc-700 bg-zinc-700/30 py-2 px-4 font-medium"
|
||||
>
|
||||
<span class="session-day-header text-zinc-200 font-bold">
|
||||
<span class="session-day-header font-bold text-zinc-200">
|
||||
{formatDate(new Date(+dateMilliseconds))}
|
||||
</span>
|
||||
</div>
|
||||
{#if selection.dateMilliseconds !== +dateMilliseconds}
|
||||
<div class="flex flex-col flex-auto">
|
||||
<div class="h-2/3 flex space-x-2 p-3">
|
||||
<div class="flex flex-auto flex-col">
|
||||
<div class="flex h-2/3 space-x-2 p-3">
|
||||
{#each uiSessions as uiSession, i}
|
||||
<!-- Session (overview) -->
|
||||
|
||||
<div class="session-column-container flex flex-col w-40">
|
||||
<div class="session-column-container flex w-40 flex-col">
|
||||
<!-- svelte-ignore a11y-click-events-have-key-events -->
|
||||
<div
|
||||
class="repository-name cursor-pointer text-sm text-center font-bold rounded borded text-zinc-800 p-1 border bg-orange-400 border-orange-400 hover:bg-[#fdbc87]"
|
||||
class="repository-name borded cursor-pointer rounded border border-orange-400 bg-orange-400 p-1 text-center text-sm font-bold text-zinc-800 hover:bg-[#fdbc87]"
|
||||
on:click={() => expandSession(i, uiSession, +dateMilliseconds)}
|
||||
>
|
||||
{toHumanBranchName(uiSession.session.meta.branch)}
|
||||
@ -192,12 +192,12 @@
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col p-1" id="sessions-details">
|
||||
<div class="text-zinc-400 font-medium">
|
||||
<div class="font-medium text-zinc-400">
|
||||
{formatTime(new Date(uiSession.earliestDeltaTimestampMs))}
|
||||
-
|
||||
{formatTime(new Date(uiSession.latestDeltaTimestampMs))}
|
||||
</div>
|
||||
<div class="text-zinc-500 text-sm" title="Session duration">
|
||||
<div class="text-sm text-zinc-500" title="Session duration">
|
||||
{Math.round(
|
||||
(uiSession.latestDeltaTimestampMs - uiSession.earliestDeltaTimestampMs) /
|
||||
1000 /
|
||||
@ -208,12 +208,12 @@
|
||||
{#each Object.keys(uiSession.deltas) as filePath}
|
||||
<button
|
||||
on:click={() => expandSession(i, uiSession, +dateMilliseconds, filePath)}
|
||||
class="cursor-pointer flex flex-row w-32 items-center"
|
||||
class="flex w-32 cursor-pointer flex-row items-center"
|
||||
>
|
||||
<div class="w-6 h-6 text-zinc-200 fill-blue-400">
|
||||
<div class="h-6 w-6 fill-blue-400 text-zinc-200">
|
||||
{@html pathToIconSvg(filePath)}
|
||||
</div>
|
||||
<div class="file-name text-zinc-300 hover:text-zinc-50 w-24 truncate">
|
||||
<div class="file-name w-24 truncate text-zinc-300 hover:text-zinc-50">
|
||||
{pathToName(filePath)}
|
||||
</div>
|
||||
</button>
|
||||
@ -223,12 +223,12 @@
|
||||
</div>
|
||||
{/each}
|
||||
</div>
|
||||
<div class="day-summary-container h-1/3 p-4 border-t border-zinc-400 ">
|
||||
<div class="day-summary-container h-1/3 border-t border-zinc-400 p-4 ">
|
||||
<div class="day-summary-header font-bold text-zinc-200">Day summary</div>
|
||||
</div>
|
||||
</div>
|
||||
{:else}
|
||||
<div class="my-2 flex-auto overflow-auto flex flex-row space-x-2">
|
||||
<div class="my-2 flex flex-auto flex-row space-x-2 overflow-auto">
|
||||
<div class="">
|
||||
<button
|
||||
on:click={() => {
|
||||
@ -242,14 +242,14 @@
|
||||
}}
|
||||
class="{selection.sessionIdx == 0
|
||||
? 'disabled cursor-default brightness-50'
|
||||
: 'hover:bg-[#fdbc87]'} rounded-r bg-orange-400 border border-orange-400 text-zinc-800 p-1 text-center text-sm font-medium "
|
||||
: 'hover:bg-[#fdbc87]'} rounded-r border border-orange-400 bg-orange-400 p-1 text-center text-sm font-medium text-zinc-800 "
|
||||
>
|
||||
‹
|
||||
</button>
|
||||
</div>
|
||||
<div class="w-full flex flex-col border rounded-t border-orange-400">
|
||||
<div class="flex w-full flex-col rounded-t border border-orange-400">
|
||||
<div
|
||||
class="session-header px-4 bg-orange-400 border border-orange-400 p-1 rounded-t-sm text-zinc-800 text-sm font-bold flex items-center justify-between"
|
||||
class="session-header flex items-center justify-between rounded-t-sm border border-orange-400 bg-orange-400 p-1 px-4 text-sm font-bold text-zinc-800"
|
||||
>
|
||||
<span class="cursor-default"
|
||||
>{format(selection.start, 'hh:mm')} - {format(selection.end, 'hh:mm')}</span
|
||||
@ -258,9 +258,9 @@
|
||||
<button on:click={resetSelection}>Close</button>
|
||||
</div>
|
||||
|
||||
<div class="flex-auto overflow-auto flex flex-col">
|
||||
<div class="shadow shadow-zinc-700 ring-1 ring-zinc-700 ring-opacity-5 mb-1">
|
||||
<div class="grid-cols-11 -mr-px border-zinc-700 grid text-xs font-medium">
|
||||
<div class="flex flex-auto flex-col overflow-auto">
|
||||
<div class="mb-1 shadow shadow-zinc-700 ring-1 ring-zinc-700 ring-opacity-5">
|
||||
<div class="-mr-px grid grid-cols-11 border-zinc-700 text-xs font-medium">
|
||||
<div class="col-span-2 flex items-center justify-center py-1">
|
||||
<span>{format(selection.start, 'hh:mm')}</span>
|
||||
</div>
|
||||
@ -301,7 +301,7 @@
|
||||
<!-- needle -->
|
||||
<div class="grid grid-cols-11">
|
||||
<div class="col-span-2 flex items-center justify-center" />
|
||||
<div class="-mx-1 col-span-8 flex items-center justify-center">
|
||||
<div class="col-span-8 -mx-1 flex items-center justify-center">
|
||||
<Slider min={17} max={80} step={1} bind:value={selection.selectedColumn}>
|
||||
<svelte:fragment slot="tooltip" let:value>
|
||||
{format(colToTimestamp(value, selection.start, selection.end), 'hh:mm')}
|
||||
@ -311,7 +311,7 @@
|
||||
<div class="col-span-1 flex items-center justify-center" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="timeline-file-list flex mb-1 border-b-zinc-700">
|
||||
<div class="timeline-file-list mb-1 flex border-b-zinc-700">
|
||||
<div class="grid flex-auto grid-cols-1 grid-rows-1">
|
||||
<!-- file names list -->
|
||||
<div
|
||||
@ -324,15 +324,15 @@
|
||||
{#each Object.keys(selection.deltas) as filePath}
|
||||
<div
|
||||
class="flex {filePath === selection.selectedFilePath
|
||||
? 'bg-blue-500/70 font-bold rounded-sm mx-1'
|
||||
? 'mx-1 rounded-sm bg-blue-500/70 font-bold'
|
||||
: ''}"
|
||||
>
|
||||
<button
|
||||
class="text-xs z-20 flex justify-end items-center overflow-hidden sticky left-0 w-1/6 leading-5
|
||||
class="sticky left-0 z-20 flex w-1/6 items-center justify-end overflow-hidden text-xs leading-5
|
||||
{selection.selectedFilePath ===
|
||||
filePath
|
||||
? 'text-zinc-200 cursor-default'
|
||||
: 'text-zinc-400 hover:text-zinc-200 cursor-pointer'}"
|
||||
? 'cursor-default text-zinc-200'
|
||||
: 'cursor-pointer text-zinc-400 hover:text-zinc-200'}"
|
||||
on:click={() => (selection.selectedFilePath = filePath)}
|
||||
title={filePath}
|
||||
>
|
||||
@ -354,7 +354,7 @@
|
||||
</div>
|
||||
<!-- time vertical lines -->
|
||||
<div
|
||||
class="col-start-1 col-end-2 row-start-1 grid-rows-1 divide-x divide-zinc-700/50 grid grid-cols-11"
|
||||
class="col-start-1 col-end-2 row-start-1 grid grid-cols-11 grid-rows-1 divide-x divide-zinc-700/50"
|
||||
>
|
||||
<div class="col-span-2 row-span-full" />
|
||||
<div class="col-span-2 row-span-full" />
|
||||
@ -376,7 +376,7 @@
|
||||
{#each Object.entries(selection.deltas) as [filePath, fileDeltas], idx}
|
||||
{#each fileDeltas as delta}
|
||||
<li
|
||||
class="relative flex items-center bg-zinc-300 hover:bg-zinc-100 rounded m-0.5 cursor-pointer"
|
||||
class="relative m-0.5 flex cursor-pointer items-center rounded bg-zinc-300 hover:bg-zinc-100"
|
||||
style="
|
||||
grid-row: {idx +
|
||||
1} / span 1;
|
||||
@ -387,7 +387,7 @@
|
||||
)} / span 1;"
|
||||
>
|
||||
<button
|
||||
class="z-20 flex flex-col w-full items-center justify-center"
|
||||
class="z-20 flex w-full flex-col items-center justify-center"
|
||||
on:click={() => {
|
||||
selection.selectedColumn = timeStampToCol(
|
||||
new Date(delta.timestampMs),
|
||||
@ -429,7 +429,7 @@
|
||||
}}
|
||||
class="{selection.sessionIdx < uiSessions.length - 1
|
||||
? 'hover:bg-[#fdbc87]'
|
||||
: 'disabled cursor-default brightness-50'} rounded-r bg-orange-400 border border-orange-400 text-zinc-800 p-1 text-center text-sm font-medium "
|
||||
: 'disabled cursor-default brightness-50'} rounded-r border border-orange-400 bg-orange-400 p-1 text-center text-sm font-medium text-zinc-800 "
|
||||
>
|
||||
›
|
||||
</button>
|
||||
|
||||
@ -54,8 +54,8 @@
|
||||
};
|
||||
</script>
|
||||
|
||||
<div class="p-4 mx-auto">
|
||||
<div class="max-w-xl mx-auto p-4">
|
||||
<div class="mx-auto p-4">
|
||||
<div class="mx-auto max-w-xl p-4">
|
||||
{#if $user}
|
||||
<div class="flex flex-col gap-6 text-zinc-100">
|
||||
<header class="flex items-center justify-between">
|
||||
@ -68,7 +68,7 @@
|
||||
|
||||
<form
|
||||
on:submit={onSubmit}
|
||||
class="flex flex-row gap-12 justify-between rounded-lg p-2 items-start"
|
||||
class="flex flex-row items-start justify-between gap-12 rounded-lg p-2"
|
||||
>
|
||||
<fields id="left" class="flex flex-1 flex-col gap-3">
|
||||
<div class="flex flex-col gap-1">
|
||||
@ -78,7 +78,7 @@
|
||||
name="name"
|
||||
bind:value={userName}
|
||||
type="text"
|
||||
class="px-2 py-1 text-zinc-300 bg-black border border-zinc-600 rounded-lg w-full"
|
||||
class="w-full rounded-lg border border-zinc-600 bg-black px-2 py-1 text-zinc-300"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
@ -91,29 +91,29 @@
|
||||
name="email"
|
||||
bind:value={$user.email}
|
||||
type="text"
|
||||
class="px-2 py-1 text-zinc-300 bg-black border border-zinc-600 rounded-lg w-full"
|
||||
class="w-full rounded-lg border border-zinc-600 bg-black px-2 py-1 text-zinc-300"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<footer class="pt-4">
|
||||
{#if saving}
|
||||
<div
|
||||
class="flex w-32 flex-row w-content items-center gap-1 justify-center px-4 py-2 rounded text-white bg-blue-600"
|
||||
class="w-content flex w-32 flex-row items-center justify-center gap-1 rounded bg-blue-600 px-4 py-2 text-white"
|
||||
>
|
||||
<IconRotateClockwise2 class="w-5 h-5 animate-spin" />
|
||||
<IconRotateClockwise2 class="h-5 w-5 animate-spin" />
|
||||
<span>Updating...</span>
|
||||
</div>
|
||||
{:else}
|
||||
<button
|
||||
type="submit"
|
||||
class="px-4 py-2 rounded-md text-white bg-blue-600 hover:bg-blue-700 focus:outline-none"
|
||||
class="rounded-md bg-blue-600 px-4 py-2 text-white hover:bg-blue-700 focus:outline-none"
|
||||
>Update profile</button
|
||||
>
|
||||
{/if}
|
||||
</footer>
|
||||
</fields>
|
||||
|
||||
<fields id="right" class="flex flex-col gap-2 items-center">
|
||||
<fields id="right" class="flex flex-col items-center gap-2">
|
||||
{#if $user.picture}
|
||||
<img
|
||||
class="h-28 w-28 rounded-full border-zinc-300"
|
||||
@ -124,7 +124,7 @@
|
||||
|
||||
<label
|
||||
for="picture"
|
||||
class="px-2 -mt-6 -ml-16 cursor-pointer text-center font-sm text-zinc-300 bg-zinc-800 border border-zinc-600 rounded-lg hover:text-zinc-50 bg-zinc-800 hover:bg-zinc-900"
|
||||
class="font-sm -mt-6 -ml-16 cursor-pointer rounded-lg border border-zinc-600 bg-zinc-800 bg-zinc-800 px-2 text-center text-zinc-300 hover:bg-zinc-900 hover:text-zinc-50"
|
||||
>
|
||||
Edit
|
||||
<input
|
||||
@ -140,10 +140,10 @@
|
||||
</form>
|
||||
</div>
|
||||
{:else}
|
||||
<div class="flex flex-col text-white space-y-6 items-center justify-items-center">
|
||||
<div class="flex flex-col items-center justify-items-center space-y-6 text-white">
|
||||
<div class="text-3xl font-bold text-white">Connect to GitButler Cloud</div>
|
||||
<div>Sign up or log in to GitButler Cloud for more tools and features:</div>
|
||||
<ul class="text-zinc-400 pb-4 space-y-2">
|
||||
<ul class="space-y-2 pb-4 text-zinc-400">
|
||||
<li class="flex flex-row space-x-3">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
@ -151,7 +151,7 @@
|
||||
viewBox="0 0 24 24"
|
||||
stroke-width="1.5"
|
||||
stroke="white"
|
||||
class="w-6 h-6"
|
||||
class="h-6 w-6"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
@ -168,7 +168,7 @@
|
||||
viewBox="0 0 24 24"
|
||||
stroke-width="1.5"
|
||||
stroke="white"
|
||||
class="w-6 h-6"
|
||||
class="h-6 w-6"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
@ -186,7 +186,7 @@
|
||||
viewBox="0 0 24 24"
|
||||
stroke-width="1.5"
|
||||
stroke="white"
|
||||
class="w-6 h-6"
|
||||
class="h-6 w-6"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
@ -200,15 +200,15 @@
|
||||
<div class="mt-8 text-center">
|
||||
<Login {user} {api} />
|
||||
</div>
|
||||
<div class="text-zinc-300 text-center">
|
||||
<div class="text-center text-zinc-300">
|
||||
You will still need to give us permission for each project before we transfer any data to
|
||||
our servers. You can revoke this permission at any time.
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<div class="flex flex-col mt-8 border-t border-zinc-400 pt-4">
|
||||
<h2 class="text-lg text-zinc-100 font-medium">Get Support</h2>
|
||||
<div class="mt-8 flex flex-col border-t border-zinc-400 pt-4">
|
||||
<h2 class="text-lg font-medium text-zinc-100">Get Support</h2>
|
||||
<div class="text-sm text-zinc-300">
|
||||
If you have an issue or any questions, please email us.
|
||||
</div>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user