Eliminar publicación

Claraescobar123 · Aug 25, 2020 · c08786f · c08786f
1 parent 82cada1
commit c08786f
Show file tree

Hide file tree

Showing 3 changed files with 63 additions and 5 deletions.
diff --git a/src/css/profile.css b/src/css/profile.css
@@ -4,4 +4,45 @@
   width: 100%;
   height: 100%;
   background-color: #FFFFF0;
+  position: relative;
+  padding: 10px
+}
+
+.comment{
+  min-width: 250px;
+  margin: 30px auto;
+  background-color: gray;
+}
+#deleteIcon{
+  width: 30px;
+  height: 30px;
+  background-image: url(../img/delete.png);
+  background-position: center;
+  cursor: pointer;
+}
+
+#confirm{
+  display: none;
+  flex-direction: column;
+  justify-content: space-around;
+  max-width: 400px;
+  height: 100px;
+  background-color: #FFFFFF;
+  border: 1px solid #766D78;
+  border-radius: 20px;
+  font-size: 1em;
+  text-align: center;
+  color: #5D5D5D;
+  position: absolute;
+  left: 0;
+  right: 0;
+  margin: auto;
+}
+
+#confirm > h2{
+  font-size: 1em;
+}
+#deleteBtn{
+  background-color: #ED3124;
+  border: 2px solid #C7251F;
 }
diff --git a/src/style.css b/src/style.css
@@ -6,6 +6,7 @@
 @import "css/thanksAccount.css";
 @import "css/recover.css";
 @import "css/timeline.css";
+@import "css/profile.css";
 @import "css/modal.css";
 *{
   margin: 0px;

diff --git a/src/views/profile.js b/src/views/profile.js
@@ -2,13 +2,29 @@ import { currentUser } from '../lib/firebaseAuth.js';
 
 export default () => {
   const profile = document.createElement('section');
-  profile.setAttribute('id', 'timelineBody');
-  profile.innerHTML = `<p>Aqui va un comentario</p>`;
+  profile.setAttribute('id', 'profileBody');
+  profile.innerHTML = `<div class="comment">
+            <p>Aqui va un comentario</p>
+            <div id="deleteIcon"></div>
+            <div id="confirm">
+            <h2>¿Estás seguro que quieres eliminar la publicación?</h2>
+            <button type="submit" class="btn" id="deleteBtn">ELIMINAR</button>
+            </div>
+            </div>`;
   let user = currentUser();
-  console.log(user.photoURL);
-  profile.querySelector('p').addEventListener('click', () => {
-    console.log('esto esta muy loco se descuadro');
+
+  profile.querySelector('#deleteBtn').addEventListener('submit', ()=>{
+    e.preventDefault();
   });
 
+  window.addEventListener('click', (e)=>{
+
+    if(e.target == profile.querySelector('#deleteIcon')){
+      profile.querySelector('#confirm').style.display = 'flex';
+    }else{
+      profile.querySelector('#confirm').style.display = 'none';
+    }
+
+  })
   return profile;
 };