mirror of
https://codeberg.org/armin/noiz.git
synced 2026-09-01 05:50:52 +02:00
add logo overlay (fades out after 2sec)
This commit is contained in:
parent
748b52a773
commit
7c3de9fc7b
1 changed files with 17 additions and 0 deletions
17
index.html
17
index.html
|
|
@ -5,6 +5,16 @@
|
|||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>noiz://</title>
|
||||
<style>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
* { margin: 0; padding: 0; box-sizing: border-box; }
|
||||
body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; background: #111; color: #e0e0e0; height: 100vh; overflow: hidden; display: flex; flex-direction: column; }
|
||||
.btn { background: linear-gradient(to bottom, #3a3a3a, #282828); border: 1px solid #484848; color: #e0e0e0; padding: 6px 14px; border-radius: 6px; cursor: pointer; font-size: 12px; transition: background .1s, transform .1s, box-shadow .1s; white-space: nowrap; box-shadow: 0 3px 0 #181818, 0 4px 6px rgba(0,0,0,0.4); transform: translateY(0); }
|
||||
|
|
@ -35,6 +45,9 @@ canvas { width: 100%; height: 100px; border-radius: 6px; display: block; }
|
|||
.progress-row .progress-bar { flex: 1; height: 6px; background: #333; border-radius: 3px; cursor: pointer; }
|
||||
.progress-row .progress-bar .fill { height: 100%; background: #1a6df5; border-radius: 3px; width: 0%; }
|
||||
.progress-row .progress-bar:hover .fill { background: #3a8df5; }
|
||||
#noiz-overlay { position: fixed; inset: 0; display: flex; justify-content: center; align-items: center; background: transparent; pointer-events: none; z-index: 9999; animation: fadeout 1s ease 2s forwards; }
|
||||
#noiz-overlay img { max-width: 50vw; max-height: 50vh; }
|
||||
@keyframes fadeout { from { opacity: 1; } to { opacity: 0; visibility: hidden; } }
|
||||
#timeRemaining { color: #555; }
|
||||
#vuMeter { width: 100%; height: 20px; border-radius: 2px; display: block; }
|
||||
.controls { display: flex; align-items: center; gap: 16px; align-self: flex-end; }
|
||||
|
|
@ -98,6 +111,10 @@ footer .footer-track { flex: 1; min-width: 0; white-space: nowrap; overflow: hid
|
|||
</head>
|
||||
<body>
|
||||
|
||||
<div id="noiz-overlay">
|
||||
<img src="noizmainlogo.png" alt="noiz://">
|
||||
</div>
|
||||
|
||||
<div id="error"></div>
|
||||
<input type="file" id="folderPicker" webkitdirectory multiple style="display:none">
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue