From 5baa12ec3d0a2043451975f1d43d8047e4808570 Mon Sep 17 00:00:00 2001
From: ByronEricPerez <xxloboisthemanxx@gmail.com>
Date: Mon, 29 Aug 2022 16:17:14 -0300
Subject: [PATCH] Aligned input

---
 ui/component/commentsList/view.jsx | 46 ++++++++++++++----------------
 ui/scss/component/_card.scss       | 16 +++++++----
 2 files changed, 32 insertions(+), 30 deletions(-)

diff --git a/ui/component/commentsList/view.jsx b/ui/component/commentsList/view.jsx
index 3f8393483..49b10dbf7 100644
--- a/ui/component/commentsList/view.jsx
+++ b/ui/component/commentsList/view.jsx
@@ -382,30 +382,28 @@ const CommentActionButtons = (actionButtonsProps: ActionButtonsProps) => {
 
       <Button button="alt" icon={ICONS.REFRESH} title={__('Refresh')} onClick={() => setPage(0)} />
       {allServers.length >= 2 && (
-        <div className="button">
-          <div className="button__content">
-            <FormField
-              type="select-tiny"
-              onChange={function (x) {
-                const selectedServer = x.target.value;
-                setCommentServer(selectedServer);
-                if (selectedServer === defaultServer.url) {
-                  Comments.setServerUrl(undefined);
-                } else {
-                  Comments.setServerUrl(selectedServer);
-                }
-              }}
-              value={commentServer}
-            >
-              {allServers.map(function (server) {
-                return (
-                  <option key={server.url} value={server.url}>
-                    {server.name}
-                  </option>
-                );
-              })}
-            </FormField>
-          </div>
+        <div className="button_selectedServer">
+          <FormField
+            type="select-tiny"
+            onChange={function (x) {
+              const selectedServer = x.target.value;
+              setCommentServer(selectedServer);
+              if (selectedServer === defaultServer.url) {
+                Comments.setServerUrl(undefined);
+              } else {
+                Comments.setServerUrl(selectedServer);
+              }
+            }}
+            value={commentServer}
+          >
+            {allServers.map(function (server) {
+              return (
+                <option key={server.url} value={server.url}>
+                  {server.name}
+                </option>
+              );
+            })}
+          </FormField>
         </div>
       )}
     </>
diff --git a/ui/scss/component/_card.scss b/ui/scss/component/_card.scss
index b9c856de6..218f379e1 100644
--- a/ui/scss/component/_card.scss
+++ b/ui/scss/component/_card.scss
@@ -276,18 +276,16 @@
   overflow: hidden;
 
   .select--slim {
-    //margin-bottom: var(--spacing-xxs);
     display: flex;
-    //justify-content: center;
-    margin: 0px 0px 10px 10px;
+    margin-left: var(--spacing-s);
+    margin-bottom: var(--spacing-s);
 
     @media (min-width: $breakpoint-small) {
       max-width: none;
 
       select {
-        //max-height: 1.5rem !important;
-        //padding: 0 var(--spacing-xs);
-        //padding-right: var(--spacing-l);
+        padding: 0 var(--spacing-xs);
+        padding-right: var(--spacing-l);
       }
     }
   }
@@ -659,3 +657,9 @@
     }
   }
 }
+
+.button_selectedServer {
+  display: inline;
+  width: var(--floating-viewer-height);
+  float: right;
+}