Overview
Comment: | Better design of dialog close button, allow documentfragments as dialogs |
---|---|
Downloads: | Tarball | ZIP archive | SQL archive |
Timelines: | family | ancestors | descendants | both | trunk | stable |
Files: | files | file ages | folders |
SHA1: |
c5e6e62dc5786dc563f0d6ec788f3778 |
User & Date: | bohwaz on 2020-12-10 01:47:27 |
Other Links: | manifest | tags |
Context
2020-12-10
| ||
02:16 | Don't hide print button on mobile check-in: 6aa5d87f22 user: bohwaz tags: trunk, stable | |
01:47 | Better design of dialog close button, allow documentfragments as dialogs check-in: c5e6e62dc5 user: bohwaz tags: trunk, stable | |
00:39 | Off course it doesn't work with images... check-in: fb370909d1 user: bohwaz tags: trunk | |
Changes
Modified src/www/admin/static/scripts/global.js from [054e0148e7] to [a4e04fc8bc].
︙ | ︙ | |||
102 103 104 105 106 107 108 | } g.dialog = document.createElement('dialog'); g.dialog.id = 'dialog'; g.dialog.open = true; var btn = document.createElement('button'); | | > > > > | | > > > > | 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 | } g.dialog = document.createElement('dialog'); g.dialog.id = 'dialog'; g.dialog.open = true; var btn = document.createElement('button'); btn.className = 'icn-btn closeBtn'; btn.setAttribute('data-icon', '✘'); btn.type = 'button'; btn.innerHTML = 'Fermer'; btn.onclick = g.closeDialog; g.dialog.appendChild(btn); if (typeof content == 'string') { var container = document.createElement('div'); container.innerHTML = content; content = container; } else if (content instanceof DocumentFragment) { var container = document.createElement('div'); container.appendChild(content.cloneNode(true)); content = container; } g.dialog.appendChild(content); content.style.opacity = g.dialog.style.opacity = 0; g.dialog.onclick = (e) => { if (e.target == g.dialog) g.closeDialog(); }; window.onkeyup = (e) => { if (e.key == 'Escape') g.closeDialog(); }; document.body.appendChild(g.dialog); // Restore CSS defaults window.setTimeout(() => { g.dialog.style.opacity = ''; }, 50); window.setTimeout(() => { content.style.opacity = ''; }, 100); return content; } g.openFrameDialog = function (url) { var iframe = document.createElement('iframe'); iframe.src = url; iframe.name = 'dialog'; iframe.frameborder = '0'; |
︙ | ︙ |
Modified src/www/admin/static/styles/04-dialogs.css from [9ca4a3ffe3] to [9ade8c8089].
︙ | ︙ | |||
40 41 42 43 44 45 46 | #dialog > iframe { width: 90%; height: 90%; border: none; box-shadow: 0px 0px 5px #000; } | | | > > > > > > | 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 | #dialog > iframe { width: 90%; height: 90%; border: none; box-shadow: 0px 0px 5px #000; } #dialog > button.closeBtn { background: unset; border: unset; box-shadow: unset; color: #fff; font-size: 1.3em; display: block; width: 90%; } #dialog > button.closeBtn:hover { color: #999 !important; } .loader { width: 100%; min-height: 32px; display: block; position: relative; } |
︙ | ︙ |