From 5c044b37eca361eacd510b697a650e10abb15b9a Mon Sep 17 00:00:00 2001 From: bat Date: Mon, 20 Mar 2023 14:28:20 +0000 Subject: [PATCH] Actualizar 'components/page-menu.js' --- components/page-menu.js | 49 +++++++++++++++++++++++++++++------------ 1 file changed, 35 insertions(+), 14 deletions(-) diff --git a/components/page-menu.js b/components/page-menu.js index 7efe6ef..61fd0da 100644 --- a/components/page-menu.js +++ b/components/page-menu.js @@ -1,4 +1,14 @@ export class PageMenu extends HTMLElement { + icons = {} + + textEn = { + download: 'Download', + } + + textEs = { + download: 'Descargar', + } + constructor() { super() this.attachShadow({mode: 'open'}) @@ -9,37 +19,48 @@ export class PageMenu extends HTMLElement { const style = document.createElement('style') style.textContent = ` :host { + background: #222; + color: #ddd; + padding: 3px; display: flex; flex-direction: column; - color: #000; + align-items: stretch; + min-width: 180px; } - h1 { - width: 100%; - text-align: center; - font-size: 18px; - margin: 0; - padding: 5px; - } - a { - display: block; + button { + background: #222; + font-size: 120%; + border: none; + color: inherit; + padding: 4px 10px; + text-align: left; } ` this.shadowRoot.append(style) } + add(name, handler) { + const btn = document.createElement('button') + btn.innerText = this.text[name] + this.shadowRoot.appendChild(btn) + btn.addEventListener('click', () => { + this.dispatchEvent(new CustomEvent( + 'close', {bubbles: true} + )) + handler() + }) + } + get language() { return this._language } set language(language) { this._language = language + this.text = this.langEs ? this.textEs : this.textEn } get langEs() { return /^es\b/.test(this.language) } - - get pagesText() { - return this.langEs ? 'Páginas' : 'Pages' - } } \ No newline at end of file