=setup: capitalize strings

This commit is contained in:
Miki 2023-12-13 13:04:04 +01:00
parent d86735e749
commit 95d3b8ae4a
7 changed files with 30 additions and 18 deletions

View file

@ -1,7 +1,7 @@
<script>
import Logo from "$lib/img/topscorer_logo_web.png"
$: surfers = 1;
$: surfers = 2;
let surfer_list = new Array();
@ -12,6 +12,13 @@
priority: ''
});
surfer_list.push({
name: '',
color: '#ffffff',
score: '',
priority: ''
});
let heat = {
number: '',
name: '',
@ -32,7 +39,7 @@
function removeSurfers() {
surfers--;
if (surfers < 1) surfers = 1;
if (surfers < 2) surfers = 2;
}
async function save() {
@ -97,6 +104,11 @@
return false;
}
function capitalize(element, elementName) {
element[elementName] = element[elementName].charAt(0).toUpperCase() + element[elementName].slice(1);
console.log(`element: ${element[elementName]}`);
}
</script>
<div class="header">
@ -107,9 +119,9 @@
<div class="container">
<div class="heat">
<label class="label" for="name">Name</label>
<input bind:value={heat.name} id="name" type="text">
<input bind:value={heat.name} on:change={capitalize(heat, "name")} id="name" type="text">
<label class="label" for="category">Category</label>
<input bind:value={heat.category} id="category" type="text">
<input bind:value={heat.category} on:change={capitalize(heat, "category")} id="category" type="text">
<label class="label" for="number">Number</label>
<input bind:value={heat.number} id="number" on:keydown={(event) => {event.preventDefault()}} type="number" min="1" max="20">
<label class="label" for="timer">Timer</label>
@ -122,7 +134,7 @@
{#each Array(surfers) as _, surfer}
<div class="surfer">
<label class="label" for="name{surfer}">Name</label>
<input bind:value={surfer_list[surfer].name} id="name{surfer}" type="text">
<input bind:value={surfer_list[surfer].name} on:change={capitalize(heat.surfers[surfer], "name")} id="name{surfer}" type="text">
<label class="label" for="color{surfer}">Color</label>
<input bind:value={surfer_list[surfer].color} type="color" id="color{surfer}">
</div>
@ -205,7 +217,7 @@
}
select {
/* select {
font-size: 1.2rem;
border-radius: 6px;
margin-left: 0.1rem;
@ -217,12 +229,12 @@
option {
width: 1rem;
padding-left: 25px; /* Spazio per la riga colorata */
background-size: 1.2rem 100%; /* Dimensioni della riga colorata */
padding-left: 25px;
background-size: 1.2rem 100%;
background-repeat: no-repeat;
background-position: 0px 0px;
transition: border 0.3s
}
} */
.plus {
border-radius: 8px;