setttings: Indent display settings checkboxes and fix header styles.

Aside from the indentation of checkboxes, the headers are added and
changed to become more unified with other page styling.
This commit is contained in:
Brock Whittaker 2017-07-05 12:52:32 -07:00 committed by Tim Abbott
parent 005a58ecd6
commit 330a3bd144
2 changed files with 60 additions and 36 deletions

View File

@ -273,7 +273,7 @@ casper.then(function () {
casper.waitUntilVisible("#default_language", function () {
casper.test.info("Checking if we are on Chinese page.");
casper.test.assertEvalEquals(function () {
return $('#default_language_name').text();
return $('#default_language_name').text().trim();
}, 'Chinese Simplified');
casper.test.info("Opening German page through i18n url.");
});

View File

@ -1,11 +1,16 @@
<div id="display-settings" class="settings-section" data-name="display-settings">
<div class="alert" id="display-settings-status"></div>
<form class="display-settings-form">
<h3 class="light">{{t "Language settings" }}</h3>
<p for="default_language" class="inline-block title">
{{t "Default language" }}: <span id='default_language_name'>{{page_params.default_language_name}}</span>
<a id="default_language" href="#default_language" title="{{t 'Change default language' }}">[{{t "Change" }}]</a>
</p>
<div class="side-padded-container 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 sea-green inline-block input-size" id='default_language_name'>
{{page_params.default_language_name}}
</button>
</a>
</div>
{{ partial "default_language_modal"}}
@ -31,41 +36,60 @@
<label for="left_side_userlist" class="inline-block">{{t "Display user list on left side in narrow windows." }}</label>
</div>
<div class="input-group">
<label class="checkbox">
<input type="checkbox" name="emoji_alt_code" id="emoji_alt_code"
{{#if page_params.emoji_alt_code}}
checked="checked"
{{/if}} />
<span></span>
</label>
<label for="emoji_alt_code" class="inline-block">{{t 'Display emoji reactions as text (:heart: instead of <img alt=":heart:" class="emoji" src="/static/generated/emoji/images/emoji/unicode/2764.png" title=":heart:"/>).' }}</label>
<h3 class="light">{{t "Display settings" }}</h3>
<div class="side-padded-container">
<div class="input-group">
<label class="checkbox">
<input type="checkbox" name="left_side_userlist" id="left_side_userlist"
{{#if page_params.left_side_userlist}}
checked="checked"
{{/if}} />
<span></span>
</label>
<label for="left_side_userlist" class="inline-block">{{t "Display user list on left side in narrow windows." }}</label>
</div>
<div class="input-group">
<label class="checkbox">
<input type="checkbox" name="emoji_alt_code" id="emoji_alt_code"
{{#if page_params.emoji_alt_code}}
checked="checked"
{{/if}} />
<span></span>
</label>
<label for="emoji_alt_code" class="inline-block">{{t 'Display emoji reactions as text (:heart: instead of <img alt=":heart:" class="emoji" src="/static/generated/emoji/images/emoji/unicode/2764.png" title=":heart:"/>).' }}</label>
</div>
</div>
<div class="input-group">
<label class="checkbox">
<input type="checkbox" name="twenty_four_hour_time" id="twenty_four_hour_time"
{{#if page_params.twenty_four_hour_time}}
checked="checked"
{{/if}} />
<span></span>
</label>
<label for="twenty_four_hour_time" class="inline-block">
{{t "Display time in 24-hour format (17:00 instead of 5:00 PM)" }}
</label>
</div>
<h3 class="light">{{t "Time settings" }}</h3>
<div class="input-group">
<label for="timezone">{{t "Time zone" }}:</label>
<select name="timezone" id="user_timezone">
{{#unless page_params.timezone}}
<option></option>
{{/unless}}
<div class="side-padded-container">
<div class="input-group">
<label class="checkbox">
<input type="checkbox" name="twenty_four_hour_time" id="twenty_four_hour_time"
{{#if page_params.twenty_four_hour_time}}
checked="checked"
{{/if}} />
<span></span>
</label>
<label for="twenty_four_hour_time" class="inline-block">
{{t "Display time in 24-hour format (17:00 instead of 5:00 PM)" }}
</label>
</div>
{{#each timezones}}
<option value="{{ this }}">{{ this }}</option>
{{/each}}
</select>
<div class="input-group">
<label for="timezone">{{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>
{{#if false}}