Something went wrong. Try again.
svelte astro
Something went wrong. Try again.
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647<script lang="ts"> import Block from "./Block.svelte"; import { proyectState, type Tab } from "../State.svelte";
type View = { id: Tab; label: string; tooltip: string };
const tabs: View[] = [ { id: "table", label: "Table", tooltip: "TODO" }, { id: "twoplot", label: "2D Plot", tooltip: "TODO" }, { id: "threeplot", label: "3D Plot", tooltip: "TODO" }, ];</script>
<Block title="Views" color="var(--orange)" tooltip="TODO" tooltipPos="left"> {#each tabs as tab} <button onclick={() => (proyectState.current!.currentTab = tab.id)} aria-current={proyectState.current!.currentTab === tab.id ? "page" : undefined} class={proyectState.current!.currentTab == tab.id ? "selected" : ""} > {tab.label} </button> {/each}</Block>
<style> button { display: flex; justify-content: center; font-size: 1em; border: none; color: var(--textMuted); font-weight: normal; }
button:hover { font-weight: bold; }
.selected { color: var(--text); font-weight: bold; }</style>