diff options
Diffstat (limited to 'static')
-rw-r--r-- | static/alert-timeout.js | 21 | ||||
-rw-r--r-- | static/kys-link-info.js | 20 | ||||
-rw-r--r-- | static/kyselma.css | 15 |
3 files changed, 43 insertions, 13 deletions
diff --git a/static/alert-timeout.js b/static/alert-timeout.js index 6fe6def..e20106f 100644 --- a/static/alert-timeout.js +++ b/static/alert-timeout.js @@ -1,13 +1,8 @@ -Array.from(document.getElementsByClassName('kysAlert')).forEach( (a) => { - a.addEventListener('click', (event) => { - event.target.remove(); - }) - setTimeout( () => { - Array.from(document.getElementsByClassName('kysAlert')) - .forEach( (a) => { - if (a.style.transition=="opacity 2s") a.remove() - a.style.transition="opacity 2s" - a.style.opacity=0; - } ) - }, 5000) - }) +setInterval( () => { + Array.from(document.getElementsByClassName('kysAlert')).forEach( (a)=>{ + a.addEventListener('click', (event) => { event.target.remove() } ) + if (a.style.transition=="opacity 2s") a.remove() + a.style.transition="opacity 2s" + a.style.opacity=0; + } ) +}, 5000) diff --git a/static/kys-link-info.js b/static/kys-link-info.js new file mode 100644 index 0000000..f3165b2 --- /dev/null +++ b/static/kys-link-info.js @@ -0,0 +1,20 @@ +const kysLink = document.getElementById("kysLink") +kysLink.onclick = () => { + const link = kysLink.innerHTML + navigator.clipboard.writeText(link) + const linkInfo = document.createElement("div") + linkInfo.className = 'kysInfo' + const linkText = document.createTextNode( + "Linkki " + link + " on kopioitu leikepöydälle." ) + linkInfo.appendChild( linkText ) + document.documentElement.lastChild.append(linkInfo) +} + +setInterval( () => { + Array.from(document.getElementsByClassName('kysInfo')).forEach( (a)=>{ + a.addEventListener('click', (event) => { event.target.remove() } ) + if (a.style.transition=="opacity 2s") a.remove() + a.style.transition="opacity 2s" + a.style.opacity=0; + } ) +}, 5000) diff --git a/static/kyselma.css b/static/kyselma.css index 92f51ca..fdc3996 100644 --- a/static/kyselma.css +++ b/static/kyselma.css @@ -62,6 +62,21 @@ transform: translate(-50%, -50%); } +.kysInfo { + border: 0.4rem solid; + padding: 0.8rem; + display: block; + background-color: #55F; + border-top-color: #79F; + border-left-color: #69F; + border-right-color: #31F; + border-bottom-color: #41F; + position: fixed; + top: 50vh; + left: 50vw; + transform: translate(-50%, -50%); +} + .kysTotal { max-width: 25rem; min-width: max-content; |