diff --git a/frontend_tests/puppeteer_tests/settings.ts b/frontend_tests/puppeteer_tests/settings.ts index 08284346bb..ff1617444b 100644 --- a/frontend_tests/puppeteer_tests/settings.ts +++ b/frontend_tests/puppeteer_tests/settings.ts @@ -299,8 +299,8 @@ async function test_alert_words_section(page: Page): Promise { } async function change_language(page: Page, language_data_code: string): Promise { - await page.waitForSelector("#user-display-settings .default_language", {visible: true}); - await page.click("#user-display-settings .default_language"); + await page.waitForSelector("#user-display-settings .setting_default_language", {visible: true}); + await page.click("#user-display-settings .setting_default_language"); await page.waitForSelector("#user_default_language_modal", {visible: true}); const language_selector = `a[data-code="${CSS.escape(language_data_code)}"]`; await page.click(language_selector); @@ -313,10 +313,10 @@ async function check_language_setting_status(page: Page): Promise { } async function assert_language_changed_to_chinese(page: Page): Promise { - await page.waitForSelector("#user-display-settings .default_language", {visible: true}); + await page.waitForSelector("#user-display-settings .setting_default_language", {visible: true}); const default_language = await common.get_text_from_selector( page, - "#user-display-settings .default_language", + "#user-display-settings .setting_default_language", ); assert.strictEqual( default_language, @@ -342,7 +342,7 @@ async function test_default_language_setting(page: Page): Promise { // Check that the saved indicator appears await check_language_setting_status(page); await page.click(".reload_link"); - await page.waitForSelector("#user-display-settings .default_language", {visible: true}); + await page.waitForSelector("#user-display-settings .setting_default_language", {visible: true}); await assert_language_changed_to_chinese(page); await test_i18n_language_precedence(page); await page.waitForSelector(display_settings_section, {visible: true}); @@ -357,7 +357,7 @@ async function test_default_language_setting(page: Page): Promise { await page.waitForSelector(display_settings_section, {visible: true}); await page.click(display_settings_section); await page.waitForSelector("#user-display-settings .language-settings-status", {visible: true}); - await page.waitForSelector("#user-display-settings .default_language", {visible: true}); + await page.waitForSelector("#user-display-settings .setting_default_language", {visible: true}); } async function test_notifications_section(page: Page): Promise { diff --git a/static/js/settings_display.js b/static/js/settings_display.js index 28b3c69c3a..68e5c14fe7 100644 --- a/static/js/settings_display.js +++ b/static/js/settings_display.js @@ -46,18 +46,18 @@ export function set_up() { container.find(".display-settings-status").hide(); - container.find(".demote_inactive_streams").val(user_settings.demote_inactive_streams); + container.find(".setting_demote_inactive_streams").val(user_settings.demote_inactive_streams); - container.find(".color_scheme").val(user_settings.color_scheme); + container.find(".setting_color_scheme").val(user_settings.color_scheme); - container.find(".default_view").val(user_settings.default_view); + container.find(".setting_default_view").val(user_settings.default_view); container - .find(".twenty_four_hour_time") + .find(".setting_twenty_four_hour_time") .val(JSON.stringify(user_settings.twenty_four_hour_time)); container - .find(`.emojiset_choice[value="${CSS.escape(user_settings.emojiset)}"]`) + .find(`.setting_emojiset_choice[value="${CSS.escape(user_settings.emojiset)}"]`) .prop("checked", true); $(`${CSS.escape(language_modal_elem)} [data-dismiss]`).on("click", () => { @@ -121,23 +121,23 @@ export function set_up() { ); }); - container.find(".default_language").on("click", (e) => { + container.find(".setting_default_language").on("click", (e) => { e.preventDefault(); e.stopPropagation(); overlays.open_modal(language_modal_elem); }); - container.find(".demote_inactive_streams").on("change", function () { + container.find(".setting_demote_inactive_streams").on("change", function () { const data = {demote_inactive_streams: this.value}; change_display_setting(data, container, patch_url, ".display-settings-status"); }); - container.find(".color_scheme").on("change", function () { + container.find(".setting_color_scheme").on("change", function () { const data = {color_scheme: this.value}; change_display_setting(data, container, patch_url, ".display-settings-status"); }); - container.find(".default_view").on("change", function () { + container.find(".setting_default_view").on("change", function () { const data = {default_view: this.value}; change_display_setting(data, container, patch_url, ".display-settings-status"); }); @@ -146,12 +146,12 @@ export function set_up() { window.location.reload(); }); - container.find(".twenty_four_hour_time").on("change", function () { + container.find(".setting_twenty_four_hour_time").on("change", function () { const data = {twenty_four_hour_time: this.value}; change_display_setting(data, container, patch_url, ".time-settings-status"); }); - container.find(".emojiset_choice").on("click", function () { + container.find(".setting_emojiset_choice").on("click", function () { const data = {emojiset: $(this).val()}; const current_emojiset = user_settings.emojiset; if (current_emojiset === data.emojiset) { @@ -208,10 +208,10 @@ export function update_page() { container.find(".default_language_name").text(default_language_name); container.find(".translate_emoticons").prop("checked", user_settings.translate_emoticons); container - .find(".twenty_four_hour_time") + .find(".setting_twenty_four_hour_time") .val(JSON.stringify(user_settings.twenty_four_hour_time)); - container.find(".color_scheme").val(JSON.stringify(user_settings.color_scheme)); - container.find(".default_view").val(user_settings.default_view); + container.find(".setting_color_scheme").val(JSON.stringify(user_settings.color_scheme)); + container.find(".setting_default_view").val(user_settings.default_view); // TODO: Set emojiset selector here. // Longer term, we'll want to automate this function diff --git a/static/styles/settings.css b/static/styles/settings.css index 936d0500cc..291ba8199d 100644 --- a/static/styles/settings.css +++ b/static/styles/settings.css @@ -338,7 +338,7 @@ td .button { display: inline-block; } - #user-display-settings .default_language { + #user-display-settings .setting_default_language { text-decoration: none; } @@ -485,7 +485,7 @@ input[type="checkbox"] { margin-top: 10px; } -#user-display-settings .default_language { +#user-display-settings .setting_default_language { margin-left: 20px; } diff --git a/static/templates/settings/display_settings.hbs b/static/templates/settings/display_settings.hbs index b333598e6d..9600e6de6d 100644 --- a/static/templates/settings/display_settings.hbs +++ b/static/templates/settings/display_settings.hbs @@ -7,7 +7,7 @@
- @@ -24,7 +24,7 @@ - {{> dropdown_options_widget option_values=default_view_values}}
@@ -32,7 +32,7 @@
- {{> dropdown_options_widget option_values=color_scheme_values}}
@@ -50,7 +50,7 @@ - {{> dropdown_options_widget option_values=demote_inactive_streams_values}} @@ -62,7 +62,7 @@
- {{#each twenty_four_hour_time_values}} {{/each}} @@ -78,7 +78,7 @@
{{#each user_settings.emojiset_choices}}