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

Fix new filecard dark mode

Browse Source
This commit is contained in:
Mattias Granlund 2023-07-19 16:11:13 +01:00
parent 13ce43ee84
commit 9d99fb6fdf
3 changed files with 18 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
src/routes/repo/[projectId]/FileCardNext.svelte
View File

@ -132,7 +132,7 @@
on:dblclick
class="changed-hunk"
>
<div class="w-full overflow-hidden bg-white">
<div class="w-full overflow-hidden bg-white dark:bg-dark-900">
{#each section.subSections as subsection, sidx}
{#each subsection.lines.slice(0, subsection.expanded ? subsection.lines.length : 0) as line}
<RenderedLine
@ -149,10 +149,17 @@
/>
{/each}
{#if !subsection.expanded}
<div class="flex h-5 w-full">
<div class="bg-light-50 text-center border-r border-light-400" style:min-width={`${2 * minWidth}rem`}>
<div
class="flex h-5 w-full border-light-200 dark:border-dark-300"
class:border-t={sidx == section.subSections.length - 1}
class:border-b={sidx == 0}
>
<div
class="border-r border-light-200 bg-light-50 text-center dark:border-dark-400 dark:bg-dark-500 dark:text-white"
style:min-width={`${2 * minWidth}rem`}
>
<button
class="px-4 py-0.5 text-sm text-light-500 hover:text-light-700 dark:text-dark-300"
class="px-2 py-0.5 text-sm text-light-500 dark:text-dark-200 hover:text-light-700 dark:hover:text-dark-100"
on:click={() => {
if ('expanded' in subsection) {
subsection.expanded = true;
@ -168,7 +175,7 @@
{/if}
</button>
</div>
<div class="flex-grow" />
<div class="flex-grow bg-light-25 dark:bg-dark-600" />
</div>
{/if}
{/each}
@ -199,10 +206,9 @@
</div>
{/if}
{#if !section.expanded}
<div class="flex">
<div style:width={`${2 * minWidth}rem`} class="flex justify-center">
<button
class="px-2 py-1 text-sm text-light-500 hover:text-light-700 dark:text-dark-300"
style:margin-left={`${minWidth - 1}rem`}
class="px-2 py-0.5 text-sm text-light-500 dark:text-dark-200 hover:text-light-700 dark:hover:text-dark-100"
on:click={() => {
if ('expanded' in section) {
section.expanded = true;

2
src/routes/repo/[projectId]/RenderedLine.svelte
View File

@ -43,7 +43,7 @@
{line.afterLineNumber || ''}
</div>
<div
class="pl-1 flex-grow overflow-hidden"
class="flex-grow overflow-hidden pl-1"
class:whitespace-pre={maximized}
class:whitespace-nowrap={!maximized}
class:diff-line-deletion={sectionType === SectionType.RemovedLines}

4
tailwind.config.cjs
View File

@ -76,6 +76,7 @@ const config = {
1000: '#1E1E1E' // Board and inactive tab background
},
light: {
25: '#FAFAFB', // Active tab and file card background
50: '#F6F6F7', // Active tab and file card background
100: '#F4F4F5', // Branch background in tray
200: '#E4E4E7', // Board background and commit message border
@ -88,7 +89,8 @@ const config = {
900: '#202223' // Normal text
},
blue: {
100: '#DEF4FF',
50: '#EFF4FF',
100: '#CBE2FE',
200: '#bfdbfe',
400: '#60a5fa',
500: '#3b82f6',