Skip to content

Commit 46ad40b

Browse files
Brayan-chanBrayan-chan
committed
add template and tooltips
1 parent f0b7732 commit 46ad40b

File tree

1 file changed

+52
-25
lines changed

1 file changed

+52
-25
lines changed

‎index.html

Lines changed: 52 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -63,7 +63,7 @@
6363
<div class="app-menu">
6464
<ul class="accordion-menu">
6565
<li>
66-
<a class="new-note-btn" href="#">NUEVA NOTA <i class="material-icons">add_box</i></a>
66+
<a class="new-note-btn" data-bs-toggle="tooltip" data-bs-placement="top" title="Nueva Nota" href="#">NUEVA NOTA <i class="material-icons">add_box</i></a>
6767
</li>
6868
<li class="sidebar-title">
6969
Historial
@@ -78,13 +78,13 @@
7878
</div>
7979
<div class="note-details">
8080
<div class="note-title">
81-
Motor Edege
81+
Motor Edge
8282
</div>
8383
<div class="note-category ideas">
8484
Ideas
8585
</div>
8686
</div>
87-
<div class="note-date">20 oct →</div>
87+
<div class="note-date">20 oct <span>→</span></div>
8888
</div>
8989
</a>
9090
</li>
@@ -103,7 +103,7 @@
103103
Tareas
104104
</div>
105105
</div>
106-
<div class="note-date">18 oct →</div>
106+
<div class="note-date">18 oct <span>→</span></div>
107107
</div>
108108
</a>
109109
</li>
@@ -122,7 +122,7 @@
122122
Tareas
123123
</div>
124124
</div>
125-
<div class="note-date">17 oct →</div>
125+
<div class="note-date">17 oct <span>→</span></div>
126126
</div>
127127
</a>
128128
</li>
@@ -140,7 +140,7 @@
140140
Proyectos
141141
</div>
142142
</div>
143-
<div class="note-date">10 oct →</div>
143+
<div class="note-date">10 oct <span>→</span></div>
144144
</div>
145145
</a>
146146
</li>
@@ -159,7 +159,7 @@
159159
Proyectos
160160
</div>
161161
</div>
162-
<div class="note-date">8 oct →</div>
162+
<div class="note-date">8 oct <span>→</span></div>
163163
</div>
164164
</a>
165165
</li>
@@ -178,7 +178,7 @@
178178
Tareas
179179
</div>
180180
</div>
181-
<div class="note-date">30 sept →</div>
181+
<div class="note-date">30 sept <span>→</span></div>
182182
</div>
183183
</a>
184184
</li>
@@ -197,7 +197,7 @@
197197
Proyectos
198198
</div>
199199
</div>
200-
<div class="note-date">28 sept →</div>
200+
<div class="note-date">28 sept <span>→</span></div>
201201
</div>
202202
</a>
203203
</li>
@@ -216,19 +216,46 @@
216216
Tareas
217217
</div>
218218
</div>
219-
<div class="note-date">27 sept →</div>
219+
<div class="note-date">27 sept <span>→</span></div>
220220
</div>
221221
</a>
222222
</li>
223223
</ul>
224224
<hr>
225225
<li class="sidebar-footer">
226-
<a id="collaborate-button" class="new-colaborate" href="#">COLABORAR <i
226+
<a id="collaborate-button" class="new-colaborate" data-bs-toggle="tooltip" data-bs-placement="top" title="Colaborar" href="#">COLABORAR <i
227227
class="material-icons">group</i></a>
228228
</li>
229229
</ul>
230230
</div>
231231
</div>
232+
233+
<!-- Template de las notas creadas en el historial -->
234+
235+
<template id="note-template">
236+
<li>
237+
<a href="#">
238+
<div class="note-item">
239+
<div class="note-icon">
240+
<!-- Aqui se debe de poner la imagen de la nota -->
241+
</div>
242+
<div class="note-details">
243+
<div class="note-title">
244+
<!-- Aqui se debe de poner el nombre de la nota -->
245+
</div>
246+
<div class="note-category ideas">
247+
<!-- Aqui se debe de poner la categoria de la nota -->
248+
</div>
249+
</div>
250+
<div class="note-date">
251+
<!-- Aqui se debe de poner la fecha de la nota -->
252+
<span>→</span>
253+
</div>
254+
</div>
255+
</a>
256+
</li>
257+
</template>
258+
232259
<div class="app-container">
233260
<div class="app-header">
234261
<nav class="navbar navbar-light navbar-expand-lg">
@@ -305,53 +332,53 @@ <h6 class="dropdown-header">Perfil</h6>
305332
<div class="row">
306333
<div class="col">
307334
<div class="top-functions d-flex justify-content-between p-3 mx-3">
308-
<button onclick="applyFormat('bold')">
335+
<button onclick="applyFormat('bold')" data-bs-toggle="tooltip" data-bs-placement="top" title="Negrita">
309336
<i class="material-icons">
310337
format_bold
311338
</i>
312339
</button>
313-
<button onclick="applyFormat('italic')">
340+
<button onclick="applyFormat('italic')" data-bs-toggle="tooltip" data-bs-placement="top" title="Cursiva">
314341
<i class="material-icons">
315342
format_italic
316343
</i>
317344
</button>
318-
<button onclick="applyFormat('underline')">
345+
<button onclick="applyFormat('underline')" data-bs-toggle="tooltip" data-bs-placement="top" title="Subrayado">
319346
<i class="material-icons">
320347
format_underlined
321348
</i>
322349
</button>
323-
<button onclick="applyFormat('strikethrough')">
350+
<button onclick="applyFormat('strikethrough')" data-bs-toggle="tooltip" data-bs-placement="top" title="Tachado">
324351
<i class="material-icons">
325352
format_strikethrough
326353
</i>
327354
</button>
328-
<button onclick="toggleColorPicker()" id="colorPickerButton">
355+
<button onclick="toggleColorPicker()" id="colorPickerButton" data-bs-toggle="tooltip" data-bs-placement="top" title="Cambiar color">
329356
<i class="material-icons">
330357
title
331358
</i>
332359
<div class="color-indicator" id="colorIndicator"></div>
333360
</button>
334-
<button onclick="applyAlign('justifyLeft')">
361+
<button onclick="applyAlign('justifyLeft')" data-bs-toggle="tooltip" data-bs-placement="top" title="Alinear a izquierda">
335362
<i class="material-icons">
336363
format_align_left
337364
</i>
338365
</button>
339-
<button onclick="applyAlign('justifyCenter')">
366+
<button onclick="applyAlign('justifyCenter')" data-bs-toggle="tooltip" data-bs-placement="top" title="Alinear al centro">
340367
<i class="material-icons">
341368
format_align_center
342369
</i>
343370
</button>
344-
<button onclick="applyAlign('justifyRight')">
371+
<button onclick="applyAlign('justifyRight')" data-bs-toggle="tooltip" data-bs-placement="top" title="Alinear a derecha">
345372
<i class="material-icons">
346373
format_align_right
347374
</i>
348375
</button>
349-
<button onclick="applyAlign('justifyFull')">
376+
<button onclick="applyAlign('justifyFull')" data-bs-toggle="tooltip" data-bs-placement="top" title="Justificar">
350377
<i class="material-icons">
351378
format_align_justify
352379
</i>
353380
</button>
354-
<button onclick="addLink()">
381+
<button onclick="addLink()" data-bs-toggle="tooltip" data-bs-placement="top" title="Agregar hipervínculo">
355382
<i class="material-icons">
356383
add_link
357384
</i>
@@ -455,24 +482,24 @@ <h2 class="text-lg font-semibold">Compartir Peer ID</h2>
455482
<div class="col">
456483
<div class="bottom-functions d-flex justify-content-between p-3 mx-3">
457484
<label for="image-upload" id="image-upload-label">
458-
<button onclick="addImage()">
485+
<button onclick="addImage()" data-bs-toggle="tooltip" data-bs-placement="top" title="Agregar imagen">
459486
<i class="material-icons">
460487
image
461488
</i>
462489
</button>
463490
</label>
464-
<button id="savePDF">
491+
<button id="savePDF" data-bs-toggle="tooltip" data-bs-placement="top" title="Guardar PDF">
465492
<i class="material-icons">
466493
picture_as_pdf
467494
</i>
468495
</button>
469-
<button id="saveWord">
496+
<button id="saveWord" data-bs-toggle="tooltip" data-bs-placement="top" title="Guardar Word">
470497
<i class="material-icons">
471498
description
472499
</i>
473500
</button>
474501
<input type="file" id="fileInput" accept=".txt,.docx" class="hidden" />
475-
<button id="importButton">
502+
<button id="importButton" data-bs-toggle="tooltip" data-bs-placement="top" title="Importar">
476503
<i class="material-icons">
477504
upload_file
478505
</i>

0 commit comments

Comments
 (0)