From fba48603b67097d997e5ce4d4de8330a4ea1d399 Mon Sep 17 00:00:00 2001
From: reverend <reverend@reverend2048.de>
Date: Wed, 12 Aug 2020 18:29:27 +0200
Subject: [PATCH] Ye

---
 components/main.scss |   5 ++-
 public/main.css      | 101 ++++++++++++++++++++++++++++++-------------
 2 files changed, 75 insertions(+), 31 deletions(-)

diff --git a/components/main.scss b/components/main.scss
index 8044977..dc27ae3 100644
--- a/components/main.scss
+++ b/components/main.scss
@@ -47,11 +47,12 @@ body{
 .LP-Main{
     display: table;
     flex-direction: row-reverse;
-    height: calc(100% - 61px);
+	height: calc(100% - 61px);
+	width: 100%;
 
     .LP-Main__Content{
         display: table-cell;
-         width: calc(100% -300px);
+         width: calc(100% - 300px);
          min-height: 1px;
          padding: 25px;
     }
diff --git a/public/main.css b/public/main.css
index a87d705..40aa8ea 100644
--- a/public/main.css
+++ b/public/main.css
@@ -18,10 +18,11 @@ body {
 .LP-Main {
   display: table;
   flex-direction: row-reverse;
-  height: calc(100% - 61px); }
+  height: calc(100% - 61px);
+  width: 100%; }
   .LP-Main .LP-Main__Content {
     display: table-cell;
-    width: calc(100% -300px);
+    width: calc(100% - 300px);
     min-height: 1px;
     padding: 25px; }
   .LP-Main .LP-Main__Sidebar {
@@ -99,12 +100,17 @@ body {
   border: none;
   padding: 8px 14px;
   border-radius: 2px;
-  font-weight: bold; }
+  font-weight: bold;
+  cursor: pointer; }
   .LP-Button:active {
     background-color: #76323F;
     color: #f9f9f9; }
   .LP-Button--cancel {
-    background-color: #f9f9f9; }
+    background-color: #565656;
+    color: #f9f9f9; }
+    .LP-Button--cancel:active {
+      color: #565656;
+      background-color: #f9f9f9; }
 
 .LP-Form .LP-Form__Checkbox {
   display: none; }
@@ -132,6 +138,17 @@ body {
       background-color: #f9f9f9;
       border-radius: 3px 3px 0 0;
       box-shadow: none; }
+    .LP-Input .LP-Input__Field[type=submit] {
+      background-color: #C09F80;
+      color: #565656;
+      border: none;
+      padding: 8px 14px;
+      border-radius: 2px;
+      font-weight: bold;
+      cursor: pointer; }
+      .LP-Input .LP-Input__Field[type=submit]:active {
+        background-color: #76323F;
+        color: #f9f9f9; }
   .LP-Input .LP-Input__Label {
     font-family: Montserrat, Helvetica, sans-serif;
     font-size: 16px; }
@@ -459,28 +476,49 @@ body {
         .LP-Footer .LP-LinkList__List .LP-LinkList__Item .LP-Link:hover {
           background-color: inherit; }
 
-.LP-Form .LP-Form__Fieldset {
-  border: none; }
-  .LP-Form .LP-Form__Fieldset .LP-Form__Legend {
-    margin: 0;
-    padding: 0;
-    font-family: Montserrat, Helvetica, sans-serif;
-    font-size: 21px; }
-  .LP-Form .LP-Form__Fieldset .LP-Form__Composition {
-    display: flex;
-    flex-direction: row;
-    justify-content: space-between; }
-    .LP-Form .LP-Form__Fieldset .LP-Form__Composition .LP-Form__Field {
-      flex: 3 1 100px;
-      padding: 6px 15px; }
-      .LP-Form .LP-Form__Fieldset .LP-Form__Composition .LP-Form__Field--wider {
-        flex: 5 1; }
-      .LP-Form .LP-Form__Fieldset .LP-Form__Composition .LP-Form__Field--wide {
-        flex: 4 1; }
-      .LP-Form .LP-Form__Fieldset .LP-Form__Composition .LP-Form__Field--narrow {
-        flex: 2 0; }
-      .LP-Form .LP-Form__Fieldset .LP-Form__Composition .LP-Form__Field--narrower {
-        flex: 1 0; }
+.LP-Form {
+  display: flex;
+  flex-direction: column;
+  align-items: center; }
+  .LP-Form .LP-Form__Fieldset {
+    border: none;
+    max-width: 1200px;
+    min-width: 750px; }
+    .LP-Form .LP-Form__Fieldset .LP-Form__Legend {
+      margin: 0;
+      padding: 0;
+      font-family: Montserrat, Helvetica, sans-serif;
+      font-size: 21px; }
+    .LP-Form .LP-Form__Fieldset .LP-Form__Composition {
+      display: flex;
+      flex-direction: row;
+      justify-content: space-between; }
+      .LP-Form .LP-Form__Fieldset .LP-Form__Composition .LP-Form__Field {
+        flex: 3 2 100px;
+        padding: 6px 15px; }
+        .LP-Form .LP-Form__Fieldset .LP-Form__Composition .LP-Form__Field--wider {
+          flex: 5 2; }
+        .LP-Form .LP-Form__Fieldset .LP-Form__Composition .LP-Form__Field--wide {
+          flex: 4 2; }
+        .LP-Form .LP-Form__Fieldset .LP-Form__Composition .LP-Form__Field--narrow {
+          flex: 2 1; }
+        .LP-Form .LP-Form__Fieldset .LP-Form__Composition .LP-Form__Field--narrower {
+          flex: 1 2; }
+      .LP-Form .LP-Form__Fieldset .LP-Form__Composition--buttons {
+        justify-content: flex-end; }
+      .LP-Form .LP-Form__Fieldset .LP-Form__Composition .LP-Form__Button {
+        flex-grow: 0;
+        padding-left: 0;
+        min-width: 130px; }
+        .LP-Form .LP-Form__Fieldset .LP-Form__Composition .LP-Form__Button .LP-Link {
+          display: contents; }
+      .LP-Form .LP-Form__Fieldset .LP-Form__Composition .LP-Form__InfoText .LP-Paragraph {
+        font-family: Montserrat, Helvetica, sans-serif;
+        color: #565656; }
+
+@media (max-width: 750px) {
+  .LP-Form .LP-Form__Fieldset {
+    min-width: unset; } }
 
 @media (max-width: 650px) {
   .LP-Form .LP-Form__Fieldset .LP-Form__Composition--breakable {
@@ -493,9 +531,13 @@ body {
     display: flex;
     flex-direction: column;
     justify-content: space-between; }
-    .LP-Form .LP-Form__Fieldset .LP-Form__Composition .LP-Form__Field {
+    .LP-Form .LP-Form__Fieldset .LP-Form__Composition .LP-Form__Field:not(.LP-Form__Button) {
       flex: 3 1 100px;
-      padding: 12px 15px; } }
+      padding: 12px 15px; }
+    .LP-Form .LP-Form__Fieldset .LP-Form__Composition .LP-Form__Button {
+      padding: 0 15px; }
+    .LP-Form .LP-Form__Fieldset .LP-Form__Composition--buttons {
+      justify-content: flex-end; } }
 
 .LP-ImageGrid .LP-ImageGrid__List {
   list-style-type: none;
@@ -558,4 +600,5 @@ body {
     width: 100%;
     height: auto;
     margin: 0;
-    padding: 0; } }
+    padding: 0;
+    margin-bottom: 25px; } }