From 1d1a78608eabb9384fb12a5f7d345be04998eacd Mon Sep 17 00:00:00 2001
From: KevinMidboe <kevin.midboe@gmail.com>
Date: Fri, 4 Oct 2019 00:36:36 +0200
Subject: [PATCH] Moved away inline css and added mobile rule to stretch the
 input wrapper closer to the edges of the screen

---
 src/components/TorrentList.vue | 18 ++++++++++++++----
 1 file changed, 14 insertions(+), 4 deletions(-)

diff --git a/src/components/TorrentList.vue b/src/components/TorrentList.vue
index d9acbfe..a3729b3 100644
--- a/src/components/TorrentList.vue
+++ b/src/components/TorrentList.vue
@@ -73,10 +73,7 @@
       <h2>No results found</h2>
       <br />
 
-      <div style="display: flex;
-                  width: 70%;
-                  justify-content: center;"
-            v-if="editSearchQuery">
+      <div class="editQuery" v-if="editSearchQuery">
 
         <seasonedInput text="Torrent query" icon="_torrents" @inputValue="(val) => editedSearchQuery = val" @enter="fetchTorrents(editedSearchQuery)" />
 
@@ -443,6 +440,19 @@ table {
 
 }
 
+
+
+.editQuery {
+  display: flex;
+  width: 70%;
+  justify-content: center;
+
+  @include mobile-only {
+    width: 90%;
+  }
+}
+
+
 .download {
 
   &__icon {