RezHackXYZ/classroomstuff
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

first commit

Browse source
This commit is contained in:
RezHackXYZ 2025-05-03 11:49:28 +05:30
commit 433c13f4ac
14 changed files with 1563 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

71
src/wordle/keyboard.svelte Normal file
View file

@ -0,0 +1,71 @@
<script>
import { keys, ButtonPressed } from "./logic.svelte.js";
</script>
<div id="root">
<div class="word">
{#each keys.slice(0, 10) as key}
<button on:click={() => ButtonPressed(key[0])} class={key[1]}
>{key[0]}</button
>
{/each}
</div>
<div class="word">
{#each keys.slice(10, 19) as key}
<button on:click={() => ButtonPressed(key[0])} class={key[1]}
>{key[0]}</button
>
{/each}
</div>
<div class="word">
{#each keys.slice(19) as key}
<button on:click={() => ButtonPressed(key[0])} class={key[1]}
>{key[0]}</button
>
{/each}
</div>
</div>
<style>
#root {
height: 255px;
margin: 20px;
border-radius: 10px;
border: 2px solid #202020;
}
.word {
display: flex;
gap: 5px;
margin: 10px;
justify-content: center;
}
button {
background-color: #202020;
font-family: "JetBrains Mono", monospace;
color: #808080;
width: 70px;
height: 70px;
display: flex;
justify-content: center;
align-items: center;
border-radius: 10px;
font-size: 50px;
border: 2px solid #444;
}
.c {
background-color: #2b5f2d;
}
.d {
background-color: #804d00;
}
.w {
background-color: #2b2b2b;
}
.o {
background-color: #202829;
}
</style>