ishan/pastebin
1
0
Fork 0
Code Issues Pull Requests Releases Activity

Add labels for select menus

Browse Source
This commit is contained in:
Konrad Borowski 2022-05-08 10:04:37 +02:00
parent 9c6305f070
commit 9218a98a2e
3 changed files with 34 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
js/views/LanguageSelector.tsx
View File

@ -24,20 +24,23 @@ export default function LanguageSelector({
languages: HTMLSelectElement;
}) {
return (
<select
id="language"
name="language"
onChange={(e) =>
setCurrentLanguage(e.currentTarget.selectedOptions[0].value)
}
>
<For each={[...languages.options]}>
{(option) => (
<option value={option.value} selected={option.selected}>
{option.textContent}
</option>
)}
</For>
</select>
<label>
{"Language: "}
<select
id="language"
name="language"
onChange={(e) =>
setCurrentLanguage(e.currentTarget.selectedOptions[0].value)
}
>
<For each={[...languages.options]}>
{(option) => (
<option value={option.value} selected={option.selected}>
{option.textContent}
</option>
)}
</For>
</select>
</label>
);
}

25
js/views/WrapperBar.tsx
View File

@ -92,17 +92,20 @@ export default function WrapperBar({
{data().implementations.length > 1 && (
<>
{" "}
<select
onChange={(e) =>
setCurrentImplementationIndex(+e.currentTarget.value)
}
>
<For each={data().implementations}>
{({ label }, index) => (
<option value={index()}>{label}</option>
)}
</For>
</select>
<label>
{"Implementation: "}
<select
onChange={(e) =>
setCurrentImplementationIndex(+e.currentTarget.value)
}
>
<For each={data().implementations}>
{({ label }, index) => (
<option value={index()}>{label}</option>
)}
</For>
</select>
</label>
</>
)}
{data().implementations.length && (

4
templates/index.html.tera
View File

@ -4,13 +4,13 @@
<form method="post" action="/">
{% block paste_header %}{% endblock %}
<div id="toolbar">
<select id=language name=language>
<label>Language: <select id=language name=language>
{% block languages %}
{% for language in languages %}
<option value="{{ language.identifier }}">{{ language.name }}</option>
{% endfor %}
{% endblock languages %}
</select>
</select></label>
<span id="wrapper-buttons"></span>
{% block rawpaste %}{% endblock %}
<span id="right-buttons">