streaming/Priority
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

+ new bootstrap layout

Browse source
This commit is contained in:
Miki 2024-01-12 16:46:50 +01:00
parent fca2c7e2d1
commit 33433bfc08
2 changed files with 70 additions and 35 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
backend.light/backend.light
View file

Binary file not shown.

85
frontend.light/src/routes/priority/+page.svelte
View file

@ -179,7 +179,20 @@
</script> </script>
<svelte:head>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script>
</svelte:head>
{#if start} {#if start}
<div class="container text-center">
<div class="row">
<div class="col">
<button class="button" on:click={StopHeat}>STOP</button>
</div>
</div>
</div>
<ul> <ul>
{#each Array($surfersCount) as _, id} {#each Array($surfersCount) as _, id}
<li style="--height:{setup_height}vh"> <li style="--height:{setup_height}vh">
@ -210,14 +223,39 @@
</li> </li>
{/each} {/each}
</ul> </ul>
<div class="footer" style="--height:{footer_height}vh">
<button class="button" on:click={StopHeat}>STOP</button>
</div>
{:else} {:else}
<ul>
<div class="container text-center">
<div class="row">
<div class="col">
<button class="mybutton" on:click={AddSurfer}>+</button>
<button class="display">{$surfersCount}</button>
<button class="mybutton" on:click={RemSurfer}>-</button>
</div>
<div class="col">
<button class="mybutton" on:click={StartHeat}>START</button>
</div>
<div class="col">
<button class="mybutton" on:click={ResetLocalCache}>Reset</button>
</div>
</div>
</div>
<table class="table is-hoverable is-striped is-bordered is-fullwidth">
<thead>
<tr>
<th> Name </th>
<td> Color </td>
</tr>
</thead>
<tbody>
{#each Array($surfersCount) as _, id} {#each Array($surfersCount) as _, id}
<li style="--height:{setup_height}vh"> <tr>
<div class="priority" id="color"> <th><input class="input" type="text" bind:value={$surfers[id].name}/></th>
<td>
<div class="select">
<select <select
name="color{id}" name="color{id}"
{id} {id}
@ -229,24 +267,16 @@
{/each} {/each}
</select> </select>
</div> </div>
<div class="color" style:background-color={$surfers[id].color}><input type="text" bind:value={$surfers[id].name}></div> </td>
</li> </tr>
{:else}
<tr>
<th />
<td />
</tr>
{/each} {/each}
</ul> </tbody>
<div </table>
class="footer"
style="--height:{footer_height}vh"
>
<div class="control">
<button class="button" on:click={AddSurfer}>+</button>
<button class="display">{$surfersCount}</button>
<button class="button" on:click={RemSurfer}>-</button>
</div>
<button class="button" on:click={StartHeat}>START</button>
<div class="command">
<button class="button" on:click={ResetLocalCache}>Reset</button>
</div>
</div>
{/if} {/if}
<style> <style>
@ -319,7 +349,12 @@
font-size: 5vmin; font-size: 5vmin;
} }
.footer { .card {
background-color: aquamarine;
border-radius: 6%;
}
.myfooter {
display: inline-flex; display: inline-flex;
bottom: 0; bottom: 0;
background-color: darkgrey; background-color: darkgrey;
@ -346,7 +381,7 @@
font-size: 2.5vmin; font-size: 2.5vmin;
} }
.button { .mybutton {
margin-left: 1vmin; margin-left: 1vmin;
margin-right: 1vmin; margin-right: 1vmin;
border-radius: 4px; border-radius: 4px;