tomasalias/AstralRinth
1
0
Fork 0
forked from didirus/AstralRinth
Code Pull Requests Activity

Run pnpm format

Browse Source
This commit is contained in:
venashial
2022-08-03 00:24:44 -07:00
parent e17eb02341
commit 13c417fcee
21 changed files with 579 additions and 565 deletions
Download Patch File Download Diff File Expand all files Collapse all files

72
theseus_gui/src/components/TitledSection.svelte
View File

@@ -1,49 +1,49 @@
<script lang="ts">
import { Checkbox } from "omorphia"
import { Checkbox } from 'omorphia';
export let title: string
export let toggleable: boolean = false
export let title: string;
export let toggleable: boolean = false;
export let enabled: boolean = false
export let enabled: boolean = false;
</script>
<div class="section">
<div class="section__title">
{#if toggleable}<Checkbox bind:checked={enabled}>{title}</Checkbox>
{:else}{title}
{/if}
</div>
<div class="section__items">
{#if !toggleable || enabled}<slot />{/if}
</div>
<div class="section__title">
{#if toggleable}<Checkbox bind:checked={enabled}>{title}</Checkbox>
{:else}{title}
{/if}
</div>
<div class="section__items">
{#if !toggleable || enabled}<slot />{/if}
</div>
</div>
<style lang="postcss">
.section {
display: flex;
flex-direction: column;
padding: 1rem;
grid-gap: 1rem;
.section {
display: flex;
flex-direction: column;
padding: 1rem;
grid-gap: 1rem;
&__title {
display: flex;
grid-gap: 1rem;
align-items: center;
&__title {
display: flex;
grid-gap: 1rem;
align-items: center;
&::after {
flex: 1 1;
content: " ";
background-color: hsla(0, 0%, 100%, 0.2);
height: 0.2rem;
border-radius: var(--rounded-max);
}
}
&__items {
display: flex;
flex-direction: column;
grid-gap: 1rem;
padding: 0 8px;
}
&::after {
flex: 1 1;
content: ' ';
background-color: hsla(0, 0%, 100%, 0.2);
height: 0.2rem;
border-radius: var(--rounded-max);
}
}
&__items {
display: flex;
flex-direction: column;
grid-gap: 1rem;
padding: 0 8px;
}
}
</style>