BetterSEQTA/BetterSEQTA-Plus
1
0
Fork 0
mirror of https://github.com/BetterSEQTA/BetterSEQTA-Plus.git synced 2026-06-06 03:34:40 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor: Update store page header styling and add search functionality

Browse Source
This commit is contained in:
sethburkart123
2024-09-15 08:55:26 +10:00
parent 0b9240a390
commit 92fd20c380
2 changed files with 29 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/svelte-interface/components/store/Header.svelte
+1 -1
View File
@@ -12,7 +12,7 @@
}; };
</script> </script>
<header class="fixed top-0 z-50 w-full h-[4.25rem] bg-white border-b shadow-md border-b-white/10 dark:bg-zinc-800/90 backdrop-blur-xl dark:text-white"> <header class="fixed top-0 z-50 w-full h-[4.25rem] bg-white border-b shadow-md border-b-white/10 dark:bg-zinc-950/90 backdrop-blur-xl dark:text-white">
<div class="flex items-center justify-between px-4 py-1"> <div class="flex items-center justify-between px-4 py-1">
<div class="flex gap-4 cursor-pointer place-items-center" onkeydown={(e) => { if (e.key === 'Enter') clearSearch() }} onclick={clearSearch} role="button" tabindex="0"> <div class="flex gap-4 cursor-pointer place-items-center" onkeydown={(e) => { if (e.key === 'Enter') clearSearch() }} onclick={clearSearch} role="button" tabindex="0">
<img src={browser.runtime.getURL(logo)} class="h-14 {darkMode ? 'hidden' : ''}" alt="Logo" /> <img src={browser.runtime.getURL(logo)} class="h-14 {darkMode ? 'hidden' : ''}" alt="Logo" />
src/svelte-interface/pages/store.svelte
+4 -4
View File
@@ -63,12 +63,11 @@
)); ));
</script> </script>
<div class="w-screen h-screen bg-white {darkMode ? 'dark' : ''}"> <div class="w-screen h-screen bg-white pt-[4.25rem] {darkMode ? 'dark' : ''}">
<div class="h-full overflow-y-scroll bg-zinc-200/50 dark:bg-zinc-900 dark:text-white">
<Header searchTerm={searchTerm} setSearchTerm={setSearchTerm} darkMode={darkMode} /> <Header searchTerm={searchTerm} setSearchTerm={setSearchTerm} darkMode={darkMode} />
<div class="bg-zinc-200/50 dark:bg-zinc-900 dark:text-white pt-[4.25rem] h-full px-12 overflow-y-scroll"> <div class="px-12 pt-12">
<!-- Loading State --> <!-- Loading State -->
{#if loading} {#if loading}
<div class="grid grid-cols-1 gap-4 py-12 mx-auto sm:grid-cols-2 lg:grid-cols-3"> <div class="grid grid-cols-1 gap-4 py-12 mx-auto sm:grid-cols-2 lg:grid-cols-3">
@@ -94,4 +93,5 @@
{/if} {/if}
</div> </div>
</div>
</div> </div>