make layout horizontal

silverweed · May 30, 2024 · a050bd7 · a050bd7
1 parent ba6fd17
commit a050bd7
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 12 deletions.
diff --git 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
@@ -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;
 }