⚡️ Replace hope-ui Input with a custom component in StopSearchMenu

frontend/src/stopsSearchMenu.tsx

@@ -2,8 +2,6 @@ import { createContext, createEffect, createResource, createSignal, For, JSX, on
 import { createStore } from "solid-js/store";
 import { createScrollPosition } from "@solid-primitives/scroll";
 
-import { Input, InputLeftAddon, InputGroup } from "@hope-ui/solid";
-
 import OlFeature from 'ol/Feature';
 import OlMap from 'ol/Map';
 import OlView from 'ol/View';
@@ -183,6 +181,13 @@ function SearchProvider(props: { children: JSX.Element }) {
 	);
 }
 
+const StopNameInput: VoidComponent<{ onInput: JSX.EventHandler<HTMLInputElement, InputEvent>, leftAddon: string, placeholder: string }> = (props) => {
+	return (
+		<div class="stopNameInput">
+			<div class="leftAddon">{props.leftAddon}</div>
+			<input type="text" oninput={props.onInput} placeholder={props.placeholder} />
+		</div>);
+};
 
 const Header: VoidComponent<{ title: string, minCharsNb: number }> = (props) => {
 
@@ -211,12 +216,7 @@ const Header: VoidComponent<{ title: string, minCharsNb: number }> = (props) =>
 					</text>
 				</svg>
 			</div>
-			<div class="inputGroup">
-				<InputGroup >
-					<InputLeftAddon>🚉 🚏</InputLeftAddon>
-					<Input onInput={onStopNameInput} placeholder="Stop name..." />
-				</InputGroup>
-			</div>
+			<StopNameInput onInput={onStopNameInput} leftAddon="🚉 🚏" placeholder="Stop name..." />
 		</div >
 	);
 };