diff --git a/.xdp-.goutputstream-83IF62-YJjfSA b/.xdp-.goutputstream-83IF62-YJjfSA new file mode 100644 index 0000000..557f5fb Binary files /dev/null and b/.xdp-.goutputstream-83IF62-YJjfSA differ diff --git a/README.md b/README.md index bf0cca1..553c85e 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,6 @@ # moan-audio-link -É uma espécie de "qr code" sonoro. Neste app, você pode gerar um código sonoro a partir de um link e, depois neste mesmo app, ouvir esse código e ir automaticamente para o link. +Gere e escute códigos sonoros que funcionam como qr 'codes sonoros'. Neste app, você pode gerar um código sonoro a partir de um link e, depois neste mesmo app, ouvir esse código e ir automaticamente para o link. Este app é inteiramente baseado em: . diff --git a/estilo.css b/estilo.css index 4619533..2bd2195 100644 --- a/estilo.css +++ b/estilo.css @@ -49,7 +49,11 @@ a.nav-link { align-items: center; justify-content: space-around; box-sizing: border-box; - margin-bottom: 60px; + margin-bottom: 15px; +} + +div#capturaSetor { + margin-bottom: 40px; } #gerarSetor div { @@ -59,12 +63,14 @@ a.nav-link { align-items: center; justify-content: space-around; box-sizing: border-box; - margin-bottom: 60px; + margin-bottom: 5px; } #listeningIcon { visibility: hidden; margin-right: 5px; + height: 40px; + vertical-align: middle; } .spinner { @@ -124,8 +130,35 @@ p, label { color: #fff; } -h1 img { - height: 2em; +/* Esconde o radio original */ +input[type="radio"] { + appearance: none; + -webkit-appearance: none; + -moz-appearance: none; + width: 14px; + height: 14px; + border: 1px solid white; + border-radius: 50%; + background-color: transparent; + cursor: pointer; + position: relative; + transition: border-color 0.2s ease; +} + +/* Quando checado, mostra uma bolinha branca no centro */ +input[type="radio"]:checked::before { + content: ""; + position: absolute; + top: 2px; + left: 2px; + width: 8px; + height: 8px; + background-color: white; + border-radius: 50%; +} + +img { + height: 10em; vertical-align: middle; margin-right: 5px; } diff --git a/icon-192.png b/icon-192.png new file mode 100644 index 0000000..55ce8cc Binary files /dev/null and b/icon-192.png differ diff --git a/icon-512.png b/icon-512.png new file mode 100644 index 0000000..557f5fb Binary files /dev/null and b/icon-512.png differ diff --git a/index.html b/index.html index 43ffafd..dd313d8 100644 --- a/index.html +++ b/index.html @@ -3,6 +3,8 @@ Moan Áudio Link + + @@ -11,8 +13,8 @@ + Ícone De uma orelha ouvindo um qr code

- Ícone De uma orelha ouvindo um qr code Moan Áudio Link

@@ -331,5 +333,16 @@ captureStop.click(); + + + + diff --git a/manifest.json b/manifest.json new file mode 100644 index 0000000..652c846 --- /dev/null +++ b/manifest.json @@ -0,0 +1,29 @@ +{ + "name": "Moan Áudio Link", + "short_name": "ÁudioLink", + "start_url": "./", + "display": "standalone", + "orientation": "portrait", + "background_color": "#ffffff", + "theme_color": "#000000", + "description": "Gere e escute códigos sonoros que funcionam como qr 'codes sonoros'.", + "icons": [ + { + "src": "icon-192.png", + "sizes": "192x192", + "type": "image/png" + }, + { + "src": "icon-512.png", + "sizes": "512x512", + "type": "image/png" + }, + { + "src": "AudioLinkIcon.svg", + "sizes": "any", + "type": "image/svg+xml", + "purpose": "any" + } + ] + } + \ No newline at end of file diff --git a/service-worker.js b/service-worker.js new file mode 100644 index 0000000..80e754b --- /dev/null +++ b/service-worker.js @@ -0,0 +1,14 @@ +self.addEventListener('install', (event) => { + console.log('[ServiceWorker] Instalando...'); + self.skipWaiting(); + }); + + self.addEventListener('activate', (event) => { + console.log('[ServiceWorker] Ativo'); + }); + + self.addEventListener('fetch', (event) => { + // No cache offline ainda, apenas responde as requisições normalmente + return; + }); + \ No newline at end of file