diff --git a/public/index.html b/public/index.html index 603e28c..c7683ea 100644 --- a/public/index.html +++ b/public/index.html @@ -27,7 +27,7 @@ type="button" hidden > - Start synced playback + Click here to consoom diff --git a/public/styles.css b/public/styles.css index 0414a62..542cf19 100644 --- a/public/styles.css +++ b/public/styles.css @@ -220,13 +220,30 @@ button[aria-pressed="false"] { .youtube-start-button { position: absolute; - left: 50%; - bottom: 18px; + inset: 0; z-index: 2; - width: auto; - min-width: 180px; - transform: translateX(-50%); - box-shadow: 0 12px 28px rgba(0, 0, 0, 0.38); + width: 100%; + height: 100%; + min-width: 0; + border-radius: 0; + background: rgba(128, 128, 128, 0.88); + color: #ffffff; + font-size: clamp(32px, 8vw, 86px); + font-weight: 800; + text-transform: uppercase; + animation: blink-visibility 1s steps(1, end) infinite; +} + +@keyframes blink-visibility { + 0%, + 49% { + opacity: 1; + } + + 50%, + 100% { + opacity: 0; + } } .watch-resize-handle {