arya/mozhi
1
0
Fork 0
mirror of https://codeberg.org/aryak/mozhi synced 2024-12-02 12:00:44 +05:30
Code Issues Actions Packages Projects Releases Wiki Activity

format the views page correctly

Browse Source
This commit is contained in:
Arya 2024-05-22 11:28:12 +05:30
parent d3f8a0d2eb
commit 41c6ec9712
Signed by: arya
GPG Key ID: 842D12BDA50DF120
1 changed files with 79 additions and 66 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

67
views/index.html
View File

@ -12,12 +12,11 @@
{{ end }} {{ end }}
</ul> </ul>
</div> </div>
<br />
<br /><br /> <br />
<form action="/" method="POST" id="translation-form"> <form action="/" method="post" id="translation-form">
<!-- This hidden input is so that the engine gets sent in the request even though its not declared here --> <!-- This hidden input is so that the engine gets sent in the request even though its not declared here -->
<input name="engine" value="{{.Engine}}" type="hidden" /> <input name="engine" value="{{.Engine}}" type="hidden" />
<div class="wrap languages center-area"> <div class="wrap languages center-area">
<div class="language"> <div class="language">
<select name="from" aria-label="Source language" id="sourceLanguage"> <select name="from" aria-label="Source language" id="sourceLanguage">
@ -32,18 +31,20 @@
{{ end }} {{ end }} {{ end }} {{ end }}
</select> </select>
</div> </div>
<div class="switch_languages"> <div class="switch_languages">
<button id="switchbutton" aria-label="Switch languages" formaction="/switchlanguages?engine={{ .Engine }}" <button id="switchbutton"
aria-label="Switch languages"
formaction="/switchlanguages?engine={{ .Engine }}"
type="submit"> type="submit">
<!-- https://icon-sets.iconify.design/ci/arrow-left-right/ --> <!-- https://icon-sets.iconify.design/ci/arrow-left-right/ -->
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"> <svg xmlns="http://www.w3.org/2000/svg"
<path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" width="24"
d="m16 13l3 3m0 0l-3 3m3-3H5m3-5L5 8m0 0l3-3M5 8h14" /> height="24"
viewBox="0 0 24 24">
<path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m16 13l3 3m0 0l-3 3m3-3H5m3-5L5 8m0 0l3-3M5 8h14" />
</svg> </svg>
</button> </button>
</div> </div>
<div class="language"> <div class="language">
<select name="to" aria-label="Target language" id="targetLanguage"> <select name="to" aria-label="Target language" id="targetLanguage">
{{ range $key, $value := .TargetLanguages }} {{ if $.To }} {{ range $key, $value := .TargetLanguages }} {{ if $.To }}
@ -58,13 +59,13 @@
</select> </select>
</div> </div>
</div> </div>
<div class="center-area2 item-wrapper"> <div class="center-area2 item-wrapper">
Source Text: Source Text:
<textarea autofocus class="item" id="input" name="text" dir="auto" placeholder="Enter Text Here"> <textarea autofocus class="item" id="input" name="text" dir="auto" placeholder="Enter Text Here">
{{ .OriginalText }}</textarea> {{ .OriginalText }}</textarea>
{{ if .Translation.SourceTransliteration }} {{ if .Translation.SourceTransliteration }}
<br>Transliteration: {{newlinetobr .Translation.SourceTransliteration}}{{end}} <br>
Transliteration: {{ newlinetobr .Translation.SourceTransliteration }}{{ end }}
{{ if .TtsFrom }} {{ if .TtsFrom }}
<br> <br>
<audio controls> <audio controls>
@ -73,7 +74,6 @@
{{ end }} {{ end }}
<br> <br>
</div> </div>
{{ if .TranslateAll }} {{ if .TranslateAll }}
{{ range $key, $value := .TranslateAll }} {{ range $key, $value := .TranslateAll }}
<div class="item-wrapper center-area2"> <div class="item-wrapper center-area2">
@ -81,9 +81,11 @@
<textarea class="translation item" dir="auto" placeholder="Translation" id="output" readonly> <textarea class="translation item" dir="auto" placeholder="Translation" id="output" readonly>
{{.OutputText}}</textarea> {{.OutputText}}</textarea>
{{ if .AutoDetect }} {{ if .AutoDetect }}
<br>Detected Language: {{.AutoDetect}}{{end}} <br>
Detected Language: {{.AutoDetect}}{{ end }}
{{ if .TargetTransliteration }} {{ if .TargetTransliteration }}
<br>Transliteration: {{newlinetobr .TargetTransliteration}}{{end}} <br>
Transliteration: {{ newlinetobr .TargetTransliteration }}{{ end }}
{{ if $.TtsTo }} {{ if $.TtsTo }}
<br> <br>
<audio controls> <audio controls>
@ -98,9 +100,11 @@
<textarea class="translation item" dir="auto" placeholder="Translation" id="output" readonly> <textarea class="translation item" dir="auto" placeholder="Translation" id="output" readonly>
{{.Translation.OutputText}}</textarea> {{.Translation.OutputText}}</textarea>
{{ if .Translation.AutoDetect }} {{ if .Translation.AutoDetect }}
<br>Detected Language: {{.Translation.AutoDetect}}{{end}} <br>
Detected Language: {{.Translation.AutoDetect}}{{ end }}
{{ if .Translation.TargetTransliteration }} {{ if .Translation.TargetTransliteration }}
<br>Transliteration: {{newlinetobr .Translation.TargetTransliteration}}{{end}} <br>
Transliteration: {{ newlinetobr .Translation.TargetTransliteration }}{{ end }}
{{ if .TtsTo }} {{ if .TtsTo }}
<br> <br>
<audio controls> <audio controls>
@ -110,22 +114,31 @@
<br> <br>
{{ end }} {{ end }}
{{ end }} {{ end }}
<div style="display:flex; justify-content:space-around; align-items:center;"> <div style="display:flex;
justify-content:space-around;
align-items:center">
{{ if .TranslationExists }} {{ if .TranslationExists }}
<button class="wrap" type="button" onclick="copyToClipboard()"> <button class="wrap" type="button" onclick="copyToClipboard()">Copy the translation</button>
Copy the translation
</button>
{{ end }} {{ end }}
{{ if and .Engine .From .To .OriginalText }}<p><a id="url" class="button" onclick="copyLinkToClipboard(event)" {{ if and .Engine .From .To .OriginalText }}
href="/?engine={{.Engine}}&from={{.From}}&to={{.To}}&text={{.OriginalText}}">Copy translation link</a></p> <p>
<a id="url"
class="button"
onclick="copyLinkToClipboard(event)"
href="/?engine={{.Engine}}&from={{.From}}&to={{.To}}&text={{.OriginalText}}">Copy translation link</a>
</p>
{{ end }} {{ end }}
{{ if .TranslationExists }} {{ if .TranslationExists }}
<button class="wrap" type="submit"> <button class="wrap" type="submit">Translate!</button>
{{ else }} {{ else }}
<button class="wrap" style="margin-left:auto; position:relative; left:-10%;margin-top: 1%;" type="submit"> <button class="wrap"
style="margin-left:auto;
position:relative;
left:-10%;
margin-top: 1%"
type="submit">Translate!</button>
{{ end }} {{ end }}
Translate! </div>
</button>
</div> </div>
</form> </form>
<script> <script>