Reorganized the codebase, add support for flag modus operandi

Signed-off-by: Izuru Yakumo <yakumo.izuru@chaotic.ninja> git-svn-id: file:///srv/svn/repo/mai/trunk@48 e410bdd4-646f-c54f-a7ce-fffcc4f439ae
2023-10-06 14:33:57 +00:00
parent 88a86eec8a
commit 08278eebad
18 changed files with 55 additions and 312 deletions
--- a/static/style.css
+++ b/static/style.css
@@ -0,0 +1,188 @@
+.center {
+    text-align: center;
+}
+
+.wrap {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: center;
+}
+
+.wrap.languages {
+    flex-wrap: nowrap;
+    margin-bottom: 20px;
+}
+
+#could_not_switch_languages_text {
+    color: red;
+}
+
+.item {
+    width: 100%;
+    height: 150px;
+}
+
+.item-wrapper {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: center;
+    width: 450px;
+    margin: 5px 10px;
+    gap: 10px;
+}
+
+
+.language,
+.switch_languages {
+    display: flex;
+}
+
+.language {
+    margin: 0px 10px;
+}
+
+.switch_languages {
+    margin: 0px 5px;
+}
+
+#switchbutton {
+    white-space: nowrap;
+}
+
+button {
+    font-size: 1rem;
+    padding: 4px 10px;
+    border: 2px solid #888888;
+}
+
+input,
+select,
+textarea {
+    width: 100%;
+    font-size: 1rem;
+    padding: 4px;
+    border: 2px solid #888888;
+}
+
+textarea {
+    resize: vertical;
+    height: 5rem;
+    font-family: sans-serif;
+
+    /* Stretch to form width */
+    width: 100%;
+}
+
+input:focus,
+select:focus,
+textarea:focus,
+button:focus {
+    border-color: #478061;
+    outline: 1px solid #478061;
+}
+
+
+body {
+    justify-content: center;
+    font-family: sans-serif;
+}
+
+#definitions_and_translations {
+    display: grid;
+    margin: auto;
+    width: 1100px;
+    gap: 10px;
+    grid-template-areas: "definitions translations";
+
+}
+
+.def_type {
+    color: #007979;
+    text-transform: capitalize;
+}
+
+.syn {
+    color: #804700;
+}
+
+.syn_type {
+    color: #007979;
+}
+
+.use_in_sentence {
+    color: #009902;
+}
+
+.definitions li:not(:last-child) {
+    margin-bottom: 1rem;
+}
+
+@media screen and (max-width: 1200px) {
+    #definitions_and_translations {
+        display: grid;
+        width: 90vw;
+        grid-template-areas:
+            "definitions definitions"
+            "translations translations";
+    }
+}
+
+
+div.definitions {
+    grid-area: definitions;
+}
+
+div.translations {
+    grid-area: translations;
+}
+
+a {
+    text-decoration: none;
+}
+
+@media screen and (prefers-color-scheme: dark) {
+    body {
+        background-color: #212529;
+        color: #f8f9fa;
+    }
+
+    #could_not_switch_languages_text {
+        color: #F13333;
+    }
+
+    a:visited {
+        color: #9759f6;
+        text-decoration: none;
+    }
+
+    a {
+        color: #599bf6;
+        text-decoration: none;
+    }
+
+    input,
+    select,
+    button,
+    textarea {
+        background-color: #131618;
+        border-color: #495057;
+        color: #f8f9fa;
+    }
+
+    .def_type {
+        color: cyan;
+        text-transform: capitalize;
+    }
+
+    .syn {
+        color: burlywood;
+    }
+
+    .syn_type {
+        color: cyan;
+    }
+
+    .use_in_sentence {
+        color: yellow;
+    }
+}