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

differ: wrap text

Browse Source
This commit is contained in:
Nikita Galaiko 2023-04-28 12:51:08 +02:00
parent 932a51d271
commit d76c0607f1
1 changed files with 14 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
src/lib/components/Differ/Differ.svelte
View File

@ -159,7 +159,7 @@
</script> </script>
<div class="flex h-full w-full select-text whitespace-pre font-mono"> <div class="flex h-full w-full select-text whitespace-pre font-mono">
<div id="numbers" class="flex flex-shrink-0 select-none flex-col"> <div id="content" class="flex max-w-full flex-auto flex-col">
{#each rows as row} {#each rows as row}
{@const baseNumber = {@const baseNumber =
row.type === RowType.Equal || row.type === RowType.Deletion row.type === RowType.Equal || row.type === RowType.Deletion
@ -169,35 +169,24 @@
row.type === RowType.Equal || row.type === RowType.Addition row.type === RowType.Equal || row.type === RowType.Addition
? String(row.currentLineNumber) ? String(row.currentLineNumber)
: ''} : ''}
<div class="grid-cols-min grid grid-cols-3 gap-2"> <div
<span class="min-w-[{originalLineNumberDigits}ch] text-right text-[#8C8178]"> class="grid max-w-full grid-cols-3"
style:grid-template-columns="min-content min-content 1fr"
>
<span class="mr-2 w-[{originalLineNumberDigits}ch] text-right text-[#8C8178]">
{baseNumber} {baseNumber}
</span> </span>
<span class="min-w-[{currentLineNumberDigits}ch] text-right text-[#8C8178]">
<span class="mr-3 w-[{currentLineNumberDigits}ch] text-right text-[#8C8178]">
{curNumber} {curNumber}
</span> </span>
<span
class="min-w-[1ch] text-center before:content-[attr(data-marker)]"
class:diff-line-addition={row.type === RowType.Addition}
class:diff-line-deletion={row.type === RowType.Deletion}
class:line-changed={row.type === RowType.Addition || row.type === RowType.Deletion}
data-marker={row.type === RowType.Addition
? '+'
: row.type === RowType.Deletion
? '-'
: ' '}
/>
</div>
{/each}
</div>
<div id="content" class="flex flex-auto flex-col"> <span class="diff-line-{row.type} overflow-hidden whitespace-pre-wrap">
{#each rows as row}
<span class="diff-line-{row.type}">
{#each row.render.html as content} {#each row.render.html as content}
{@html content} {@html content}
{/each} {/each}
</span> </span>
</div>
{/each} {/each}
</div> </div>
</div> </div>