Remove unnecessary a11y warnings
This commit is contained in:
parent
24ddd39f35
commit
3d631f69b5
@ -197,7 +197,7 @@ if(icon_override){
|
|||||||
<div class=title>
|
<div class=title>
|
||||||
<a class=category href="/rezepte/category/{recipe.category}" >{recipe.category}</a>
|
<a class=category href="/rezepte/category/{recipe.category}" >{recipe.category}</a>
|
||||||
<div>
|
<div>
|
||||||
<div class=name>{recipe.name}</div>
|
<div class=name>{@html recipe.name}</div>
|
||||||
<div class=description>{recipe.description}</div>
|
<div class=description>{recipe.description}</div>
|
||||||
</div>
|
</div>
|
||||||
<div class=tags>
|
<div class=tags>
|
||||||
|
@ -346,6 +346,7 @@ input::placeholder{
|
|||||||
|
|
||||||
<input class=icon placeholder=🥫 bind:value={card_data.icon}/>
|
<input class=icon placeholder=🥫 bind:value={card_data.icon}/>
|
||||||
{#if image_preview_url}
|
{#if image_preview_url}
|
||||||
|
<!-- svelte-ignore a11y-missing-attribute -->
|
||||||
<img src={image_preview_url} class=img_preview width=300px height=300px />
|
<img src={image_preview_url} class=img_preview width=300px height=300px />
|
||||||
{/if}
|
{/if}
|
||||||
<div class=img_label_wrapper>
|
<div class=img_label_wrapper>
|
||||||
@ -369,9 +370,10 @@ input::placeholder{
|
|||||||
</div>
|
</div>
|
||||||
<div class=tags>
|
<div class=tags>
|
||||||
{#each card_data.tags as tag}
|
{#each card_data.tags as tag}
|
||||||
<div class="tag" tabindex="0" on:keypress={remove_on_enter(event ,tag)} on:click='{remove_from_tags(tag)}'>{tag}</div>
|
<!-- svelte-ignore a11y-no-noninteractive-tabindex -->
|
||||||
|
<div class="tag" tabindex="0" on:keydown={remove_on_enter(event ,tag)} on:click='{remove_from_tags(tag)}'>{tag}</div>
|
||||||
{/each}
|
{/each}
|
||||||
<div class="tag input_wrapper"><span class=input>+</span><input class="tag_input" type="text" on:keypress={add_on_enter} on:focusout={add_to_tags} size="1" bind:value={new_tag} placeholder=Stichwort...></div>
|
<div class="tag input_wrapper"><span class=input>+</span><input class="tag_input" type="text" on:keydown={add_on_enter} on:focusout={add_to_tags} size="1" bind:value={new_tag} placeholder=Stichwort...></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
@ -361,6 +361,7 @@ h3{
|
|||||||
|
|
||||||
<h2>Zutaten</h2>
|
<h2>Zutaten</h2>
|
||||||
{#each ingredients as list, list_index}
|
{#each ingredients as list, list_index}
|
||||||
|
<!-- svelte-ignore a11y-click-events-have-key-events -->
|
||||||
<h3 on:click="{() => show_modal_edit_subheading_ingredient(list_index)}">
|
<h3 on:click="{() => show_modal_edit_subheading_ingredient(list_index)}">
|
||||||
<div>
|
<div>
|
||||||
{#if list.name }
|
{#if list.name }
|
||||||
@ -378,7 +379,9 @@ h3{
|
|||||||
</h3>
|
</h3>
|
||||||
<div class=ingredients_grid>
|
<div class=ingredients_grid>
|
||||||
{#each list.list as ingredient, ingredient_index}
|
{#each list.list as ingredient, ingredient_index}
|
||||||
|
<!-- svelte-ignore a11y-click-events-have-key-events -->
|
||||||
<div on:click={() => show_modal_edit_ingredient(list_index, ingredient_index)} >{ingredient.amount} {ingredient.unit}</div>
|
<div on:click={() => show_modal_edit_ingredient(list_index, ingredient_index)} >{ingredient.amount} {ingredient.unit}</div>
|
||||||
|
<!-- svelte-ignore a11y-click-events-have-key-events -->
|
||||||
<div on:click={() => show_modal_edit_ingredient(list_index, ingredient_index)} >{ingredient.name}</div>
|
<div on:click={() => show_modal_edit_ingredient(list_index, ingredient_index)} >{ingredient.name}</div>
|
||||||
<div class=mod_icons><button class="action_button button_subtle" on:click={() => show_modal_edit_ingredient(list_index, ingredient_index)}>
|
<div class=mod_icons><button class="action_button button_subtle" on:click={() => show_modal_edit_ingredient(list_index, ingredient_index)}>
|
||||||
<Pen fill=var(--nord1) height=1em width=1em></Pen></button>
|
<Pen fill=var(--nord1) height=1em width=1em></Pen></button>
|
||||||
@ -389,11 +392,11 @@ h3{
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="adder shadow">
|
<div class="adder shadow">
|
||||||
<input class=category type="text" bind:value={new_ingredient.sublist} placeholder="Kategorie (optional)" on:keypress={(event) => do_on_key(event, 'Enter', false, add_new_ingredient)}>
|
<input class=category type="text" bind:value={new_ingredient.sublist} placeholder="Kategorie (optional)" on:keydown={(event) => do_on_key(event, 'Enter', false, add_new_ingredient)}>
|
||||||
<div class=add_ingredient>
|
<div class=add_ingredient>
|
||||||
<input type="text" placeholder="250..." bind:value={new_ingredient.amount} on:keypress={(event) => do_on_key(event, 'Enter', false, add_new_ingredient)}>
|
<input type="text" placeholder="250..." bind:value={new_ingredient.amount} on:keydown={(event) => do_on_key(event, 'Enter', false, add_new_ingredient)}>
|
||||||
<input type="text" placeholder="mL..." bind:value={new_ingredient.unit} on:keypress={(event) => do_on_key(event, 'Enter', false, add_new_ingredient)}>
|
<input type="text" placeholder="mL..." bind:value={new_ingredient.unit} on:keydown={(event) => do_on_key(event, 'Enter', false, add_new_ingredient)}>
|
||||||
<input type="text" placeholder="Milch..." bind:value={new_ingredient.name} on:keypress={(event) => do_on_key(event, 'Enter', false, add_new_ingredient)}>
|
<input type="text" placeholder="Milch..." bind:value={new_ingredient.name} on:keydown={(event) => do_on_key(event, 'Enter', false, add_new_ingredient)}>
|
||||||
<button on:click={() => add_new_ingredient()} class=action_button>
|
<button on:click={() => add_new_ingredient()} class=action_button>
|
||||||
<Plus fill=white style="width: 2rem; height: 2rem;"></Plus>
|
<Plus fill=white style="width: 2rem; height: 2rem;"></Plus>
|
||||||
</button>
|
</button>
|
||||||
@ -403,11 +406,11 @@ h3{
|
|||||||
<h2>Zutat verändern</h2>
|
<h2>Zutat verändern</h2>
|
||||||
<div class=adder>
|
<div class=adder>
|
||||||
<input class=category type="text" bind:value={edit_ingredient.sublist} placeholder="Kategorie (optional)">
|
<input class=category type="text" bind:value={edit_ingredient.sublist} placeholder="Kategorie (optional)">
|
||||||
<div class=add_ingredient on:keypress={(event) => do_on_key(event, 'Enter', false, edit_ingredient_and_close_modal)}>
|
<div class=add_ingredient on:keydown={(event) => do_on_key(event, 'Enter', false, edit_ingredient_and_close_modal)}>
|
||||||
<input type="text" placeholder="250..." bind:value={edit_ingredient.amount} on:keypress={(event) => do_on_key(event, 'Enter', false, edit_ingredient_and_close_modal)}>
|
<input type="text" placeholder="250..." bind:value={edit_ingredient.amount} on:keydown={(event) => do_on_key(event, 'Enter', false, edit_ingredient_and_close_modal)}>
|
||||||
<input type="text" placeholder="mL..." bind:value={edit_ingredient.unit} on:keypress={(event) => do_on_key(event, 'Enter', false, edit_ingredient_and_close_modal)}>
|
<input type="text" placeholder="mL..." bind:value={edit_ingredient.unit} on:keydown={(event) => do_on_key(event, 'Enter', false, edit_ingredient_and_close_modal)}>
|
||||||
<input type="text" placeholder="Milch..." bind:value={edit_ingredient.name} on:keypress={(event) => do_on_key(event, 'Enter', false, edit_ingredient_and_close_modal)}>
|
<input type="text" placeholder="Milch..." bind:value={edit_ingredient.name} on:keydown={(event) => do_on_key(event, 'Enter', false, edit_ingredient_and_close_modal)}>
|
||||||
<button class=action_button on:keypress={(event) => do_on_key(event, 'Enter', false, edit_ingredient_and_close_modal)} on:click={edit_ingredient_and_close_modal}>
|
<button class=action_button on:keydown={(event) => do_on_key(event, 'Enter', false, edit_ingredient_and_close_modal)} on:click={edit_ingredient_and_close_modal}>
|
||||||
<Check fill=white style="width: 2rem; height: 2rem;"></Check>
|
<Check fill=white style="width: 2rem; height: 2rem;"></Check>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
@ -417,8 +420,8 @@ h3{
|
|||||||
<dialog id=edit_subheading_ingredient_modal>
|
<dialog id=edit_subheading_ingredient_modal>
|
||||||
<h2>Kategorie umbenennen</h2>
|
<h2>Kategorie umbenennen</h2>
|
||||||
<div class=heading_wrapper>
|
<div class=heading_wrapper>
|
||||||
<input class=heading type="text" bind:value={edit_heading.name} on:keypress={(event) => do_on_key(event, 'Enter', false, edit_subheading_and_close_modal)} >
|
<input class=heading type="text" bind:value={edit_heading.name} on:keydown={(event) => do_on_key(event, 'Enter', false, edit_subheading_and_close_modal)} >
|
||||||
<button class=action_button on:keypress={(event) => do_on_key(event, 'Enter', false, edit_subheading_and_close_modal)} on:click={edit_subheading_and_close_modal}>
|
<button class=action_button on:keydown={(event) => do_on_key(event, 'Enter', false, edit_subheading_and_close_modal)} on:click={edit_subheading_and_close_modal}>
|
||||||
<Check fill=white style="width:2rem; height:2rem;"></Check>
|
<Check fill=white style="width:2rem; height:2rem;"></Check>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
@ -350,17 +350,6 @@ h3{
|
|||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
user-select: none;
|
user-select: none;
|
||||||
}
|
}
|
||||||
.additional_info input{
|
|
||||||
all:unset;
|
|
||||||
display: inline;
|
|
||||||
width: 10ch;
|
|
||||||
border-radius: 1000px;
|
|
||||||
border: 2px solid grey;
|
|
||||||
padding: 0em 0.5em;
|
|
||||||
}
|
|
||||||
.additional_info input::placeholder{
|
|
||||||
color: grey;
|
|
||||||
}
|
|
||||||
.additional_info p[contenteditable]{
|
.additional_info p[contenteditable]{
|
||||||
display: inline;
|
display: inline;
|
||||||
padding: 0.25em 1em;
|
padding: 0.25em 1em;
|
||||||
@ -416,6 +405,7 @@ h3{
|
|||||||
|
|
||||||
<h2>Zubereitung</h2>
|
<h2>Zubereitung</h2>
|
||||||
{#each instructions as list, list_index}
|
{#each instructions as list, list_index}
|
||||||
|
<!-- svelte-ignore a11y-click-events-have-key-events -->
|
||||||
<h3 on:click={() => show_modal_edit_subheading_step(list_index)}>
|
<h3 on:click={() => show_modal_edit_subheading_step(list_index)}>
|
||||||
{#if list.name}
|
{#if list.name}
|
||||||
{list.name}
|
{list.name}
|
||||||
@ -432,6 +422,7 @@ h3{
|
|||||||
</h3>
|
</h3>
|
||||||
<ol>
|
<ol>
|
||||||
{#each list.steps as step, step_index}
|
{#each list.steps as step, step_index}
|
||||||
|
<!-- svelte-ignore a11y-click-events-have-key-events -->
|
||||||
<li><div><div on:click={() => show_modal_edit_step(list_index, step_index)}>{step}</div>
|
<li><div><div on:click={() => show_modal_edit_step(list_index, step_index)}>{step}</div>
|
||||||
<div><button class="action_button button_subtle" on:click={() => show_modal_edit_step(list_index, step_index)}>
|
<div><button class="action_button button_subtle" on:click={() => show_modal_edit_step(list_index, step_index)}>
|
||||||
<Pen fill=var(--nord1)></Pen>
|
<Pen fill=var(--nord1)></Pen>
|
||||||
@ -447,9 +438,9 @@ h3{
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class='adder shadow'>
|
<div class='adder shadow'>
|
||||||
<input class=category type="text" bind:value={new_step.name} placeholder="Kategorie (optional)"on:keypress={(event) => do_on_key(event, 'Enter', false , add_new_step)} >
|
<input class=category type="text" bind:value={new_step.name} placeholder="Kategorie (optional)"on:keydown={(event) => do_on_key(event, 'Enter', false , add_new_step)} >
|
||||||
<div class=add_step>
|
<div class=add_step>
|
||||||
<p id=step contenteditable on:focus='{clear_step}' on:blur={add_placeholder} bind:innerText={new_step.step} on:keypress={(event) => do_on_key(event, 'Enter', true , add_new_step)}></p>
|
<p id=step contenteditable on:focus='{clear_step}' on:blur={add_placeholder} bind:innerText={new_step.step} on:keydown={(event) => do_on_key(event, 'Enter', true , add_new_step)}></p>
|
||||||
<button on:click={() => add_new_step()} class=action_button>
|
<button on:click={() => add_new_step()} class=action_button>
|
||||||
<Plus fill=white style="height: 2rem; width: 2rem"></Plus>
|
<Plus fill=white style="height: 2rem; width: 2rem"></Plus>
|
||||||
</button>
|
</button>
|
||||||
@ -459,9 +450,9 @@ h3{
|
|||||||
<dialog id=edit_step_modal>
|
<dialog id=edit_step_modal>
|
||||||
<h2>Schritt verändern</h2>
|
<h2>Schritt verändern</h2>
|
||||||
<div class=adder>
|
<div class=adder>
|
||||||
<input class=category type="text" bind:value={edit_step.name} placeholder="Unterkategorie (optional)" on:keypress={(event) => do_on_key(event, 'Enter', false , edit_step_and_close_modal)}>
|
<input class=category type="text" bind:value={edit_step.name} placeholder="Unterkategorie (optional)" on:keydown={(event) => do_on_key(event, 'Enter', false , edit_step_and_close_modal)}>
|
||||||
<div class=add_step>
|
<div class=add_step>
|
||||||
<p id=step contenteditable bind:innerText={edit_step.step} on:keypress={(event) => do_on_key(event, 'Enter', true , edit_step_and_close_modal)}></p>
|
<p id=step contenteditable bind:innerText={edit_step.step} on:keydown={(event) => do_on_key(event, 'Enter', true , edit_step_and_close_modal)}></p>
|
||||||
<button class=action_button on:click="{() => edit_step_and_close_modal()}" >
|
<button class=action_button on:click="{() => edit_step_and_close_modal()}" >
|
||||||
<Check fill=white style="height: 2rem; width: 2rem"></Check>
|
<Check fill=white style="height: 2rem; width: 2rem"></Check>
|
||||||
</button>
|
</button>
|
||||||
@ -471,7 +462,7 @@ h3{
|
|||||||
<dialog id=edit_subheading_steps_modal>
|
<dialog id=edit_subheading_steps_modal>
|
||||||
<h2>Kategorie umbenennen</h2>
|
<h2>Kategorie umbenennen</h2>
|
||||||
<div class=heading_wrapper>
|
<div class=heading_wrapper>
|
||||||
<input class="heading" type="text" bind:value={edit_heading.name} on:keypress={(event) => do_on_key(event, 'Enter', false, edit_subheading_steps_and_close_modal)}>
|
<input class="heading" type="text" bind:value={edit_heading.name} on:keydown={(event) => do_on_key(event, 'Enter', false, edit_subheading_steps_and_close_modal)}>
|
||||||
<button on:click={edit_subheading_steps_and_close_modal} class=action_button>
|
<button on:click={edit_subheading_steps_and_close_modal} class=action_button>
|
||||||
<Check fill=white style="height: 2rem; width: 2rem"></Check>
|
<Check fill=white style="height: 2rem; width: 2rem"></Check>
|
||||||
</button>
|
</button>
|
||||||
|
@ -88,7 +88,8 @@ input[type=checkbox]::after
|
|||||||
<div id=labels>
|
<div id=labels>
|
||||||
{#each months as month}
|
{#each months as month}
|
||||||
<div class=checkbox_container>
|
<div class=checkbox_container>
|
||||||
<label tabindex="0" on:keypress={(event) => do_on_key(event, 'Enter', false, () => {toggle_checkbox_on_key(event)}) } ><input tabindex=-1 type="checkbox" name="checkbox" value="value" on:click={set_season}>{month}</label>
|
<!-- svelte-ignore a11y-no-noninteractive-tabindex-->
|
||||||
|
<label tabindex="0" on:keydown={(event) => do_on_key(event, 'Enter', false, () => {toggle_checkbox_on_key(event)}) } ><input tabindex=-1 type="checkbox" name="checkbox" value="value" on:click={set_season}>{month}</label>
|
||||||
</div>
|
</div>
|
||||||
{/each}
|
{/each}
|
||||||
</div>
|
</div>
|
||||||
|
@ -35,13 +35,6 @@
|
|||||||
position: relative;
|
position: relative;
|
||||||
margin: 30vh auto 0;
|
margin: 30vh auto 0;
|
||||||
}
|
}
|
||||||
.blocker{
|
|
||||||
display:block;
|
|
||||||
z-index: 10;
|
|
||||||
background-color: white;
|
|
||||||
width: 100%;
|
|
||||||
height: 20vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
.image-container {
|
.image-container {
|
||||||
position: sticky;
|
position: sticky;
|
||||||
|
@ -3,7 +3,6 @@
|
|||||||
import SeasonSelect from '$lib/components/SeasonSelect.svelte';
|
import SeasonSelect from '$lib/components/SeasonSelect.svelte';
|
||||||
import '$lib/css/action_button.css'
|
import '$lib/css/action_button.css'
|
||||||
|
|
||||||
export let data: PageData;
|
|
||||||
let preamble = ""
|
let preamble = ""
|
||||||
let addendum = ""
|
let addendum = ""
|
||||||
|
|
||||||
|
@ -1,13 +0,0 @@
|
|||||||
import type { PageLoad } from "./$types";
|
|
||||||
|
|
||||||
export async function load({ fetch }) {
|
|
||||||
let current_month = new Date().getMonth() + 1
|
|
||||||
const res_season = await fetch(`/api/items/category`);
|
|
||||||
const res_all_brief = await fetch(`/api/items/tag`);
|
|
||||||
const item_season = await res_season.json();
|
|
||||||
const item_all_brief = await res_all_brief.json();
|
|
||||||
return {
|
|
||||||
season: item_season,
|
|
||||||
all_brief: item_all_brief,
|
|
||||||
};
|
|
||||||
};
|
|
@ -245,12 +245,6 @@ h1{
|
|||||||
h3{
|
h3{
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
.delete{
|
|
||||||
position: fixed;
|
|
||||||
right: 0;
|
|
||||||
bottom: 0;
|
|
||||||
margin: 2rem;
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
||||||
<h1>Rezept editieren</h1>
|
<h1>Rezept editieren</h1>
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user