Mobile and style improvements

src/pages/homepage/components/Search/Search.tsx

@@ -43,6 +43,7 @@ export default function Search({
 	const [listIndex, setListIndex] = useState(0);
 	const {
 		theme,
+		isMobile,
 		urlPattern,
 		providerLabel,
 		setProviderLabel,
@@ -263,7 +264,13 @@ export default function Search({
 		const [showFillButton, setShowFillButton] = useState(false);
 		if (item.option.searchTerm !== undefined) {
 			const m = new Date(item.option.dateTimeStamp);
-			const dateString = `${m.getUTCFullYear()}/${`0${m.getUTCMonth() + 1}`.slice(-2)}/${`0${m.getUTCDate()}`.slice(-2)} ${`0${m.getUTCHours()}`.slice(-2)}:${`0${m.getUTCMinutes()}`.slice(-2)}:${`0${m.getUTCSeconds()}`.slice(-2)}`;
+			const year = m.getUTCFullYear();
+			const month = `0${m.getUTCMonth() + 1}`.slice(-2);
+			const day = `0${m.getUTCDate()}`.slice(-2);
+			const hours = `0${m.getUTCHours()}`.slice(-2);
+			const minutes = `0${m.getUTCMinutes()}`.slice(-2);
+			const seconds = `0${m.getUTCSeconds()}`.slice(-2);
+			const dateString = `${year}/${month}/${day} ${hours}:${minutes}:${seconds}`;
 			return (
 				<Group
 					w={'100%'}
@@ -446,7 +453,7 @@ export default function Search({
 				}}
 				spellCheck='true'
 				searchable
-				autoFocus
+				autoFocus={!isMobile}
 				leftSection={providerLabel}
 				rightSection={<Stack />}
 				renderOption={RenderOption}
@@ -478,6 +485,9 @@ export default function Search({
 				closeProviderModal={closeProviderModal}
 			/>
 			<WeatherModal
+				setSearchValue={setSearchValue}
+				setProviderLabel={setProviderLabel}
+				setProviderURL={setProviderURL}
 				current={current}
 				outlook={outlook}
 				extendedForecast={extendedForecast}