From d3508f1f5f105fe3edb7c196ab2fb99c84b145f8 Mon Sep 17 00:00:00 2001
From: crupest <crupest@outlook.com>
Date: Fri, 16 Apr 2021 18:13:28 +0800
Subject: ...

---
 FrontEnd/src/app/views/common/SearchInput.tsx | 18 +++++++++++++++---
 1 file changed, 15 insertions(+), 3 deletions(-)

(limited to 'FrontEnd/src/app/views/common/SearchInput.tsx')

diff --git a/FrontEnd/src/app/views/common/SearchInput.tsx b/FrontEnd/src/app/views/common/SearchInput.tsx
index 12e2126a..76e7884c 100644
--- a/FrontEnd/src/app/views/common/SearchInput.tsx
+++ b/FrontEnd/src/app/views/common/SearchInput.tsx
@@ -12,10 +12,11 @@ export interface SearchInputProps {
   buttonText?: string;
   placeholder?: string;
   additionalButton?: React.ReactNode;
+  alwaysOneline?: boolean;
 }
 
 const SearchInput: React.FC<SearchInputProps> = (props) => {
-  const { onChange, onButtonClick } = props;
+  const { onChange, onButtonClick, alwaysOneline } = props;
 
   const { t } = useTranslation();
 
@@ -37,7 +38,13 @@ const SearchInput: React.FC<SearchInputProps> = (props) => {
   );
 
   return (
-    <Form inline className={classnames(" flex-sm-nowrap", props.className)}>
+    <Form
+      inline
+      className={classnames(
+        alwaysOneline ? "flex-nowrap" : "flex-sm-nowrap",
+        props.className
+      )}
+    >
       <Form.Control
         className="mr-sm-2 flex-grow-1"
         value={props.value}
@@ -50,7 +57,12 @@ const SearchInput: React.FC<SearchInputProps> = (props) => {
           {props.additionalButton}
         </div>
       ) : null}
-      <div className="mt-2 mt-sm-0 flex-shrink-0 ml-auto ml-sm-0">
+      <div
+        className={classnames(
+          alwaysOneline ? "mt-0 ml-2" : "mt-2 mt-sm-0 ml-auto ml-sm-0",
+          "flex-shrink-0"
+        )}
+      >
         {props.loading ? (
           <Spinner variant="primary" animation="border" />
         ) : (
-- 
cgit v1.2.3