ui updates --> responsiveness

2025-09-27 14:22:41 +02:00
parent 00855c3ce1
commit 2bf98a8faf
2 changed files with 20 additions and 2 deletions
--- a/src/static/style.css
+++ b/src/static/style.css
@@ -242,6 +242,10 @@ button span {
    align-items: center;
 }

+.mobile_only {
+    display: none;
+}
+
 textarea,
 pre {
    background-color: white;
@@ -256,9 +260,18 @@ pre {
@media (max-width: 600px) {
    main {
        width: 100wv;
+        display: flex;
    }

    main > div {
        width: 100%;
    }
+
+    .desktop_only {
+        display: none;
+    }
+
+    .mobile_only {
+        display: unset;
+    }
 }
--- a/src/templates/index.html
+++ b/src/templates/index.html
@@ -3,6 +3,11 @@
    <head>
        <title>Anki Converter</title>
        <link rel="stylesheet" href="/static/style.css" />
+        <meta charset="UTF-8" />
+        <meta name="description" content="Anki Flashcard Formatter" />
+        <meta name="keywords" content="Anki" />
+        <meta name="author" content="Tom Tröger" />
+        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    </head>
    <body>
        <main>
@@ -11,12 +16,12 @@
                <div class="form_button">
                    <label class="custom-file-upload">
                        <input id="myfile" type="file" name="file" accept=".pdf" />
-                        <span>Custom Upload</span>
+                        <span>Upload</span>
                    </label>
                    <button type="submit">Convert</button>
                    <div class="checkbox-wrapper-14">
                        <input id="s1-14" type="checkbox" class="switch" {% if format_indents %}checked {% endif %} name="format_indents" />
-                        <label for="s1-14">Stichpunkte formatieren</label>
+                        <label for="s1-14" class="mobile_only">Stichpunkte</label>
                    </div>
                </div>
                <br />