diff --git a/src/css/profileUser.css b/src/css/profileUser.css
index 602fb83f..8446e6a6 100644
--- a/src/css/profileUser.css
+++ b/src/css/profileUser.css
@@ -8,11 +8,13 @@
flex-direction: column;
}
#profile h1,h3{
+ font-size: 13px;
color:black;
text-align: center;
}
#profile .photo{
+ border-radius: 50%;
max-width: 25%;
display:inline-block;
}
diff --git a/src/main.js b/src/main.js
index d6afa2ce..4268b379 100644
--- a/src/main.js
+++ b/src/main.js
@@ -58,4 +58,6 @@ window.addEventListener('hashchange', () => {
router(window.location.hash);
});
+
+
myFunction();
diff --git a/src/views/profileUser.js b/src/views/profileUser.js
index fb5c4f14..be54dbe3 100644
--- a/src/views/profileUser.js
+++ b/src/views/profileUser.js
@@ -2,8 +2,10 @@ export default () => {
history.replaceState({}, 'profileUser', '#profile');
const profile = document.createElement('div');
profile.setAttribute('id', 'profile');
- profile.innerHTML = `
+ profile.innerHTML = `
+
Clara Escobar
+
Sobre mi
`;
+
+ const photos = profile.querySelector('#archivo');
+ const previewPhoto = profile.querySelector('#preview');
+ const defaultImage = profile.querySelector('.default-image');
+
+ photos.addEventListener('change', () => {
+ const file = photos.files[0];
+ console.log(file);
+ if (file) {
+ const reader = new FileReader();
+ defaultImage.style.display = 'none';
+ previewPhoto.style.display = 'block';
+ reader.addEventListener('load', () => {
+ previewPhoto.setAttribute('src', reader.result);
+ });
+ reader.readAsDataURL(file);
+ } else {
+ defaultImage.style.display = null;
+ previewPhoto.style.display = null;
+ previewPhoto.setAttribute('src', '');
+ }
+ });
return profile;
-};
\ No newline at end of file
+};
+
+
+/*function mostrarImagen(event){
+ let imagenSource = event.target.result;
+ let previewImage = document.getElementById("preview");
+ }
+ function changePhoto(event){
+ let imagen = event.target.files[0];
+ let lector = new FileReader();
+ lector.addEventListener("load", mostrarImagen,false);
+ lector.readAsDataURL(imagen);
+ }
+
+document.getElementById("archivo").addEventListener("change", changePhoto,false);*/
+