Mirror
/
zulip
mirror of https://github.com/zulip/zulip.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

settings: Fix labels using full width of the modal. 

Currently, the labels are using the full width of the modal, which results
in a clickable area that is too large. This commit fixes the issue by
setting the width of the labels to just fit its content.
This commit is contained in:
joseph 2024-09-05 19:58:48 +00:00 committed by Tim Abbott
parent 8332c7d93b
commit f1da8a9151
3 changed files with 9 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web/styles/modal.css
View File

@ -391,6 +391,8 @@
.modal-field-label { .modal-field-label {
margin-bottom: var(--margin-bottom-field-description); margin-bottom: var(--margin-bottom-field-description);
/* Avoid having the clickable area extend to the full width of the containing element */
width: fit-content;
} }
.dropdown-widget-button { .dropdown-widget-button {

2
web/styles/settings.css
View File

@ -1645,6 +1645,8 @@ $option_title_width: 180px;
.settings-field-label { .settings-field-label {
margin-bottom: var(--margin-bottom-field-description); margin-bottom: var(--margin-bottom-field-description);
/* Avoid having the clickable area extend to the full width of the containing element */
width: fit-content;
} }
.settings-profile-user-field-hint { .settings-profile-user-field-hint {

5
web/styles/subscriptions.css
View File

@ -1192,6 +1192,11 @@ div.settings-radio-input-parent {
height: inherit; height: inherit;
} }
.group-setting-label {
/* Avoid having the clickable area extend to the full width of the containing element */
width: fit-content;
}
@media (width < $lg_min) { @media (width < $lg_min) {
.user-groups-container, .user-groups-container,
.subscriptions-container { .subscriptions-container {