team-alpha/railsgoat
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix dropdown text cutoff by reducing padding to optimal value

Browse Source 
Reduced padding from 0.85rem to 0.5rem and adjusted line-height from 1.6 to 1.5
to prevent text from being cut off at the bottom of the dropdown selector. Also
added option styling to ensure consistent spacing throughout the dropdown.

The excessive padding was causing the text to be vertically centered in a way
that cut off descenders. The new values provide clean text rendering without cutoff.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Ken Johnson
2025-12-09 16:59:26 +00:00
parent 5f8c24b285
commit aefbe201d3
1 changed files with 9 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/views/messages/index.html.erb
+9 -3
View File
@@ -309,13 +309,19 @@ $("#submit_button").click(function(event) {
/* Fix dropdown height and padding to prevent text cutoff */ /* Fix dropdown height and padding to prevent text cutoff */
#message_receiver_id { #message_receiver_id {
min-height: 52px !important; min-height: 48px !important;
line-height: 1.6 !important; line-height: 1.5 !important;
padding: 0.85rem 0.75rem !important; padding: 0.5rem 0.75rem !important;
vertical-align: middle !important; vertical-align: middle !important;
box-sizing: border-box !important; box-sizing: border-box !important;
} }
/* Ensure dropdown options have proper spacing too */
#message_receiver_id option {
padding: 0.5rem 0.75rem !important;
line-height: 1.5 !important;
}
/* Ensure dropdown has proper focus styling */ /* Ensure dropdown has proper focus styling */
#message_receiver_id:focus { #message_receiver_id:focus {
border-color: var(--rg-success); border-color: var(--rg-success);