tooltips: Fix hotkey-hint CSS class reuse.

The "hotkey-hint" class name used internally in
d66f2d900f conflicted with the
preexisting class name for hotkey hints into popovers, introduced in
80ff3d8da5.

Given that the new class is for a styling of hotkey hints designed for
use in tooltips, it was a bad name anyway, so just rename it to
tooltip-hotkey-hint. We rename the related cluster of variable names
to match this.
This commit is contained in:
Tim Abbott 2023-02-08 12:40:48 -08:00
parent d2ea65da10
commit b9fc5da350
13 changed files with 27 additions and 27 deletions

View File

@ -43,13 +43,13 @@ run_test("numberFormat", () => {
assert.equal(html, "1,000,000\n"); assert.equal(html, "1,000,000\n");
}); });
run_test("hotkey_hints", () => { run_test("tooltip_hotkey_hints", () => {
const args = { const args = {
hotkey_one: "Ctrl", hotkey_one: "Ctrl",
hotkey_two: "C", hotkey_two: "C",
}; };
const html = require("./templates/hotkey_hints.hbs")(args); const html = require("./templates/tooltip_hotkey_hints.hbs")(args);
const expected_html = `<span class="hotkey-hints"><span class="hotkey-hint">${args.hotkey_one}</span><span class="hotkey-hint">${args.hotkey_two}</span></span>\n`; const expected_html = `<span class="tooltip-hotkey-hints"><span class="tooltip-hotkey-hint">${args.hotkey_one}</span><span class="tooltip-hotkey-hint">${args.hotkey_two}</span></span>\n`;
assert.equal(html, expected_html); assert.equal(html, expected_html);
}); });

View File

@ -1 +0,0 @@
{{hotkey_hints hotkey_one hotkey_two}}

View File

@ -0,0 +1 @@
{{tooltip_hotkey_hints hotkey_one hotkey_two}}

View File

