diff --git a/src/pages/Parametres.js b/src/pages/Parametres.js index 5990def..48889da 100644 --- a/src/pages/Parametres.js +++ b/src/pages/Parametres.js @@ -2,12 +2,35 @@ import React from 'react'; import NavigationDashboard from '../components/NavigationDashboard'; -const Parametres = () => { +const Parametre = () => { return ( - coucou + + + +
+ {/* Create an account page */} +
+

Parametre

+
+
+ + + + +
+ +
+
+
+ +
+ coucou +
+
+
); }; -export default Parametres; \ No newline at end of file +export default Parametre; \ No newline at end of file diff --git a/src/styles/components/_calendrier.scss b/src/styles/components/_calendrier.scss index a484b8e..b65c979 100644 --- a/src/styles/components/_calendrier.scss +++ b/src/styles/components/_calendrier.scss @@ -132,7 +132,7 @@ body { backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(15px); width: 100%; - margin: 5px 5px 10px 10px; + margin: 5px 10px 10px 5px; text-align: center; .mini_formulaire_evenement { diff --git a/src/styles/components/_parametre.scss b/src/styles/components/_parametre.scss new file mode 100644 index 0000000..62c98af --- /dev/null +++ b/src/styles/components/_parametre.scss @@ -0,0 +1,142 @@ +body { + background-image: url("../../../public/fond_page_connexion.png"); + + .page_compte { + display: flex; + flex-direction: column; + justify-content: space-evenly; + width: auto; + height: 100vh; + + .haut_de_page { + display: flex; + flex-direction: row; + justify-content: space-between; + padding: 50px; + width: auto; + height: 10%; + align-items: center; + margin: 10px 10px 5px 10px; + + background: rgba(255, 255, 255, 0.3); + border-radius: 15px; + box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37); + backdrop-filter: blur(3px); + -webkit-backdrop-filter: blur(15px); + + .titre { + font-size: 40px; + } + + .rechLogo { + display: flex; + flex-direction: row; + justify-content: space-between; + + .input_box { + display: flex; + justify-content: center; + align-items: center; + position: relative; + height: 40px; + max-width: 350px; + width: 100%; + margin: 30px 30px; + border-radius: 25px; + box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37); + + input { + position: relative; + width: 100%; + height: 100%; + padding: 0 15px 0 65px; + outline: none; + border: none; + border-radius: 25px; + font-size: 16px; + font-weight: 400; + color: #333; + } + + .search { + display: flex; + align-items: center; + justify-content: center; + position: absolute; + left: 0; + top: 0; + height: 100%; + width: 60px; + border-radius: 25px 0 0 25px; + + .search-icon { + font-size: 30px; + color: black; + } + } + } + + .logo { + display: flex; + width: 100px; + height: 100px; + } + } + } + + .bas_de_page { + display: flex; + flex-direction: row; + justify-content: space-between; + width: auto; + height: 86%; + + .nav_bar_verticale { + display: flex; + flex-direction: column; + justify-content: space-around; + align-items: center; + width: 5%; + margin: 5px 5px 10px 10px; + + background: rgba(255, 255, 255, 0.3); + border-radius: 15px; + box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37); + backdrop-filter: blur(3px); + -webkit-backdrop-filter: blur(15px); + + .button { + display: flex; + object-fit: cover; + background-color: transparent; + border: none; + cursor: pointer; + + .logo_nav_bar{ + display: flex; + margin: 10px; + height: 50px; + width: 50px; + } + } + } + + + .Parametre { + display: flex; + flex-direction: column; + justify-content: space-evenly; + width: 94.3%; + height: auto; + margin: 5px 10px 10px 5px; + + background: rgba(255, 255, 255, 0.3); + border-radius: 15px; + box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37); + backdrop-filter: blur(3px); + -webkit-backdrop-filter: blur(15px); + + } + } + } +} diff --git a/src/styles/index.scss b/src/styles/index.scss index 0ded5d7..7ffc4c5 100644 --- a/src/styles/index.scss +++ b/src/styles/index.scss @@ -4,4 +4,5 @@ @import "./components/compte"; @import "./components/dashboard"; @import "./components/analyse"; -@import "./components/calendrier" \ No newline at end of file +@import "./components/calendrier"; +@import "./components/parametre"; \ No newline at end of file