aotds-docks/src/lib/components/ShipEdit/Structure/Screens.svelte

48 lines
917 B
Svelte

<ShipItem {...reqs}>
<div>
<Field label="screens">
<input class="short" type="number" bind:value={standard} min="0" />
</Field>
<Field label="advanced screens">
<input
class="short advanced"
type="number"
bind:value={advanced}
min="0"
/>
</Field>
</div>
</ShipItem>
<script>
import { getContext } from "svelte";
import Section from "$lib/components/Section.svelte";
import Field from "$lib/components/Field.svelte";
import ShipItem from "$lib/components/ShipItem.svelte";
export let reqs = {};
export let standard = 0;
export let advanced = 0;
const api = getContext("api");
$: api?.dispatch?.setScreens?.({ standard, advanced });
</script>
<style>
input {
width: 3em;
}
div {
display: flex;
gap: 2em;
align-items: baseline;
}
.advanced {
min-width: 8em;
text-align: center;
}
</style>