Use position:sticky for alert so it stays visible while scrolling
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -720,7 +720,7 @@ function gnizaToast(type, msg) {
|
|||||||
var el = document.createElement('div');
|
var el = document.createElement('div');
|
||||||
el.id = 'gniza-alert';
|
el.id = 'gniza-alert';
|
||||||
el.className = 'alert alert-' + type;
|
el.className = 'alert alert-' + type;
|
||||||
el.style.cssText = 'position:absolute;top:0;right:0;z-index:9999;max-width:480px;padding:12px 20px;border-radius:8px;font-size:14px;box-shadow:0 4px 12px rgba(0,0,0,.15);transition:opacity .3s';
|
el.style.cssText = 'position:sticky;top:12px;margin-left:auto;z-index:9999;max-width:480px;padding:12px 20px;border-radius:8px;font-size:14px;box-shadow:0 4px 12px rgba(0,0,0,.15);transition:opacity .3s';
|
||||||
el.textContent = msg;
|
el.textContent = msg;
|
||||||
container.appendChild(el);
|
container.appendChild(el);
|
||||||
setTimeout(function() { el.style.opacity = '0'; }, type === 'error' ? 6000 : 3000);
|
setTimeout(function() { el.style.opacity = '0'; }, type === 'error' ? 6000 : 3000);
|
||||||
|
|||||||
@@ -322,7 +322,7 @@ function gnizaToast(type, msg) {
|
|||||||
var el = document.createElement('div');
|
var el = document.createElement('div');
|
||||||
el.id = 'gniza-alert';
|
el.id = 'gniza-alert';
|
||||||
el.className = 'alert alert-' + type;
|
el.className = 'alert alert-' + type;
|
||||||
el.style.cssText = 'position:absolute;top:0;right:0;z-index:9999;max-width:480px;padding:12px 20px;border-radius:8px;font-size:14px;box-shadow:0 4px 12px rgba(0,0,0,.15);transition:opacity .3s';
|
el.style.cssText = 'position:sticky;top:12px;margin-left:auto;z-index:9999;max-width:480px;padding:12px 20px;border-radius:8px;font-size:14px;box-shadow:0 4px 12px rgba(0,0,0,.15);transition:opacity .3s';
|
||||||
el.textContent = msg;
|
el.textContent = msg;
|
||||||
container.appendChild(el);
|
container.appendChild(el);
|
||||||
setTimeout(function() { el.style.opacity = '0'; }, type === 'error' ? 6000 : 3000);
|
setTimeout(function() { el.style.opacity = '0'; }, type === 'error' ? 6000 : 3000);
|
||||||
|
|||||||
Reference in New Issue
Block a user