diff --git a/QUICK-FIX-SCROLLING.txt b/QUICK-FIX-SCROLLING.txt new file mode 100644 index 0000000..d414225 --- /dev/null +++ b/QUICK-FIX-SCROLLING.txt @@ -0,0 +1,48 @@ +QUICK FIX: Enable Auto-Scrolling +================================= + +The CSS animation might not be working. Here's how to enable JavaScript auto-scroll: + +METHOD 1: Browser Console (Works Immediately) +---------------------------------------------- +1. The dashboard should be open in Firefox (kiosk mode) +2. Since you're in kiosk mode, you might need to: + - Press Alt to show menu, or + - Use a keyboard if available, or + - SSH in and use xdotool to send F12 + +3. Once console is open, paste this JavaScript: + +let currentIndex = 0; +const cards = Array.from(document.querySelectorAll('ha-card')); +const scrollInterval = 5000; + +cards.forEach(card => card.style.minHeight = window.innerHeight + 'px'); + +function nextCard() { + currentIndex = (currentIndex + 1) % cards.length; + cards[currentIndex].scrollIntoView({ behavior: 'smooth', block: 'start' }); +} + +setInterval(nextCard, scrollInterval); +window.scrollTo({ top: 0, behavior: 'smooth' }); + +METHOD 2: Create a Bookmarklet +------------------------------- +Create a bookmark with this URL (as a bookmarklet): +javascript:(function(){let c=Array.from(document.querySelectorAll('ha-card'));c.forEach(card=>card.style.minHeight=window.innerHeight+'px');let i=0;setInterval(()=>{i=(i+1)%c.length;c[i].scrollIntoView({behavior:'smooth',block:'start'})},5000);window.scrollTo({top:0,behavior:'smooth'})})(); + +METHOD 3: Update Dashboard YAML +-------------------------------- +The dashboard YAML has the styling for larger text. Make sure you've: +1. Copied the updated YAML to Home Assistant +2. Saved it +3. Refreshed the page + +The larger fonts should work even without scrolling. + +To check if the YAML was updated: +- Look at the text size - it should be MUCH bigger now +- Cards should take up full screen height + +If text is still small, the YAML wasn't updated in Home Assistant yet.