UI: Redesign CollapsibleAlert and improve HTML text styling

[ksharma-xyz]

TL;DR

Enhanced the visual appearance and functionality of service alerts in the trip planner UI.

What changed?

• Redesigned the CollapsibleAlert component with a semi-transparent background and rounded corners
• Added a "Read More" button for collapsed alerts
• Updated HtmlText component to support customizable text and URL colors
• Improved text alignment and spacing in alert displays
• Enhanced contrast between background and foreground colors for better readability

How to test?

1. Navigate to the trip planner service alerts screen
2. Verify alerts display with semi-transparent backgrounds
3. Check that collapsed alerts show a "Read More" button
4. Confirm text is readable and properly aligned
5. Test that HTML links are properly colored and clickable
6. Verify alerts expand/collapse smoothly when tapped

Why make this change?

To improve the user experience by making service alerts more visually appealing and easier to read. The addition of the "Read More" button makes it clearer that alerts are expandable, while the enhanced color contrast ensures better accessibility.

[ksharma-xyz]

• UI: Redesign journey card alerts and spacing #377
• UI: Redesign CollapsibleAlert and improve HTML text styling #376 👈 (View in Graphite)
• UI: Add loading state to saved trips screen #375
• Add Settings Screen #374
• main

This stack of pull requests is managed by Graphite. Learn more about stacking.

[ksharma-xyz]

Merge activity

• Nov 24, 5:18 PM EST: A user merged this pull request with Graphite.