From 59a05081c5ab6250a51b58a44c6b11245c7c79c4 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 8 Apr 2018 03:43:07 +0300
Subject: [PATCH] some styles fixes

---
 src/App.scss                                     |  6 +++---
 src/components/style_switcher/style_switcher.vue | 15 +++++++--------
 src/components/timeline/timeline.vue             |  2 ++
 src/components/user_finder/user_finder.vue       |  4 ++--
 4 files changed, 14 insertions(+), 13 deletions(-)

diff --git a/src/App.scss b/src/App.scss
index 047cd333..e4b02017 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -95,7 +95,7 @@ input, textarea, .select {
   color: var(--lightFg, $fallback--lightFg);
   font-family: sans-serif;
   font-size: 14px;
-  padding: 8px 7px 4px;
+  padding: 8px 7px;
   box-sizing: border-box;
   display: inline-block;
   position: relative;
@@ -183,8 +183,8 @@ i[class*=icon-] {
 
 .item {
   flex: 1;
-  line-height: 25px;
-  height: 25px;
+  line-height: 50px;
+  height: 50px;
   overflow: hidden;
 
   .nav-icon {
diff --git a/src/components/style_switcher/style_switcher.vue b/src/components/style_switcher/style_switcher.vue
index ef4a21bd..9c39b245 100644
--- a/src/components/style_switcher/style_switcher.vue
+++ b/src/components/style_switcher/style_switcher.vue
@@ -55,32 +55,32 @@
       <p>{{$t('settings.radii_help')}}</p>
       <div class="radius-item">
         <label for="btnradius" class="theme-radius-lb">{{$t('settings.btnRadius')}}</label>
-        <input id="btnradius" class="theme-radius-rn" type="range" v-model="btnRadiusLocal">
+        <input id="btnradius" class="theme-radius-rn" type="range" v-model="btnRadiusLocal" max="16">
         <input id="btnradius-t" class="theme-radius-in" type="text" v-model="btnRadiusLocal">
       </div>
       <div class="radius-item">
         <label for="panelradius" class="theme-radius-lb">{{$t('settings.panelRadius')}}</label>
-        <input id="panelradius" class="theme-radius-rn" type="range" v-model="panelRadiusLocal">
+        <input id="panelradius" class="theme-radius-rn" type="range" v-model="panelRadiusLocal" max="50">
         <input id="panelradius-t" class="theme-radius-in" type="text" v-model="panelRadiusLocal">
       </div>
       <div class="radius-item">
         <label for="avatarradius" class="theme-radius-lb">{{$t('settings.avatarRadius')}}</label>
-        <input id="avatarradius" class="theme-radius-rn" type="range" v-model="avatarRadiusLocal">
+        <input id="avatarradius" class="theme-radius-rn" type="range" v-model="avatarRadiusLocal" max="28">
         <input id="avatarradius-t" class="theme-radius-in" type="green" v-model="avatarRadiusLocal">
       </div>
       <div class="radius-item">
         <label for="avataraltradius" class="theme-radius-lb">{{$t('settings.avatarAltRadius')}}</label>
-        <input id="avataraltradius" class="theme-radius-rn" type="range" v-model="avatarAltRadiusLocal">
+        <input id="avataraltradius" class="theme-radius-rn" type="range" v-model="avatarAltRadiusLocal" max="28">
         <input id="avataraltradius-t" class="theme-radius-in" type="text" v-model="avatarAltRadiusLocal">
       </div>
       <div class="radius-item">
         <label for="attachmentradius" class="theme-radius-lb">{{$t('settings.attachmentRadius')}}</label>
-        <input id="attachmentrradius" class="theme-radius-rn" type="range" v-model="attachmentRadiusLocal">
+        <input id="attachmentrradius" class="theme-radius-rn" type="range" v-model="attachmentRadiusLocal" max="50">
         <input id="attachmentradius-t" class="theme-radius-in" type="text" v-model="attachmentRadiusLocal">
       </div>
       <div class="radius-item">
         <label for="tooltipradius" class="theme-radius-lb">{{$t('settings.tooltipRadius')}}</label>
-        <input id="tooltipradius" class="theme-radius-rn" type="range" v-model="tooltipRadiusLocal">
+        <input id="tooltipradius" class="theme-radius-rn" type="range" v-model="tooltipRadiusLocal" max="20">
         <input id="tooltipradius-t" class="theme-radius-in" type="text" v-model="tooltipRadiusLocal">
       </div>
     </div>
@@ -166,6 +166,7 @@
   box-shadow: none;
   background: transparent;
   color: var(--faint, $fallback--faint);
+  align-self: stretch;
 }
 
 .theme-color-cl,
@@ -175,7 +176,6 @@
 }
 
 .theme-color-in {
-  padding: 5px;
   min-width: 4em;
 }
 
@@ -206,7 +206,6 @@
 .theme-color-cl {
   padding: 1px;
   max-width: 8em;
-  align-self: stretch;
   height: 100%;
   flex: 0;
   min-width: 2em;
diff --git a/src/components/timeline/timeline.vue b/src/components/timeline/timeline.vue
index 68439681..4d2230cb 100644
--- a/src/components/timeline/timeline.vue
+++ b/src/components/timeline/timeline.vue
@@ -101,5 +101,7 @@
   border-color: var(--border, $fallback--border);
   padding: 10px;
   z-index: 1;
+  background-color: $fallback--btn;
+  background-color: var(--btn, $fallback--btn);
 }
 </style>
diff --git a/src/components/user_finder/user_finder.vue b/src/components/user_finder/user_finder.vue
index 22d4bd77..69bd1d21 100644
--- a/src/components/user_finder/user_finder.vue
+++ b/src/components/user_finder/user_finder.vue
@@ -19,13 +19,13 @@
 @import '../../_variables.scss';
 
 .user-finder-container {
-  height: 21px;
+  height: 29px;
   max-width: 100%;
 }
 
 .user-finder-input {
   max-width: 80%;
-  padding: 0.1em 0.2em 0.2em 0.2em;
+  vertical-align: middle;
 }
 
 </style>