diff options
Diffstat (limited to 'static/widgets')
| -rw-r--r-- | static/widgets/image/index.css | 12 | ||||
| -rw-r--r-- | static/widgets/image/index.js | 8 |
2 files changed, 20 insertions, 0 deletions
diff --git a/static/widgets/image/index.css b/static/widgets/image/index.css index a53bddc..f265644 100644 --- a/static/widgets/image/index.css +++ b/static/widgets/image/index.css @@ -94,3 +94,15 @@ cursor: pointer; user-select: none; } + +#date { + background: #efefef99; + padding: 10px; + font-weight: bold; + margin: auto; + width: min-content; + border-radius: var(--border-radius); + cursor: pointer; + user-select: none; + margin-bottom: 10px; +} diff --git a/static/widgets/image/index.js b/static/widgets/image/index.js index 291cf23..e9e1507 100644 --- a/static/widgets/image/index.js +++ b/static/widgets/image/index.js @@ -11,6 +11,7 @@ export default class Image extends sfw.element.Container { #menu #id #month + #date constructor() { super ({ css }) @@ -26,6 +27,7 @@ export default class Image extends sfw.element.Container { this.#menu = Div.new({ id: 'menu', children: [ + this.#date = Div.new({ id: 'date' }), Div.new({ id: 'delete', innerText: 'Delete', @@ -40,15 +42,21 @@ export default class Image extends sfw.element.Container { oncontextmenu: (e) => { this.#menu.classList.toggle('open'); e.preventDefault(); + }, + ondblclick: (e) => { + this.#menu.classList.toggle('open'); + e.preventDefault(); } }) ); } set metadata(image) { + const date = new Date(image.timestamp * 1000); this.#id = image.id; this.#month = Month.from_unix(image.timestamp); this.#container.classList.remove('loaded'); + this.#date.innerText = date.toLocaleDateString() } load() { |