-
+ render() {
+ return html`
+
`
- }
-
- firstUpdated() {
- // ...
- }
-
- stateChanged(state) {
- this.config = state.config
- this.urls = state.app.registeredUrls
- }
-
- async logout(e) {
- if(window.confirm('Are you sure you want to logout?')) {
- store.dispatch(doLogout());
}
- }
+
+ firstUpdated() {
+ // ...
+ }
+
+ renderNodeManagement() {
+ const checkNodeManagement = store.getState().app.nodeConfig.knownNodes[store.getState().app.nodeConfig.node]
+ if (checkNodeManagement.enableManagement = true) {
+ return html`
+
+
+ `
+ } else {
+ return html`
+ `
+ }
+ }
+
+ stateChanged(state) {
+ this.config = state.config
+ this.urls = state.app.registeredUrls
+ }
+
+ async logout(e) {
+ if(window.confirm('Are you sure you want to logout?')) {
+ store.dispatch(doLogout());
+ }
+ }
}
window.customElements.define('sidenav-menu', SidenavMenu)
diff --git a/qortal-ui-core/src/components/wallet-profile.js b/qortal-ui-core/src/components/wallet-profile.js
index be67c5cd..99fa52f5 100644
--- a/qortal-ui-core/src/components/wallet-profile.js
+++ b/qortal-ui-core/src/components/wallet-profile.js
@@ -36,17 +36,19 @@ class WalletProfile extends connect(store)(LitElement) {
#profileInMenu {
padding: 12px;
border-top: var(--border);
- background: var(--white);
+ background: var(--sidetopbar);
color: var(--black);
}
+
#profileInMenu:hover {
- /* cursor:pointer; */
}
+
#accountIcon {
font-size:48px;
color: var(--mdc-theme-primary);
display: inline-block;
}
+
#accountName {
margin: 0;
font-size: 18px;
@@ -55,12 +57,14 @@ class WalletProfile extends connect(store)(LitElement) {
width:100%;
padding-bottom:8px;
}
+
#blocksMinted {
margin:0;
margin-top: 0;
font-size: 11px;
color: #03a9f4;
}
+
#address {
white-space: nowrap;
overflow: hidden;
diff --git a/qortal-ui-core/src/functional-components/side-menu-item-style.js b/qortal-ui-core/src/functional-components/side-menu-item-style.js
new file mode 100644
index 00000000..aec5bf0b
--- /dev/null
+++ b/qortal-ui-core/src/functional-components/side-menu-item-style.js
@@ -0,0 +1,153 @@
+import { css } from 'lit'
+
+export const sideMenuItemStyle = css`
+ :host {
+ --font-family: "Roboto", sans-serif;
+ --item-font-size: 1rem;
+ --sub-item-font-size: 0.85rem;
+ --item-padding: 1rem;
+ --item-content-padding: 1rem;
+ --icon-height: 1.25rem;
+ --icon-width: 1.25rem;
+ --item-border-radius: 5px;
+ --item-selected-color: #dddddd;
+ --item-selected-color-text: #333333;
+ --item-color-active: #d1d1d1;
+ --item-color-hover: #eeeeee;
+ --item-text-color: #080808;
+ --item-icon-color: #080808;
+ --item-border-color: #eeeeee;
+ --item-border-selected-color: #333333;
+
+ --overlay-box-shadow: 0 2px 4px -1px hsla(214, 53%, 23%, 0.16), 0 3px 12px -1px hsla(214, 50%, 22%, 0.26);
+ --overlay-background-color: #ffffff;
+
+ --spacing: 4px;
+
+ font-family: var(--font-family);
+ display: flex;
+ overflow: hidden;
+ flex-direction: column;
+ border-radius: var(--item-border-radius);
+ }
+
+ #itemLink {
+ align-items: center;
+ font-size: var(--item-font-size);
+ font-weight: 400;
+ height: var(--icon-height);
+ transition: background-color 200ms;
+ padding: var(--item-padding);
+ cursor: pointer;
+ display: inline-flex;
+ flex-grow: 1;
+ align-items: center;
+ overflow: hidden;
+ text-decoration: none;
+ border-bottom: 1px solid var(--item-border-color);
+ }
+
+ #itemLink:hover {
+ background-color: var(--item-color-hover);
+ }
+
+ #itemLink:active {
+ background-color: var(--item-color-active);
+ }
+
+ #content {
+ padding-left: var(--item-content-padding);
+ flex: 1;
+ }
+
+ :host([compact]) #content {
+ padding-left: 0;
+ display: none;
+ }
+
+ :host([selected]) #itemLink {
+ background-color: var(--item-selected-color);
+ color: var(--item-selected-color-text);
+ border-left: 3px solid var(--item-border-selected-color);
+ }
+
+ :host([selected]) slot[name="icon"]::slotted(*) {
+ color: var(--item-selected-color-text);
+ }
+
+ :host(:not([selected])) #itemLink{
+ color: var(--item-text-color);
+ }
+
+ :host([expanded]){
+ background-color: var(--item-selected-color);
+ }
+
+ :host([hasSelectedChild]){
+ background-color: var(--item-selected-color);
+ }
+
+ :host span {
+ cursor: inherit;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ user-select: none;
+ -webkit-user-select: none;
+ white-space: nowrap;
+ }
+
+ slot[name="icon"]::slotted(*) {
+ flex-shrink: 0;
+ color: var(--item-icon-color);
+ height: var(--icon-height);
+ width: var(--icon-width);
+ pointer-events: none;
+ }
+
+ #collapse-button {
+ float: right;
+ }
+
+ :host([compact]) #itemLink[level]:not([level="0"]) {
+ padding: calc( var(--item-padding) / 2);
+ }
+
+ :host(:not([compact])) #itemLink[level]:not([level="0"]) {
+ padding-left: calc(var(--icon-width) + var(--item-content-padding));
+ }
+
+ #itemLink[level]:not([level="0"]) #content {
+ display: block;
+ visibility: visible;
+ width: auto;
+ font-weight: 400;
+ font-size: var(--sub-item-font-size)
+ }
+
+ #overlay {
+ display: block;
+ left: 101%;
+ min-width: 200px;
+ padding: 4px 2px;
+ background-color: var(--overlay-background-color);
+ background-image: var(--overlay-background-image, none);
+ box-shadow: var(--overlay-box-shadow);
+ border: 1px solid var(--overlay-background-color);
+ border-left: 0;
+ border-radius: 0 3px 3px 0;
+ position: absolute;
+ z-index: 1;
+ animation: pop 200ms forwards;
+ }
+
+ @keyframes pop{
+ 0% {
+ transform: translateX(-5px);
+ opacity: 0.5;
+ }
+ 100% {
+ transform: translateX(0);
+ opacity: 1;
+ }
+ }
+`;
diff --git a/qortal-ui-core/src/functional-components/side-menu-item.js b/qortal-ui-core/src/functional-components/side-menu-item.js
new file mode 100644
index 00000000..8c869e5c
--- /dev/null
+++ b/qortal-ui-core/src/functional-components/side-menu-item.js
@@ -0,0 +1,210 @@
+import { LitElement, html, css } from 'lit'
+import { ifDefined } from 'lit/directives/if-defined.js'
+import { sideMenuItemStyle } from './side-menu-item-style.js'
+import '@vaadin/icon'
+import '@vaadin/icons'
+import '@polymer/paper-tooltip'
+
+export class SideMenuItem extends LitElement {
+ static get properties() {
+ return {
+ selected: { type: Boolean, reflect: true },
+ label: { type: String, reflect: true },
+ expanded: { type: Boolean, reflect: true },
+ compact: { type: Boolean, reflect: true },
+ href: { type: String, reflect: true },
+ target: { type: String, reflect: true }
+ }
+ }
+
+ static get styles() {
+ return css`
+ ${sideMenuItemStyle}
+ `
+ }
+
+ constructor() {
+ super()
+ this.selected = false
+ this.expanded = false
+ }
+
+ render() {
+ return html`
+ ${this._itemLinkTemplate()} ${this._tooltipTemplate()}
+ ${this._childrenTemplate()}
+ `
+ }
+
+ firstUpdated(changedProperties) {
+ if (!this.hasChildren()) {
+ return
+ }
+ this.collapseExpandIcon = document.createElement("vaadin-icon")
+ this.collapseExpandIcon.id = "collapse-button"
+ this.shadowRoot.getElementById("content").appendChild(this.collapseExpandIcon)
+ this._boundOutsideClickListener = this._outsideClickListener.bind(this)
+ }
+
+ _itemLinkTemplate() {
+ return html`
+
+
+ ${this.label}
+
+
+ `
+ }
+
+ _tooltipTemplate() {
+ return html`
+ ${this._getLevel === 0 && this.compact ? html`
+
+ ${this.label}
+
+ `
+ : undefined}
+ `
+ }
+
+ _childrenTemplate() {
+ return html`
+ ${this.expanded ? html`
+ ${this.compact ? html`
+
+ `
+ : html`
+
+ `}
+ `
+ : undefined}
+ `
+ }
+
+ updated(changedProperties) {
+ changedProperties.forEach((oldValue, propName) => {
+ if (propName === "compact") {
+ this._onCompactChanged()
+ }
+
+ if (propName === "expanded") {
+ this._onExpandedChanged()
+ }
+
+ if (propName === "selected"){
+ if (oldValue === this.selected){
+ return
+ }
+
+ if (this.selected) {
+ this._changeSelectedState(true)
+ this._markParentWithSelectedChild()
+ }
+ }
+ });
+ }
+
+ _onCompactChanged() {
+ this.expanded = false;
+
+ if (this.collapseExpandIcon == null) {
+ return;
+ }
+
+ if (!this.compact) {
+ this.collapseExpandIcon["icon"] = "vaadin:chevron-down-small"
+ } else {
+ this.collapseExpandIcon["icon"] = "vaadin:chevron-right-small"
+ }
+ }
+
+ _onExpandedChanged() {
+ if (this.collapseExpandIcon == null) {
+ return;
+ }
+
+ if (this.expanded) {
+ this._onHandleExpanded();
+ } else {
+ this._onHandleCollapsed();
+ }
+ }
+
+ _onHandleExpanded() {
+ if (!this.compact) {
+ this.collapseExpandIcon["icon"] = "vaadin:chevron-up-small"
+ } else {
+ this.collapseExpandIcon["icon"] = "vaadin:chevron-left-small"
+ document.addEventListener("click", this._boundOutsideClickListener, true)
+ }
+ }
+
+ _onHandleCollapsed() {
+ if (!this.compact) {
+ this.collapseExpandIcon["icon"] = "vaadin:chevron-down-small"
+ } else {
+ this.collapseExpandIcon["icon"] = "vaadin:chevron-right-small"
+ document.removeEventListener(
+ "click",
+ this._boundOutsideClickListener,
+ true
+ )
+ }
+ }
+
+ _onClick(e) {
+ if (!this.hasChildren()) {
+ this.selected = true
+ } else {
+ this.expanded = !this.expanded
+ e.preventDefault()
+ }
+ }
+
+ _outsideClickListener(event) {
+ const eventPath = event.composedPath()
+ if (eventPath.indexOf(this) < 0) {
+ this.expanded = false
+ }
+ }
+
+ _changeSelectedState(selected, sourceEvent) {
+ this.selected = selected
+ let evt = new CustomEvent("side-menu-item-select", {
+ bubbles: true,
+ cancelable: true,
+ detail: { sourceEvent: sourceEvent }
+ });
+ this.dispatchEvent(evt)
+ }
+
+ hasChildren() {
+ return !!this.querySelector("side-menu-item")
+ }
+
+ _markParentWithSelectedChild() {
+ let element = this.parentElement;
+ while (element instanceof SideMenuItem) {
+ element.setAttribute('hasSelectedChild', true)
+ element = element.parentElement;
+ }
+ }
+
+ get _getLevel() {
+ let level = 0
+ let element = this.parentElement
+ while (element instanceof SideMenuItem) {
+ level++;
+ element = element.parentElement
+ }
+ return level
+ }
+}
+
+window.customElements.define("side-menu-item", SideMenuItem);
diff --git a/qortal-ui-core/src/functional-components/side-menu.js b/qortal-ui-core/src/functional-components/side-menu.js
new file mode 100644
index 00000000..c3b08c24
--- /dev/null
+++ b/qortal-ui-core/src/functional-components/side-menu.js
@@ -0,0 +1,78 @@
+import {LitElement, html, css} from 'lit'
+
+class SideMenu extends LitElement {
+ static get properties() {
+ return {
+ items: {type: Array},
+ selectedValue: {type: String, reflect: true},
+ compact: {type: Boolean, reflect: true}
+ }
+ }
+
+ static get styles() {
+ return css`
+ nav {
+ padding: 0;
+ }
+
+ :host {
+ list-style: none;
+ width: 100%;
+ position: relative;
+ }
+
+ :host([compact]) {
+ width: auto;
+ }
+ `
+ }
+
+ constructor() {
+ super()
+ this.compact = false
+ }
+
+ render() {
+ return html`
+
+
+ `
+ }
+
+ firstUpdated(_changedProperties) {
+ this.items = [...this.querySelectorAll("side-menu-item")]
+ }
+
+ _handleSelect(event) {
+ let targetItem = event.target
+ this._deselectAllItems()
+ targetItem.selected = true
+ this.selectedValue = targetItem.label
+ }
+
+ _deselectAllItems() {
+ this.items.forEach(element => {
+ if (this.compact) {
+ element.expanded = false
+ }
+ element.selected = false
+ element.hasChildren() ? element.removeAttribute('hasSelectedChild') : undefined
+ });
+ }
+
+ updated(changedProperties) {
+ changedProperties.forEach((oldValue, propName) => {
+ if (propName === "compact") {
+ this.items.forEach(item => (item.compact = this.compact))
+ let evt = new CustomEvent("side-menu-compact-change", {
+ bubbles: true,
+ cancelable: true
+ })
+ this.dispatchEvent(evt)
+ }
+ })
+ }
+}
+
+window.customElements.define("side-menu", SideMenu);
diff --git a/qortal-ui-core/src/plugins/streams.js b/qortal-ui-core/src/plugins/streams.js
index 18bf5f53..ad6696d1 100644
--- a/qortal-ui-core/src/plugins/streams.js
+++ b/qortal-ui-core/src/plugins/streams.js
@@ -4,7 +4,7 @@ import { EpmlStream } from 'epml'
const LOGIN_STREAM_NAME = 'logged_in'
const CONFIG_STREAM_NAME = 'config'
const SELECTED_ADDRESS_STREAM_NAME = 'selected_address'
-// const APP_INFO_STATE = 'app_info_state'
+const APP_INFO_STATE = 'app_info_state'
const CHAT_HEADS_STREAM_NAME = 'chat_heads'
const NODE_CONFIG_STREAM_NAME = 'node_config'
const COPY_MENU_SWITCH = 'copy_menu_switch'
@@ -13,7 +13,7 @@ const FRAME_PASTE_MENU_SWITCH = 'frame_paste_menu_switch'
export const loggedInStream = new EpmlStream(LOGIN_STREAM_NAME, () => store.getState().app.loggedIn)
export const configStream = new EpmlStream(CONFIG_STREAM_NAME, () => store.getState().config)
export const selectedAddressStream = new EpmlStream(SELECTED_ADDRESS_STREAM_NAME, () => store.getState().app.selectedAddress)
-// export const appInfoStateStream = new EpmlStream(APP_INFO_STATE, () => store.getState().app.appInfo)
+export const appInfoStateStream = new EpmlStream(APP_INFO_STATE, () => store.getState().app.appInfo)
export const chatHeadsStateStream = new EpmlStream(CHAT_HEADS_STREAM_NAME, () => store.getState().app.chatHeads)
export const nodeConfigStream = new EpmlStream(NODE_CONFIG_STREAM_NAME, () => store.getState().app.nodeConfig)
export const copyMenuSwitchStream = new EpmlStream(COPY_MENU_SWITCH, () => store.getState().app.copyMenuSwitch)
@@ -59,8 +59,9 @@ store.subscribe(() => {
chatHeadsStateStream.emit(state.app.chatHeads)
}
- // if (oldState.app.appInfo !== state.app.appInfo) {
- // appInfoStateStream.emit(state.app.appInfo)
- // }
+ if (oldState.app.appInfo !== state.app.appInfo) {
+ appInfoStateStream.emit(state.app.appInfo)
+ }
+
oldState = state
})
diff --git a/qortal-ui-core/src/redux/app/actions/node-config.js b/qortal-ui-core/src/redux/app/actions/node-config.js
index 20612381..7c4be8c4 100644
--- a/qortal-ui-core/src/redux/app/actions/node-config.js
+++ b/qortal-ui-core/src/redux/app/actions/node-config.js
@@ -97,7 +97,7 @@ const obj4 = {
protocol: 'http',
domain: '127.0.0.1',
port: 62391,
- enableManagement: false
+ enableManagement: true
}
const obj5 = {
diff --git a/qortal-ui-core/src/redux/config/config-reducer.js b/qortal-ui-core/src/redux/config/config-reducer.js
index 9dc83059..5a53f4d1 100644
--- a/qortal-ui-core/src/redux/config/config-reducer.js
+++ b/qortal-ui-core/src/redux/config/config-reducer.js
@@ -17,7 +17,6 @@ const DEFAULT_INITIAL_STATE = {
},
user: {
language: 'english',
- theme: 'light',
server: {},
node: 0,
knownNodes: [{}]
diff --git a/qortal-ui-core/src/styles/switch-theme.css b/qortal-ui-core/src/styles/switch-theme.css
index b215560b..993e68f3 100644
--- a/qortal-ui-core/src/styles/switch-theme.css
+++ b/qortal-ui-core/src/styles/switch-theme.css
@@ -1,16 +1,67 @@
html {
- /* color pallet */
--white: #ffffff;
--black: #080808;
--gray: #c8c8c8;
--graylight: #bbbbbb;
--plugback: #ffffff;
+ --border: #d0d6de;
+ --border2: #dde2e8;
+ --copybutton: #707584;
+ --sectxt: #576374;
+ --vdicon: #707b8a;
+ --tradehead: #6a6c75;
+ --tradeborder: #666666;
+ --tradehave: #555555;
+ --txtfieldborder: #666666;
+ --txtfieldhoverborder: #00000;
+ --relaynodetxt: #646464;
+ --menuhover: #eeeeee;
+ --menuactive: #ebebeb;
+ --mainmenutext:#080808;
+ --mainmenutexthover:#080808;
+ --switchbackground: #666666;
+ --switchborder: #333333;
+ --sidetopbar: #ffffff;
+ --nav-selected-color: #dddddd;
+ --nav-selected-color-text: #333333;
+ --nav-color-active: #d1d1d1;
+ --nav-color-hover: #eeeeee;
+ --nav-text-color: #080808;
+ --nav-icon-color: #080808;
+ --nav-border-color: #eeeeee;
+ --nav-border-selected-color: #03a9f4;
}
html[theme="dark"] {
- --white: #36393f;
- --black: #f8f8f8;
+ --white: #0f1a2e;
+ --black: #c9d2d9;
--gray: #d8d8d8;
- --graylight: #dddddd;
- --plugback: #36393f;
+ --graylight: #0b305e;
+ --plugback: #0f1a2e;
+ --border: #0b305e;
+ --border2: #0b305e;
+ --copybutton: #d0d6de;
+ --sectxt: #bbc3cd;
+ --vdicon: #d0d6de;
+ --tradehead: #008fd5;
+ --tradeborder: #0b305e;
+ --tradehave: #dddddd;
+ --txtfieldborder: #0b305e;
+ --txtfieldhoverborder: #ffffff;
+ --relaynodetxt: #d4d4d4;
+ --menuhover: #008fd5;
+ --menuactive: #008fd5;
+ --mainmenutext:#008fd5;
+ --mainmenutexthover:#0f1a2e;
+ --switchbackground: #eeeeee;
+ --switchborder: #03a9f4;
+ --sidetopbar: #070d19;
+ --nav-selected-color: #0f1a2e;
+ --nav-selected-color-text: #76c8f5;
+ --nav-color-active: #d1d1d1;
+ --nav-color-hover: #444444;
+ --nav-text-color: #008fd5;
+ --nav-icon-color: #008fd5;
+ --nav-border-color: #0b305e;
+ --nav-border-selected-color: #76c8f5;
}
diff --git a/qortal-ui-plugins/package.json b/qortal-ui-plugins/package.json
index f063434d..5a0944c1 100644
--- a/qortal-ui-plugins/package.json
+++ b/qortal-ui-plugins/package.json
@@ -45,7 +45,7 @@
"epml": "^0.3.3",
"html-escaper": "^3.0.3",
"lit": "^2.2.0",
- "rollup": "^2.68.0",
+ "rollup": "^2.70.0",
"rollup-plugin-node-globals": "^1.4.0",
"rollup-plugin-progress": "^1.1.2",
"rollup-plugin-terser": "^7.0.2"
diff --git a/qortal-ui-plugins/plugins/core/components/ChatWelcomePage.js b/qortal-ui-plugins/plugins/core/components/ChatWelcomePage.js
index ff26a780..38a77eb8 100644
--- a/qortal-ui-plugins/plugins/core/components/ChatWelcomePage.js
+++ b/qortal-ui-plugins/plugins/core/components/ChatWelcomePage.js
@@ -239,9 +239,11 @@ class ChatWelcomePage extends LitElement {
firstUpdated() {
+ this.changeTheme()
+
setInterval(() => {
this.changeTheme();
- }, 250)
+ }, 100)
const stopKeyEventPropagation = (e) => {
e.stopPropagation();
diff --git a/qortal-ui-plugins/plugins/core/group-management/group-management.src.js b/qortal-ui-plugins/plugins/core/group-management/group-management.src.js
index a8a2fbd5..76995965 100644
--- a/qortal-ui-plugins/plugins/core/group-management/group-management.src.js
+++ b/qortal-ui-plugins/plugins/core/group-management/group-management.src.js
@@ -429,6 +429,8 @@ class GroupManagement extends LitElement {
firstUpdated() {
+ this.changeTheme()
+
setInterval(() => {
this.changeTheme();
}, 100)
diff --git a/qortal-ui-plugins/plugins/core/main.src.js b/qortal-ui-plugins/plugins/core/main.src.js
index 9967f31e..840862e2 100644
--- a/qortal-ui-plugins/plugins/core/main.src.js
+++ b/qortal-ui-plugins/plugins/core/main.src.js
@@ -13,7 +13,7 @@ parentEpml.ready().then(() => {
domain: 'core',
page: 'minting/index.html',
title: 'Minting Details',
- icon: 'info',
+ icon: 'vaadin:info-circle',
menus: [],
parent: false
},
@@ -22,7 +22,7 @@ parentEpml.ready().then(() => {
domain: 'core',
page: 'wallet/index.html',
title: 'Wallet',
- icon: 'account_balance_wallet',
+ icon: 'vaadin:wallet',
menus: [],
parent: false
},
@@ -31,7 +31,7 @@ parentEpml.ready().then(() => {
domain: 'core',
page: 'send-coin/index.html',
title: 'Send Coin',
- icon: 'send',
+ icon: 'vaadin:coin-piles',
menus: [],
parent: false
},
@@ -40,7 +40,7 @@ parentEpml.ready().then(() => {
domain: 'core',
page: 'trade-portal/index.html',
title: 'Trade Portal',
- icon: 'toc',
+ icon: 'vaadin:bullets',
menus: [],
parent: false
},
@@ -49,7 +49,7 @@ parentEpml.ready().then(() => {
domain: 'core',
page: 'reward-share/index.html',
title: 'Reward Share',
- icon: 'call_split',
+ icon: 'vaadin:share-square',
menus: [],
parent: false
},
@@ -58,7 +58,7 @@ parentEpml.ready().then(() => {
domain: 'core',
page: 'name-registration/index.html',
title: 'Name Registration',
- icon: 'assignment_ind',
+ icon: 'vaadin:user-check',
menus: [],
parent: false
},
@@ -67,7 +67,7 @@ parentEpml.ready().then(() => {
domain: 'core',
page: 'qdn/index.html',
title: 'Websites',
- icon: 'computer',
+ icon: 'vaadin:desktop',
menus: [],
parent: false
},
@@ -76,7 +76,7 @@ parentEpml.ready().then(() => {
domain: 'core',
page: 'qdn/data-management/index.html',
title: 'Data Management',
- icon: 'dns',
+ icon: 'vaadin:database',
menus: [],
parent: false
},
@@ -85,7 +85,7 @@ parentEpml.ready().then(() => {
domain: 'core',
page: 'messaging/q-chat/index.html',
title: 'Q-Chat',
- icon: 'message',
+ icon: 'vaadin:chat',
menus: [],
parent: false
},
@@ -94,7 +94,7 @@ parentEpml.ready().then(() => {
domain: 'core',
page: 'group-management/index.html',
title: 'Group Management',
- icon: 'group',
+ icon: 'vaadin:group',
menus: [],
parent: false
},
@@ -103,7 +103,7 @@ parentEpml.ready().then(() => {
domain: 'core',
page: 'puzzles/index.html',
title: 'Puzzles',
- icon: 'extension',
+ icon: 'vaadin:puzzle-piece',
menus: [],
parent: false
}
@@ -127,7 +127,7 @@ parentEpml.ready().then(() => {
domain: 'core',
page: 'node-management/index.html',
title: 'Node Management',
- icon: 'cloud',
+ icon: 'vaadin:cloud',
menus: [],
parent: false
}
diff --git a/qortal-ui-plugins/plugins/core/messaging/chain-messaging/chain-messaging.src.js b/qortal-ui-plugins/plugins/core/messaging/chain-messaging/chain-messaging.src.js
index 3b301e28..c95668ef 100644
--- a/qortal-ui-plugins/plugins/core/messaging/chain-messaging/chain-messaging.src.js
+++ b/qortal-ui-plugins/plugins/core/messaging/chain-messaging/chain-messaging.src.js
@@ -3,7 +3,8 @@ import { LitElement, html, css } from 'lit'
class ChainMessaging extends LitElement {
static get properties() {
return {
- loading: { type: Boolean }
+ loading: { type: Boolean },
+ theme: { type: String, reflect: true }
}
}
@@ -22,7 +23,7 @@ class ChainMessaging extends LitElement {
}
#chain-messaging-page {
- background:#fff;
+ background: var(--white);
}
`
@@ -30,18 +31,25 @@ class ChainMessaging extends LitElement {
constructor() {
super()
+ this.theme = localStorage.getItem('qortalTheme') ? localStorage.getItem('qortalTheme') : 'light'
}
render() {
return html`
-
Coming Soon!
+ Coming Soon!
`
}
firstUpdated() {
+ this.changeTheme()
+
+ setInterval(() => {
+ this.changeTheme();
+ }, 100)
+
window.addEventListener("contextmenu", (event) => {
event.preventDefault();
});
@@ -55,6 +63,16 @@ class ChainMessaging extends LitElement {
}
}
+ changeTheme() {
+ const checkTheme = localStorage.getItem('qortalTheme')
+ if (checkTheme === 'dark') {
+ this.theme = 'dark';
+ } else {
+ this.theme = 'light';
+ }
+ document.querySelector('html').setAttribute('theme', this.theme);
+ }
+
isEmptyArray(arr) {
if (!arr) { return true }
return arr.length === 0
diff --git a/qortal-ui-plugins/plugins/core/messaging/chain-messaging/index.html b/qortal-ui-plugins/plugins/core/messaging/chain-messaging/index.html
index ff935638..8c089c59 100644
--- a/qortal-ui-plugins/plugins/core/messaging/chain-messaging/index.html
+++ b/qortal-ui-plugins/plugins/core/messaging/chain-messaging/index.html
@@ -3,6 +3,7 @@
+
diff --git a/qortal-ui-plugins/plugins/core/messaging/messaging.src.js b/qortal-ui-plugins/plugins/core/messaging/messaging.src.js
index 68ebe567..fa98bf55 100644
--- a/qortal-ui-plugins/plugins/core/messaging/messaging.src.js
+++ b/qortal-ui-plugins/plugins/core/messaging/messaging.src.js
@@ -136,6 +136,8 @@ class Messaging extends LitElement {
firstUpdated() {
+ this.changeTheme()
+
setInterval(() => {
this.changeTheme();
}, 100)
diff --git a/qortal-ui-plugins/plugins/core/messaging/q-chat/q-chat.src.js b/qortal-ui-plugins/plugins/core/messaging/q-chat/q-chat.src.js
index 61206236..41b883a7 100644
--- a/qortal-ui-plugins/plugins/core/messaging/q-chat/q-chat.src.js
+++ b/qortal-ui-plugins/plugins/core/messaging/q-chat/q-chat.src.js
@@ -345,9 +345,11 @@ class Chat extends LitElement {
firstUpdated() {
+ this.changeTheme()
+
setInterval(() => {
this.changeTheme();
- }, 250)
+ }, 100)
const stopKeyEventPropagation = (e) => {
e.stopPropagation();
diff --git a/qortal-ui-plugins/plugins/core/minting/minting-info.src.js b/qortal-ui-plugins/plugins/core/minting/minting-info.src.js
index ee8784bf..1a41d45a 100644
--- a/qortal-ui-plugins/plugins/core/minting/minting-info.src.js
+++ b/qortal-ui-plugins/plugins/core/minting/minting-info.src.js
@@ -358,6 +358,8 @@ class MintingInfo extends LitElement {
firstUpdated() {
+ this.changeTheme()
+
setInterval(() => {
this.changeTheme();
}, 100)
diff --git a/qortal-ui-plugins/plugins/core/name-registration/name-registration.src.js b/qortal-ui-plugins/plugins/core/name-registration/name-registration.src.js
index acba8ff6..1d3f37f1 100644
--- a/qortal-ui-plugins/plugins/core/name-registration/name-registration.src.js
+++ b/qortal-ui-plugins/plugins/core/name-registration/name-registration.src.js
@@ -159,6 +159,8 @@ class NameRegistration extends LitElement {
firstUpdated() {
+ this.changeTheme()
+
setInterval(() => {
this.changeTheme();
}, 100)
diff --git a/qortal-ui-plugins/plugins/core/node-management/node-management.src.js b/qortal-ui-plugins/plugins/core/node-management/node-management.src.js
index 9915a034..d6a4d39b 100644
--- a/qortal-ui-plugins/plugins/core/node-management/node-management.src.js
+++ b/qortal-ui-plugins/plugins/core/node-management/node-management.src.js
@@ -287,6 +287,8 @@ class NodeManagement extends LitElement {
firstUpdated() {
+ this.changeTheme()
+
setInterval(() => {
this.changeTheme();
}, 100)
diff --git a/qortal-ui-plugins/plugins/core/puzzles/puzzles.src.js b/qortal-ui-plugins/plugins/core/puzzles/puzzles.src.js
index 6351e370..d218570a 100644
--- a/qortal-ui-plugins/plugins/core/puzzles/puzzles.src.js
+++ b/qortal-ui-plugins/plugins/core/puzzles/puzzles.src.js
@@ -171,6 +171,8 @@ class Puzzles extends LitElement {
firstUpdated() {
+ this.changeTheme()
+
setInterval(() => {
this.changeTheme();
}, 100)
diff --git a/qortal-ui-plugins/plugins/core/qdn/browser/browser.src.js b/qortal-ui-plugins/plugins/core/qdn/browser/browser.src.js
index 87a9f11b..7f2a2514 100644
--- a/qortal-ui-plugins/plugins/core/qdn/browser/browser.src.js
+++ b/qortal-ui-plugins/plugins/core/qdn/browser/browser.src.js
@@ -131,7 +131,7 @@ class WebBrowser extends LitElement {
const render = () => {
const myNode = window.parent.reduxStore.getState().app.nodeConfig.knownNodes[window.parent.reduxStore.getState().app.nodeConfig.node]
const nodeUrl = myNode.protocol + '://' + myNode.domain + ':' + myNode.port
- this.url = `${nodeUrl}/render/${this.service}/${this.name}`;
+ this.url = `${nodeUrl}/render/${this.service}/${this.name}?theme=${this.theme}`;
}
const authorizeAndRender = () => {
@@ -203,6 +203,8 @@ class WebBrowser extends LitElement {
firstUpdated() {
+ this.changeTheme()
+
setInterval(() => {
this.changeTheme();
}, 100)
diff --git a/qortal-ui-plugins/plugins/core/qdn/publish/index.html b/qortal-ui-plugins/plugins/core/qdn/publish/index.html
index 41c23a29..318b76a3 100644
--- a/qortal-ui-plugins/plugins/core/qdn/publish/index.html
+++ b/qortal-ui-plugins/plugins/core/qdn/publish/index.html
@@ -3,6 +3,7 @@
+
diff --git a/qortal-ui-plugins/plugins/core/qdn/publish/publish.src.js b/qortal-ui-plugins/plugins/core/qdn/publish/publish.src.js
index 25c86b2d..03387e85 100644
--- a/qortal-ui-plugins/plugins/core/qdn/publish/publish.src.js
+++ b/qortal-ui-plugins/plugins/core/qdn/publish/publish.src.js
@@ -37,7 +37,8 @@ class PublishData extends LitElement {
successMessage: { type: String },
errorMessage: { type: String },
loading: { type: Boolean },
- btnDisable: { type: Boolean }
+ btnDisable: { type: Boolean },
+ theme: { type: String, reflect: true }
}
}
@@ -51,6 +52,16 @@ class PublishData extends LitElement {
--mdc-theme-primary: rgb(3, 169, 244);
--mdc-theme-secondary: var(--mdc-theme-primary);
--paper-input-container-focus-color: var(--mdc-theme-primary);
+ --lumo-primary-text-color: rgb(0, 167, 245);
+ --lumo-primary-color-50pct: rgba(0, 167, 245, 0.5);
+ --lumo-primary-color-10pct: rgba(0, 167, 245, 0.1);
+ --lumo-primary-color: hsl(199, 100%, 48%);
+ --lumo-base-color: var(--white);
+ --lumo-body-text-color: var(--black);
+ --lumo-secondary-text-color: var(--sectxt);
+ --lumo-contrast-60pct: var(--vdicon);
+ --_lumo-grid-border-color: var(--border);
+ --_lumo-grid-secondary-border-color: var(--border2);
}
#publishWrapper paper-button {
@@ -72,6 +83,7 @@ class PublishData extends LitElement {
.upload-text {
display: block;
font-size: 14px;
+ color: var(--black);
}
.address-bar {
@@ -80,7 +92,7 @@ class PublishData extends LitElement {
left: 0;
right: 0;
height: 100px;
- background-color: white;
+ background-color: var(--white);
height: 36px;
}
@@ -90,24 +102,136 @@ class PublishData extends LitElement {
`
}
+ constructor() {
+ super()
+
+ this.showName = false;
+ this.showService = false
+ this.showIdentifier = false
+ this.showMetadata = false
+
+ const urlParams = new URLSearchParams(window.location.search)
+ this.name = urlParams.get('name')
+ this.service = urlParams.get('service')
+ this.identifier = urlParams.get('identifier')
+ this.category = urlParams.get('category')
+ this.uploadType = urlParams.get('uploadType') !== "null" ? urlParams.get('uploadType') : "file"
+
+ if (urlParams.get('showName') === "true") {
+ this.showName = true
+ }
+ if (urlParams.get('showService') === "true") {
+ this.showService = true
+ }
+ if (urlParams.get('showIdentifier') === "true") {
+ this.showIdentifier = true
+ }
+ if (urlParams.get('showMetadata') === "true") {
+ this.showMetadata = true
+ }
+
+ if (this.identifier != null) {
+ if (this.identifier === "null" || this.identifier.trim().length == 0) {
+ this.identifier = null
+ }
+ }
+
+ // Default to true so the message doesn't appear and disappear quickly
+ this.portForwardingEnabled = true
+ this.names = []
+ this.myRegisteredName = ''
+ this.selectedName = 'invalid'
+ this.path = ''
+ this.successMessage = ''
+ this.generalMessage = ''
+ this.errorMessage = ''
+ this.loading = false
+ this.btnDisable = false
+ this.theme = localStorage.getItem('qortalTheme') ? localStorage.getItem('qortalTheme') : 'light'
+
+ const fetchNames = () => {
+ parentEpml.request('apiCall', {
+ url: `/names/address/${this.selectedAddress.address}?limit=0&reverse=true`
+ }).then(res => {
+
+ setTimeout(() => {
+ this.names = res
+ if (res[0] != null) {
+ this.myRegisteredName = res[0].name;
+ }
+ }, 1)
+ })
+ setTimeout(fetchNames, this.config.user.nodeSettings.pingInterval)
+ }
+
+ const fetchCategories = () => {
+ parentEpml.request('apiCall', {
+ url: `/arbitrary/categories`
+ }).then(res => {
+
+ setTimeout(() => {
+ this.categories = res
+ }, 1)
+ })
+ }
+
+ const fetchPeersSummary = () => {
+ parentEpml.request('apiCall', {
+ url: `/peers/summary`
+ }).then(res => {
+
+ setTimeout(() => {
+ this.portForwardingEnabled = (res.inboundConnections != null && res.inboundConnections > 0);
+ }, 1)
+ })
+ setTimeout(fetchPeersSummary, this.config.user.nodeSettings.pingInterval)
+ }
+
+ let configLoaded = false
+ parentEpml.ready().then(() => {
+ parentEpml.subscribe('selected_address', async selectedAddress => {
+ this.selectedAddress = {}
+ selectedAddress = JSON.parse(selectedAddress)
+ if (!selectedAddress || Object.entries(selectedAddress).length === 0) return
+ this.selectedAddress = selectedAddress
+ })
+ parentEpml.subscribe('config', c => {
+ if (!configLoaded) {
+ setTimeout(fetchNames, 1)
+ setTimeout(fetchCategories, 1)
+ setTimeout(fetchPeersSummary, 1)
+ configLoaded = true
+ }
+ this.config = JSON.parse(c)
+ })
+ parentEpml.subscribe('copy_menu_switch', async value => {
+
+ if (value === 'false' && window.getSelection().toString().length !== 0) {
+
+ this.clearSelection()
+ }
+ })
+ })
+ }
+
render() {
return html`
-
-
-
- this.goBack()} class="address-bar-button">arrow_back_ios Back
-
-
-
-
Publish / Update ${this.category}
-
Note: it is recommended that you set up port forwarding before hosting data, so that it can more easily accessed by peers on the network.
-
+
+
+ this.goBack()} class="address-bar-button">arrow_back_ios Back
+
+
+
+
Publish / Update ${this.category}
+
Note: it is recommended that you set up port forwarding before hosting data, so that it can more easily accessed by peers on the network.
+
this.selectName(e)} style="min-width: 130px; max-width:100%; width:100%;">
${this.registeredName}
+ ${this.myRegisteredName}
@@ -143,7 +267,7 @@ class PublishData extends LitElement {
-
${this.generalMessage}
+
${this.generalMessage}
${this.errorMessage}
${this.successMessage}
@@ -156,11 +280,45 @@ class PublishData extends LitElement {
- `
+
+ `
+ }
+
+ firstUpdated() {
+
+ this.changeTheme()
+
+ setInterval(() => {
+ this.changeTheme();
+ }, 100)
+
+ window.addEventListener('contextmenu', (event) => {
+ event.preventDefault()
+ this._textMenu(event)
+ })
+
+ window.addEventListener('click', () => {
+ parentEpml.request('closeCopyTextMenu', null)
+ })
+
+ window.onkeyup = (e) => {
+ if (e.keyCode === 27) {
+ parentEpml.request('closeCopyTextMenu', null)
+ }
+ }
+ }
+
+ changeTheme() {
+ const checkTheme = localStorage.getItem('qortalTheme')
+ if (checkTheme === 'dark') {
+ this.theme = 'dark';
+ } else {
+ this.theme = 'light';
+ }
+ document.querySelector('html').setAttribute('theme', this.theme);
}
// Navigation
-
goBack() {
window.history.back();
}
@@ -169,13 +327,13 @@ class PublishData extends LitElement {
renderUploadField() {
if (this.uploadType === "file") {
return html`
-
`;
}
else if (this.uploadType === "zip") {
return html`
Select zip file containing static content:
`;
}
else {
@@ -332,7 +490,6 @@ class PublishData extends LitElement {
url: `${uploadDataUrl}`,
body: `${postBody}`,
})
-
return uploadDataRes
}
@@ -343,7 +500,6 @@ class PublishData extends LitElement {
url: `/transactions/convert`,
body: `${transactionBytesBase58}`,
})
-
return convertedBytes
}
@@ -386,20 +542,11 @@ class PublishData extends LitElement {
else {
myResponse = response
}
-
return myResponse
}
-
validate()
}
-
- // Helper Functions (Re-Used in Most part of the UI )
-
- textColor(color) {
- return color == 'light' ? 'rgba(255,255,255,0.7)' : 'rgba(0,0,0,0.87)'
- }
-
_textMenu(event) {
const getSelectedText = () => {
var text = ''
@@ -421,141 +568,9 @@ class PublishData extends LitElement {
parentEpml.request('openCopyTextMenu', textMenuObject)
}
}
-
checkSelectedTextAndShowMenu()
}
- constructor() {
- super()
-
- this.showName = false;
- this.showService = false
- this.showIdentifier = false
- this.showMetadata = false;
-
- const urlParams = new URLSearchParams(window.location.search)
- this.name = urlParams.get('name')
- this.service = urlParams.get('service')
- this.identifier = urlParams.get('identifier')
- this.category = urlParams.get('category')
- this.uploadType = urlParams.get('uploadType') !== "null" ? urlParams.get('uploadType') : "file"
-
- if (urlParams.get('showName') === "true") {
- this.showName = true
- }
- if (urlParams.get('showService') === "true") {
- this.showService = true
- }
- if (urlParams.get('showIdentifier') === "true") {
- this.showIdentifier = true
- }
- if (urlParams.get('showMetadata') === "true") {
- this.showMetadata = true
- }
-
- if (this.identifier != null) {
- if (this.identifier === "null" || this.identifier.trim().length == 0) {
- this.identifier = null
- }
- }
-
- this.categories = [];
- this.tags = ["tag 1", "tag 2", "tag 3", "tag 4", "tag 5"];
-
- // Default to true so the message doesn't appear and disappear quickly
- this.portForwardingEnabled = true
- this.names = []
- this.myRegisteredName = ''
- this.selectedName = 'invalid'
- this.path = ''
- this.successMessage = ''
- this.generalMessage = ''
- this.errorMessage = ''
- this.loading = false
- this.btnDisable = false
-
- const fetchNames = () => {
- parentEpml.request('apiCall', {
- url: `/names/address/${this.selectedAddress.address}?limit=0&reverse=true`
- }).then(res => {
-
- setTimeout(() => {
- this.names = res
- if (res[0] != null) {
- this.myRegisteredName = res[0].name;
- }
- }, 1)
- })
- setTimeout(fetchNames, this.config.user.nodeSettings.pingInterval)
- }
-
- const fetchCategories = () => {
- parentEpml.request('apiCall', {
- url: `/arbitrary/categories`
- }).then(res => {
-
- setTimeout(() => {
- this.categories = res
- }, 1)
- })
- }
-
- const fetchPeersSummary = () => {
- parentEpml.request('apiCall', {
- url: `/peers/summary`
- }).then(res => {
-
- setTimeout(() => {
- this.portForwardingEnabled = (res.inboundConnections != null && res.inboundConnections > 0);
- }, 1)
- })
- setTimeout(fetchPeersSummary, this.config.user.nodeSettings.pingInterval)
- }
-
- let configLoaded = false
- parentEpml.ready().then(() => {
- parentEpml.subscribe('selected_address', async selectedAddress => {
- this.selectedAddress = {}
- selectedAddress = JSON.parse(selectedAddress)
- if (!selectedAddress || Object.entries(selectedAddress).length === 0) return
- this.selectedAddress = selectedAddress
- })
- parentEpml.subscribe('config', c => {
- if (!configLoaded) {
- setTimeout(fetchNames, 1)
- setTimeout(fetchCategories, 1)
- setTimeout(fetchPeersSummary, 1)
- configLoaded = true
- }
- this.config = JSON.parse(c)
- })
- parentEpml.subscribe('copy_menu_switch', async value => {
-
- if (value === 'false' && window.getSelection().toString().length !== 0) {
-
- this.clearSelection()
- }
- })
- })
- }
-
- firstUpdated() {
-
- window.addEventListener('contextmenu', (event) => {
- event.preventDefault()
- this._textMenu(event)
- })
-
- window.addEventListener('click', () => {
- parentEpml.request('closeCopyTextMenu', null)
- })
-
- window.onkeyup = (e) => {
- if (e.keyCode === 27) {
- parentEpml.request('closeCopyTextMenu', null)
- }
- }
- }
fetchResourceMetadata() {
let identifier = this.identifier != null ? this.identifier : "default";
@@ -575,11 +590,10 @@ class PublishData extends LitElement {
}, 1)
})
}
-
- selectName() {
- const name = this.shadowRoot.getElementById('registeredName').value
- this.selectedName = name
- this.name = name
+ selectName(e) {
+ let name = this.shadowRoot.getElementById('registeredName')
+ this.selectedName = (name.value)
+ this.name = (name.value)
this.fetchResourceMetadata();
}
diff --git a/qortal-ui-plugins/plugins/core/qdn/websites.src.js b/qortal-ui-plugins/plugins/core/qdn/websites.src.js
index 0cad235b..6c3bd5cc 100644
--- a/qortal-ui-plugins/plugins/core/qdn/websites.src.js
+++ b/qortal-ui-plugins/plugins/core/qdn/websites.src.js
@@ -400,6 +400,8 @@ class Websites extends LitElement {
firstUpdated() {
+ this.changeTheme()
+
setInterval(() => {
this.changeTheme();
}, 100)
@@ -416,7 +418,7 @@ class Websites extends LitElement {
})
this.followedNames = followedNames
- setTimeout(getFollowedNames, 60000)
+ setTimeout(getFollowedNames, 120000)
}
const getBlockedNames = async () => {
@@ -425,7 +427,7 @@ class Websites extends LitElement {
})
this.blockedNames = blockedNames
- setTimeout(getBlockedNames, 60000)
+ setTimeout(getBlockedNames, 120000)
}
const getWebFollowedNames = async () => {
@@ -434,7 +436,7 @@ class Websites extends LitElement {
})
this.webFollowedNames = webFollowedNames
- setTimeout(getWebFollowedNames, 60000)
+ setTimeout(getWebFollowedNames, 120000)
}
const getWebBlockedNames = async () => {
@@ -443,7 +445,7 @@ class Websites extends LitElement {
})
this.webBlockedNames = webBlockedNames
- setTimeout(getWebBlockedNames, 60000)
+ setTimeout(getWebBlockedNames, 120000)
}
const getBlockFollowedNames = async () => {
@@ -452,7 +454,7 @@ class Websites extends LitElement {
})
this.blockFollowedNames = blockFollowedNames
- setTimeout(getBlockFollowedNames, 60000)
+ setTimeout(getBlockFollowedNames, 120000)
}
const getBlockBlockedNames = async () => {
@@ -461,7 +463,7 @@ class Websites extends LitElement {
})
this.blockBlockedNames = blockBlockedNames
- setTimeout(getBlockBlockedNames, 60000)
+ setTimeout(getBlockBlockedNames, 120000)
}
const getSearchFollowedNames = async () => {
@@ -470,7 +472,7 @@ class Websites extends LitElement {
})
this.searchFollowedNames = searchFollowedNames
- setTimeout(getSearchFollowedNames, 60000)
+ setTimeout(getSearchFollowedNames, 120000)
}
const getSearchBlockedNames = async () => {
@@ -479,7 +481,7 @@ class Websites extends LitElement {
})
this.searchBlockedNames = searchBlockedNames
- setTimeout(getSearchBlockedNames, 60000)
+ setTimeout(getSearchBlockedNames, 120000)
}
const getRelayMode = async () => {
@@ -488,7 +490,7 @@ class Websites extends LitElement {
})
this.relayMode = relayMode;
- setTimeout(getRelayMode, 60000)
+ setTimeout(getRelayMode, 120000)
}
window.addEventListener("contextmenu", (event) => {
@@ -530,8 +532,8 @@ class Websites extends LitElement {
setTimeout(getSearchBlockedNames, 1)
setTimeout(getRelayMode, 1)
setInterval(this.getArbitraryResources, 120000)
- setInterval(this.getFollowedWebsites, 60000)
- setInterval(this.getBlockedWebsites, 60000)
+ setInterval(this.getFollowedWebsites, 120000)
+ setInterval(this.getBlockedWebsites, 120000)
configLoaded = true
}
this.config = JSON.parse(c)
diff --git a/qortal-ui-plugins/plugins/core/reward-share/reward-share.src.js b/qortal-ui-plugins/plugins/core/reward-share/reward-share.src.js
index 2b8bff8c..454a6b3d 100644
--- a/qortal-ui-plugins/plugins/core/reward-share/reward-share.src.js
+++ b/qortal-ui-plugins/plugins/core/reward-share/reward-share.src.js
@@ -165,6 +165,8 @@ class RewardShare extends LitElement {
firstUpdated() {
+ this.changeTheme()
+
setInterval(() => {
this.changeTheme();
}, 100)
diff --git a/qortal-ui-plugins/plugins/core/send-coin/send-coin.src.js b/qortal-ui-plugins/plugins/core/send-coin/send-coin.src.js
index ab0bbe43..0381c714 100644
--- a/qortal-ui-plugins/plugins/core/send-coin/send-coin.src.js
+++ b/qortal-ui-plugins/plugins/core/send-coin/send-coin.src.js
@@ -275,6 +275,8 @@ class SendMoneyPage extends LitElement {
firstUpdated() {
+ this.changeTheme()
+
setInterval(() => {
this.changeTheme();
}, 100)
diff --git a/qortal-ui-plugins/plugins/core/trade-portal/trade-portal.src.js b/qortal-ui-plugins/plugins/core/trade-portal/trade-portal.src.js
index ebfdb2e1..affbd1e6 100644
--- a/qortal-ui-plugins/plugins/core/trade-portal/trade-portal.src.js
+++ b/qortal-ui-plugins/plugins/core/trade-portal/trade-portal.src.js
@@ -855,8 +855,11 @@ class TradePortal extends LitElement {
}
firstUpdated() {
+
let _this = this
+ this.changeTheme()
+
setInterval(() => {
this.changeTheme();
}, 100)
diff --git a/qortal-ui-plugins/plugins/core/wallet/wallet-app.src.js b/qortal-ui-plugins/plugins/core/wallet/wallet-app.src.js
index 43f671ad..e21beca0 100644
--- a/qortal-ui-plugins/plugins/core/wallet/wallet-app.src.js
+++ b/qortal-ui-plugins/plugins/core/wallet/wallet-app.src.js
@@ -660,6 +660,8 @@ class MultiWallet extends LitElement {
firstUpdated() {
+ this.changeTheme()
+
setInterval(() => {
this.changeTheme();
}, 100)