diff --git a/src/App.jsx b/src/App.jsx index b4c88fe..62172dc 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -12,7 +12,7 @@ function App() { }/> - }/> + }/> diff --git a/src/Components/Header/index.jsx b/src/Components/Header/index.jsx new file mode 100644 index 0000000..6b52af8 --- /dev/null +++ b/src/Components/Header/index.jsx @@ -0,0 +1,22 @@ + +import styles from './style.module.scss'; +import logo from '../../img/headerImg/OgettoLogo.png'; +import { useNavigate } from "react-router-dom"; + +const Header = () => { + const navigate = useNavigate(); + const handleHome = () => { + navigate('/'); + } + + return ( +
+
+
logo
+ +
+
+ ) + +} +export default Header; \ No newline at end of file diff --git a/src/Components/Header/style.module.scss b/src/Components/Header/style.module.scss new file mode 100644 index 0000000..5b9fbd6 --- /dev/null +++ b/src/Components/Header/style.module.scss @@ -0,0 +1,37 @@ + + +.header { + height: 75px; + width: 80%; + display: flex; + align-items: center; + justify-content: space-between; + &__container { + display: flex; + align-items: center; + justify-content: center; + width: 100%; + height: 150px; + position: absolute; + top: 0px; + left: 0px; + } + &__logo { + cursor: pointer; + } + &__button { + display: flex; + align-items: center; + justify-content: center; + border-radius: 100px; + background: #FFED00; + width: 200px; + height: 42px; + color: #000; + font-family: Montserrat; + font-size: 25px; + font-style: normal; + font-weight: 400; + line-height: normal; + } +} \ No newline at end of file diff --git a/src/Components/HomePage/index.jsx b/src/Components/HomePage/index.jsx index 293db6d..62accb7 100644 --- a/src/Components/HomePage/index.jsx +++ b/src/Components/HomePage/index.jsx @@ -1,11 +1,15 @@ - +import Header from "../Header"; import styles from "./style.module.scss"; const HomePage = () => { return ( + <> +
-
dadada
+
+ + ) } diff --git a/src/Components/css/style.module.css b/src/Components/css/style.module.css new file mode 100644 index 0000000..92d86f1 --- /dev/null +++ b/src/Components/css/style.module.css @@ -0,0 +1 @@ +.header{height:75px;width:80%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.header__container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:100%;height:150px;position:absolute;top:0px;left:0px}.header__logo{cursor:pointer}.header__button{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;border-radius:100px;background:#ffed00;width:200px;height:42px;color:#000;font-family:Montserrat;font-size:25px;font-style:normal;font-weight:400;line-height:normal}/*# sourceMappingURL=style.module.css.map */ \ No newline at end of file diff --git a/src/Components/css/style.module.css.map b/src/Components/css/style.module.css.map new file mode 100644 index 0000000..3430802 --- /dev/null +++ b/src/Components/css/style.module.css.map @@ -0,0 +1 @@ +{"version":3,"sources":["../Header/style.module.scss"],"names":[],"mappings":"AAEA,QACI,WAAA,CACA,SAAA,CACA,mBAAA,CAAA,mBAAA,CAAA,YAAA,CACA,wBAAA,CAAA,qBAAA,CAAA,kBAAA,CACA,wBAAA,CAAA,qBAAA,CAAA,6BAAA,CACA,mBACI,mBAAA,CAAA,mBAAA,CAAA,YAAA,CACA,wBAAA,CAAA,qBAAA,CAAA,kBAAA,CACA,uBAAA,CAAA,oBAAA,CAAA,sBAAA,CACA,UAAA,CACA,YAAA,CACA,iBAAA,CACA,OAAA,CACA,QAAA,CAEJ,cACI,cAAA,CAEJ,gBACI,mBAAA,CAAA,mBAAA,CAAA,YAAA,CACA,wBAAA,CAAA,qBAAA,CAAA,kBAAA,CACA,uBAAA,CAAA,oBAAA,CAAA,sBAAA,CACA,mBAAA,CACA,kBAAA,CACA,WAAA,CACA,WAAA,CACA,UAAA,CACA,sBAAA,CACA,cAAA,CACA,iBAAA,CACA,eAAA,CACA,kBAAA","file":"style.module.css"} \ No newline at end of file diff --git a/src/img/headerImg/OgettoLogo.png b/src/img/headerImg/OgettoLogo.png new file mode 100644 index 0000000..e96085a Binary files /dev/null and b/src/img/headerImg/OgettoLogo.png differ