fix: improve UI consistency in codebase indexing popover #7041
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
![roomote[bot]](https://avatars.githubusercontent.com/in/1546624?s=60&v=4){kind=small}
- Add cursor-pointer class to collapsible section headers for better UX - Add consistent padding (mb-1 block) between all labels and input fields - Ensures visual consistency with the rest of the application styling Fixes #7040
dosubot
bot
added
size:M
| @@ -1103,7 +1103,7 @@ export const CodeIndexPopover: React.FC<CodeIndexPopoverProps> = ({ | |||
| <div className="mt-4 space-y-4"> | |||
| {/* Search Score Threshold Slider */} | |||
| <div className="space-y-2"> | |||
| <div className="flex items-center gap-2"> | |||
| <div className="flex items-center gap-2 mb-1"> | |||
There was a problem hiding this comment.
I notice that here we're adding to the parent div instead of the label element itself. For consistency with all the other labels in this file (lines 616, 653, 675, 718, 749, 770, 802, 829, 857, 878, 910, 932, 975, 997, 1039, 1067), should we consider moving the classes directly to the label element?
| @@ -1149,7 +1149,7 @@ export const CodeIndexPopover: React.FC<CodeIndexPopoverProps> = ({ | |||
|
|
|||
| {/* Maximum Search Results Slider */} | |||
| <div className="space-y-2"> | |||
| <div className="flex items-center gap-2"> | |||
| <div className="flex items-center gap-2 mb-1"> | |||
There was a problem hiding this comment.
Same pattern here - for consistency with the rest of the file, the classes would typically go on the label element rather than the wrapper div.
hannesrudolph
added
the
Issue/PR - Triage
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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.
Summary
This PR fixes the UI styling issues in the codebase indexing popover as reported in #7040.
Changes Made
Added cursor pointer to collapsible headings: The Setup Settings and Advanced Settings collapsible sections now show a pointer cursor on hover, providing better visual feedback to users that these elements are clickable.
Added consistent padding between labels and input fields: All input labels now have consistent bottom margin (mb-1) and are displayed as block elements, creating uniform spacing throughout the form.
Testing
Screenshots
The changes ensure:
Fixes #7040
Important
Improves UI consistency in
CodeIndexPopover.tsxby adding cursor feedback and consistent padding.cursor-pointertoSetup SettingsandAdvanced Settingsbuttons inCodeIndexPopover.tsxfor better user feedback.mb-1andblockto alllabelelements inCodeIndexPopover.tsx.This description was created by
for 0d990f3. You can customize this summary. It will automatically update as commits are pushed.