Fix Personality card break on smaller screens on search page #1823
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description
SearchResults.tsx: Updated Grid container styles to prevent component breakage in mobile environments by setting flexWrap: "nowrap" to maintain elements on the same line and adding a 10px gap for consistent spacing.
Fixes #1709
Type of change
Testing
1. Be in a "small" environment with less than 768px, such as mobile;
2. Be logged in to the platform;
3. Enter the search page, if you are local http://localhost:3000/search;
4. Search for an existing personality.
Test Video
Screencast.from.18-02-2025.12.03.55.webm
Developer Checklist
General
console.log
or related logging is added.Frontend Changes
Tests
Merge Request Review Checklist