From 6e17826938965c2b1a973b670b4bdecf0a3634ef Mon Sep 17 00:00:00 2001
From: Damillora <damillora@damillora.com>
Date: Tue, 26 Jan 2021 02:05:46 +0700
Subject: [PATCH] Make GameItem responsive

---
 src/node_modules/components/GameListItem.svelte | 4 ++--
 src/style/components/_gameitem.scss             | 7 +++++--
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/src/node_modules/components/GameListItem.svelte b/src/node_modules/components/GameListItem.svelte
index f6ae6b6..cd7746c 100644
--- a/src/node_modules/components/GameListItem.svelte
+++ b/src/node_modules/components/GameListItem.svelte
@@ -9,7 +9,7 @@
         <p class="game-item__caption"><a href={link}>{name}</a></p>
     </div>
     <div class="game-item__content">
-        <p><CopyArea value={playername} /><span class="game-item__icon material-icons">person</span></p>
-        <p><CopyArea value={gameid} /><span class="game-item__icon material-icons">code</span></p>
+        <p><span class="game-item__icon material-icons">person</span><CopyArea value={playername} /></p>
+        <p><span class="game-item__icon material-icons">code</span><CopyArea value={gameid} /></p>
     </div>
 </div>
diff --git a/src/style/components/_gameitem.scss b/src/style/components/_gameitem.scss
index 07ec871..e2d3250 100644
--- a/src/style/components/_gameitem.scss
+++ b/src/style/components/_gameitem.scss
@@ -2,9 +2,12 @@
     padding: 0.25rem 1rem;
     width: 100%;
     display: flex;
-    flex-direction: row;
+    flex-direction: column;
     @include transition;
-
+    
+    @include screen(lg) {
+        flex-direction: row;
+    }
     &:hover {
         background-color: $bg-secondary;
     }