settings: Fix size of dropdown_list_widget elements.

We remove the small CSS class, which set the font size as something
tiny, and also restructure it with a fixed height and more natural
markup for the reset link.
This commit is contained in:
Tim Abbott 2021-06-11 16:18:16 -07:00
parent 579a9d60e9
commit 6a7d4d96c5
2 changed files with 21 additions and 13 deletions

View File

@ -1611,21 +1611,29 @@ body:not(.night-mode) #settings_page .custom_user_field .datepicker {
.dropdown-list-widget {
button {
margin: 0 5px;
&.dropdown_list_reset_button {
/* Prevent night mode from overriding background. */
background: unset !important;
border: none;
&:disabled {
display: none;
}
&.dropdown-toggle {
/* Matches bootstrap hardcoded 30px height for select elements,
which we want to match the size of. */
height: 30px;
padding: 0;
}
&:disabled i {
display: none;
}
}
a.dropdown_list_reset_button {
/* Prevent night mode from overriding background. */
background: unset !important;
border: none;
margin-left: 10px;
&:disabled {
display: none;
}
}
.dropdown-search > input[type="text"] {
margin: 9px;
}

View File

@ -5,7 +5,7 @@
{{ label }}
</label>
{{/if}}
<button class="button small rounded dropdown-toggle" type="button" data-toggle="dropdown">
<button class="button rounded dropdown-toggle" type="button" data-toggle="dropdown">
<span id="{{widget_name}}_name"></span>
<i class="fa fa-pencil"></i>
</button>
@ -19,8 +19,8 @@
</ul>
</span>
{{#if reset_button_text}}
<button class="button small dropdown_list_reset_button" type="button">
<a>{{reset_button_text}}</a>
</button>
<a class="dropdown_list_reset_button" role="button">
{{reset_button_text}}
</a>
{{/if}}
</div>