settings: Change the control for selecting emojiset to radio group.

Fixes: #7260.
This commit is contained in:
Harshit Bansal 2017-11-02 20:25:36 +00:00 committed by Tim Abbott
parent 4d51a6cfac
commit 439bc2920a
3 changed files with 35 additions and 7 deletions

View File

@ -6,7 +6,7 @@ exports.set_up = function () {
$("#display-settings-status").hide();
$("#user_timezone").val(page_params.timezone);
$("#emojiset_select").val(page_params.emojiset);
$(".emojiset_choice[value=" + page_params.emojiset + "]").prop("checked", true);
$("#default_language_modal [data-dismiss]").click(function () {
overlays.close_modal('default_language_modal');
@ -160,7 +160,7 @@ exports.set_up = function () {
});
});
$("#emojiset_select").change(function () {
$(".emojiset_choice").click(function () {
var emojiset = $(this).val();
var data = {};
data.emojiset = JSON.stringify(emojiset);

View File

@ -837,6 +837,24 @@ input[type=checkbox].inline-block {
white-space: normal;
}
.emojiset_choices {
padding-left: 20px;
width: 230px;
}
.emojiset_choices .emoji {
height: 22px;
width: 22px;
}
.emojiset_choices label {
line-height: 2em;
}
.emojiset_choices span {
float: right;
}
.open-user-form {
min-width: initial !important;
}

View File

@ -82,13 +82,23 @@
</div>
</div>
<div class="input-group">
<label for="emojiset_select">{{t "Emoji style" }}:</label>
<select name="emojiset_select" id="emojiset_select">
<h3 class="light">Emoji settings</h3>
<div class="input-group side-padded-container">
<label>{{t "Emoji style" }}:</label>
<div class="emojiset_choices">
{{#each page_params.emojiset_choices}}
<option value={{@key}}>{{this}}</option>
<label>
<input type="radio" class="emojiset_choice" name="emojiset_group" value="{{@key}}" />
{{this}}
<span>
<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/1f4a9.png" />
</span>
</label>
{{/each}}
</select>
</div>
<div id="emojiset_spinner"></div>
</div>
</form>