Adjust “What's new” modal UI and items for tablet

[catalinradoiu]

Task/Issue URL: https://app.asana.com/1/137249556945/project/1211724162604201/task/1212898863116333?focus=true

Description

This PR improves the “What’s new” modal UI for tablet devices by:

• Adding a maximum width constraint (600dp) to message components to prevent excessive stretching on larger screens
• Creating responsive margins with different values for phones and tablets
• Extracting dimension values to dedicated resource files for better maintainability

Steps to test this PR

Check the steps inside the following task to the the changes: https://app.asana.com/1/137249556945/project/1211724162604201/task/1213012607800059?focus=true

UI changes

Before changes

Phone	Tablet
whats_new_phone_before_changes.mp4 (uploaded via Graphite)	whats_new_tablet_before_changes.mp4 (uploaded via Graphite)

|

After changes

Phone	Tablet
whats_new_phone.mp4 (uploaded via Graphite)	whats_new_tablet_changes.mp4 (uploaded via Graphite)

---

Note

Improves layout scalability of the “What’s new” modal, especially on tablets.

• Caps content width via messageContentMaxWidth (600dp) and applies it to header, section title, featured card, and list items
• Introduces size-specific dimensions (values and values-sw600dp) to adjust margins/padding (e.g., actionButtonHorizontalMargin, featured item spacing)
• Refactors item layouts to center content within constrained containers (e.g., new listItemContainer in card items; restructured featured card and header wrappers)
• Updates click handling to use listItemContainer instead of root in CardsListAdapter

^{Written by Cursor Bugbot for commit c3f50b4. This will update automatically on new commits. Configure here.}

[catalinradoiu]

Warning

This pull request is not mergeable via GitHub because a downstack PR is open. Once all requirements are satisfied, merge this PR as a stack on Graphite.
Learn more

• Adjust “What's new” modal UI and items for tablet #7605 👈 (View in Graphite)
• Add the top section of the "what's new modal" (title and top image) as items in the RecyclerView so that the entire content is scrollable #7588
• develop

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

[cursor]

Cursor Bugbot has reviewed your changes and found 2 potential issues.

[cursor]

Inner card padding uses wrong dimension resource

Medium Severity

The inner ConstraintLayout's paddingBottom was changed from @dimen/keyline_2 (8dp) to @dimen/featuredListItemBottomMargin. This dimension is meant for spacing between list items (used correctly on the outer wrapper at line 25), not for internal card content padding. On tablets this results in 40dp of internal bottom padding instead of 8dp, creating excessive whitespace inside the featured card. The inner padding likely needs to remain at @dimen/keyline_2.

---

_{Please tell me if this was useful or not with a 👍 or 👎.}

 

[catalinradoiu]

This is according to the Figma design.

[cursor]

Action button missing max width constraint for tablet consistency

Low Severity

The actionButton is missing app:layout_constraintWidth_max="@dimen/messageContentMaxWidth" that was added to all other message components in this PR. On large tablets/foldables (e.g., 1200dp width), the list items above will be constrained to 600dp and centered, while the button stretches to approximately 1080dp, creating visual inconsistency. This appears to be an oversight given the PR's stated goal of adding max width constraints to prevent excessive stretching.

---

_{Please tell me if this was useful or not with a 👍 or 👎.}

 

[catalinradoiu]

This is according to the Figma design.