max 6 lines
This commit is contained in:
parent
f4d8320817
commit
b50f1f061e
1 changed files with 21 additions and 18 deletions
|
@ -11,9 +11,10 @@
|
||||||
{ color: 'gray', priority: 'P' },
|
{ color: 'gray', priority: 'P' },
|
||||||
{ color: 'gray', priority: '4' },
|
{ color: 'gray', priority: '4' },
|
||||||
{ color: 'gray', priority: '3' },
|
{ color: 'gray', priority: '3' },
|
||||||
|
{ color: 'gray', priority: '6' },
|
||||||
{ color: 'gray', priority: '5' },
|
{ color: 'gray', priority: '5' },
|
||||||
];
|
];
|
||||||
$: surfers = 5;
|
$: surfers = 6;
|
||||||
|
|
||||||
$: if (saved && surfer) {
|
$: if (saved && surfer) {
|
||||||
window.sessionStorage.setItem('priority', JSON.stringify(surfer));
|
window.sessionStorage.setItem('priority', JSON.stringify(surfer));
|
||||||
|
@ -47,7 +48,8 @@
|
||||||
{:else}
|
{:else}
|
||||||
<div class="priority" id="n">{surfer[id].priority}</div>
|
<div class="priority" id="n">{surfer[id].priority}</div>
|
||||||
{/if}
|
{/if}
|
||||||
<div class="color" style:background-color={surfer[id].color}></div>
|
<div class="color" style:background-color={surfer[id].color}>
|
||||||
|
</div>
|
||||||
</li>
|
</li>
|
||||||
{/each}
|
{/each}
|
||||||
</ul>
|
</ul>
|
||||||
|
@ -60,6 +62,7 @@
|
||||||
<li style="--height:{setup_height}vh">
|
<li style="--height:{setup_height}vh">
|
||||||
{#if surfer[id].priority == 'P'}
|
{#if surfer[id].priority == 'P'}
|
||||||
<div class="priority" id="p"><a href="/">{surfer[id].priority}</a></div>
|
<div class="priority" id="p"><a href="/">{surfer[id].priority}</a></div>
|
||||||
|
<!-- <span>{footer_height} - {setup_height}</span> -->
|
||||||
{:else}
|
{:else}
|
||||||
<div class="priority" id="n">{surfer[id].priority}</div>
|
<div class="priority" id="n">{surfer[id].priority}</div>
|
||||||
{/if}
|
{/if}
|
||||||
|
@ -68,22 +71,22 @@
|
||||||
{/each}
|
{/each}
|
||||||
</ul>
|
</ul>
|
||||||
<div class="footer" style="--height:{footer_height}vh">
|
<div class="footer" style="--height:{footer_height}vh">
|
||||||
<span>{footer_height} - {setup_height}</span>
|
<!-- <span>{footer_height} - {setup_height}</span>
|
||||||
<span style:padding-left="20px"></span>
|
<span style:padding-left="20px"></span>
|
||||||
{#each Array(surfers) as _, id}
|
{#each Array(surfers) as _, id}
|
||||||
<span style:padding-left="20px"></span><span>{surfer[id].color}</span>
|
<span style:padding-left="20px"></span><span>{surfer[id].color}</span>
|
||||||
{/each}
|
{/each}
|
||||||
<br>
|
<br> -->
|
||||||
<Button label="+" handleClick={() => {if (surfers < 5) surfers += 1;}} />
|
<Button label="+" handleClick={() => {if (surfers < 6) surfers += 1;}} />
|
||||||
<span class="surfers">{surfers}</span>
|
<Button label={surfers} />
|
||||||
<Button label="-" handleClick={() => {if (surfers > 2) surfers -= 1;}} />
|
<Button label="-" handleClick={() => {if (surfers > 2) surfers -= 1;}} />
|
||||||
{#each Array(surfers) as _, id}
|
{#each Array(surfers) as _, id}
|
||||||
<span style:padding-left="16px"></span>
|
<span style:padding-left="1vmin"></span>
|
||||||
<Color id="color{id}" label="Color-{id+1}" bind:value={surfer[id].color} />
|
<Color id="color{id}" label="Color-{id+1}" bind:value={surfer[id].color} />
|
||||||
{/each}
|
{/each}
|
||||||
<span style:padding-left="16px"></span>
|
<span style:padding-left="1vmin"></span>
|
||||||
<Button label="Reset" handleClick={() => {saved = false; window.sessionStorage.clear(); location.reload();}} />
|
<Button label="Reset" handleClick={() => {saved = false; window.sessionStorage.clear(); location.reload();}} />
|
||||||
<span style:padding-left="16px"></span>
|
<span style:padding-left="1vmin"></span>
|
||||||
<Button label="START" handleClick={() => {start = true;}} />
|
<Button label="START" handleClick={() => {start = true;}} />
|
||||||
</div>
|
</div>
|
||||||
{/if}
|
{/if}
|
||||||
|
@ -116,6 +119,7 @@
|
||||||
margin-top: 0.2vh;
|
margin-top: 0.2vh;
|
||||||
margin-bottom: 0.2vh;
|
margin-bottom: 0.2vh;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
height: var(--height);
|
||||||
}
|
}
|
||||||
|
|
||||||
.priority {
|
.priority {
|
||||||
|
@ -143,12 +147,11 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.footer {
|
.footer {
|
||||||
position: fixed;
|
display: fixed;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
background-color: aqua;
|
background-color: darkgrey;
|
||||||
border: 2px solid black;
|
/* border: 2px solid black; */
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: var(--height);
|
height: var(--height);
|
||||||
}
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
|
Loading…
Add table
Reference in a new issue