ui updates --> responsiveness
All checks were successful
Publish Docker image / Push Docker image to Docker Hub (push) Successful in -2s

This commit is contained in:
2025-09-27 14:22:41 +02:00
parent 00855c3ce1
commit 2bf98a8faf
2 changed files with 20 additions and 2 deletions

View File

@@ -242,6 +242,10 @@ button span {
align-items: center; align-items: center;
} }
.mobile_only {
display: none;
}
textarea, textarea,
pre { pre {
background-color: white; background-color: white;
@@ -256,9 +260,18 @@ pre {
@media (max-width: 600px) { @media (max-width: 600px) {
main { main {
width: 100wv; width: 100wv;
display: flex;
} }
main > div { main > div {
width: 100%; width: 100%;
} }
.desktop_only {
display: none;
}
.mobile_only {
display: unset;
}
} }

View File

@@ -3,6 +3,11 @@
<head> <head>
<title>Anki Converter</title> <title>Anki Converter</title>
<link rel="stylesheet" href="/static/style.css" /> <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> </head>
<body> <body>
<main> <main>
@@ -11,12 +16,12 @@
<div class="form_button"> <div class="form_button">
<label class="custom-file-upload"> <label class="custom-file-upload">
<input id="myfile" type="file" name="file" accept=".pdf" /> <input id="myfile" type="file" name="file" accept=".pdf" />
<span>Custom Upload</span> <span>Upload</span>
</label> </label>
<button type="submit">Convert</button> <button type="submit">Convert</button>
<div class="checkbox-wrapper-14"> <div class="checkbox-wrapper-14">
<input id="s1-14" type="checkbox" class="switch" {% if format_indents %}checked {% endif %} name="format_indents" /> <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>
</div> </div>
<br /> <br />