diff --git a/frontend/src/components/Headers/HeaderLongResearch.jsx b/frontend/src/components/Headers/HeaderLongResearch.jsx index 687d38a..d6032c4 100644 --- a/frontend/src/components/Headers/HeaderLongResearch.jsx +++ b/frontend/src/components/Headers/HeaderLongResearch.jsx @@ -1,10 +1,10 @@ import "./header.css"; import PropTypes from "prop-types"; -import Input from "../Inputs/Input"; +import InputSearch from "../Inputs/InputSearch"; function HeaderLongResearch({ textTitle, textTitle2 }) { return ( -
+
); diff --git a/frontend/src/components/Headers/header.css b/frontend/src/components/Headers/header.css index 5198051..91e4ff5 100644 --- a/frontend/src/components/Headers/header.css +++ b/frontend/src/components/Headers/header.css @@ -73,7 +73,9 @@ border-radius 24% border-radius: 50px; } .input-research-container { - width: 100%; + height: 40px; + border-radius: 30px; + width: 80%; justify-content: center; background-color: var(--background-input); padding: 15px 20px; @@ -84,7 +86,3 @@ border-radius 24% font-weight: 500; margin-top: 5px; } - -.input-research { - width: 80%; -} diff --git a/frontend/src/components/Inputs/InputSearch.jsx b/frontend/src/components/Inputs/InputSearch.jsx new file mode 100644 index 0000000..5f1fab6 --- /dev/null +++ b/frontend/src/components/Inputs/InputSearch.jsx @@ -0,0 +1,14 @@ +import "./input-search.css"; + +function inputsearch() { + return ( +
+
+ + +
+
+ ); +} + +export default inputsearch; diff --git a/frontend/src/components/Inputs/input-search.css b/frontend/src/components/Inputs/input-search.css new file mode 100644 index 0000000..c28f0fe --- /dev/null +++ b/frontend/src/components/Inputs/input-search.css @@ -0,0 +1,24 @@ +.container-search { + margin: 40px 0 10px 0; +} + +.background-search { + background-color: white; + padding: 10px 20px; + border-radius: 100px; + border: none; + color: var(--second-color); + font-size: 16px; + font-weight: 500; + width: 80%; + margin-top: 10px; + margin-left: 20px; +} +.background-search input { + width: 100%; + border-style: none; +} +::placeholder { + color: var(--text-exemple); + font-style: italic; +} diff --git a/frontend/src/pages/HomeOffer/Home.jsx b/frontend/src/pages/HomeOffer/Home.jsx index a139a60..299e6f6 100644 --- a/frontend/src/pages/HomeOffer/Home.jsx +++ b/frontend/src/pages/HomeOffer/Home.jsx @@ -1,11 +1,12 @@ import CardOffre from "../../components/CardModel/CardOffre"; -import HeaderLongTitreSsTitre from "../../components/Headers/HeaderLongTitreSsTitre"; +import HeaderLongResearch from "../../components/Headers/HeaderLongResearch"; function Home() { return ( <> - +
+

Les offres qui matchent !