sublime_text
sublime_text copied to clipboard
Find panel: different height of UI elements
Problem description
UI elements in the Find panel have different height, and it's bugging me.
- Text panel is the tallest, even at its minimum;
- Buttons on the left are the shortest;
- Buttons of the right are of the average height.
A picture is worth a thousand words, so here it goes:
Let's zoom way in:
Preferred solution
Align buttons, make them all the same height. Set their hight to the text field's minimal height.
Alternatives
None
Additional Information (optional)
My setup might be relevant. Below is my font info and preferences.
- Version 3.2.2
- Build 3211
Note: this is a stripped version of my Preferences.sublime-settings. I only left what seems relevant.
{
"caret_extra_bottom": 0,
"caret_extra_top": 0,
"caret_extra_width": 2,
"caret_style": "smooth",
"color_scheme": "Packages/Color Scheme - Default/Mariana.sublime-color-scheme",
"copy_with_empty_selection": false,
"dpi_scale": 1.0,
"font_face": "Fira Code",
"font_size": 12,
"ignored_packages":
[
"Vintage"
],
"move_to_limit_on_up_down": true,
"theme": "Adaptive.sublime-theme",
"ui_scale": 1.0,
}
Some more additional info
Height of the Find/Where/Replace text fields does not depend on the current theme or color scheme, but it depends on current font_face
and font_size
preferences.
For example, the diff is smaller when using "Andale Mono"/12. But if you make it as large as "Hack"/26, then the text field would be almost twice as tall as those buttons around it.
On the other hand, even with font as small as 9 units, the line height is less than required and the text is padded with an empty space (i.e. slightly stretched vertically), it is still 1-2px taller than it should be:
So, my new suggested solution is this:
Preferred solution №2
When minimal text field's height (which is ultimately related to the current font's line height) is about the size of the buttons (which depends on the ui_scale
, for what is worth), then snap those buttons' height to the text field height.
Let's say, about 10dip (device-independent pixels) would be good enough. Whenever text field's height is no more than 10dip away from the buttons' default height — just stretch the buttons and vertical-venter align their content.
In Sublime Text 4, I can customize theme to work around on this. Example:
{
"variables":
{
},
"rules":
[
{
"class": "text_line_control",
"content_margin": 2,
}
],
}
