Fix double clicking reason and glossary text

This commit is contained in:
toasted-nutbread 2020-01-29 20:47:24 -05:00
parent dd700af0be
commit db247a2837
3 changed files with 20 additions and 5 deletions

View File

@ -249,7 +249,7 @@ button.action-button {
display: inline-block; display: inline-block;
} }
.term-reasons>.term-reason+.term-reason:before { .term-reasons>.term-reason+.term-reason-separator+.term-reason:before {
content: " \00AB "; /* The two spaces is not a typo */ content: " \00AB "; /* The two spaces is not a typo */
display: inline; display: inline;
} }
@ -468,3 +468,13 @@ button.action-button {
padding-left: 1.4em; padding-left: 1.4em;
list-style-type: decimal; list-style-type: decimal;
} }
.term-glossary-separator,
.term-reason-separator {
display: inline-block;
width: 0;
height: 0;
font-size: 0;
opacity: 0;
white-space: pre;
}

View File

@ -31,8 +31,8 @@
<ul class="term-glossary-list"></ul> <ul class="term-glossary-list"></ul>
</li></template> </li></template>
<template id="term-definition-only-template"><span class="term-definition-only"></span></template> <template id="term-definition-only-template"><span class="term-definition-only"></span></template>
<template id="term-glossary-item-template"><li class="term-glossary-item"><span class="term-glossary"></span></li></template> <template id="term-glossary-item-template"><li class="term-glossary-item"><span class="term-glossary"></span><span class="term-glossary-separator">&#10;</span></li></template>
<template id="term-reason-template"><span class="term-reason"></span></template> <template id="term-reason-template"><span class="term-reason"></span><span class="term-reason-separator">&#10;</span></template>
<template id="kanji-entry-template"><div class="entry" data-type="kanji"> <template id="kanji-entry-template"><div class="entry" data-type="kanji">
<div class="entry-header1"> <div class="entry-header1">

View File

@ -110,10 +110,11 @@ class DisplayGenerator {
} }
createTermReason(reason) { createTermReason(reason) {
const node = DisplayGenerator._instantiateTemplate(this._termReasonTemplate); const fragment = DisplayGenerator._instantiateTemplateFragment(this._termReasonTemplate);
const node = fragment.querySelector('.term-reason');
node.textContent = reason; node.textContent = reason;
node.dataset.reason = reason; node.dataset.reason = reason;
return node; return fragment;
} }
createTermDefinitionItem(details) { createTermDefinitionItem(details) {
@ -378,4 +379,8 @@ class DisplayGenerator {
static _instantiateTemplate(template) { static _instantiateTemplate(template) {
return document.importNode(template.content.firstChild, true); return document.importNode(template.content.firstChild, true);
} }
static _instantiateTemplateFragment(template) {
return document.importNode(template.content, true);
}
} }