zulip/static/templates/settings/notification_settings.hbs

<div id="notification-settings" class="settings-section" data-name="notifications">
    <form class="notification-settings-form">
        <div id="general_notifications" class="subsection-parent">
            <h3 class="inline-block">{{t "Notification triggers" }}</h3>
            <div class="alert-notification" id="general-notify-settings-status"></div>
            <p>{{t "Configure how Zulip notifies you about new messages." }}</p>
            <table id="notification-table" class="table table-condensed table-bordered wrapped-table">
                <thead>
                    <tr>
                        <th rowspan="2" width="30%"></th>
                        <th colspan="2" width="28%">{{t "Desktop"}}</th>
                        <th rowspan="2" width="14%" class="{{#if show_push_notifications_tooltip.push_notifications}}control-label-disabled{{/if}}">
                            {{t "Mobile"}}
                            {{#if (not page_params.realm_push_notifications_enabled) }}
                            <i class="fa fa-question-circle settings-info-icon" data-toggle="tooltip"
                              title="{{t 'Mobile push notifications are not configured on this server.' }}"></i>
                            {{/if}}
                        </th>
                        <th rowspan="2" width="14%">{{t "Email"}}</th>
                        <th rowspan="2" width="14%">@all
                            <i class="fa fa-question-circle settings-info-icon" data-toggle="tooltip"
                              title="{{t 'Whether wildcard mentions like @all are treated as mentions for the purpose of notifications.' }}"></i>
                        </th>
                    </tr>
                    <tr>
                        <th>{{t "Visual"}}</th>
                        <th>{{t "Audio"}}</th>
                    </tr>
                </thead>
                <tbody>
                    {{#each general_settings}}
                    <tr>
                        <td>{{ this.label }}</td>
                        {{#each this.notification_settings}}
                        {{> notification_settings_checkboxes
                          setting_name=this.setting_name
                          is_checked=this.is_checked
                          is_disabled=this.is_disabled }}
                        {{/each}}
                    </tr>
                    {{/each}}
                </tbody>
                <tbody id="stream-specific-notify-table">
                    {{> ../settings/stream_specific_notification_row }}
                </tbody>
            </table>
        </div>

        <div id="other_notifications" class="m-10 inline-block subsection-parent">

            <h3 class="inline-block">{{t "Other notification settings" }}</h3>
            <div class="alert-notification" id="other-notify-settings-status"></div>

            <h5>{{t "Desktop" }}</h5>

            <p><a id="send_test_notification">{{t "Send test notification" }}</a></p>

            {{#each notification_settings.desktop_notification_settings}}
            {{> settings_checkbox
              setting_name=this
              is_checked=(lookup ../page_params this)
              label=(lookup ../settings_label this)}}
            {{/each}}

            <label for="notification_sound">
                {{t "Notification sound" }}
            </label>

            <div class="input-group {{#unless enable_sound_select}}control-label-disabled{{/unless}}">
                <select name="notification_sound" id="notification_sound" data-setting-widget-type="string"
                  {{#unless enable_sound_select}}
                  disabled
                  {{/unless}}>
                    {{#each page_params.available_notification_sounds}}
                    <option value="{{ this }}">{{ this }}</option>
                    {{/each}}
                </select>
                <span id="play_notification_sound">
                    <i class="fa fa-play-circle" aria-label="{{t 'Play sound' }}"></i>
                </span>
            </div>

            <div class="input-group">
                <label for="desktop_icon_count_display" class="dropdown-title">{{ settings_label.desktop_icon_count_display }}</label>
                <select name="desktop_icon_count_display" id="desktop_icon_count_display" class="prop-element"
                  data-setting-widget-type="number">
                    {{> dropdown_options_widget option_values=desktop_icon_count_display_values}}
                </select>
            </div>

            <h5>{{t "Mobile" }}</h5>

            {{#each notification_settings.mobile_notification_settings}}
            {{> settings_checkbox
              setting_name=this
              is_checked=(lookup ../page_params this)
              label=(lookup ../settings_label this)
              show_push_notifications_tooltip=(lookup ../show_push_notifications_tooltip this)}}
            {{/each}}

            <h5>{{t "Email" }}</h5>

            {{#each notification_settings.email_notification_settings}}
            {{> settings_checkbox
              setting_name=this
              is_checked=(lookup ../page_params this)
              label=(lookup ../settings_label this)}}
            {{/each}}

            <h5>{{t "Presence" }}</h5>

            {{#each notification_settings.presence_notification_settings}}
            {{> settings_checkbox
              setting_name=this
              is_checked=(lookup ../page_params this)
              label=(lookup ../settings_label this)}}
            {{/each}}

        </div>
    </form>
</div>