From fa3b8c9b10053cdc5cbb7fa16342bb786a87d56a Mon Sep 17 00:00:00 2001
From: Esmail EL BoB <esmail@esmailelbob.xyz>
Date: Tue, 5 Apr 2022 06:23:07 +0200
Subject: [PATCH] Auto rezise of <textarea>
---
templates/index.html | 366 +++++++++++++++++++++++--------------------
1 file changed, 195 insertions(+), 171 deletions(-)
diff --git a/templates/index.html b/templates/index.html
index 1bc041b..e16ccd4 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -1,31 +1,32 @@
<!doctype html>
{% macro lang_option(lang_name, current_lang) %}
- <option value="{{ lang_name }}" {{ 'selected' if current_lang ==
lang_name else '' }}>{{ lang_name }}</option>
+<option value="{{ lang_name }}" {{ 'selected' if current_lang ==
lang_name else '' }}>{{ lang_name }}</option>
{% endmacro %}
{% macro supported_source_lang_options(current_lang) %}
- {% for lang_name in supported_source_languages.keys() %}
- {{ lang_option(lang_name, current_lang) }}
- {% endfor %}
+{% for lang_name in supported_source_languages.keys() %}
+{{ lang_option(lang_name, current_lang) }}
+{% endfor %}
{% endmacro %}
{% macro supported_target_lang_options(current_lang) %}
- {% for lang_name in supported_target_languages.keys() %}
- {{ lang_option(lang_name, current_lang) }}
- {% endfor %}
+{% for lang_name in supported_target_languages.keys() %}
+{{ lang_option(lang_name, current_lang) }}
+{% endfor %}
{% endmacro %}
<html lang="en">
- <head>
- <title>SimplyTranslate</title>
- <link rel="shortcut icon" href="{{ url_for('static',
filename='favicon.ico') }}">
- <meta name="description" content="Experience simple and private
Google translations">
- <meta name="viewport" content="width=device-width,
initial-scale=1.0">
- <meta charset="UTF-8">
-
- <style>
+
+<head>
+ <title>SimplyTranslate</title>
+ <link rel="shortcut icon" href="{{ url_for('static',
filename='favicon.ico') }}">
+ <meta name="description" content="Experience simple and private
Google translations">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <meta charset="UTF-8">
+
+ <style>
.center {
text-align: center;
}
@@ -125,7 +126,7 @@
}
.definitions li:not(:last-child) {
- margin-bottom: 1rem;
+ margin-bottom: 1rem;
}
@media screen and (max-width: 1200px) {
@@ -193,189 +194,212 @@
color: yellow;
}
}
- </style>
- </head>
-
- <body>
- <header class="center"><h1>SimplyTranslate</h1></header>
-
- <form action="/?engine={{ engine }}" method="POST"
id="translation-form">
-
- <!-- engine buttons -->
- {% if engines|length > 1 %}
- <div class="center">
- Translation Engine
- {% for _engine in engines %}
- <a style="
+ </style>
+</head>
+
+<body>
+ <header class="center">
+ <h1>SimplyTranslate</h1>
+ </header>
+
+ <form action="/?engine={{ engine }}" method="POST"
id="translation-form">
+
+ <!-- engine buttons -->
+ {% if engines|length > 1 %}
+ <div class="center">
+ Translation Engine
+ {% for _engine in engines %}
+ <a style="
{# Show the currently selected
engine by underlining it #}
{% if engine == _engine.name %}
text-decoration: underline;
{% endif %}
" href="/?engine={{ _engine.name }}">
- {{ _engine.display_name -}}
- </a>
+ {{ _engine.display_name -}}
+ </a>
- {% if not loop.last %}
- |
- {% endif %}
- {% endfor %}
- </div>
- <br>
+ {% if not loop.last %}
+ |
{% endif %}
+ {% endfor %}
+ </div>
+ <br>
+ {% endif %}
+
+ <!-- from and to language -->
+ <div class="wrap">
+ <div class="language">
+ {% if use_text_fields %}
+ <input type="text" id="from_language"
name="from_language" aria-label="Source language"
+ value="{{ from_l }}" placeholder="from" />
+ {% else %}
+ <select name="from_language" id="from_language"
aria-label="Source language">
+ {{ supported_source_lang_options(from_l) }}
+ </select>
+ {% endif %}
+ </div>
- <!-- from and to language -->
- <div class="wrap">
- <div class="language">
- {% if use_text_fields %}
- <input type="text" id="from_language"
name="from_language" aria-label="Source language" value="{{ from_l }}"
placeholder="from" />
- {% else %}
- <select name="from_language" id="from_language"
aria-label="Source language">
- {{ supported_source_lang_options(from_l) }}
- </select>
- {% endif %}
- </div>
-
- <div class="switch_languages">
- <button id="switchbutton" aria-label="Switch
languages" formaction="/switchlanguages/?engine={{ engine }}"
type="submit"><-></button>
- </div>
+ <div class="switch_languages">
+ <button id="switchbutton" aria-label="Switch languages"
+ formaction="/switchlanguages/?engine={{ engine }}"
type="submit"><-></button>
+ </div>
- <div class="language">
- {% if use_text_fields %}
- <input type="text" id="to_language"
aria-label="Target language" name="to_language" value="{{ to_l }}"
placeholder="from" />
- {% else %}
- <select name="to_language" id="to_language"
aria-label="Target language">
- {{ supported_target_lang_options(to_l) }}
- </select>
- {% endif %}
- </div>
+ <div class="language">
+ {% if use_text_fields %}
+ <input type="text" id="to_language" aria-label="Target
language" name="to_language" value="{{ to_l }}"
+ placeholder="from" />
+ {% else %}
+ <select name="to_language" id="to_language"
aria-label="Target language">
+ {{ supported_target_lang_options(to_l) }}
+ </select>
+ {% endif %}
</div>
+ </div>
- {% if could_not_switch_languages %}
- <div class="center" id="could_not_switch_languages_text">
- Sorry, {{ engine }} doesn't support switching from
autodetect.
- </div>
+ {% if could_not_switch_languages %}
+ <div class="center" id="could_not_switch_languages_text">
+ Sorry, {{ engine }} doesn't support switching from autodetect.
+ </div>
+ <br>
+ {% endif %}
+
+ <!-- text boxes -->
+ <div class="wrap">
+ <div class="item-wrapper">
+ <textarea autofocus class="item" id="input"
name="input" dir="auto"
+ placeholder="Enter Text Here">{{ inp }}</textarea>
+ <!-- TTS for the input text -->
+ {%- if tts_enabled and tts_from is not none -%}
<br>
- {% endif %}
-
- <!-- text boxes -->
- <div class="wrap">
- <div class="item-wrapper">
- <textarea autofocus class="item" id="input"
name="input" dir="auto" placeholder="Enter Text Here">{{ inp }}</textarea>
- <!-- TTS for the input text -->
- {%- if tts_enabled and tts_from is not none -%}
- <br>
- <div class="center">
- <audio controls>
- <source type="audio/mpeg" src="{{
tts_from }}">
- </audio>
- </div>
- {%- endif -%}
+ <div class="center">
+ <audio controls>
+ <source type="audio/mpeg" src="{{ tts_from }}">
+ </audio>
</div>
+ {%- endif -%}
+ </div>
- <div class="item-wrapper">
- <textarea class="translation item" dir="auto"
placeholder="Translation" readonly>
+ <div class="item-wrapper">
+ <textarea class="translation item" dir="auto"
placeholder="Translation" readonly>
{%- if translation is not none -%}{%- if
translation['translated-text'] is not none -%}{{
translation['translated-text'] }}{%- endif -%}{%- endif -%}
</textarea>
- <!-- TTS for the output text -->
- {%- if tts_enabled and tts_to is not none -%}
- <br>
- <div class="center">
- <audio controls>
- <source type="audio/mpeg" src="{{
tts_to }}">
- </audio>
- </div>
- {%- endif -%}
+ <!-- TTS for the output text -->
+ {%- if tts_enabled and tts_to is not none -%}
+ <br>
+ <div class="center">
+ <audio controls>
+ <source type="audio/mpeg" src="{{ tts_to }}">
+ </audio>
</div>
+ {%- endif -%}
</div>
+ </div>
- <br>
+ <br>
- <div class="center">
- <!-- translate button -->
- <button type="submit">Translate with {{ engine }}!</button>
- </div>
+ <div class="center">
+ <!-- translate button -->
+ <button type="submit">Translate with {{ engine }}!</button>
+ </div>
- <br>
+ <br>
- <div class="center">
- <!-- link to share translation -->
- <a href="/?engine={{ engine }}&text={{ inp|urlencode
}}&sl={{ from_l_code }}&tl={{ to_l_code }}">Copy this link to share this
translation with others</a>
- </div>
+ <div class="center">
+ <!-- link to share translation -->
+ <a href="/?engine={{ engine }}&text={{ inp|urlencode
}}&sl={{ from_l_code }}&tl={{ to_l_code }}">Copy this
+ link to share this translation with others</a>
+ </div>
- <br>
-
- <div id="definitions_and_translations">
- {% if translation is not none and "definitions" in
translation %}
- <div class="definitions">
- {% for type, definitions in
translation["definitions"].items() %}
- <span class="def_type">{{type}}</span>
- <ol>
- {% for definition_item in definitions %}
- <li>
- {{definition_item["definition"]}}
- <br>
- {% if "use-in-sentence" in
definition_item %}
- <span class="use_in_sentence">
- "{{definition_item["use-in-sentence"]}}"
- </span>
- <br>
- {% endif %}
- {% if "synonyms" in
definition_item %}
- {% for synonym_type in
definition_item["synonyms"] %}
- <span class="syn">
- {% if synonym_type
!= "" %}
- <br>
- <span
class="syn_type">{{synonym_type}}: </span>
- {% endif %}
- {{",
".join(definition_item["synonyms"][synonym_type])}}
- </span>
- {% endfor %}
- {% endif %}
- </li>
- {% endfor %}
- </ol>
- {% endfor %}
- </div>
- {% endif %}
+ <br>
- {% if translation is not none and "translations" in
translation %}
- <div class="translations">
- {% for def_type, translations in
translation["translations"].items() %}
- <span class="def_type">{{def_type}}</span>
- <ul>
- {% for word, word_translations in
translations.items() %}
- <li>
- <span
class="syn_type">{{word}}:</span>
- <span class="syn">{{",
".join(word_translations["words"])}}</span>
- <span
class="syn_type">{{word_translations["frequency"]}}</span>
- </li>
- <br>
- {% endfor %}
- </ul>
+ <div id="definitions_and_translations">
+ {% if translation is not none and "definitions" in
translation %}
+ <div class="definitions">
+ {% for type, definitions in
translation["definitions"].items() %}
+ <span class="def_type">{{type}}</span>
+ <ol>
+ {% for definition_item in definitions %}
+ <li>
+ {{definition_item["definition"]}}
+ <br>
+ {% if "use-in-sentence" in definition_item %}
+ <span class="use_in_sentence">
+ "{{definition_item["use-in-sentence"]}}"
+ </span>
+ <br>
+ {% endif %}
+ {% if "synonyms" in definition_item %}
+ {% for synonym_type in
definition_item["synonyms"] %}
+ <span class="syn">
+ {% if synonym_type != "" %}
+ <br>
+ <span class="syn_type">{{synonym_type}}:
</span>
+ {% endif %}
+ {{",
".join(definition_item["synonyms"][synonym_type])}}
+ </span>
{% endfor %}
- </div>
- {% endif %}
+ {% endif %}
+ </li>
+ {% endfor %}
+ </ol>
+ {% endfor %}
</div>
+ {% endif %}
- </form>
+ {% if translation is not none and "translations" in
translation %}
+ <div class="translations">
+ {% for def_type, translations in
translation["translations"].items() %}
+ <span class="def_type">{{def_type}}</span>
+ <ul>
+ {% for word, word_translations in
translations.items() %}
+ <li>
+ <span class="syn_type">{{word}}:</span>
+ <span class="syn">{{",
".join(word_translations["words"])}}</span>
+ <span
class="syn_type">{{word_translations["frequency"]}}</span>
+ </li>
+ <br>
+ {% endfor %}
+ </ul>
+ {% endfor %}
+ </div>
+ {% endif %}
+ </div>
- <br>
- <br>
- <br>
+ </form>
+
+ <br>
+ <br>
+ <br>
+
+ <footer class="center">
+ <a href="/prefs">Preferences</a> | <a
href="https://simple-web.org/projects/simplytranslate.html">Project
+ Page</a> | <a href="https://simple-web.org">Simple Web
Project</a>
+ </footer>
+
+ <script>
+ // this code submits the translation form when pressing
Ctrl/Meta+Enter while focussed on the input text field
+ document.getElementById("input").addEventListener("keydown", function
(event) {
+ if (event.keyCode === 13 && (event.metaKey || event.ctrlKey)) {
+ document.getElementById("translation-form").submit();
+ }
+ });
+ </script>
+ <script>
+ // Auto resize textarea to fit words inside it without need to
scroll -- Thanks to: https://stackoverflow.com/a/25621277
+ const tx = document.getElementsByTagName("textarea");
+
+ for (let i = 0; i < tx.length; i++) {
+ tx[i].setAttribute("style", "height:" +
(tx[i].scrollHeight) + "px;overflow-y:hidden;");
+ tx[i].addEventListener("input", OnInput, false);
+ }
+
+ function OnInput(e) {
+ this.style.height = 150 + "px";
+ this.style.height = (this.scrollHeight) + "px";
+ }
+ </script>
+</body>
- <footer class="center">
- <a href="/prefs">Preferences</a> | <a
href="https://simple-web.org/projects/simplytranslate.html">Project
Page</a> | <a href="https://simple-web.org">Simple Web Project</a>
- </footer>
-
- <script>
- // this code submits the translation form when pressing
Ctrl/Meta+Enter while focussed on the input text field
- document.getElementById("input").addEventListener("keydown",
function(event) {
- if (event.keyCode === 13 && (event.metaKey ||
event.ctrlKey)) {
- document.getElementById("translation-form").submit();
- }
- });
- </script>
- </body>
-</html>
+</html>
\ No newline at end of file
--
2.35.1
On Dienstag, 5. April 2022 06:32:15 CEST Esmail EL BoB wrote:
> From fa3b8c9b10053cdc5cbb7fa16342bb786a87d56a Mon Sep 17 00:00:00 2001
> From: Esmail EL BoB <esmail@esmailelbob.xyz>
> Date: Tue, 5 Apr 2022 06:23:07 +0200
> Subject: [PATCH] Auto rezise of <textarea>
>
> ---
> templates/index.html | 366 +++++++++++++++++++++++--------------------
> 1 file changed, 195 insertions(+), 171 deletions(-)
>
> diff --git a/templates/index.html b/templates/index.html
> index 1bc041b..e16ccd4 100644
> --- a/templates/index.html
> +++ b/templates/index.html
> @@ -1,31 +1,32 @@
> <!doctype html>
>
> {% macro lang_option(lang_name, current_lang) %}
> - <option value="{{ lang_name }}" {{ 'selected' if current_lang ==
> lang_name else '' }}>{{ lang_name }}</option>
> +<option value="{{ lang_name }}" {{ 'selected' if current_lang ==
> lang_name else '' }}>{{ lang_name }}</option>
> {% endmacro %}
>
> {% macro supported_source_lang_options(current_lang) %}
> - {% for lang_name in supported_source_languages.keys() %}
> - {{ lang_option(lang_name, current_lang) }}
> - {% endfor %}
> +{% for lang_name in supported_source_languages.keys() %}
> +{{ lang_option(lang_name, current_lang) }}
> +{% endfor %}
> {% endmacro %}
>
> {% macro supported_target_lang_options(current_lang) %}
> - {% for lang_name in supported_target_languages.keys() %}
> - {{ lang_option(lang_name, current_lang) }}
> - {% endfor %}
> +{% for lang_name in supported_target_languages.keys() %}
> +{{ lang_option(lang_name, current_lang) }}
> +{% endfor %}
> {% endmacro %}
>
>
> <html lang="en">
> - <head>
> - <title>SimplyTranslate</title>
> - <link rel="shortcut icon" href="{{ url_for('static',
> filename='favicon.ico') }}">
> - <meta name="description" content="Experience simple and private
> Google translations">
> - <meta name="viewport" content="width=device-width,
> initial-scale=1.0">
> - <meta charset="UTF-8">
> -
> - <style>
> +
> +<head>
> + <title>SimplyTranslate</title>
> + <link rel="shortcut icon" href="{{ url_for('static',
> filename='favicon.ico') }}">
> + <meta name="description" content="Experience simple and private
> Google translations">
> + <meta name="viewport" content="width=device-width, initial-scale=1.0">
> + <meta charset="UTF-8">
> +
> + <style>
> .center {
> text-align: center;
> }
> @@ -125,7 +126,7 @@
> }
>
> .definitions li:not(:last-child) {
> - margin-bottom: 1rem;
> + margin-bottom: 1rem;
> }
>
> @media screen and (max-width: 1200px) {
> @@ -193,189 +194,212 @@
> color: yellow;
> }
> }
> - </style>
> - </head>
> -
> - <body>
> - <header class="center"><h1>SimplyTranslate</h1></header>
> -
> - <form action="/?engine={{ engine }}" method="POST"
> id="translation-form">
> -
> - <!-- engine buttons -->
> - {% if engines|length > 1 %}
> - <div class="center">
> - Translation Engine
> - {% for _engine in engines %}
> - <a style="
> + </style>
> +</head>
> +
> +<body>
> + <header class="center">
> + <h1>SimplyTranslate</h1>
> + </header>
> +
> + <form action="/?engine={{ engine }}" method="POST"
> id="translation-form">
> +
> + <!-- engine buttons -->
> + {% if engines|length > 1 %}
> + <div class="center">
> + Translation Engine
> + {% for _engine in engines %}
> + <a style="
> {# Show the currently selected
> engine by underlining it #}
> {% if engine == _engine.name %}
> text-decoration: underline;
> {% endif %}
> " href="/?engine={{ _engine.name }}">
> - {{ _engine.display_name -}}
> - </a>
> + {{ _engine.display_name -}}
> + </a>
>
> - {% if not loop.last %}
> - |
> - {% endif %}
> - {% endfor %}
> - </div>
> - <br>
> + {% if not loop.last %}
> + |
> {% endif %}
> + {% endfor %}
> + </div>
> + <br>
> + {% endif %}
> +
> + <!-- from and to language -->
> + <div class="wrap">
> + <div class="language">
> + {% if use_text_fields %}
> + <input type="text" id="from_language"
> name="from_language" aria-label="Source language"
> + value="{{ from_l }}" placeholder="from" />
> + {% else %}
> + <select name="from_language" id="from_language"
> aria-label="Source language">
> + {{ supported_source_lang_options(from_l) }}
> + </select>
> + {% endif %}
> + </div>
>
> - <!-- from and to language -->
> - <div class="wrap">
> - <div class="language">
> - {% if use_text_fields %}
> - <input type="text" id="from_language"
> name="from_language" aria-label="Source language" value="{{ from_l }}"
> placeholder="from" />
> - {% else %}
> - <select name="from_language" id="from_language"
> aria-label="Source language">
> - {{ supported_source_lang_options(from_l) }}
> - </select>
> - {% endif %}
> - </div>
> -
> - <div class="switch_languages">
> - <button id="switchbutton" aria-label="Switch
> languages" formaction="/switchlanguages/?engine={{ engine }}"
> type="submit"><-></button>
> - </div>
> + <div class="switch_languages">
> + <button id="switchbutton" aria-label="Switch languages"
> + formaction="/switchlanguages/?engine={{ engine }}"
> type="submit"><-></button>
> + </div>
>
> - <div class="language">
> - {% if use_text_fields %}
> - <input type="text" id="to_language"
> aria-label="Target language" name="to_language" value="{{ to_l }}"
> placeholder="from" />
> - {% else %}
> - <select name="to_language" id="to_language"
> aria-label="Target language">
> - {{ supported_target_lang_options(to_l) }}
> - </select>
> - {% endif %}
> - </div>
> + <div class="language">
> + {% if use_text_fields %}
> + <input type="text" id="to_language" aria-label="Target
> language" name="to_language" value="{{ to_l }}"
> + placeholder="from" />
> + {% else %}
> + <select name="to_language" id="to_language"
> aria-label="Target language">
> + {{ supported_target_lang_options(to_l) }}
> + </select>
> + {% endif %}
> </div>
> + </div>
>
> - {% if could_not_switch_languages %}
> - <div class="center" id="could_not_switch_languages_text">
> - Sorry, {{ engine }} doesn't support switching from
> autodetect.
> - </div>
> + {% if could_not_switch_languages %}
> + <div class="center" id="could_not_switch_languages_text">
> + Sorry, {{ engine }} doesn't support switching from autodetect.
> + </div>
> + <br>
> + {% endif %}
> +
> + <!-- text boxes -->
> + <div class="wrap">
> + <div class="item-wrapper">
> + <textarea autofocus class="item" id="input"
> name="input" dir="auto"
> + placeholder="Enter Text Here">{{ inp }}</textarea>
> + <!-- TTS for the input text -->
> + {%- if tts_enabled and tts_from is not none -%}
> <br>
> - {% endif %}
> -
> - <!-- text boxes -->
> - <div class="wrap">
> - <div class="item-wrapper">
> - <textarea autofocus class="item" id="input"
> name="input" dir="auto" placeholder="Enter Text Here">{{ inp }}</textarea>
> - <!-- TTS for the input text -->
> - {%- if tts_enabled and tts_from is not none -%}
> - <br>
> - <div class="center">
> - <audio controls>
> - <source type="audio/mpeg" src="{{
> tts_from }}">
> - </audio>
> - </div>
> - {%- endif -%}
> + <div class="center">
> + <audio controls>
> + <source type="audio/mpeg" src="{{ tts_from }}">
> + </audio>
> </div>
> + {%- endif -%}
> + </div>
>
>
>
> - <div class="item-wrapper">
> - <textarea class="translation item" dir="auto"
> placeholder="Translation" readonly>
> + <div class="item-wrapper">
> + <textarea class="translation item" dir="auto"
> placeholder="Translation" readonly>
> {%- if translation is not none -%}{%- if
> translation['translated-text'] is not none -%}{{
> translation['translated-text'] }}{%- endif -%}{%- endif -%}
> </textarea>
> - <!-- TTS for the output text -->
> - {%- if tts_enabled and tts_to is not none -%}
> - <br>
> - <div class="center">
> - <audio controls>
> - <source type="audio/mpeg" src="{{
> tts_to }}">
> - </audio>
> - </div>
> - {%- endif -%}
> + <!-- TTS for the output text -->
> + {%- if tts_enabled and tts_to is not none -%}
> + <br>
> + <div class="center">
> + <audio controls>
> + <source type="audio/mpeg" src="{{ tts_to }}">
> + </audio>
> </div>
> + {%- endif -%}
> </div>
> + </div>
>
> - <br>
> + <br>
>
> - <div class="center">
> - <!-- translate button -->
> - <button type="submit">Translate with {{ engine
> }}!</button>
- </div>
> + <div class="center">
> + <!-- translate button -->
> + <button type="submit">Translate with {{ engine }}!</button>
> + </div>
>
> - <br>
> + <br>
>
> - <div class="center">
> - <!-- link to share translation -->
> - <a href="/?engine={{ engine }}&text={{ inp|urlencode
> }}&sl={{ from_l_code }}&tl={{ to_l_code }}">Copy this link to share this
> translation with others</a>
> - </div>
> + <div class="center">
> + <!-- link to share translation -->
> + <a href="/?engine={{ engine }}&text={{ inp|urlencode
> }}&sl={{ from_l_code }}&tl={{ to_l_code }}">Copy this
> + link to share this translation with others</a>
> + </div>
>
> - <br>
> -
> - <div id="definitions_and_translations">
> - {% if translation is not none and "definitions" in
> translation %}
> - <div class="definitions">
> - {% for type, definitions in
> translation["definitions"].items() %}
> - <span class="def_type">{{type}}</span>
> - <ol>
> - {% for definition_item in definitions %}
> - <li>
> - {{definition_item["definition"]}}
> - <br>
> - {% if "use-in-sentence" in
> definition_item %}
> - <span class="use_in_sentence">
> - "{{definition_item["use-in-sentence"]}}"
> - </span>
> - <br>
> - {% endif %}
> - {% if "synonyms" in
> definition_item %}
> - {% for synonym_type in
> definition_item["synonyms"] %}
> - <span class="syn">
> - {% if synonym_type
> != "" %}
> - <br>
> - <span
> class="syn_type">{{synonym_type}}: </span>
> - {% endif %}
> - {{",
> ".join(definition_item["synonyms"][synonym_type])}}
> - </span>
> - {% endfor %}
> - {% endif %}
> - </li>
> - {% endfor %}
> - </ol>
> - {% endfor %}
> - </div>
> - {% endif %}
> + <br>
>
> - {% if translation is not none and "translations" in
> translation %}
> - <div class="translations">
> - {% for def_type, translations in
> translation["translations"].items() %}
> - <span class="def_type">{{def_type}}</span>
> - <ul>
> - {% for word, word_translations in
> translations.items() %}
> - <li>
> - <span
> class="syn_type">{{word}}:</span>
> - <span class="syn">{{",
> ".join(word_translations["words"])}}</span>
> - <span
> class="syn_type">{{word_translations["frequency"]}}</span>
> - </li>
> - <br>
> - {% endfor %}
> - </ul>
> + <div id="definitions_and_translations">
> + {% if translation is not none and "definitions" in
> translation %}
> + <div class="definitions">
> + {% for type, definitions in
> translation["definitions"].items() %}
> + <span class="def_type">{{type}}</span>
> + <ol>
> + {% for definition_item in definitions %}
> + <li>
> + {{definition_item["definition"]}}
> + <br>
> + {% if "use-in-sentence" in definition_item %}
> + <span class="use_in_sentence">
> + "{{definition_item["use-in-sentence"]}}"
> + </span>
> + <br>
> + {% endif %}
> + {% if "synonyms" in definition_item %}
> + {% for synonym_type in
> definition_item["synonyms"] %}
> + <span class="syn">
> + {% if synonym_type != "" %}
> + <br>
> + <span class="syn_type">{{synonym_type}}:
> </span>
> + {% endif %}
> + {{",
> ".join(definition_item["synonyms"][synonym_type])}}
> + </span>
> {% endfor %}
> - </div>
> - {% endif %}
> + {% endif %}
> + </li>
> + {% endfor %}
> + </ol>
> + {% endfor %}
> </div>
> + {% endif %}
>
> - </form>
> + {% if translation is not none and "translations" in
> translation %}
> + <div class="translations">
> + {% for def_type, translations in
> translation["translations"].items() %}
> + <span class="def_type">{{def_type}}</span>
> + <ul>
> + {% for word, word_translations in
> translations.items() %}
> + <li>
> + <span class="syn_type">{{word}}:</span>
> + <span class="syn">{{",
> ".join(word_translations["words"])}}</span>
> + <span
> class="syn_type">{{word_translations["frequency"]}}</span>
> + </li>
> + <br>
> + {% endfor %}
> + </ul>
> + {% endfor %}
> + </div>
> + {% endif %}
> + </div>
>
> - <br>
> - <br>
> - <br>
> + </form>
> +
> + <br>
> + <br>
> + <br>
> +
> + <footer class="center">
> + <a href="/prefs">Preferences</a> | <a
> href="https://simple-web.org/projects/simplytranslate.html">Project
> + Page</a> | <a href="https://simple-web.org">Simple Web
> Project</a>
> + </footer>
> +
> + <script>
> + // this code submits the translation form when pressing
> Ctrl/Meta+Enter while focussed on the input text field
> + document.getElementById("input").addEventListener("keydown", function
> (event) {
> + if (event.keyCode === 13 && (event.metaKey || event.ctrlKey))
> {
+ document.getElementById("translation-form").submit();
> + }
> + });
> + </script>
> + <script>
> + // Auto resize textarea to fit words inside it without need to
> scroll -- Thanks to: https://stackoverflow.com/a/25621277
> + const tx = document.getElementsByTagName("textarea");
> +
> + for (let i = 0; i < tx.length; i++) {
> + tx[i].setAttribute("style", "height:" +
> (tx[i].scrollHeight) + "px;overflow-y:hidden;");
> + tx[i].addEventListener("input", OnInput, false);
> + }
> +
> + function OnInput(e) {
> + this.style.height = 150 + "px";
> + this.style.height = (this.scrollHeight) + "px";
> + }
> + </script>
> +</body>
>
> - <footer class="center">
> - <a href="/prefs">Preferences</a> | <a
> href="https://simple-web.org/projects/simplytranslate.html">Project
> Page</a> | <a href="https://simple-web.org">Simple Web Project</a>
> - </footer>
> -
> - <script>
> - // this code submits the translation form when pressing
> Ctrl/Meta+Enter while focussed on the input text field
> - document.getElementById("input").addEventListener("keydown",
> function(event) {
> - if (event.keyCode === 13 && (event.metaKey ||
> event.ctrlKey)) {
> - document.getElementById("translation-form").submit();
> - }
> - });
> - </script>
> - </body>
> -</html>
> +</html>
> \ No newline at end of file
> --
> 2.35.1
>
>
I think you somehow malformatted this patch, please try sending it again
https://lists.sr.ht/~metalune/simplytranslate-devel/%3C4186bcc1-b016-b665-0f43-fe78519fece0%40esmailelbob.xyz%3E
as you can see here it doesn't show up as a patch but rather as a normal email
and I'd like to keep a clean history on SourceHut :)