diff --git a/website/app.js b/website/app.js index 3a5fa7e..31fd2a4 100644 --- a/website/app.js +++ b/website/app.js @@ -1,6 +1,14 @@ // KoalaSync Landing Page Logic document.addEventListener('DOMContentLoaded', () => { + const siteAccessBanner = document.querySelector('.site-access-banner'); + const siteAccessBannerDismiss = document.querySelector('.site-access-banner-dismiss'); + if (siteAccessBanner && siteAccessBannerDismiss) { + siteAccessBannerDismiss.addEventListener('click', () => { + siteAccessBanner.hidden = true; + }); + } + // Mockup Video Title Randomization on Load const SERIES_NAMES = [ 'Stranger Things', diff --git a/website/locales/de.json b/website/locales/de.json index ee5eb3a..be323ed 100644 --- a/website/locales/de.json +++ b/website/locales/de.json @@ -16,6 +16,7 @@ "NAV_HOW_IT_WORKS": "So funktioniert's", "SUPPORT_BANNER_TEXT": "KoalaSync kann nicht auf deine Videoseite zugreifen?", "SUPPORT_BANNER_CTA": "Websitezugriff reparieren", + "SUPPORT_BANNER_DISMISS": "Hinweis schließen", "HERO_TITLE": "Mach jedes Video zur Watch Party.", "HERO_SUBTITLE": "Dein Kino-Abend auf Distanz, ohne Lags. Kein Account, kein Tracking, keine Werbung. Einfach Link teilen und gemeinsam Play drücken.", "HERO_MASCOT_ALT": "Ein niedlicher Koala steht da und schaut nach unten auf die Download-Buttons", diff --git a/website/locales/en.json b/website/locales/en.json index 1028902..818ac01 100644 --- a/website/locales/en.json +++ b/website/locales/en.json @@ -16,6 +16,7 @@ "NAV_HOW_IT_WORKS": "How it works", "SUPPORT_BANNER_TEXT": "KoalaSync cannot access your video site?", "SUPPORT_BANNER_CTA": "Fix website access", + "SUPPORT_BANNER_DISMISS": "Dismiss notification", "HERO_TITLE": "Turn any video into a watch party.", "HERO_SUBTITLE": "Your remote movie night without lags. No account, no tracking, no ads. Just share a link and press play together.", "HERO_MASCOT_ALT": "A cute koala standing and looking down at the download buttons", diff --git a/website/locales/es.json b/website/locales/es.json index 13f70ba..607ec0b 100644 --- a/website/locales/es.json +++ b/website/locales/es.json @@ -16,6 +16,7 @@ "NAV_HOW_IT_WORKS": "Cómo funciona", "SUPPORT_BANNER_TEXT": "¿KoalaSync no puede acceder al sitio del vídeo?", "SUPPORT_BANNER_CTA": "Reparar acceso al sitio", + "SUPPORT_BANNER_DISMISS": "Cerrar aviso", "HERO_TITLE": "Convierte cualquier vídeo en una watch party.", "HERO_SUBTITLE": "Tu noche de cine a distancia, sin retrasos. Sin cuenta, sin rastreo, sin anuncios. Comparte un enlace y dale al play juntos.", "HERO_MASCOT_ALT": "Un lindo koala de pie mirando hacia abajo a los botones de descarga", diff --git a/website/locales/fr.json b/website/locales/fr.json index 5a6aa01..db2923a 100644 --- a/website/locales/fr.json +++ b/website/locales/fr.json @@ -16,6 +16,7 @@ "NAV_HOW_IT_WORKS": "Comment ça marche", "SUPPORT_BANNER_TEXT": "KoalaSync n’accède pas à votre site vidéo ?", "SUPPORT_BANNER_CTA": "Réparer l’accès au site", + "SUPPORT_BANNER_DISMISS": "Fermer l’avertissement", "HERO_TITLE": "Transformez n'importe quelle vidéo en watch party.", "HERO_SUBTITLE": "Votre soirée ciné à distance, sans décalage. Pas de compte, pas de tracking, pas de pub. Partagez un lien et lancez la lecture ensemble.", "HERO_MASCOT_ALT": "Un koala mignon debout et regardant vers le bas les boutons de téléchargement", diff --git a/website/locales/it.json b/website/locales/it.json index 87424f2..ed08769 100644 --- a/website/locales/it.json +++ b/website/locales/it.json @@ -16,6 +16,7 @@ "NAV_HOW_IT_WORKS": "Come Funziona", "SUPPORT_BANNER_TEXT": "KoalaSync non riesce ad accedere al sito video?", "SUPPORT_BANNER_CTA": "Ripristina l’accesso al sito", + "SUPPORT_BANNER_DISMISS": "Chiudi avviso", "HERO_TITLE": "Trasforma qualsiasi video in una watch party.", "HERO_SUBTITLE": "La tua serata film a distanza, senza lag. Niente account, niente tracciamento, niente pubblicità. Condividi un link e premete play insieme.", "HERO_MASCOT_ALT": "Un simpatico koala che guarda i pulsanti di download", diff --git a/website/locales/ja.json b/website/locales/ja.json index 19e7bea..9df4a0e 100644 --- a/website/locales/ja.json +++ b/website/locales/ja.json @@ -16,6 +16,7 @@ "NAV_HOW_IT_WORKS": "仕組み", "SUPPORT_BANNER_TEXT": "KoalaSync が動画サイトにアクセスできませんか？", "SUPPORT_BANNER_CTA": "サイトアクセスを修復", + "SUPPORT_BANNER_DISMISS": "通知を閉じる", "HERO_TITLE": "どんな動画もウォッチパーティーに。", "HERO_SUBTITLE": "離れていても一緒に映画ナイト。アカウント不要、トラッキングなし、広告なし。リンクを共有して、一緒に再生するだけ。", "HERO_MASCOT_ALT": "ダウンロードボタンを見下ろしているかわいいコアラ", diff --git a/website/locales/ko.json b/website/locales/ko.json index 6434372..06bca60 100644 --- a/website/locales/ko.json +++ b/website/locales/ko.json @@ -16,6 +16,7 @@ "NAV_HOW_IT_WORKS": "작동 방식", "SUPPORT_BANNER_TEXT": "KoalaSync가 동영상 사이트에 액세스할 수 없나요?", "SUPPORT_BANNER_CTA": "사이트 액세스 복구", + "SUPPORT_BANNER_DISMISS": "알림 닫기", "HERO_TITLE": "어떤 영상이든 워치 파티로.", "HERO_SUBTITLE": "지연 없는 원격 영화의 밤. 계정 없음, 추적 없음, 광고 없음. 링크만 공유하고 함께 재생하세요.", "HERO_MASCOT_ALT": "다운로드 버튼을 내려다보고 서 있는 귀여운 코알라", diff --git a/website/locales/nl.json b/website/locales/nl.json index 41a8a6d..ff21ac5 100644 --- a/website/locales/nl.json +++ b/website/locales/nl.json @@ -16,6 +16,7 @@ "NAV_HOW_IT_WORKS": "Hoe het werkt", "SUPPORT_BANNER_TEXT": "Heeft KoalaSync geen toegang tot je videosite?", "SUPPORT_BANNER_CTA": "Websitetoegang herstellen", + "SUPPORT_BANNER_DISMISS": "Melding sluiten", "HERO_TITLE": "Maak van elke video een watch party.", "HERO_SUBTITLE": "Jouw filmavond op afstand, zonder vertraging. Geen account, geen tracking, geen advertenties. Deel een link en druk samen op play.", "HERO_MASCOT_ALT": "Een schattige koala die staat en naar beneden kijkt naar de downloadknoppen", diff --git a/website/locales/pl.json b/website/locales/pl.json index 2d2ab69..06fef2b 100644 --- a/website/locales/pl.json +++ b/website/locales/pl.json @@ -16,6 +16,7 @@ "NAV_HOW_IT_WORKS": "Jak to działa", "SUPPORT_BANNER_TEXT": "KoalaSync nie ma dostępu do strony z filmem?", "SUPPORT_BANNER_CTA": "Napraw dostęp do strony", + "SUPPORT_BANNER_DISMISS": "Zamknij powiadomienie", "HERO_TITLE": "Zamień dowolne wideo w watch party.", "HERO_SUBTITLE": "Twój zdalny wieczór filmowy bez opóźnień. Bez konta, bez śledzenia, bez reklam. Udostępnij link i naciśnijcie play razem.", "HERO_MASCOT_ALT": "Uroczy koala stojący i patrzący w dół na przyciski pobierania", diff --git a/website/locales/pt-BR.json b/website/locales/pt-BR.json index 1906f5d..bd4b41d 100644 --- a/website/locales/pt-BR.json +++ b/website/locales/pt-BR.json @@ -16,6 +16,7 @@ "NAV_HOW_IT_WORKS": "Como Funciona", "SUPPORT_BANNER_TEXT": "O KoalaSync não consegue acessar o site do vídeo?", "SUPPORT_BANNER_CTA": "Corrigir acesso ao site", + "SUPPORT_BANNER_DISMISS": "Fechar aviso", "HERO_TITLE": "Transforme qualquer vídeo em uma watch party.", "HERO_SUBTITLE": "Sua sessão de cinema à distância, sem atrasos. Sem conta, sem rastreamento, sem anúncios. Compartilhe um link e deem play juntos.", "HERO_MASCOT_ALT": "Um coala fofo olhando para os botões de download", diff --git a/website/locales/pt.json b/website/locales/pt.json index 7567526..773cab9 100644 --- a/website/locales/pt.json +++ b/website/locales/pt.json @@ -16,6 +16,7 @@ "NAV_HOW_IT_WORKS": "Como Funciona", "SUPPORT_BANNER_TEXT": "O KoalaSync não consegue aceder ao site do vídeo?", "SUPPORT_BANNER_CTA": "Corrigir acesso ao site", + "SUPPORT_BANNER_DISMISS": "Fechar aviso", "HERO_TITLE": "Transforma qualquer vídeo numa watch party.", "HERO_SUBTITLE": "A tua noite de cinema à distância, sem atrasos. Sem conta, sem rastreio, sem anúncios. Partilha um link e carreguem no play juntos.", "HERO_MASCOT_ALT": "Um coala fofo a olhar para os botões de download", diff --git a/website/locales/ru.json b/website/locales/ru.json index a8eb060..50657a1 100644 --- a/website/locales/ru.json +++ b/website/locales/ru.json @@ -16,6 +16,7 @@ "NAV_HOW_IT_WORKS": "Как это работает", "SUPPORT_BANNER_TEXT": "KoalaSync не может получить доступ к сайту с видео?", "SUPPORT_BANNER_CTA": "Исправить доступ к сайту", + "SUPPORT_BANNER_DISMISS": "Закрыть уведомление", "HERO_TITLE": "Преврати любое видео в watch party.", "HERO_SUBTITLE": "Ваш киновечер на расстоянии, без задержек. Без аккаунта, без слежки, без рекламы. Просто поделитесь ссылкой и нажмите play вместе.", "HERO_MASCOT_ALT": "Милый коала стоит и смотрит вниз на кнопки загрузки", diff --git a/website/locales/tr.json b/website/locales/tr.json index 55506c5..7e515ec 100644 --- a/website/locales/tr.json +++ b/website/locales/tr.json @@ -16,6 +16,7 @@ "NAV_HOW_IT_WORKS": "Nasıl Çalışır", "SUPPORT_BANNER_TEXT": "KoalaSync video sitesine erişemiyor mu?", "SUPPORT_BANNER_CTA": "Site erişimini düzelt", + "SUPPORT_BANNER_DISMISS": "Bildirimi kapat", "HERO_TITLE": "Herhangi bir videoyu watch party'ye dönüştür.", "HERO_SUBTITLE": "Gecikmesiz uzaktan film gecen. Hesap yok, takip yok, reklam yok. Sadece bir bağlantı paylaş ve birlikte oynatın.", "HERO_MASCOT_ALT": "İndirme düğmelerine bakan sevimli bir koala", diff --git a/website/locales/uk.json b/website/locales/uk.json index 4912b53..f11f04a 100644 --- a/website/locales/uk.json +++ b/website/locales/uk.json @@ -16,6 +16,7 @@ "NAV_HOW_IT_WORKS": "Як це працює", "SUPPORT_BANNER_TEXT": "KoalaSync не має доступу до сайту з відео?", "SUPPORT_BANNER_CTA": "Виправити доступ до сайту", + "SUPPORT_BANNER_DISMISS": "Закрити сповіщення", "HERO_TITLE": "Перетвори будь-яке відео на watch party.", "HERO_SUBTITLE": "Ваш кіновечір на відстані, без затримок. Без акаунта, без стеження, без реклами. Просто поділіться посиланням і натисніть play разом.", "HERO_MASCOT_ALT": "Мила коала стоїть і дивиться вниз на кнопки завантаження", diff --git a/website/locales/zh.json b/website/locales/zh.json index cfe3e44..6a06ec8 100644 --- a/website/locales/zh.json +++ b/website/locales/zh.json @@ -16,6 +16,7 @@ "NAV_HOW_IT_WORKS": "它是如何运作的", "SUPPORT_BANNER_TEXT": "KoalaSync 无法访问视频网站？", "SUPPORT_BANNER_CTA": "修复网站访问权限", + "SUPPORT_BANNER_DISMISS": "关闭提示", "HERO_TITLE": "把任意视频变成一起看派对。", "HERO_SUBTITLE": "远程电影之夜，毫无延迟。无需账号、无跟踪、无广告。分享链接，一起播放。", "HERO_MASCOT_ALT": "一只可爱的考拉站着，低头看着下载按钮", diff --git a/website/site-access-help.html b/website/site-access-help.html index e799155..0518e90 100644 --- a/website/site-access-help.html +++ b/website/site-access-help.html @@ -101,12 +101,13 @@
  • If needed, open KoalaSync’s extension details and change site access to On this site or On all sites.
  • Reload the video tab and select it again in KoalaSync.
    • -

    Google’s official site-access instructions

    +

    Google’s official explanation of the new access menu

    Firefox

    Check extension permissions

    +

    Firefox does not use Chrome’s new access menu. Follow these steps only if Firefox reports that KoalaSync lacks website access.

    1. Open Add-ons and themes, then select Extensions.
    2. Open KoalaSync and select Permissions or Permissions and data.
      3. diff --git a/website/styles/foundation.css b/website/styles/foundation.css index 6f6faae..78638d4 100644 --- a/website/styles/foundation.css +++ b/website/styles/foundation.css @@ -109,6 +109,7 @@ nav.nav-scrolled + .site-access-banner { } .site-access-banner-inner { + position: relative; min-height: 50px; display: flex; align-items: center; @@ -118,6 +119,8 @@ nav.nav-scrolled + .site-access-banner { font-size: 0.9rem; font-weight: 650; text-align: center; + padding-right: 4rem; + padding-left: 4rem; } .site-access-banner-icon { @@ -148,6 +151,29 @@ nav.nav-scrolled + .site-access-banner { color: var(--text); } +.site-access-banner-dismiss { + position: absolute; + right: 2rem; + top: 50%; + transform: translateY(-50%); + display: inline-grid; + place-items: center; + width: 2rem; + height: 2rem; + padding: 0; + border: 0; + border-radius: 999px; + background: transparent; + color: var(--text-muted); + cursor: pointer; +} + +.site-access-banner-dismiss:hover, +.site-access-banner-dismiss:focus-visible { + background: color-mix(in oklch, var(--accent) 18%, transparent); + color: var(--text); +} + @media (max-width: 768px) { .site-access-banner { top: 73px; @@ -159,7 +185,7 @@ nav.nav-scrolled + .site-access-banner { .site-access-banner-inner { min-height: 64px; - padding-block: 0.65rem; + padding: 0.65rem 3rem 0.65rem 1rem; gap: 0.5rem; flex-wrap: wrap; font-size: 0.8rem; @@ -170,6 +196,10 @@ nav.nav-scrolled + .site-access-banner { height: 1.3rem; font-size: 0.75rem; } + + .site-access-banner-dismiss { + right: 0.75rem; + } } * { diff --git a/website/template.html b/website/template.html index aaf39d5..6ff6762 100644 --- a/website/template.html +++ b/website/template.html @@ -367,6 +367,12 @@ {{SUPPORT_BANNER_CTA}} +