- Added console logging to track truncation logic
- Changed layout to inline elements with explicit display
- Added margin-left to separate link from text
- Simplified overflow handling
- Changed overview from line-clamp to flex layout
- Split text and link into separate inline elements
- Link now wraps naturally and stays visible within 58px height
- Maintains card alignment
- Re-enabled line-clamp: 3 for consistent 3-line display
- Reduced truncation from 150 to 120 chars so See More fits inline
- Link now appears at end of 3rd line within the clamp area
Issue: line-clamp was hiding the 'See More' link
Solution: Remove line-clamp, let text truncate naturally at 150 chars
with 'See More' link visible at the end
The fixed height (58px) still ensures consistent card alignment.
Changes:
- Notification now visible for 4 seconds before fade out starts
- Added slideOut animation (0.3s) for smooth exit
- Total display time: 4.3 seconds (much more readable)
- Prevents premature dismissal of success/error messages
Previous issue: Users couldn't read messages (disappeared too quickly)
Changed availability-status height from 38px to 42px
and padding from 8px to 10px (top/bottom).
Fixes 'bunched' appearance on 'Available to request' text,
giving more breathing room for all status badges.
Fixed heights for all card elements:
- Title: 42px (2 lines max with line-clamp)
- Overview: 58px (3 lines with line-clamp)
- Meta section: 20px fixed height
- Availability status: 38px (changed from min-height to height)
- Request section: 46px
- Request button: 42px
Also reduced font sizes slightly for better proportions:
- Title: 18px → 16px
- Meta: 14px → 13px
Result: Absolutely perfect alignment across all cards in every row
Card Alignment Improvements:
- Added grid-auto-rows: 1fr for perfectly equal row heights
- Descriptions now use line-clamp (3 lines max, 58px fixed height)
- All cards in same row now exactly same height
- Eliminated uneven appearance completely
Instance Selector UX:
- Added pulsing green glow animation to unselected dropdown
- Animation draws user attention to required selection
- Glow automatically disappears once instance is selected
- Uses CSS keyframes animation (pulseGlow) with green ring
- Makes onboarding intuitive and obvious
Result: Professional, uniform card grid with clear user guidance
Changes:
- Cards now use flexbox (flex-direction: column) for consistent height
- Description area has min-height (60px) to prevent varying heights
- Availability status has min-height (38px) for uniform badge sizes
- Request buttons now full width and pushed to bottom with margin-top: auto
- All cards now have identical bottom section alignment
- Result: Clean, uniform appearance regardless of content length
Fixes visual inconsistency where cards had different heights
due to varying description and status text lengths.
Changes:
- Reduced card minimum width from 350px to 220px for more cards per row
- Grid now truly responsive: more cards fit as browser expands
- Modal text now left-aligned instead of centered
- Close button smaller (8px/16px padding) and positioned below content
- Close button right-aligned using flexbox (align-self: flex-end)
- Reduced gap between cards from 20px to 16px
- Mobile: Close button spans full width for easier tapping
Result: Cleaner, more compact layout with better space utilization
Changes:
- Added 'See More' link for long descriptions (>150 chars)
- Implemented modal popup with full description text
- Modal features: blurred background, smooth animations, close button with icon
- Fixed poster image aspect ratio from fixed height to proper 2:3 ratio
- Changed object-fit from 'cover' to 'contain' to show full posters
- Added ESC key support to close modal
- Responsive design for mobile devices
Frontend improvements enhance UX by preventing text cutoff
and ensuring movie/TV posters display in correct proportions.
- Updated CSS for the Requestarr module to improve visual aesthetics with new gradients, borders, and shadows.
- Removed the Recent Requests section from the HTML template to streamline the interface and focus on core functionalities.
- Renamed CSS classes and IDs from Requestor to Requestarr for consistency.
- Updated JavaScript to reflect the new Requestarr section and its functionalities.
- Modified HTML templates to include the Requestarr section and adjusted related elements.
- Enhanced image handling in the Requestarr module with a placeholder for missing posters.
- Improved logging for request actions to aid in debugging and user feedback.
- Removed the Requestor module and replaced it with the Requestarr module, including all associated files and functionality.
- Updated frontend templates and JavaScript to reflect the new Requestarr naming convention.
- Adjusted database schema to create new tables for Requestarr settings and requests.
- Enhanced the web server and blueprints to register the new Requestarr routes and API endpoints.
- Improved navigation and UI elements to support the transition from Requestor to Requestarr.
