UX: Fix & clarify bulk notification change modal (#11969)

This commit is contained in:
Kris 2021-02-04 14:35:47 -05:00 committed by GitHub
parent c40c858233
commit 6d6436e9e7
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 26 additions and 9 deletions

View File

@ -1,13 +1,15 @@
{{#each notificationLevels as |level|}} <div class="bulk-notification-list">
<div class="controls"> {{#each notificationLevels as |level|}}
<label class="radio"> <div class="controls">
{{radio-button value=level.id name="notification_level" selection=notificationLevelId}} <strong>{{level.name}}</strong> <label class="radio notification-level-radio">
<div class="description">{{html-safe level.description}}</div> {{radio-button value=level.id name="notification_level" selection=notificationLevelId}} <strong>{{level.name}}</strong>
</label> <div class="description">{{html-safe level.description}}</div>
</div> </label>
{{/each}} </div>
{{/each}}
</div>
{{d-button {{d-button
disabled=disabled disabled=disabled
action=(action "changeNotificationLevel") action=(action "changeNotificationLevel")
label="topics.bulk.notification_level"}} label="topics.bulk.change_notification_level"}}

View File

@ -672,6 +672,20 @@
} }
} }
.bulk-notification-list {
margin-bottom: 1.5em;
}
.notification-level-radio {
flex-wrap: wrap;
align-items: baseline;
margin-bottom: 0.5em;
.description {
width: 100%;
margin-top: 0.25em;
}
}
.modal.edit-slow-mode-modal { .modal.edit-slow-mode-modal {
.slow-mode-label { .slow-mode-label {
display: inline-flex; display: inline-flex;

View File

@ -2257,6 +2257,7 @@ en:
close_topics: "Close Topics" close_topics: "Close Topics"
archive_topics: "Archive Topics" archive_topics: "Archive Topics"
notification_level: "Notifications" notification_level: "Notifications"
change_notification_level: "Change Notification Level"
choose_new_category: "Choose the new category for the topics:" choose_new_category: "Choose the new category for the topics:"
selected: selected:
one: "You have selected <b>%{count}</b> topic." one: "You have selected <b>%{count}</b> topic."