zulip/static/templates/settings/display-settings.handlebars

97 lines
4.2 KiB
Handlebars

<div id="display-settings" class="settings-section" data-name="display-settings">
<form class="display-settings-form">
<div id="user-lang-settings">
<!-- this is inline block so that the alert notification can sit beside
it. If there's not an alert, don't make it inline-block. -->
<h3 class="inline-block">{{t "Language settings" }}</h3>
<div class="alert-notification" id="language-settings-status"></div>
<div class="input-group user-name-section">
<label class="inline-block title">{{t "Default language" }}</label>
<a id="default_language" href="#default_language">
<button type="button" class="button rounded small inline-block">
<span id="default_language_name">{{page_params.default_language_name}}</span>
<i class="fa fa-pencil"></i>
</button>
</a>
</div>
{{ partial "default_language_modal"}}
</div>
<div id="user-display-settings">
<h3 class="inline-block">{{t "Display settings" }}</h3>
<div class="alert-notification" id="display-settings-status"></div>
{{partial "settings_checkbox"
"setting_name" "night_mode"
"is_checked" page_params.night_mode
"label" settings_label.night_mode}}
{{partial "settings_checkbox"
"setting_name" "high_contrast_mode"
"is_checked" page_params.high_contrast_mode
"label" settings_label.high_contrast_mode}}
{{partial "settings_checkbox"
"setting_name" "left_side_userlist"
"is_checked" page_params.left_side_userlist
"label" settings_label.left_side_userlist}}
</div>
<div id="user-time-settings">
<h3 class="inline-block">{{t "Time settings" }}</h3>
<div class="alert-notification" id="time-settings-status"></div>
{{partial "settings_checkbox"
"setting_name" "twenty_four_hour_time"
"is_checked" page_params.twenty_four_hour_time
"label" settings_label.twenty_four_hour_time}}
<div class="input-group">
<label for="timezone" class="dropdown-title">{{t "Time zone" }}:</label>
<select name="timezone" id="user_timezone">
{{#unless page_params.timezone}}
<option></option>
{{/unless}}
{{#each timezones}}
<option value="{{ this }}">{{ this }}</option>
{{/each}}
</select>
</div>
</div>
<div id="user-emoji-settings">
<h3 class="inline-block light">Emoji style</h3>
<div class="alert-notification" id="emoji-settings-status"></div>
<div class="input-group">
<div class="emojiset_choices grey-box">
{{#each page_params.emojiset_choices }}
<label>
<input type="radio" class="emojiset_choice" name="emojiset_group" value="{{@key}}" />
<span>{{t this }}</span>
<span class="right">
{{#if @last}}
<div class="emoji_alt_code">&nbsp;:relaxed:</div>
{{else}}
<img class="emoji" src="/static/generated/emoji/images-{{@key}}-64/1f642.png" />
<img class="emoji" src="/static/generated/emoji/images-{{@key}}-64/1f44d.png" />
<img class="emoji" src="/static/generated/emoji/images-{{@key}}-64/1f680.png" />
<img class="emoji" src="/static/generated/emoji/images-{{@key}}-64/1f389.png" />
{{/if}}
</span>
</label>
{{/each}}
</div>
</div>
{{partial "settings_checkbox"
"setting_name" "translate_emoticons"
"is_checked" page_params.translate_emoticons
"label" settings_label.translate_emoticons}}
</div>
</form>
</div>