refac: styling

This commit is contained in:
Timothy Jaeryang Baek 2025-09-03 18:37:25 +04:00
parent 5a596ae40c
commit 926954f93b
2 changed files with 14 additions and 6 deletions

View file

@ -282,6 +282,14 @@ input[type='number'] {
outline: none;
}
.cm-gutters {
@apply !bg-white dark:!bg-black !border-none;
}
.cm-editor {
@apply bg-white dark:bg-black;
}
.tippy-box[data-theme~='dark'] {
@apply rounded-lg bg-gray-950 text-xs border border-gray-900 shadow-xl;
}

View file

@ -437,7 +437,7 @@
>
<div class="flex items-center gap-0.5 translate-y-[1px]">
<button
class="flex gap-1 items-center bg-none border-none bg-gray-50 hover:bg-gray-100 dark:bg-gray-850 dark:hover:bg-gray-800 transition rounded-md px-1.5 py-0.5"
class="flex gap-1 items-center bg-none border-none bg-gray-50 dark:bg-black transition rounded-md px-1.5 py-0.5"
on:click={collapseCodeBlock}
>
<div class=" -translate-y-[0.5px]">
@ -451,7 +451,7 @@
{#if preview && ['html', 'svg'].includes(lang)}
<button
class="flex gap-1 items-center run-code-button bg-none border-none bg-gray-50 hover:bg-gray-100 dark:bg-gray-850 dark:hover:bg-gray-800 transition rounded-md px-1.5 py-0.5"
class="flex gap-1 items-center run-code-button bg-none border-none bg-gray-50 dark:bg-black transition rounded-md px-1.5 py-0.5"
on:click={previewCode}
>
<div class=" -translate-y-[0.5px]">
@ -471,7 +471,7 @@
</div>
{:else if run}
<button
class="flex gap-1 items-center run-code-button bg-none border-none bg-gray-50 hover:bg-gray-100 dark:bg-gray-850 dark:hover:bg-gray-800 transition rounded-md px-1.5 py-0.5"
class="flex gap-1 items-center run-code-button bg-none border-none bg-gray-50 dark:bg-black transition rounded-md px-1.5 py-0.5"
on:click={async () => {
code = _code;
await tick();
@ -491,7 +491,7 @@
{#if save}
<button
class="save-code-button bg-none border-none bg-gray-50 hover:bg-gray-100 dark:bg-gray-850 dark:hover:bg-gray-800 transition rounded-md px-1.5 py-0.5"
class="save-code-button bg-none border-none bg-gray-50 dark:bg-black transition rounded-md px-1.5 py-0.5"
on:click={saveCode}
>
{saved ? $i18n.t('Saved') : $i18n.t('Save')}
@ -499,7 +499,7 @@
{/if}
<button
class="copy-code-button bg-none border-none bg-gray-50 hover:bg-gray-100 dark:bg-gray-850 dark:hover:bg-gray-800 transition rounded-md px-1.5 py-0.5"
class="copy-code-button bg-none border-none bg-gray-50 dark:bg-black transition rounded-md px-1.5 py-0.5"
on:click={copyCode}>{copied ? $i18n.t('Copied') : $i18n.t('Copy')}</button
>
</div>
@ -512,7 +512,7 @@
? ''
: 'rounded-b-lg'} overflow-hidden"
>
<div class=" pt-7 bg-gray-50 dark:bg-gray-850"></div>
<div class=" pt-7 bg-gray-50 dark:bg-black"></div>
{#if !collapsed}
{#if edit}