refac: styling

This commit is contained in:
Timothy J. Baek 2024-06-09 15:12:38 -07:00
parent a93645aee8
commit 8b4867deb5
2 changed files with 9 additions and 5 deletions

View File

@ -23,12 +23,12 @@
let selectedTab = 'general';
</script>
<div class="flex flex-col md:flex-row w-full h-full py-2 md:space-x-4">
<div class="flex flex-col lg:flex-row w-full h-full py-2 lg:space-x-4">
<div
class="tabs flex flex-row overflow-x-auto space-x-1 md:space-x-0 md:space-y-1 md:flex-col md:flex-none md:w-44 dark:text-gray-200 text-xs text-left scrollbar-none"
class="tabs flex flex-row overflow-x-auto space-x-1 max-w-full lg:space-x-0 lg:space-y-1 lg:flex-col lg:flex-none lg:w-44 dark:text-gray-200 text-xs text-left scrollbar-none"
>
<button
class="px-2.5 py-2.5 min-w-fit rounded-lg flex-1 md:flex-none flex text-right transition {selectedTab ===
class="px-2.5 py-2.5 min-w-fit rounded-lg flex-1 lg:flex-none flex text-right transition {selectedTab ===
'general'
? 'bg-gray-200 dark:bg-gray-800'
: ' hover:bg-gray-300 dark:hover:bg-gray-850'}"
@ -319,7 +319,7 @@
</button>
</div>
<div class="flex-1 mt-3 md:mt-0 overflow-y-scroll">
<div class="flex-1 mt-3 lg:mt-0 overflow-y-scroll">
{#if selectedTab === 'general'}
<General
saveHandler={() => {

View File

@ -14,7 +14,11 @@
</title>
</svelte:head>
<div class=" flex flex-col w-full min-h-screen max-h-screen">
<div
class=" flex flex-col w-full min-h-screen max-h-screen {$showSidebar
? 'md:max-w-[calc(100%-260px)]'
: ''}"
>
<div class=" px-4 pt-3 mt-0.5 mb-1">
<div class=" flex items-center gap-1">
<div class="{$showSidebar ? 'md:hidden' : ''} mr-1 self-start flex flex-none items-center">