diff --git a/src/pages/Compte.js b/src/pages/Compte.js index efc74ad..d112422 100644 --- a/src/pages/Compte.js +++ b/src/pages/Compte.js @@ -1,12 +1,20 @@ import { Component } from '@fullcalendar/core'; -import { render } from '@testing-library/react'; -import { click } from '@testing-library/user-event/dist/click'; -import React from 'react'; +import React, { useState } from 'react'; import NavigationDashboard from '../components/NavigationDashboard'; +import img1 from '../img/logo_personEntouré.svg'; -const Compte = () => { + +function Compte() { + + const [file, setFile] = useState(); + function handleChange(e) { + console.log(e.target.files); + setFile(URL.createObjectURL(e.target.files[0])); + } + + return ( @@ -31,9 +39,16 @@ const Compte = () => {
-
+
+ +
- + +
+ +
@@ -81,8 +96,8 @@ const Compte = () => {
); - }; + export default Compte; \ No newline at end of file diff --git a/src/styles/components/_compte.scss b/src/styles/components/_compte.scss index 0d2fdfa..bb9f109 100644 --- a/src/styles/components/_compte.scss +++ b/src/styles/components/_compte.scss @@ -199,10 +199,15 @@ body { height: 135px; width: 135px; background: rgba(255, 255, 255, 0.1); - border-radius: 15px; + border-radius: 100px; box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(15px); + + .img { + border-radius: 100px; + object-fit: cover; + } } .figure{ @@ -220,7 +225,9 @@ body { align-items: center; cursor: pointer; - .bouton_ajoutPhoto { + + + /*.bouton_ajoutPhoto { height: 40px; width: 150px; background-color: rgb(190, 189, 189); @@ -231,7 +238,7 @@ body { &:hover{ background-color: lightgrey; } - } + }*/ } } @@ -432,3 +439,23 @@ body { } } } + +#input[type="file"] { + display: none; +} + +.fileUpload{ + width: 100%; + margin-top: 1rem; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + margin: auto; + width: 150px; + height: 50px; + color: white; + border-radius: 10px; + background-color: $xiketic; + cursor: pointer; +} diff --git a/src/styles/settings.scss b/src/styles/settings.scss index 42d3cf8..1bfe1c4 100644 --- a/src/styles/settings.scss +++ b/src/styles/settings.scss @@ -26,7 +26,7 @@ $alice-blue: rgba(232, 238, 242, 1); $blue-munsell: rgba(0, 136, 163, 1); $malachite: rgba(50, 232, 117, 1); $rufous: rgba(155, 41, 21, 1); -$xiketic: rgba(2, 1, 20, 1); +$xiketic: rgb(21, 18, 75); /* SCSS Gradient */ $gradient-top: linear-gradient(0deg, #e8eef2ff, #0088a3ff, #32e875ff, #9b2915ff, #020114ff);