diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 245541d..4129c7a 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -122,6 +122,13 @@
$effect(() => {
if (!is_mobile) open_drawer = false;
});
+
+ let tabs = [
+ { id: '', content: 'select 1', name: 'new' },
+ { id: '', content: 'select 2', name: 'query1' },
+ { id: '', content: 'select 3', name: 'query2' }
+ ];
+ let selected_tab = $state(0);
@@ -169,7 +176,18 @@
{/if}
+
+ {#each tabs as tab, i}
+ (selected_tab = i)}
+ >
+ {tab.name}
+
+ {/each}
+
+
-
-
-
+ {#each tabs as tab, i}
+
+
+
+ {/each}
{/snippet}
{#snippet b()}
@@ -200,6 +220,8 @@
& > .left {
flex: 1;
+ align-items: center;
+ height: 100%;
}
& > .right {
@@ -208,7 +230,6 @@
}
& button {
- height: 100%;
background-color: transparent;
border-radius: 0;
}
@@ -218,6 +239,21 @@
}
}
+ .tab {
+ font-size: 11px;
+ border-right: 1px solid hsl(0deg 0% 20%);
+ padding: 0 10px 0 10px;
+ display: inline-flex;
+ align-items: center;
+ height: 100%;
+ color: hsl(0deg 0% 70%);
+ }
+
+ .active {
+ background-color: hsl(0deg 0% 12%);
+ color: white;
+ }
+
button {
appearance: none;
outline: none;