diff options
| -rw-r--r-- | ext/mixed/css/display.css | 8 | ||||
| -rw-r--r-- | ext/mixed/display-templates.html | 4 | ||||
| -rw-r--r-- | ext/mixed/js/display-generator.js | 4 | 
3 files changed, 11 insertions, 5 deletions
| diff --git a/ext/mixed/css/display.css b/ext/mixed/css/display.css index 55e76ab7..8bbd5731 100644 --- a/ext/mixed/css/display.css +++ b/ext/mixed/css/display.css @@ -208,17 +208,21 @@ button.action-button {  }  .tag { -    display: inline; +    display: inline-block;      padding: 0.2em 0.6em 0.3em;      font-size: 75%;      font-weight: 700; -    line-height: 1; +    line-height: 1.25;      text-align: center;      white-space: nowrap;      vertical-align: baseline;      border-radius: 0.25em;  } +.tag-inner { +    display: block; +} +  .tag-list>.tag+.tag {      margin-left: 0.375em;  } diff --git a/ext/mixed/display-templates.html b/ext/mixed/display-templates.html index 62f3c69c..eda9abd9 100644 --- a/ext/mixed/display-templates.html +++ b/ext/mixed/display-templates.html @@ -75,7 +75,7 @@  <template id="kanji-glossary-item-template"><li class="kanji-glossary-item"><span class="kanji-glossary"></span></li></template>  <template id="kanji-reading-template"><dd class="kanji-reading"></dd></template> -<template id="tag-template"><span class="tag"></span></template> -<template id="tag-frequency-template"><span class="tag" data-category="frequency"><span class="term-frequency-dictionary-name"></span><span class="term-frequency-separator"></span><span class="term-frequency-value"></span></template> +<template id="tag-template"><span class="tag"><span class="tag-inner"></span></span></template> +<template id="tag-frequency-template"><span class="tag" data-category="frequency"><span class="tag-inner"><span class="term-frequency-dictionary-name"></span><span class="term-frequency-separator"></span><span class="term-frequency-value"></span></span></template>  </body></html> diff --git a/ext/mixed/js/display-generator.js b/ext/mixed/js/display-generator.js index e1710488..8c39d380 100644 --- a/ext/mixed/js/display-generator.js +++ b/ext/mixed/js/display-generator.js @@ -252,8 +252,10 @@ class DisplayGenerator {      createTag(details) {          const node = DisplayGenerator._instantiateTemplate(this._tagTemplate); +        const inner = node.querySelector('.tag-inner'); +          node.title = details.notes; -        node.textContent = details.name; +        inner.textContent = details.name;          node.dataset.category = details.category;          return node; |