Add support for positioning the QR code element by introducing a new qrOffset URL parameter. The parameter controls the bottom and right positioning of the QR code with a default value of 20px if not specified. This allows for better control over the QR code placement in the layout.
- Define CSS variable for background image in root element
- Create updateBackgroundImage function to sync background with main image
- Modify refreshImage to update both main and background images
- Maintain consistent gradient overlay for both images
- Keep existing 5-minute refresh interval
The change adds a dark semi-transparent gradient overlay to the background
image to improve text readability. This creates better contrast between
the foreground content and background image while maintaining visibility
of the underlying image.
- Position the main container relatively to allow absolute positioning of background
- Add pseudo-element with background image, blur effect and scaling
- Ensure main image stays above background with z-index
- Improve visual appeal while maintaining focus on primary content
- Add favicon with TV emoji to match project name
- Rename page title to project name 'memes-tv'
- Expand click-to-refresh functionality to entire page
- Add spacebar shortcut for refreshing images
- Prevent default spacebar behavior to avoid page scrolling
