From f08f6ca0a9d337efff280d4d1669a41b5d9c31c2 Mon Sep 17 00:00:00 2001
From: piotrruss <mail@pruss.it>
Date: Thu, 2 Sep 2021 22:28:11 +0200
Subject: finish translations, force maximize

---
 styles/Main.module.scss | 94 +++++++++++++++++++++++++++++++++++++++++++++----
 styles/_window.scss     | 32 ++++++++---------
 2 files changed, 103 insertions(+), 23 deletions(-)

(limited to 'styles')

diff --git a/styles/Main.module.scss b/styles/Main.module.scss
index 3f0230c..bac6a97 100644
--- a/styles/Main.module.scss
+++ b/styles/Main.module.scss
@@ -9,8 +9,8 @@
 .icon {
   text-decoration: none;
   display: inline-block;
-  width: 4.5em;
   padding: .5em;
+  text-align: center;
 
   img {
     width: 3em;
@@ -19,7 +19,6 @@
   p {
     margin-top: .25em;
     padding: .25em;
-    text-align: center;
     transition: .2s background;
     border-radius: .5em;
   }
@@ -30,6 +29,8 @@
 }
 
 .userForm {
+  padding: 2em;
+
   label,
   & {
     display: flex;
@@ -50,11 +51,77 @@
     border-radius: .5px;
   }
 
+
+  input[type=password]:nth-of-type(2)  {
+    margin-top: 1em;
+  }
+
   p {
     text-align: center;
     color: var(--color-error);
     margin: 1rem 0 0;
   }
+
+  legend {
+    font-size: .8em;
+    padding: 2em 0 1.5em;
+  }
+
+  fieldset:nth-of-type(1) {
+    input {
+      display: none;
+    }
+
+    label {
+      padding: 0 .75em;
+      transition: .3s color;
+      display: inline-block;
+      color: var(--color-decor);
+
+      &:hover {
+        color: #666;
+      }
+    }
+
+    input:checked + label {
+      font-weight: 600;
+      color: var(--color-text);
+    }
+  }
+
+  fieldset:nth-of-type(2) {
+    input {
+      display: none;
+    }
+
+    label {
+      width: 2em;
+      height: 2em;
+      display: inline-block;
+      margin: 0 1em;
+      outline-offset: 4px;
+
+      &:nth-of-type(1) {
+        background-color: #53e3a6;
+      }
+
+      &:nth-of-type(2) {
+        background-color: #2986b3;
+      }
+
+      &:nth-of-type(3) {
+        background-color: #000;
+      }
+    }
+
+    input:checked + label {
+      outline: 3px solid var(--color-window-buttons);
+    }
+  }
+
+  input[type=submit] {
+    margin-top: 1.5em;
+  }
 }
 
 .header {
@@ -70,7 +137,7 @@
       overflow: auto;
     }
 
-    ul {
+    & > ul {
       display: block;
 
       & > li {
@@ -119,21 +186,34 @@
     color: var(--color-text-alt);
     background-color: var(--color-selected);
   }
-
 }
 
 .submenu {
   position: absolute;
   right: 4px;
   top: 2.1em;
-  width: 8em;
-  padding: .5em;
+  padding: .75em;
   background-color: var(--color-window-content);
   border-bottom: 1px solid var(--color-window-border-bottom);
   border-radius: .5em;
+  display: flex;
+  flex-direction: column;
 
-  & > li > span {
+  & > li > span,
+  & > li > a {
+    display: block;
+    color: var(--color-text);
+    padding: .5em;
+    margin: .25em;
+    white-space: nowrap;
     text-decoration: none;
+    transition: .3s background, .3s color;
+    border-radius: .5em;
+
+    &:hover {
+      color: var(--color-text-alt);
+      background-color: var(--color-selected);
+    }
   }
 }
 
diff --git a/styles/_window.scss b/styles/_window.scss
index a2d0438..08ddfaf 100644
--- a/styles/_window.scss
+++ b/styles/_window.scss
@@ -26,22 +26,22 @@
   }
 
   &:not(.window--popup) {
-    height: 80vh;
-    width: 80vw;
-    top: 10vh;
-    left: 10vw;
+    height: 100%;
+    width: 100%;
+  }
+    // top: 50%;
+    // left: 50%;
 
+    // @media (min-width: 80em) {
+      // width: 64em;
+      // left: calc((100vw - 64em) / 2)
+    // }
 
-    @media (min-width: 80em) {
-      width: 64em;
-      left: calc((100vw - 64em) / 2)
-    }
-
-    @media (min-height: 80em) {
-      width: 64em;
-      left: calc((100vh - 64em) / 2)
-    }
-  }
+    // @media (min-height: 80em) {
+      // width: 64em;
+      // left: calc((100vh - 64em) / 2)
+    // }
+  // }
 
   &__title {
     position: absolute;
@@ -181,8 +181,8 @@
     right: 0!important;
     bottom: 0!important;
     left: 0!important;
-    width: 100%;
-    height: 100%;
+    width: 100%!important;
+    height: 100%!important;
 
     & > .window__content {
       top: 0;
-- 
cgit v1.2.3