From a050bd795e214d51d5cae67939585199cf8b19b0 Mon Sep 17 00:00:00 2001
From: silverweed <silverweed14@proton.me>
Date: Thu, 30 May 2024 15:14:34 +0200
Subject: [PATCH] make layout horizontal

---
 index.html |  2 +-
 tiers.css  | 17 ++++++-----------
 2 files changed, 7 insertions(+), 12 deletions(-)

diff --git a/index.html b/index.html
index 4089e13..66d4f36 100644
--- a/index.html
+++ b/index.html
@@ -42,9 +42,9 @@
                     <input id='import-input' type='file' accept='.json' multiple/>
                 </div>
             </div>
-            <p class='hint'>Hint: you can paste an image into this page to have it show up in the list below.</p>
             <section class='images'></section>
         </div>
+        <p class='hint'>Hint: you can paste an image into this page to have it show up in the list below.</p>
     </section>
     <img id='trash' src='trash_bin.png' title='Delete image (drag it over here)'></img>
   </body>
diff --git a/tiers.css b/tiers.css
index 23758a9..e7f4d24 100644
--- a/tiers.css
+++ b/tiers.css
@@ -31,11 +31,7 @@ body {
 
 .main-content {
 	display: flex;
-	flex-flow: row;
-}
-
-.tierlist {
-	width: 80%;
+	flex-flow: column;
 }
 
 .tierlist span {
@@ -135,10 +131,9 @@ img.draggable.dragged, .button:active {
 
 .bottom-container {
 	display: flex;
-	flex-flow: column;
+	flex-flow: row;
 	align-items: center;
-	width: 310px;
-	margin-left: 15px;
+	margin-top: 15px;
 }
 
 .bottom-container input {
@@ -173,7 +168,7 @@ img.draggable.dragged, .button:active {
 .buttons-container {
 	display: flex;
 	flex-wrap: wrap;
-	width: 206px;
+	width: 270px;
 }
 
 .gh-link {
@@ -185,9 +180,9 @@ img.draggable.dragged, .button:active {
 
 #trash {
 	position: absolute;
-	bottom: 5px;
+	top: 5px;
 	right: 5px;
-	height: 80px;
+	height: 60px;
 	opacity: 0.4;
 }