blob: 2a938975b7fa591eaaf5f96f46c6ddde08734f04 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
|
<script lang="ts">
import { page } from '$app/stores';
export let href: string;
$: isActive = $page.url.pathname == href;
</script>
<a class="nav-tab" {href} class:active={isActive}>
<slot></slot>
</a>
<style lang="scss">
.nav-tab {
padding: 8px;
text-decoration: none;
color: black;
}
.nav-tab:hover {
background-color: rgb(246, 248, 250);
}
.nav-tab.active {
border-bottom: 2px solid #0080ff;
}
</style>
|