othr

src/components/Header/Header.module.css

@@ -0,0 +1,14 @@
+.header {
+    display: flex;
+    flex-direction: row;
+}
+
+.header-input {
+    flex: 1;
+}
+
+.header-button {
+    height: 100%;
+    width: 10%;
+    min-width: 5rem;
+}

src/components/Header/Header.tsx

@@ -0,0 +1,25 @@
+import styles from './Header.module.css';
+import {Button, TextInput} from "@mantine/core";
+import {FC} from "react";
+
+const Header: FC = ()=>{
+
+    return (
+        <div className={styles['header']}>
+            <TextInput
+                radius={0}
+                placeholder={"Поиск и фильтры"}
+                size={"xl"}
+                className={styles['header-input']}
+            />
+            <Button
+                radius={0}
+                color={"gray"}
+                variant={'default'}
+                className={styles['header-button']}
+            >Поиск</Button>
+        </div>
+    )
+}
+
+export default Header;