Cons-n-Stuff/slidershim
1
0
Fork 0
mirror of https://github.com/4yn/slidershim.git synced 2024-11-24 05:50:12 +01:00
Code Releases Activity

add warnings and adjust button layout

Browse Source
This commit is contained in:
4yn 2022-03-23 01:42:14 +08:00
parent 169d981e6f
commit ec0cc7d2e4
2 changed files with 337 additions and 288 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
public/global.css
View File

@ -71,12 +71,33 @@ body {
.main {
margin-top: 2rem;
height: calc(100% - 2rem);
display: flex;
flex-flow: column nowrap;
align-items: stretch;
justify-content: flex-start;
}
.preview-row {
flex: 0 1;
}
.options {
padding: 0.5rem 0;
flex: 1 1;
display: flex;
flex-flow: column nowrap;
align-items: stretch;
justify-content: flex-start;
overflow-y: auto;
}
.buttons-row {
flex: 0 1;
}
.row,
.row-2 {
margin: 0 0 0.5rem 0;
@ -102,6 +123,10 @@ body {
flex: 2 2 0;
}
.comment {
font-size: 0.75rem;
}
.serverlist {
width: 100%;
max-height: 5rem;

56
src/App.svelte
View File

@ -169,9 +169,10 @@
</div>
<div data-tauri-drag-region class="titlebar titlebar-front" />
<main class="main">
<div class="row">
<div class="preview-row">
<Preview data={previewData} />
</div>
<div class="options">
<div class="row">
<div class="label">Input Device</div>
<div class="input">
@ -270,16 +271,19 @@
<div class="input">
<select bind:value={outputMode} on:change={markDirty}>
<option value="none">None</option>
<option value="kb-32-tasoller">Keyboard 32-zone, Tasoller Layout</option
<option value="kb-32-tasoller"
>Keyboard 32-zone, Tasoller Layout</option
>
<option value="kb-32-yuancon">Keyboard 32-zone, Yuancon Layout</option
>
<option value="kb-32-yuancon">Keyboard 32-zone, Yuancon Layout</option>
<option value="kb-16">Keyboard 16-zone, Linear</option>
<option value="kb-8">Keyboard 8-zone, Linear</option>
<option value="kb-6">Keyboard 6-zone, Linear</option>
<option value="kb-4">Keyboard 4-zone, Linear</option>
<option value="kb-voltex">Keyboard 10-zone, Voltex Layout</option>
<option value="kb-neardayo">Keyboard 10-zone, Neardayo Layout</option>
<option value="gamepad-voltex">XBOX 360 Gamepad, Voltex Layout</option>
<option value="gamepad-voltex">XBOX 360 Gamepad, Voltex Layout</option
>
<option value="gamepad-neardayo"
>XBOX 360 Gamepad, Neardayo Layout</option
>
@ -287,6 +291,31 @@
</select>
</div>
</div>
{#if deviceMode === "brokenithm-nostalgia" && outputMode !== "none" && outputMode.slice(0, 5) !== "kb-32"}
<div class="row">
<div class="label" />
<div class="input comment">
32 key layout is recommended for Brokestalgia controllers
</div>
</div>
{:else if deviceMode.slice(0, 10) === "brokenithm" && ["kb-voltex", "kb-neardayo", "gamepad-voltex", "gamepad-neardayo"].includes(outputMode)}
<div class="row">
<div class="label" />
<div class="input comment">
Voltex-like layouts are not recommended for Brokenithm controllers
</div>
</div>
{/if}
{#if outputMode.slice(0, 7) === "gamepad"}
<div class="row">
<div class="label" />
<div class="input comment">
Gamepad emulation requires <Link
href="https://github.com/ViGEm/ViGEmBus/releases">ViGEMBus</Link
>
</div>
</div>
{/if}
{#if outputMode !== "none"}
<div class="row">
<div class="label">Output Polling</div>
@ -301,16 +330,6 @@
</div>
</div>
{/if}
{#if outputMode.slice(0, 7) === "gamepad"}
<div class="row">
<div class="label" />
<div class="input">
Gamepad emulation requires <Link
href="https://github.com/ViGEm/ViGEmBus/releases">ViGEMBus</Link
>
</div>
</div>
{/if}
{#if (outputMode.slice(0, 2) === "kb" || outputMode.slice(0, 7) === "gamepad") && deviceMode.slice(0, 10) !== "brokenithm"}
<div class="row">
<div class="label" title="Larger means harder to trigger">
@ -392,7 +411,11 @@
<div class="row">
<div class="label">Active Color</div>
<div class="input">
<input type="color" bind:value={ledColorActive} on:change={markDirty} />
<input
type="color"
bind:value={ledColorActive}
on:change={markDirty}
/>
</div>
</div>
<div class="row">
@ -475,7 +498,8 @@
</div>
</div>
{/if}
<div class="row">
</div>
<div class="buttons-row">
<button
on:click={async () => await setConfig()}
class={`${dirty && "primary"}`}>Apply</button