From c7b02f02ad0a7e2888f2d7d3599719e59bbd1ee2 Mon Sep 17 00:00:00 2001 From: Nathan Reiner Date: Thu, 13 Nov 2025 14:56:02 +0100 Subject: frontend: design prototype --- static/pages/settings/index.js | 62 ++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 62 insertions(+) create mode 100644 static/pages/settings/index.js (limited to 'static/pages/settings/index.js') diff --git a/static/pages/settings/index.js b/static/pages/settings/index.js new file mode 100644 index 0000000..da30ba7 --- /dev/null +++ b/static/pages/settings/index.js @@ -0,0 +1,62 @@ +import * as sfw from 'sfw'; +const { Div, Img } = sfw.element.native; + +import Editable from '../../widgets/editable/index.js'; + +import icons from '../../icons/index.js'; + +const css = await sfw.css(import.meta.url, './index.css'); + +export default class SettingsView extends sfw.element.Container { + constructor() { + super({ css }); + + this.onlogout = () => {}; + + this.body.append( + Div.new({ + id: 'container', + children: [ + Div.new({ + id: 'profile-image', + children: [ + Div.new({ + id: 'image-container', + children: [ + Img.new({ + src: '/images/0010.jpg', + }), + ] + }), + Div.new({ + id: 'edit', + children: [ icons.edit ] + }), + ] + }), + Editable.new({ + title: 'Name', + value: 'Nathan Reiner' + }), + Editable.new({ + title: 'Birthday', + type: 'date', + value: '2002-08-06', + }), + Div.new({ + id: 'logout', + innerText: 'Log-out', + onclick: () => this.onlogout(), + }), + Div.new({ + id: 'info-box', + children: [ + Div.new({ id: 'name', innerText: 'Memora' }), + Div.new({ id: 'version', innerText: '0.0.1-unstable' }), + ] + }), + ] + }) + ) + } +} -- cgit v1.2.3-70-g09d2