Center logo

static/app.js

@@ -53,7 +53,6 @@ els('[data-icon]').forEach((svg) => paintIcon(svg, ICONS[svg.dataset.icon]));
 const ui = {
   foot: el('[data-role="foot"]'),
   toast: el('[data-role="toast"]'),
-  refresh: el('[data-role="refresh"]'),
   avrStatus: el('[data-role="avr-status"]'),
   inputButton: el('[data-role="input-button"]'),
   inputName: el('[data-role="input-name"]'),
@@ -719,12 +718,6 @@ function busy() {
     || Object.values(rooms).some((r) => r.taps || r.inflight || r.dragging || r.busy || r.playBusy || seeking(r));
 }
 
-ui.refresh.addEventListener('click', () => {
-  ui.refresh.classList.add('spin');
-  setTimeout(() => ui.refresh.classList.remove('spin'), 700);
-  refresh();
-});
-
 setInterval(() => {
   if (document.visibilityState === 'visible' && !busy()) refresh();
 }, POLL_MS);

static/panel.css

@@ -65,19 +65,10 @@ svg { width: 22px; height: 22px; fill: currentColor; }
 .app > .on-top { order: -1; }
 
 /* --- header ---------------------------------------------------------- */
-.top { order: -2; display: flex; align-items: center; justify-content: space-between; padding: 6px 4px 0; }
+.top { order: -2; display: flex; align-items: center; justify-content: center; padding: 6px 4px 0; }
 .top h1 { margin: 0; line-height: 0; }
 .top .logo { height: 34px; width: auto; display: block; }
 
-.icon-button {
-  width: 44px; height: 44px; border-radius: 50%;
-  display: grid; place-items: center;
-  color: var(--muted); background: var(--card);
-}
-.icon-button:active { background: var(--raised); color: var(--ink); }
-.icon-button.spin svg { animation: spin .7s linear; }
-@keyframes spin { to { transform: rotate(360deg); } }
-
 /* --- cards ----------------------------------------------------------- */
 .card {
   background: var(--card);