Compact responsive mini-player UI redesign

[rajesh-puripanda]

Compact responsive mini-player UI redesign

Replaces the floating like/dislike pill with a full compact mini-player bar at the bottom of the screen.

Changes

• New mini-player bar (#ytm-mini-bar) with album artwork, song title + artist, Previous/Play-Pause/Next controls, and integrated Like/Dislike buttons
• Progress bar at the top of the bar showing live playback progress
• Responsive layout that shrinks gracefully at 480px and 360px breakpoints (hides artist name, then hides prev/next, then hides like buttons)
• Hidden clutter in the expanded player page (side panel, description shelf, mealbar) when in mini-mode
• Removed the old draggable floating pill and its drag/drop logic
• Controls interact with native YTM hidden controls via programmatic clicks, preserving all original functionality

Closes #31

[Labreo]

Hi there,

Thank you for submitting this! Replacing the floating like/dislike pill with a full fixed bottom mini-player bar is a fantastic UX improvement. It makes the mini-player feel like a complete control dashboard.

Before we can merge this, please address the following issues:

Broken Test Suite: The test script test/manage-pill-bar.test.js is still querying managePillBar which was renamed/deleted. Please update the test script to test the manageMiniPlayerBar logic.
Duplicate Like Buttons on Song Change: In updateMiniPlayerBar, when a track changes and a new ytmusic-like-button-renderer is created, likeContainer.appendChild(primary) appends it without clearing the container first. This causes multiple like/dislike button rows to accumulate side-by-side. Please clear the container (e.g. using a while (likeContainer.firstChild) loop) before appending.
ID Duplication on Image Cloning: Cloning the image element via nativeThumb.cloneNode(true) copies the native id="img" element attribute into our custom bar. Please create a fresh element and copy the src attribute instead of cloning the node.
Progress Bar Polling: Since the update interval runs at 500ms, the progress bar animation is a bit stuttered. Consider caching the video element reference and listening to the native timeupdate event for smoother progress filling.
Once these changes are made, we'll run the builds and get this merged! Great work on this design.