@ -106,13 +106,13 @@ Handlebars.registerHelper(
Handlebars.registerHelper("numberFormat", (number) => number.toLocaleString()); Handlebars.registerHelper("numberFormat", (number) => number.toLocaleString());
Handlebars.registerHelper("hotkey_hints", (...hotkeys) => { Handlebars.registerHelper("tooltip_hotkey_hints", (...hotkeys) => {
hotkeys.pop(); // Handlebars options hotkeys.pop(); // Handlebars options
let hotkey_hints = ""; let hotkey_hints = "";
common.adjust_mac_tooltip_keys(hotkeys); common.adjust_mac_tooltip_keys(hotkeys);
for (const hotkey of hotkeys) { for (const hotkey of hotkeys) {
hotkey_hints += `<span class="hotkey-hint">${hotkey}</span>`; hotkey_hints += `<span class="tooltip-hotkey-hint">${hotkey}</span>`;
} }
const result = `<span class="hotkey-hints">${hotkey_hints}</span>`; const result = `<span class="tooltip-hotkey-hints">${hotkey_hints}</span>`;
return new Handlebars.SafeString(result); return new Handlebars.SafeString(result);
}); });

View File

@ -66,7 +66,7 @@
*/ */
text-align: left; text-align: left;
.hotkey-hints { .tooltip-hotkey-hints {
box-sizing: inherit; box-sizing: inherit;
display: flex; display: flex;
align-self: flex-start; align-self: flex-start;
@ -74,7 +74,7 @@
gap: 4px; gap: 4px;
} }
.hotkey-hint { .tooltip-hotkey-hint {
box-sizing: inherit; box-sizing: inherit;
border: 1px solid hsla(225, 100%, 84%, 1); border: 1px solid hsla(225, 100%, 84%, 1);
border-radius: 3px; border-radius: 3px;

View File

@ -11,7 +11,7 @@
</div> </div>
<template id="scroll-to-bottom-button-tooltip-template"> <template id="scroll-to-bottom-button-tooltip-template">
{{t 'Scroll to bottom' }} {{t 'Scroll to bottom' }}
{{hotkey_hints "End"}} {{tooltip_hotkey_hints "End"}}
</template> </template>
</div> </div>
<div id="compose_controls" class="new-style"> <div id="compose_controls" class="new-style">
@ -61,11 +61,11 @@
<button type="button" class="close fa fa-times" id='compose_close' data-tooltip-template-id="compose_close_tooltip_template"></button> <button type="button" class="close fa fa-times" id='compose_close' data-tooltip-template-id="compose_close_tooltip_template"></button>
<template id="compose_close_tooltip_template"> <template id="compose_close_tooltip_template">
{{t 'Cancel compose' }} {{t 'Cancel compose' }}
{{hotkey_hints "Esc"}} {{tooltip_hotkey_hints "Esc"}}
</template> </template>
<template id="compose_close_and_save_tooltip_template"> <template id="compose_close_and_save_tooltip_template">
{{t 'Cancel compose and save draft' }} {{t 'Cancel compose and save draft' }}
{{hotkey_hints "Esc"}} {{tooltip_hotkey_hints "Esc"}}
</template> </template>
</div> </div>
<div id="stream-message" class="order-1"> <div id="stream-message" class="order-1">

View File

@ -18,7 +18,7 @@
</a> </a>
<template id="compose_draft_tooltip_template"> <template id="compose_draft_tooltip_template">
{{t 'Drafts' }} {{t 'Drafts' }}
{{hotkey_hints "D"}} {{tooltip_hotkey_hints "D"}}
</template> </template>
<div class="compose_control_menu_wrapper" role="button" tabindex=0> <div class="compose_control_menu_wrapper" role="button" tabindex=0>
<a class="compose_control_button zulip-icon zulip-icon-ellipsis-v-solid hide {{#if message_id}}show-lg{{else}}show-sm{{/if}} compose_control_menu" tabindex="-1" data-tippy-content="Compose actions"></a> <a class="compose_control_button zulip-icon zulip-icon-ellipsis-v-solid hide {{#if message_id}}show-lg{{else}}show-sm{{/if}} compose_control_menu" tabindex="-1" data-tippy-content="Compose actions"></a>

View File

@ -94,7 +94,7 @@
</div> </div>
<template id="filter-streams-tooltip-template"> <template id="filter-streams-tooltip-template">
{{t 'Filter streams' }} {{t 'Filter streams' }}
{{hotkey_hints "Q"}} {{tooltip_hotkey_hints "Q"}}
</template> </template>
</div> </div>
<div id="topics_header"> <div id="topics_header">

View File

@ -3,15 +3,15 @@
<div class="edit_content message_control_button" data-tooltip-template-id="view-source-tooltip-template"></div> <div class="edit_content message_control_button" data-tooltip-template-id="view-source-tooltip-template"></div>
<template id="edit-content-tooltip-template"> <template id="edit-content-tooltip-template">
{{#tr}}Edit message{{/tr}} {{#tr}}Edit message{{/tr}}
{{hotkey_hints "E"}} {{tooltip_hotkey_hints "E"}}
</template> </template>
<template id="move-message-tooltip-template"> <template id="move-message-tooltip-template">
{{#tr}}Move message{{/tr}} {{#tr}}Move message{{/tr}}
{{hotkey_hints "M"}} {{tooltip_hotkey_hints "M"}}
</template> </template>
<template id="view-source-tooltip-template"> <template id="view-source-tooltip-template">
{{#tr}}View message source{{/tr}} {{#tr}}View message source{{/tr}}
{{hotkey_hints "E"}} {{tooltip_hotkey_hints "E"}}
</template> </template>
{{/if}} {{/if}}
@ -21,7 +21,7 @@
</div> </div>
<template id="add-emoji-tooltip-template"> <template id="add-emoji-tooltip-template">
{{#tr}}Add emoji reaction{{/tr}} {{#tr}}Add emoji reaction{{/tr}}
{{hotkey_hints ":"}} {{tooltip_hotkey_hints ":"}}
</template> </template>
{{/unless}} {{/unless}}
@ -31,7 +31,7 @@
</div> </div>
<template id="message-actions-tooltip-template"> <template id="message-actions-tooltip-template">
{{#tr}}Message actions{{/tr}} {{#tr}}Message actions{{/tr}}
{{hotkey_hints "I"}} {{tooltip_hotkey_hints "I"}}
</template> </template>
{{/unless}} {{/unless}}
@ -51,11 +51,11 @@
</div> </div>
<template id="star-message-tooltip-template"> <template id="star-message-tooltip-template">
<span class="starred-status">{{#tr}}Star this message{{/tr}}</span> <span class="starred-status">{{#tr}}Star this message{{/tr}}</span>
{{hotkey_hints "Ctrl" "S"}} {{tooltip_hotkey_hints "Ctrl" "S"}}
</template> </template>
<template id="unstar-message-tooltip-template"> <template id="unstar-message-tooltip-template">
<span class="starred-status">{{#tr}}Unstar this message{{/tr}}</span> <span class="starred-status">{{#tr}}Unstar this message{{/tr}}</span>
{{hotkey_hints "Ctrl" "S"}} {{tooltip_hotkey_hints "Ctrl" "S"}}
</template> </template>
{{/unless}} {{/unless}}

View File

@ -4,4 +4,4 @@
<p class="narrow_to_compose_recipient_current_view_help tooltip-inner-content italic">{{display_current_view}}</p> <p class="narrow_to_compose_recipient_current_view_help tooltip-inner-content italic">{{display_current_view}}</p>
{{/if}} {{/if}}
</div> </div>
{{hotkey_hints "Ctrl" "."}} {{tooltip_hotkey_hints "Ctrl" "."}}

View File

@ -67,13 +67,13 @@
<i class="zulip-icon zulip-icon-mute on_hover_topic_unmute recipient_bar_icon" data-stream-id="{{stream_id}}" data-topic-name="{{topic}}" data-tooltip-template-id="topic-unmute-tooltip-template" role="button" tabindex="0" aria-label="{{t 'Unmute topic' }}"></i> <i class="zulip-icon zulip-icon-mute on_hover_topic_unmute recipient_bar_icon" data-stream-id="{{stream_id}}" data-topic-name="{{topic}}" data-tooltip-template-id="topic-unmute-tooltip-template" role="button" tabindex="0" aria-label="{{t 'Unmute topic' }}"></i>
<template id="topic-unmute-tooltip-template"> <template id="topic-unmute-tooltip-template">
{{#tr}}Unmute topic{{/tr}} {{#tr}}Unmute topic{{/tr}}
{{hotkey_hints "M"}} {{tooltip_hotkey_hints "M"}}
</template> </template>
{{else}} {{else}}
<i class="zulip-icon zulip-icon-mute on_hover_topic_mute recipient_bar_icon hidden-for-spectators" data-stream-id="{{stream_id}}" data-topic-name="{{topic}}" data-tooltip-template-id="topic-mute-tooltip-template" role="button" tabindex="0" aria-label="{{t 'Mute topic' }}"></i> <i class="zulip-icon zulip-icon-mute on_hover_topic_mute recipient_bar_icon hidden-for-spectators" data-stream-id="{{stream_id}}" data-topic-name="{{topic}}" data-tooltip-template-id="topic-mute-tooltip-template" role="button" tabindex="0" aria-label="{{t 'Mute topic' }}"></i>
<template id="topic-mute-tooltip-template"> <template id="topic-mute-tooltip-template">
{{#tr}}Mute topic{{/tr}} {{#tr}}Mute topic{{/tr}}
{{hotkey_hints "M"}} {{tooltip_hotkey_hints "M"}}
</template> </template>
{{/if}} {{/if}}
</span> </span>

View File

@ -13,7 +13,7 @@
</div> </div>
<template id="search-people-tooltip-template"> <template id="search-people-tooltip-template">
{{t 'Search people' }} {{t 'Search people' }}
{{hotkey_hints "W"}} {{tooltip_hotkey_hints "W"}}
</template> </template>
<div class="input-append notdisplayed" id="user_search_section"> <div class="input-append notdisplayed" id="user_search_section">
<input class="user-list-filter home-page-input" type="text" autocomplete="off" placeholder="{{t 'Search people' }}" /> <input class="user-list-filter home-page-input" type="text" autocomplete="off" placeholder="{{t 'Search people' }}" />
@ -34,7 +34,7 @@
<i class="fa fa-keyboard-o fa-2x tippy-zulip-tooltip" id="keyboard-icon" data-tooltip-template-id="keyboard-icon-tooltip-template"></i> <i class="fa fa-keyboard-o fa-2x tippy-zulip-tooltip" id="keyboard-icon" data-tooltip-template-id="keyboard-icon-tooltip-template"></i>
<template id="keyboard-icon-tooltip-template"> <template id="keyboard-icon-tooltip-template">
{{t 'Keyboard shortcuts' }} {{t 'Keyboard shortcuts' }}
{{hotkey_hints "?"}} {{tooltip_hotkey_hints "?"}}
</template> </template>
</a> </a>
<div class="only-visible-for-spectators"> <div class="only-visible-for-spectators">

View File

@ -143,7 +143,7 @@ export default (env: {minimize?: boolean} = {}, argv: {mode?: string}): webpack.
"t", "t",
"tr", "tr",
"rendered_markdown", "rendered_markdown",
"hotkey_hints", "tooltip_hotkey_hints",
], ],
preventIndent: true, preventIndent: true,
}, },