From a200a71abc018344851c23e2d7ff6df00f5fd481 Mon Sep 17 00:00:00 2001
From: developomp <developomp@gmail.com>
Date: Mon, 9 Aug 2021 11:53:46 +0900
Subject: [PATCH] put search bar on top for mobile

---
 source/src/pages/Search.tsx | 14 ++++++++++++--
 1 file changed, 12 insertions(+), 2 deletions(-)

diff --git a/source/src/pages/Search.tsx b/source/src/pages/Search.tsx
index 899718e..62904fe 100644
--- a/source/src/pages/Search.tsx
+++ b/source/src/pages/Search.tsx
@@ -29,9 +29,10 @@ const StyledSearch = styled.div`
 
 const StyledSearchContainer = styled.div`
 	display: flex;
+	align-items: center;
 
 	@media screen and (max-width: ${theming.size.screen_size2}) {
-		display: block;
+		flex-direction: column-reverse;
 	}
 `
 
@@ -44,6 +45,15 @@ const StyledSearchControlContainer = styled.div`
 	}
 `
 
+const StyledDateRange = styled(DateRange)`
+	width: 350px;
+	height: 350px;
+
+	@media screen and (max-width: ${theming.size.screen_size2}) {
+		margin-top: 1rem;
+	}
+`
+
 function isDateInRange(
 	dateToCompare: string,
 	from: string,
@@ -108,7 +118,7 @@ function _Search() {
 				<h1>Search</h1>
 
 				<StyledSearchContainer>
-					<DateRange
+					<StyledDateRange
 						editableDateInputs={true}
 						moveRangeOnFirstSelection={false}
 						retainEndDateOnFirstSelection={true}