Files
radicle-desktop/src/components/PreviewSwitch.svelte
T
Rūdolfs Ošiņš efea7f1ab2 Add peer selector to repo source browsing
Introduce a peer/branch/tag selector in the repository source and commits
views, letting you browse the canonical refs or any peer's namespace.
2026-06-04 17:19:31 +02:00

55 lines
1.1 KiB
Svelte

<script lang="ts">
import Icon from "@app/components/Icon.svelte";
let { preview = $bindable(true) }: { preview?: boolean } = $props();
</script>
<style>
.container {
display: flex;
align-items: center;
gap: 0.25rem;
}
.toggle {
display: flex;
align-items: center;
gap: 0.25rem;
font: var(--txt-body-m-regular);
color: var(--color-text-secondary);
padding: 0.25rem 0.5rem;
border: 0;
border-radius: var(--border-radius-sm);
background-color: transparent;
cursor: pointer;
white-space: nowrap;
}
.toggle:hover {
background-color: var(--color-surface-strong);
color: var(--color-text-primary);
}
.toggle.active {
background-color: var(--color-surface-strong);
color: var(--color-text-primary);
}
</style>
<div class="container">
<button
class="toggle"
class:active={!preview}
onclick={() => {
preview = false;
}}>
<Icon name="code" />Code
</button>
<button
class="toggle"
class:active={preview}
onclick={() => {
preview = true;
}}>
<Icon name="eye" />Preview
</button>
</div>