From a3dca567c313fdd195c620334e266b57500a72d7 Mon Sep 17 00:00:00 2001
From: Angelina Filippova <linakirsanova@gmail.com>
Date: Sun, 9 Feb 2020 19:52:17 +0300
Subject: [PATCH] Fix styles for Relays tab

---
 src/views/settings/components/Inputs.vue |  2 +-
 src/views/settings/components/Relays.vue | 14 +++++-------
 src/views/settings/styles/main.scss      | 27 ++++++++++++++++++++++++
 3 files changed, 33 insertions(+), 10 deletions(-)

diff --git a/src/views/settings/components/Inputs.vue b/src/views/settings/components/Inputs.vue
index b2773fd1..d7f6def4 100644
--- a/src/views/settings/components/Inputs.vue
+++ b/src/views/settings/components/Inputs.vue
@@ -61,7 +61,7 @@
             :setting-parent="[...settingParent, subSetting]"
             :setting="subSetting"
             :data="data[setting.key]"
-            :custom-label-width="'140px'"
+            :custom-label-width="isDesktop ? '140px' : '100px'"
             :label-class="'center-label'"
             :input-class="'keyword-inner-input'"
             :nested="true"/>
diff --git a/src/views/settings/components/Relays.vue b/src/views/settings/components/Relays.vue
index 18db6f5b..eb3ac264 100644
--- a/src/views/settings/components/Relays.vue
+++ b/src/views/settings/components/Relays.vue
@@ -1,13 +1,9 @@
 <template>
-  <div v-if="!loading">
-    <el-row :gutter="5">
-      <el-col :span="8">
-        <el-input v-model="newRelay" :placeholder="$t('settings.followRelay')" @keyup.enter.native="followRelay"/>
-      </el-col>
-      <el-col :span="8">
-        <el-button type="primary" @click.native="followRelay">{{ $t('settings.follow') }}</el-button>
-      </el-col>
-    </el-row>
+  <div v-if="!loading" class="relays-container">
+    <div class="follow-relay-container">
+      <el-input v-model="newRelay" :placeholder="$t('settings.followRelay')" class="follow-relay" @keyup.enter.native="followRelay"/>
+      <el-button type="primary" @click.native="followRelay">{{ $t('settings.follow') }}</el-button>
+    </div>
     <el-table :data="relaysTable">
       <el-table-column
         :label="$t('settings.instanceUrl')"
diff --git a/src/views/settings/styles/main.scss b/src/views/settings/styles/main.scss
index 785fff01..04d71905 100644
--- a/src/views/settings/styles/main.scss
+++ b/src/views/settings/styles/main.scss
@@ -51,6 +51,10 @@
       padding: 2px 3px;
     }
   }
+  .follow-relay {
+    width: 350px;
+    margin-right: 7px;
+  }
   .form-container {
     margin-bottom: 80px;
   }
@@ -152,6 +156,9 @@
     margin-left: 8px;
     margin-right: 10px
   }
+  .relays-container {
+    margin: 0 15px;
+  }
   .replacement-input {
     width: 80%;
     margin-left: 8px;
@@ -213,10 +220,27 @@
     .description > p {
       line-height: 18px;
       margin: 0 0 7px 0;
+      code {
+        display: inline;
+        line-height: 18px;
+        padding: 2px 3px;
+        font-size: 14px;
+      }
     }
     .description-container.settings-input {
       margin-bottom: 0;
     }
+    .follow-relay {
+      width: 70%;
+      margin-right: 5px;
+      input {
+        width: 100%;
+      }
+    }
+    .follow-relay-container {
+      display: flex;
+      justify-content: space-between;
+    }
     .input-container {
       width: 100%;
       .el-form-item {
@@ -295,6 +319,9 @@
       width: 40%;
       margin-right: 4px
     }
+    .relays-container {
+      margin: 0 10px;
+    }
     .replacement-input {
       width: 60%;
       margin-left: 4px;