Ledda/soma-solver
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

added examples, begun work on saves

Browse Source
This commit is contained in:
Daniel Ledda
2021-07-05 23:29:25 +02:00
parent c415641d39
commit 97cb0bc550
8 changed files with 176 additions and 89 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
src/ui/List.svelte
View File

@@ -3,18 +3,21 @@
export let activeItem: number = 0;
export let items: string[] = [];
export let onClick = (itemNo: number) => { activeItem = itemNo };
export let maxHeight: string = "auto";
</script>
<ul>
{#if items.length === 0}
<li>{defaultText}</li>
{/if}
{#each items as item, i}
<li class:active={activeItem === i} on:click={() => onClick(i)}>
{item}
</li>
{/each}
</ul>
<div class="container">
<ul>
{#if items.length === 0}
<li>{defaultText}</li>
{/if}
{#each items as item, i}
<li class:active={activeItem === i} on:click={() => onClick(i)}>
{item}
</li>
{/each}
</ul>
</div>
<style>
li:hover:not(.active) {
@@ -28,13 +31,32 @@
line-height: 2em;
}
ul {
width: 100%;
overflow-y: scroll;
flex: 1;
position: absolute;
left: 0;
top: 0;
padding: 0.5em;
margin: 0;
text-align: center;
background-color: #666;
margin: 0;
height: 100%;
width: 100%;
overflow-y: scroll;
}
.container {
position: relative;
width: 100%;
height: 100%;
}
.container:before {
pointer-events: none;
left: 0;
top: 0;
content: "";
width: 100%;
height: 100%;
z-index: 1;
position: absolute;
box-shadow: inset 0 0 0.5em rgba(0,0,0,0.5);
}
.active {
background-color: #ff3e00;