Dark mode feature (#16)

* added toggle dark mode button on settings page, new logo and CSS file for dark mode

* change colors of settings_input for dark mode

* added the dark_mode flag in every templateData (very painfully)

* Using ui.json to store all UI settings, darkmode implementation is cleaner

* moved all CSS and JS links to head.html; imported ui_settigns appropriately; created dark version of bitcoind CSS

* subheader color on lnd page

* save ui.json on both HDD and mynode for redundancy

* use head and logo template in new config and login pages

* add ui_settings to templateData for new login and config pages

* avoid repeating CSS for dark theme

* change colors of config textarea

* wrap ui setting hdd write in TRY/except

* group similar CSS commands

rootfs/standard/var/www/mynode/bitcoin_cli.py

@@ -1,6 +1,7 @@
 from flask import Blueprint, render_template, session, abort, Markup, request, redirect
 from bitcoinrpc.authproxy import AuthServiceProxy, JSONRPCException
 from pprint import pprint, pformat
+from settings import read_ui_settings
 from user_management import check_logged_in
 import json
 import time
@@ -34,6 +35,7 @@ def bitcoincli():
 
     # Load page
     templateData = {
-        "title": "myNode Bitcoin CLI"
+        "title": "myNode Bitcoin CLI",
+        "ui_settings": read_ui_settings()
     }
     return render_template('bitcoin_cli.html', **templateData)

rootfs/standard/var/www/mynode/bitcoind.py

@@ -6,6 +6,7 @@ from device_info import *
 #from bitcoin.wallet import *
 from subprocess import check_output, check_call
 from electrum_functions import *
+from settings import read_ui_settings
 from user_management import check_logged_in
 import socket
 import hashlib
@@ -158,7 +159,8 @@ def bitcoind_status_page():
     except Exception as e:
         templateData = {
             "title": "myNode Bitcoin Error",
-            "message": Markup("Error communicating with bitcoind. Node may be busy syncing.<br/><br/>{}".format(str(e)))
+            "message": Markup("Error communicating with bitcoind. Node may be busy syncing.<br/><br/>{}".format(str(e))),
+            "ui_settings": read_ui_settings()
         }
         return render_template('bitcoind_status_error.html', **templateData)
 
@@ -173,7 +175,8 @@ def bitcoind_status_page():
         "disk_size": (int(info["size_on_disk"]) / 1000 / 1000 / 1000),
         "mempool_tx": mempool["size"],
         "mempool_size": "{:.3} MB".format(float(mempool["bytes"]) / 1000 / 1000),
-        "version": version
+        "version": version,
+        "ui_settings": read_ui_settings()
     }
     return render_template('bitcoind_status.html', **templateData)
 
@@ -212,7 +215,8 @@ def bitcoind_config_page():
         templateData = {
             "title": "myNode Reboot",
             "header_text": "Restarting",
-            "subheader_text": "This will take several minutes..."
+            "subheader_text": "This will take several minutes...",
+            "ui_settings": read_ui_settings()
         }
         return render_template('reboot.html', **templateData)
 
@@ -222,7 +226,8 @@ def bitcoind_config_page():
 
     templateData = {
         "title": "myNode Bitcoin Config",
-        "bitcoin_config": bitcoin_config
+        "bitcoin_config": bitcoin_config,
+        "ui_settings": read_ui_settings()
     }
     return render_template('bitcoind_config.html', **templateData)
 
@@ -251,7 +256,8 @@ def bitcoind_explorer_page():
         templateData = {
             "title": "myNode Bitcoin Error",
             "message": Markup("Error communicating with bitcoind. Node may be busy syncing.<br/><br/>{}".format(str(e))),
-            "back_url": "/"
+            "back_url": "/",
+            "ui_settings": read_ui_settings()
         }
         return render_template('bitcoind_error.html', **templateData)
 
@@ -264,7 +270,8 @@ def bitcoind_explorer_page():
         "header_num": info["headers"],
         "disk_size": (int(info["size_on_disk"]) / 1000 / 1000 / 1000),
         "mempool_tx": mempool["size"],
-        "mempool_size": "{:.3} MB".format(float(mempool["bytes"]) / 1000 / 1000)
+        "mempool_size": "{:.3} MB".format(float(mempool["bytes"]) / 1000 / 1000),
+        "ui_settings": read_ui_settings()
     }
     return render_template('bitcoind_explorer.html', **templateData)
 
@@ -286,19 +293,22 @@ def search_page():
     elif results["type"] == "not_found":
         templateData = {
             "title": "myNode BTC Bitcoin Error",
-            "message": Markup("Not Found<br/>{}".format(request.form['search']))
+            "message": Markup("Not Found<br/>{}".format(request.form['search'])),
+            "ui_settings": read_ui_settings()
         }
         return render_template('bitcoind_error.html', **templateData)
     elif results["type"] == "error":
         templateData = {
             "title": "myNode Bitcoin Error",
-            "message": Markup("Error<br/>{}".format(results["error_message"]))
+            "message": Markup("Error<br/>{}".format(results["error_message"])),
+            "ui_settings": read_ui_settings()
         }
         return render_template('bitcoind_error.html', **templateData)
 
     templateData = {
         "title": "myNode Bitcoin Error",
         "message": Markup("Error - unknown return: {}".format(results["type"])),
+        "ui_settings": read_ui_settings()
     }
     return render_template('bitcoind_error.html', **templateData)
 
@@ -360,13 +370,15 @@ def tx_page(txid):
             "block_date": block_date,
             "total": total,
             "inputs": inputs,
-            "outputs": outputs
+            "outputs": outputs,
+            "ui_settings": read_ui_settings()
         }
         return render_template('bitcoind_tx.html', **templateData)
     except Exception as e:
         templateData = {
             "title": "myNode Bitcoin Error",
-            "message": Markup("Error retreiving or parsing transaction.<br/><br/>{}".format(str(e)))
+            "message": Markup("Error retreiving or parsing transaction.<br/><br/>{}".format(str(e))),
+            "ui_settings": read_ui_settings()
         }
         return render_template('bitcoind_error.html', **templateData)
 
@@ -399,14 +411,16 @@ def block_page(block_hash):
             "difficulty": "{:.3g}".format(block["difficulty"]),
             "size": int(block["size"] / 1000), 
             "date": tstring,
-            "txs": txs
+            "txs": txs,
+            "ui_settings": read_ui_settings()
         }
         return render_template('bitcoind_block.html', **templateData)
     except Exception as e:
         templateData = {
             "title": "myNode Bitcoin Error",
             "message": Markup("Error communicating with bitcoind. Node may be busy syncing.<br/><br/>{}".format(str(e))),
-            "back_url": "/bitcoind"
+            "back_url": "/bitcoind",
+            "ui_settings": read_ui_settings()
         }
         return render_template('bitcoind_error.html', **templateData)
 
@@ -446,13 +460,15 @@ def address_page(addr):
             "address": addr,
             "confirmed_balance": confirmed_bal,
             "unconfirmed_balance": unconfirmed_bal,
-            "txs": txs
+            "txs": txs,
+            "ui_settings": read_ui_settings()
         }
         return render_template('bitcoind_address.html', **templateData)
     except Exception as e:
         templateData = {
             "title": "myNode Bitcoin Error",
             "message": Markup("Error communicating with bitcoind. Node may be busy syncing.<br/><br/>{}".format(str(e))),
-            "back_url": "/bitcoind"
+            "back_url": "/bitcoind",
+            "ui_settings": read_ui_settings()
         }
-        return render_template('bitcoind_error.html', **templateData)
+        return render_template('bitcoind_error.html', **templateData)

rootfs/standard/var/www/mynode/electrum_server.py

@@ -123,6 +123,7 @@ def electrum_server_page():
         "electrs_command": electrs_command,
         "electrs_onion_hostname": electrs_onion_hostname,
         "electrs_onion_password": electrs_onion_password,
-        "electrs_onion_command": electrs_onion_command
+        "electrs_onion_command": electrs_onion_command,
+        "ui_settings": {'darkmode': False}
     }
     return render_template('electrum_server.html', **templateData)

rootfs/standard/var/www/mynode/lnd.py

@@ -3,7 +3,7 @@ from pprint import pprint, pformat
 from threading import Timer
 from bitcoin_info import *
 from lightning_info import *
-from settings import reboot_device
+from settings import reboot_device, read_ui_settings
 from device_info import *
 from user_management import check_logged_in
 import base64
@@ -62,7 +62,8 @@ def page_lnd():
             "wallet_exists": wallet_exists,
             "wallet_logged_in": wallet_logged_in,
             "version": get_lnd_version(),
-            "status": status
+            "status": status,
+            "ui_settings": read_ui_settings()
         }
         return render_template('lnd.html', **templateData)
 
@@ -72,7 +73,8 @@ def page_lnd():
             "wallet_exists": wallet_exists,
             "wallet_logged_in": wallet_logged_in,
             "status": get_lnd_status(),
-            "version": get_lnd_version()
+            "version": get_lnd_version(),
+            "ui_settings": read_ui_settings()
         }
         return render_template('lnd.html', **templateData)
 
@@ -97,7 +99,8 @@ def page_lnd():
     except Exception as e:
         templateData = {
             "title": "myNode Lightning Status",
-            "message": str(e)
+            "message": str(e),
+            "ui_settings": read_ui_settings()
         }
         return render_template('lnd_error.html', **templateData)
 
@@ -116,7 +119,8 @@ def page_lnd():
         "num_inactive_channels": num_inactive_channels,
         "pubkey": pubkey,
         "uri": uri,
-        "ip": ip
+        "ip": ip,
+        "ui_settings": read_ui_settings()
     }
     return render_template('lnd.html', **templateData)
 
@@ -153,13 +157,15 @@ def page_lnd_create_wallet():
     except:
         templateData = {
             "title": "myNode Lightning Wallet",
-            "message": Markup("Waiting on lnd...<br/>Please try again in a minute.")
+            "message": Markup("Waiting on lnd...<br/>Please try again in a minute."),
+            "ui_settings": read_ui_settings()
         }
         return render_template('lnd_error.html', **templateData)
 
     templateData = {
         "title": "myNode Lightning Wallet",
-        "seed": seed
+        "seed": seed,
+        "ui_settings": read_ui_settings()
     }
     return render_template('lnd_wallet_create.html', **templateData)
 
@@ -171,6 +177,7 @@ def page_lnd_create_wallet_with_seed():
     if request.method == 'GET':
         templateData = {
             "title": "myNode Lightning Wallet",
+            "ui_settings": read_ui_settings()
         }
         return render_template('lnd_wallet_create_with_seed.html', **templateData)
 
@@ -193,6 +200,7 @@ def page_lnd_create_wallet_confirm():
     if request.method == 'GET':
         templateData = {
             "title": "myNode Lightning Wallet",
+            "ui_settings": read_ui_settings()
         }
         return render_template('lnd_wallet_create_confirm.html', **templateData)
 
@@ -259,7 +267,8 @@ def page_lnd_lndconnect():
         "lndconnect_local_grpc_img": lndconnect_local_grpc_img,
         "lndconnect_local_rest_img": lndconnect_local_rest_img,
         "lndconnect_tor_grpc_img": lndconnect_tor_grpc_img,
-        "lndconnect_tor_rest_img": lndconnect_tor_rest_img
+        "lndconnect_tor_rest_img": lndconnect_tor_rest_img,
+        "ui_settings": read_ui_settings()
     }
     return render_template('lndconnect.html', **templateData)
 
@@ -296,7 +305,8 @@ def page_lnd_change_alias():
     templateData = {
         "title": "myNode Reboot",
         "header_text": "Restarting",
-        "subheader_text": "This will take several minutes..."
+        "subheader_text": "This will take several minutes...",
+        "ui_settings": read_ui_settings()
     }
     return render_template('reboot.html', **templateData)
 
@@ -314,7 +324,8 @@ def lnd_reset_config_page():
     templateData = {
         "title": "myNode Reboot",
         "header_text": "Restarting",
-        "subheader_text": "This will take several minutes..."
+        "subheader_text": "This will take several minutes...",
+        "ui_settings": read_ui_settings()
     }
     return render_template('reboot.html', **templateData)
 
@@ -335,7 +346,8 @@ def lnd_config_page():
         templateData = {
             "title": "myNode Reboot",
             "header_text": "Restarting",
-            "subheader_text": "This will take several minutes..."
+            "subheader_text": "This will take several minutes...",
+            "ui_settings": read_ui_settings()
         }
         return render_template('reboot.html', **templateData)
 
@@ -345,7 +357,8 @@ def lnd_config_page():
 
     templateData = {
         "title": "myNode LND Config",
-        "lnd_config": lnd_config
+        "lnd_config": lnd_config,
+        "ui_settings": read_ui_settings()
     }
     return render_template('lnd_config.html', **templateData)
 

rootfs/standard/var/www/mynode/mynode.py

@@ -8,7 +8,7 @@ from tor import mynode_tor
 from vpn import mynode_vpn
 from electrum_server import *
 from lnd import mynode_lnd, lnd_wallet_exists, is_lnd_logged_in, lnd_get, get_lnd_status
-from settings import mynode_settings
+from settings import *
 from pprint import pprint
 from bitcoinrpc.authproxy import AuthServiceProxy, JSONRPCException
 from background_thread import BackgroundThread
@@ -19,6 +19,7 @@ from messages import get_message
 from thread_functions import *
 from datetime import timedelta
 import pam
+import json
 import random
 import logging
 import logging.handlers
@@ -107,7 +108,8 @@ def index():
         templateData = {
             "title": "myNode Uploader",
             "header_text": "Uploader Device",
-            "quicksync_status": status
+            "quicksync_status": status,
+            "ui_settings": read_ui_settings()
         }
         return render_template('uploader.html', **templateData)
 
@@ -115,14 +117,16 @@ def index():
         templateData = {
             "title": "myNode Looking for Drive",
             "header_text": "Looking for Drive",
-            "subheader_text": "Please attach a drive to your myNode"
+            "subheader_text": "Please attach a drive to your myNode",
+            "ui_settings": read_ui_settings()
         }
         return render_template('state.html', **templateData)
     elif status == STATE_DRIVE_MOUNTED:
         templateData = {
             "title": "myNode Drive Mounted",
             "header_text": "Drive Mounted",
-            "subheader_text": "myNode starting soon..."
+            "subheader_text": "myNode starting soon...",
+            "ui_settings": read_ui_settings()
         }
         return render_template('state.html', **templateData)
     elif not has_product_key() and not skipped_product_key():
@@ -148,14 +152,16 @@ def index():
         templateData = {
             "title": "myNode QuickSync",
             "header_text": "QuickSync",
-            "subheader_text": subheader_msg
+            "subheader_text": subheader_msg,
+            "ui_settings": read_ui_settings()
         }
         return render_template('state.html', **templateData)
     elif status == STATE_QUICKSYNC_RESET:
         templateData = {
             "title": "myNode QuickSync",
             "header_text": "QuickSync",
-            "subheader_text": "Restarting QuickSync..."
+            "subheader_text": "Restarting QuickSync...",
+            "ui_settings": read_ui_settings()
         }
         return render_template('state.html', **templateData)
     elif status == STATE_QUICKSYNC_DOWNLOAD:
@@ -179,7 +185,8 @@ def index():
         templateData = {
             "title": "myNode QuickSync",
             "header_text": "QuickSync",
-            "subheader_text": subheader
+            "subheader_text": subheader,
+            "ui_settings": read_ui_settings()
         }
         return render_template('state.html', **templateData)
     elif status == STATE_STABLE:
@@ -209,7 +216,8 @@ def index():
             templateData = {
                 "title": "myNode Status",
                 "header_text": "Starting...",
-                "subheader_text": Markup("Launching myNode services...{}".format(message))
+                "subheader_text": Markup("Launching myNode services...{}".format(message)),
+                "ui_settings": read_ui_settings()
             }
             return render_template('state.html', **templateData)
 
@@ -224,7 +232,8 @@ def index():
             templateData = {
                 "title": "myNode Sync",
                 "header_text": "Bitcoin Blockchain",
-                "subheader_text": subheader
+                "subheader_text": subheader,
+                "ui_settings": read_ui_settings()
             }
             return render_template('state.html', **templateData)
 
@@ -361,15 +370,17 @@ def index():
             "ram_usage": get_ram_usage(),
             "swap_usage": get_swap_usage(),
             "device_temp": get_device_temp(),
+            "upgrade_available": upgrade_available,
             "has_changed_password": has_changed_password(),
-            "upgrade_available": upgrade_available
+            "ui_settings": read_ui_settings()
         }
         return render_template('main.html', **templateData)
     else:
         templateData = {
             "title": "myNode Error",
             "header_text": "Error",
-            "subheader_text": "Unknown State ("+status+"). Please restart your myNode."
+            "subheader_text": "Unknown State ("+status+"). Please restart your myNode.",
+            "ui_settings": read_ui_settings()
         }
         return render_template('state.html', **templateData)
 
@@ -381,7 +392,8 @@ def page_product_key():
     if request.method == 'GET':
         templateData = {
             "title": "myNode Product Key",
-            "header_text": "Product Key"
+            "header_text": "Product Key",
+            "ui_settings": read_ui_settings()
         }
         return render_template('product_key.html', **templateData)
     elif request.method == 'POST':
@@ -448,8 +460,9 @@ def page_toggle_vpn():
 
 @app.route("/login", methods=["GET","POST"])
 def page_login():
+    templateData = {"ui_settings": read_ui_settings()}
     if request.method == 'GET':
-        return render_template('login.html')
+        return render_template('login.html', **templateData)
 
     pw = request.form.get('password')
     if login(pw):
@@ -466,12 +479,14 @@ def page_logout():
 @app.route("/about")
 def page_about():
     check_logged_in()
-    return render_template('about.html')
+    templateData = {"ui_settings": read_ui_settings()}
+    return render_template('about.html', **templateData)
 
 @app.route("/help")
 def page_help():
     check_logged_in()
-    return render_template('help.html')
+    templateData = {"ui_settings": read_ui_settings()}
+    return render_template('help.html', **templateData)
 
 # Disable browser caching
 @app.after_request
@@ -529,4 +544,4 @@ if __name__ == "__main__":
             raise RuntimeError('Not running with the Werkzeug Server')
         func()
 
-    print("Service www exiting...")
+    print("Service www exiting...")

rootfs/standard/var/www/mynode/settings.py

@@ -3,7 +3,6 @@ from flask import Blueprint, render_template, session, abort, Markup, request, r
 from bitcoinrpc.authproxy import AuthServiceProxy, JSONRPCException
 from pprint import pprint, pformat
 from threading import Timer
-from device_info import *
 from thread_functions import *
 from user_management import check_logged_in
 from lightning_info import *
@@ -15,6 +14,51 @@ import subprocess
 
 mynode_settings = Blueprint('mynode_settings',__name__)
 
+def read_ui_settings():
+    ui_hdd_file = '/mnt/hdd/mynode/settings/ui.json'
+    ui_mynode_file = '/home/bitcoin/.mynode/ui.json'
+
+    # read ui.json from HDD
+    if os.path.isfile(ui_hdd_file):
+        with open(ui_hdd_file, 'r') as fp:
+            ui_settings = json.load(fp)
+    # read ui.json from mynode
+    elif os.path.isfile(ui_mynode_file):
+        with open(ui_mynode_file, 'r') as fp:
+            ui_settings = json.load(fp)
+    # if ui.json is not found anywhere, use default settings
+    else:
+        ui_settings = {'darkmode': False}
+
+    return ui_settings
+
+def write_ui_settings(ui_settings):
+    ui_hdd_file = '/mnt/hdd/mynode/settings/ui.json'
+    ui_mynode_file = '/home/bitcoin/.mynode/ui.json'
+
+    try:
+        with open(ui_hdd_file, 'w') as fp:
+            json.dump(ui_settings, fp)
+    except:
+        pass
+
+    with open(ui_mynode_file, 'w') as fp:
+        json.dump(ui_settings, fp)
+
+def is_darkmode_enabled():
+    ui_settings = read_ui_settings()
+    return ui_settings['darkmode']
+
+def disable_darkmode():
+    ui_settings = read_ui_settings()
+    ui_settings['darkmode'] = False
+    write_ui_settings(ui_settings)
+
+def enable_darkmode():
+    ui_settings = read_ui_settings()
+    ui_settings['darkmode'] = True
+    write_ui_settings(ui_settings)
+
 # Flask Pages
 @mynode_settings.route("/settings")
 def page_settings():
@@ -93,7 +137,8 @@ def page_settings():
         "upload_rate": upload_rate,
         "uptime": uptime,
         "public_ip": public_ip,
-        "local_ip": local_ip
+        "local_ip": local_ip,
+        "ui_settings": read_ui_settings()
     }
     return render_template('settings.html', **templateData)
 
@@ -109,7 +154,8 @@ def upgrade_page():
     templateData = {
         "title": "myNode Upgrade",
         "header_text": "Upgrading",
-        "subheader_text": "This may take a while..."
+        "subheader_text": "This may take a while...",
+        "ui_settings": read_ui_settings()
     }
     return render_template('reboot.html', **templateData)
 
@@ -129,7 +175,8 @@ def reset_blockchain_page():
     templateData = {
         "title": "myNode",
         "header_text": "Reset Blockchain",
-        "subheader_text": "This will take several minutes..."
+        "subheader_text": "This will take several minutes...",
+        "ui_settings": read_ui_settings()
     }
     return render_template('reboot.html', **templateData)
 
@@ -143,7 +190,8 @@ def restart_quicksync_page():
     templateData = {
         "title": "myNode",
         "header_text": "Restart Quicksync",
-        "subheader_text": "This will take several minutes..."
+        "subheader_text": "This will take several minutes...",
+        "ui_settings": read_ui_settings()
     }
     return render_template('reboot.html', **templateData)
 
@@ -159,7 +207,8 @@ def reboot_device_page():
     templateData = {
         "title": "myNode Reboot",
         "header_text": "Restarting",
-        "subheader_text": "This will take several minutes..."
+        "subheader_text": "This will take several minutes...",
+        "ui_settings": read_ui_settings()
     }
     return render_template('reboot.html', **templateData)
 
@@ -175,7 +224,8 @@ def shutdown_device_page():
     templateData = {
         "title": "myNode Shutdown",
         "header_text": "Shutting down...",
-        "subheader_text": Markup("Your myNode is shutting down.<br/><br/>You will need to power cycle the device to turn it back on.")
+        "subheader_text": Markup("Your myNode is shutting down.<br/><br/>You will need to power cycle the device to turn it back on."),
+        "ui_settings": read_ui_settings()
     }
     return render_template('shutdown.html', **templateData)
 
@@ -212,7 +262,8 @@ def factory_reset_page():
         templateData = {
             "title": "myNode Factory Reset",
             "header_text": "Factory Reset",
-            "subheader_text": "This will take several minutes..."
+            "subheader_text": "This will take several minutes...",
+            "ui_settings": read_ui_settings()
         }
         return render_template('reboot.html', **templateData)
 
@@ -307,7 +358,8 @@ def page_reset_tor():
     templateData = {
         "title": "myNode Reboot",
         "header_text": "Restarting",
-        "subheader_text": "This will take several minutes..."
+        "subheader_text": "This will take several minutes...",
+        "ui_settings": read_ui_settings()
     }
     return render_template('reboot.html', **templateData)
 
@@ -340,7 +392,8 @@ def repair_drive_page():
     templateData = {
         "title": "myNode Reboot",
         "header_text": "Restarting",
-        "subheader_text": "This will take several minutes..."
+        "subheader_text": "This will take several minutes...",
+        "ui_settings": read_ui_settings()
     }
     return render_template('reboot.html', **templateData)
 
@@ -374,7 +427,8 @@ def toggle_uploader_page():
     templateData = {
         "title": "myNode Reboot",
         "header_text": "Restarting",
-        "subheader_text": "This will take several minutes..."
+        "subheader_text": "This will take several minutes...",
+        "ui_settings": read_ui_settings()
     }
     return render_template('reboot.html', **templateData)
 
@@ -393,10 +447,19 @@ def toggle_quicksync_page():
     templateData = {
         "title": "myNode Reboot",
         "header_text": "Restarting",
-        "subheader_text": "This will take several minutes..."
+        "subheader_text": "This will take several minutes...",
+        "ui_settings": read_ui_settings()
     }
     return render_template('reboot.html', **templateData)
 
 @mynode_settings.route("/settings/ping")
 def ping_page():
-    return "alive"
+    return "alive"
+
+@mynode_settings.route("/settings/toggle-darkmode")
+def toggle_darkmode_page():
+    if is_darkmode_enabled():
+        disable_darkmode()
+    else:
+        enable_darkmode()
+    return redirect("/settings")

rootfs/standard/var/www/mynode/static/css/mynode.css

@@ -413,6 +413,33 @@ a:active {
     -webkit-border-radius: 50%;
 }
 
+.cli_command {
+    width: 800px;
+    margin: auto;
+    display: table;
+    padding: 10px;
+    vertical-align: middle;
+}
+.cli_command_input {
+    width: 685px;
+    font-size: 20px;
+    vertical-align: middle;
+}
+.cli_enter_button {
+    width: 100px;
+    font-size: 16px;
+    vertical-align: middle;
+}
+
+.cli_contents {
+    margin: auto;
+    width: 800px;
+    max-height: 500px;
+    height: 500px;
+    overflow-y: scroll;
+    border: 2px solid #222222;
+    border-radius: 5px;
+}
 .login_div {
     width: 300px;
     color: #444444;

rootfs/standard/var/www/mynode/static/css/mynode_bitcoind.css

@@ -1,4 +1,3 @@
-
 .bitcoind_search {
     width: 600px;
     margin: auto;
@@ -46,14 +45,14 @@
     font-family: Arial, Helvetica, sans-serif;
 }
 
-table tbody tr:nth-child(odd) td{
+table.bitcoind_table tbody tr:nth-child(odd) td{
     background-color: #ffdecb;
 }
-table tbody tr:nth-child(even) td{
+table.bitcoind_table tbody tr:nth-child(even) td{
     background-color: #fff5ef;
 }
 
-table td {
+table.bitcoind_table td {
     padding: 10px;
     margin: 0px;
 }

rootfs/standard/var/www/mynode/static/css/mynode_bitcoind_dark.css

@@ -0,0 +1,19 @@
+.bitcoind_search_text {
+    color: #888888;
+}
+
+.bitcoind_error_message {
+    color: #BB4444;
+}
+
+.bitcoind_table_header {
+    border-bottom: 2px solid gray;
+    background-color: unset;
+}
+
+table.bitcoind_table tbody tr:nth-child(odd) td{
+    background-color: #222;
+}
+table.bitcoind_table tbody tr:nth-child(even) td{
+    background-color: unset;
+}

rootfs/standard/var/www/mynode/static/css/mynode_cli.css

@@ -1,28 +0,0 @@
-
-.cli_command {
-    width: 800px;
-    margin: auto;
-    display: table;
-    padding: 10px;
-    vertical-align: middle;
-}
-.cli_command_input {
-    width: 685px;
-    font-size: 20px;
-    vertical-align: middle;
-}
-.cli_enter_button {
-    width: 100px;
-    font-size: 16px;
-    vertical-align: middle;
-}
-
-.cli_contents {
-    margin: auto;
-    width: 800px;
-    max-height: 500px;
-    height: 500px;
-    overflow-y: scroll;
-    border: 2px solid #222222;
-    border-radius: 5px;
-}

rootfs/standard/var/www/mynode/static/css/mynode_dark.css

@@ -0,0 +1,99 @@
+/* mynode color: #f9c132 */
+/* dark grey for background: #303841 */
+/* lighter gray: #3a4750 */
+/* light gray: #eee */
+
+body {
+    background: #303841;
+}
+
+a:link,
+a:visited,
+a:hover,
+a:active {
+    color: #eee;
+    text-decoration: underline dashed #eee;
+}
+
+.footer,
+.state_header,
+.state_subheader,
+.main_header,
+.main_header_sub_text,
+.app_title,
+.app_status,
+.app_contents,
+.info_tile_contents,
+.content_block,
+.drive_usage,
+.settings_block_header,
+.settings_block_subheader,
+.settings_block,
+table,
+#cli_contents {
+    color: #eee;
+}
+
+.app_tile,
+.app_tile_short,
+.info_tile,
+.settings_block_header {
+    border: 3px solid #f9c132;
+}
+
+.info_tile_header {
+    color: #FFFFFF;
+    background-color: #f9c132;
+}
+
+.divider {
+    border-bottom: 3px dashed #f9c132;
+}
+
+.ui-button.ui-widget.ui-corner-all {
+    color: #303841;
+    background-color: #eee;
+    border-color: #eee;
+}
+
+.settings_input {
+    color: white;
+    background: #eee;
+}
+
+.main_page_warning_block,
+.upgrade_ad_main_page {
+    color: #eee;
+    border: 3px solid #f9c132;
+    background-color: #3a4750;
+}
+
+.main_page_error_block {
+    color: #eee;
+    border: 3px solid red;
+    background-color: rgb(255, 238, 238);
+}
+
+.slider {
+  background-color: #ccc;
+}
+
+.slider:before {
+  background-color: white;
+}
+
+input:checked + .slider {
+  background-color: #eee;
+}
+
+input:focus + .slider {
+  box-shadow: 0 0 1px #eee;
+}
+
+.cli_contents {
+    border: 2px solid #222222;
+}
+.config_textarea {
+	color: #eee;
+	background-color: #303841;
+}

rootfs/standard/var/www/mynode/templates/about.html

@@ -1,18 +1,12 @@
 <!DOCTYPE html lang="en">
     <head>
         <title>myNode About</title>
-        <link rel="shortcut icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
+        {% include 'includes/head.html' %}
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode.css")}}">
-        <link href="{{ url_for('static', filename="jquery_ui/jquery-ui.css")}}" rel="stylesheet">
-        <meta http-equiv="Content-Language" content="en">
-        <meta name="google" content="notranslate">
-        <script src="{{ url_for('static', filename="js/jquery-3.3.1.min.js")}}"></script>
-        <script src="{{ url_for('static', filename="jquery_ui/jquery-ui.js")}}"></script>
-        <script src="{{ url_for('static', filename="js/mynode.js")}}"></script>
      </head>
 
     <body>
-        <div class="logo_header"><a href="/"><img class="logo_image" src="{{ url_for('static', filename="images/logo.png")}}"/></a></div>
+        {% include 'includes/logo_header.html' %}
+
         <div class="mynode_back_div">
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/"><span class="ui-icon ui-icon-home"></span>home&nbsp;</a>
         </div>

rootfs/standard/var/www/mynode/templates/bitcoin_cli.html

@@ -1,15 +1,7 @@
 <!DOCTYPE html lang="en">
     <head>
         <title>{{ title }}</title>
-        <link rel="shortcut icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
+        {% include 'includes/head.html' %}
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode.css")}}">
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode_cli.css")}}">
-        <link href="{{ url_for('static', filename="jquery_ui/jquery-ui.css")}}" rel="stylesheet">
-        <meta http-equiv="Content-Language" content="en">
-        <meta name="google" content="notranslate">
-        <script src="{{ url_for('static', filename="js/jquery-3.3.1.min.js")}}"></script>
-        <script src="{{ url_for('static', filename="jquery_ui/jquery-ui.js")}}"></script>
-        <script src="{{ url_for('static', filename="js/mynode.js")}}"></script>
         <script>
         $(document).ready(function() {
             $("#cmd_form").submit(function( event ) {
@@ -42,7 +34,7 @@
      </head>
 
     <body>
-        <div class="logo_header"><a href="/"><img class="logo_image" src="{{ url_for('static', filename="images/logo.png")}}"/></a></div>
+        {% include 'includes/logo_header.html' %}
         <div class="mynode_back_div">
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/"><span class="ui-icon ui-icon-home"></span>home&nbsp;</a>
         </div>

rootfs/standard/var/www/mynode/templates/bitcoind_address.html

@@ -1,19 +1,11 @@
 <!DOCTYPE html lang="en">
     <head>
         <title>{{ title }}</title>
-        <link rel="shortcut icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
+        {% include 'includes/head.html' %}
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode.css")}}">
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode_bitcoind.css")}}">
-        <link href="{{ url_for('static', filename="jquery_ui/jquery-ui.css")}}" rel="stylesheet">
-        <meta http-equiv="Content-Language" content="en">
-        <meta name="google" content="notranslate">
-        <script src="{{ url_for('static', filename="js/jquery-3.3.1.min.js")}}"></script>
-        <script src="{{ url_for('static', filename="jquery_ui/jquery-ui.js")}}"></script>
-        <script src="{{ url_for('static', filename="js/mynode.js")}}"></script>
      </head>
 
     <body>
-        <div class="logo_header"><a href="/"><img class="logo_image" src="{{ url_for('static', filename="images/logo.png")}}"/></a></div>
+        {% include 'includes/logo_header.html' %}
         <div class="mynode_back_div">
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/"><span class="ui-icon ui-icon-home"></span>home&nbsp;</a>
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/explorer"><span class="ui-icon ui-icon-search"></span>bitcoin&nbsp;</a>

rootfs/standard/var/www/mynode/templates/bitcoind_block.html

@@ -1,19 +1,11 @@
 <!DOCTYPE html lang="en">
     <head>
         <title>{{ title }}</title>
-        <link rel="shortcut icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
+        {% include 'includes/head.html' %}
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode.css")}}">
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode_bitcoind.css")}}">
-        <link href="{{ url_for('static', filename="jquery_ui/jquery-ui.css")}}" rel="stylesheet">
-        <meta http-equiv="Content-Language" content="en">
-        <meta name="google" content="notranslate">
-        <script src="{{ url_for('static', filename="js/jquery-3.3.1.min.js")}}"></script>
-        <script src="{{ url_for('static', filename="jquery_ui/jquery-ui.js")}}"></script>
-        <script src="{{ url_for('static', filename="js/mynode.js")}}"></script>
      </head>
 
     <body>
-        <div class="logo_header"><a href="/"><img class="logo_image" src="{{ url_for('static', filename="images/logo.png")}}"/></a></div>
+        {% include 'includes/logo_header.html' %}
         <div class="mynode_back_div">
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/"><span class="ui-icon ui-icon-home"></span>home&nbsp;</a>
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/explorer"><span class="ui-icon ui-icon-search"></span>bitcoin&nbsp;</a>

rootfs/standard/var/www/mynode/templates/bitcoind_config.html

@@ -1,19 +1,11 @@
 <!DOCTYPE html lang="en">
     <head>
         <title>{{ title }}</title>
-        <link rel="shortcut icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
+        {% include 'includes/head.html' %}
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode.css")}}">
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode_bitcoind.css")}}">
-        <link href="{{ url_for('static', filename="jquery_ui/jquery-ui.css")}}" rel="stylesheet">
-        <meta http-equiv="Content-Language" content="en">
-        <meta name="google" content="notranslate">
-        <script src="{{ url_for('static', filename="js/jquery-3.3.1.min.js")}}"></script>
-        <script src="{{ url_for('static', filename="jquery_ui/jquery-ui.js")}}"></script>
-        <script src="{{ url_for('static', filename="js/mynode.js")}}"></script>
      </head>
 
     <body>
-        <div class="logo_header"><a href="/"><img class="logo_image" src="{{ url_for('static', filename="images/logo.png")}}"/></a></div>
+        {% include 'includes/logo_header.html' %}
         <div class="mynode_back_div">
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/"><span class="ui-icon ui-icon-home"></span>home&nbsp;</a>
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/bitcoind"><span class="ui-icon ui-icon-arrowthick-1-w"></span>back&nbsp;</a>

rootfs/standard/var/www/mynode/templates/bitcoind_error.html

@@ -1,19 +1,11 @@
 <!DOCTYPE html lang="en">
     <head>
         <title>{{ title }}</title>
-        <link rel="shortcut icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
+        {% include 'includes/head.html' %}
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode.css")}}">
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode_bitcoind.css")}}">
-        <link href="{{ url_for('static', filename="jquery_ui/jquery-ui.css")}}" rel="stylesheet">
-        <meta http-equiv="Content-Language" content="en">
-        <meta name="google" content="notranslate">
-        <script src="{{ url_for('static', filename="js/jquery-3.3.1.min.js")}}"></script>
-        <script src="{{ url_for('static', filename="jquery_ui/jquery-ui.js")}}"></script>
-        <script src="{{ url_for('static', filename="js/mynode.js")}}"></script>
      </head>
 
     <body>
-        <div class="logo_header"><a href="/"><img class="logo_image" src="{{ url_for('static', filename="images/logo.png")}}"/></a></div>
+        {% include 'includes/logo_header.html' %}
         <div class="mynode_back_div">
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/"><span class="ui-icon ui-icon-home"></span>home&nbsp;</a>
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/explorer"><span class="ui-icon ui-icon-search"></span>bitcoin&nbsp;</a>

rootfs/standard/var/www/mynode/templates/bitcoind_explorer.html

@@ -1,19 +1,11 @@
 <!DOCTYPE html lang="en">
     <head>
         <title>{{ title }}</title>
-        <link rel="shortcut icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
+        {% include 'includes/head.html' %}
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode.css")}}">
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode_bitcoind.css")}}">
-        <link href="{{ url_for('static', filename="jquery_ui/jquery-ui.css")}}" rel="stylesheet">
-        <meta http-equiv="Content-Language" content="en">
-        <meta name="google" content="notranslate">
-        <script src="{{ url_for('static', filename="js/jquery-3.3.1.min.js")}}"></script>
-        <script src="{{ url_for('static', filename="jquery_ui/jquery-ui.js")}}"></script>
-        <script src="{{ url_for('static', filename="js/mynode.js")}}"></script>
      </head>
 
     <body>
-        <div class="logo_header"><a href="/"><img class="logo_image" src="{{ url_for('static', filename="images/logo.png")}}"/></a></div>
+        {% include 'includes/logo_header.html' %}
         <div class="mynode_back_div">
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/"><span class="ui-icon ui-icon-home"></span>home&nbsp;</a>
         </div>

rootfs/standard/var/www/mynode/templates/bitcoind_status.html

@@ -1,19 +1,11 @@
 <!DOCTYPE html lang="en">
     <head>
         <title>{{ title }}</title>
-        <link rel="shortcut icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
+        {% include 'includes/head.html' %}
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode.css")}}">
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode_bitcoind.css")}}">
-        <link href="{{ url_for('static', filename="jquery_ui/jquery-ui.css")}}" rel="stylesheet">
-        <meta http-equiv="Content-Language" content="en">
-        <meta name="google" content="notranslate">
-        <script src="{{ url_for('static', filename="js/jquery-3.3.1.min.js")}}"></script>
-        <script src="{{ url_for('static', filename="jquery_ui/jquery-ui.js")}}"></script>
-        <script src="{{ url_for('static', filename="js/mynode.js")}}"></script>
      </head>
 
     <body>
-        <div class="logo_header"><a href="/"><img class="logo_image" src="{{ url_for('static', filename="images/logo.png")}}"/></a></div>
+        {% include 'includes/logo_header.html' %}
         <div class="mynode_back_div">
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/"><span class="ui-icon ui-icon-home"></span>home&nbsp;</a>
         </div>

rootfs/standard/var/www/mynode/templates/bitcoind_status_error.html

@@ -1,19 +1,11 @@
 <!DOCTYPE html lang="en">
     <head>
         <title>{{ title }}</title>
-        <link rel="shortcut icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
+        {% include 'includes/head.html' %}
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode.css")}}">
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode_bitcoind.css")}}">
-        <link href="{{ url_for('static', filename="jquery_ui/jquery-ui.css")}}" rel="stylesheet">
-        <meta http-equiv="Content-Language" content="en">
-        <meta name="google" content="notranslate">
-        <script src="{{ url_for('static', filename="js/jquery-3.3.1.min.js")}}"></script>
-        <script src="{{ url_for('static', filename="jquery_ui/jquery-ui.js")}}"></script>
-        <script src="{{ url_for('static', filename="js/mynode.js")}}"></script>
      </head>
 
     <body>
-        <div class="logo_header"><a href="/"><img class="logo_image" src="{{ url_for('static', filename="images/logo.png")}}"/></a></div>
+        {% include 'includes/logo_header.html' %}
         <div class="mynode_back_div">
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/"><span class="ui-icon ui-icon-home"></span>home&nbsp;</a>
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/bitcoind"><span class="ui-icon ui-icon-info"></span>bitcoin&nbsp;</a>

rootfs/standard/var/www/mynode/templates/bitcoind_tx.html

@@ -1,19 +1,11 @@
 <!DOCTYPE html lang="en">
     <head>
         <title>{{ title }}</title>
-        <link rel="shortcut icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
+        {% include 'includes/head.html' %}
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode.css")}}">
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode_bitcoind.css")}}">
-        <link href="{{ url_for('static', filename="jquery_ui/jquery-ui.css")}}" rel="stylesheet">
-        <meta http-equiv="Content-Language" content="en">
-        <meta name="google" content="notranslate">
-        <script src="{{ url_for('static', filename="js/jquery-3.3.1.min.js")}}"></script>
-        <script src="{{ url_for('static', filename="jquery_ui/jquery-ui.js")}}"></script>
-        <script src="{{ url_for('static', filename="js/mynode.js")}}"></script>
      </head>
 
     <body>
-        <div class="logo_header"><a href="/"><img class="logo_image" src="{{ url_for('static', filename="images/logo.png")}}"/></a></div>
+        {% include 'includes/logo_header.html' %}
         <div class="mynode_back_div">
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/"><span class="ui-icon ui-icon-home"></span>home&nbsp;</a>
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/explorer"><span class="ui-icon ui-icon-search"></span>bitcoin&nbsp;</a>

rootfs/standard/var/www/mynode/templates/electrum_server.html

@@ -1,19 +1,11 @@
 <!DOCTYPE html lang="en">
     <head>
         <title>{{ title }}</title>
-        <link rel="shortcut icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
+        {% include 'includes/head.html' %}
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode.css")}}">
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode_bitcoind.css")}}">
-        <link href="{{ url_for('static', filename="jquery_ui/jquery-ui.css")}}" rel="stylesheet">
-        <meta http-equiv="Content-Language" content="en">
-        <meta name="google" content="notranslate">
-        <script src="{{ url_for('static', filename="js/jquery-3.3.1.min.js")}}"></script>
-        <script src="{{ url_for('static', filename="jquery_ui/jquery-ui.js")}}"></script>
-        <script src="{{ url_for('static', filename="js/mynode.js")}}"></script>
      </head>
 
     <body>
-        <div class="logo_header"><a href="/"><img class="logo_image" src="{{ url_for('static', filename="images/logo.png")}}"/></a></div>
+        {% include 'includes/logo_header.html' %}
         <div class="mynode_back_div">
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/"><span class="ui-icon ui-icon-home"></span>home&nbsp;</a>
         </div>

rootfs/standard/var/www/mynode/templates/error.html

@@ -1,19 +1,11 @@
 <!DOCTYPE html lang="en">
     <head>
         <title>{{ title }}</title>
-        <link rel="shortcut icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
+        {% include 'includes/head.html' %}
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode.css")}}">
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode_bitcoind.css")}}">
-        <link href="{{ url_for('static', filename="jquery_ui/jquery-ui.css")}}" rel="stylesheet">
-        <meta http-equiv="Content-Language" content="en">
-        <meta name="google" content="notranslate">
-        <script src="{{ url_for('static', filename="js/jquery-3.3.1.min.js")}}"></script>
-        <script src="{{ url_for('static', filename="jquery_ui/jquery-ui.js")}}"></script>
-        <script src="{{ url_for('static', filename="js/mynode.js")}}"></script>
      </head>
 
     <body>
-        <div class="logo_header"><a href="/"><img class="logo_image" src="{{ url_for('static', filename="images/logo.png")}}"/></a></div>
+        {% include 'includes/logo_header.html' %}
         <div class="mynode_back_div">
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/"><span class="ui-icon ui-icon-home"></span>home&nbsp;</a>
         </div>

rootfs/standard/var/www/mynode/templates/help.html

@@ -1,18 +1,12 @@
 <!DOCTYPE html lang="en">
     <head>
         <title>myNode Help</title>
-        <link rel="shortcut icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
+        {% include 'includes/head.html' %}
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode.css")}}">
-        <link href="{{ url_for('static', filename="jquery_ui/jquery-ui.css")}}" rel="stylesheet">
-        <meta http-equiv="Content-Language" content="en">
-        <meta name="google" content="notranslate">
-        <script src="{{ url_for('static', filename="js/jquery-3.3.1.min.js")}}"></script>
-        <script src="{{ url_for('static', filename="jquery_ui/jquery-ui.js")}}"></script>
-        <script src="{{ url_for('static', filename="js/mynode.js")}}"></script>
      </head>
 
     <body>
-        <div class="logo_header"><a href="/"><img class="logo_image" src="{{ url_for('static', filename="images/logo.png")}}"/></a></div>
+        {% include 'includes/logo_header.html' %}
+        
         <div class="mynode_back_div">
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/"><span class="ui-icon ui-icon-home"></span>home&nbsp;</a>
         </div>

rootfs/standard/var/www/mynode/templates/includes/head.html

@@ -0,0 +1,14 @@
+<link rel="shortcut icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
+<link href="{{ url_for('static', filename='jquery_ui/jquery-ui.css')}}" rel="stylesheet">
+<link rel="stylesheet" href="{{ url_for('static', filename='css/mynode.css')}}">
+<link rel="stylesheet" href="{{ url_for('static', filename='css/mynode_bitcoind.css')}}">
+{% if ui_settings['darkmode'] %}
+<link rel="stylesheet" href="{{ url_for('static', filename='css/mynode_dark.css')}}">
+<link rel="stylesheet" href="{{ url_for('static', filename='css/mynode_bitcoind_dark.css')}}">
+{% endif %}
+<link href="{{ url_for('static', filename='jquery_ui/jquery-ui.css')}}" rel="stylesheet">
+<meta http-equiv="Content-Language" content="en">
+<meta name="google" content="notranslate">
+<script src="{{ url_for('static', filename='js/jquery-3.3.1.min.js')}}"></script>
+<script src="{{ url_for('static', filename='jquery_ui/jquery-ui.js')}}"></script>
+<script src="{{ url_for('static', filename='js/mynode.js')}}"></script>

rootfs/standard/var/www/mynode/templates/includes/logo_header.html

@@ -0,0 +1,5 @@
+{% if ui_settings['darkmode'] %}
+<div class="logo_header"><a href="/"><img class="logo_image" src="{{ url_for('static', filename='images/logo_dark.png')}}"/></a></div>
+{% else %}
+<div class="logo_header"><a href="/"><img class="logo_image" src="{{ url_for('static', filename='images/logo.png')}}"/></a></div>
+{% endif %}

rootfs/standard/var/www/mynode/templates/lnd.html

@@ -1,15 +1,7 @@
 <!DOCTYPE html lang="en">
     <head>
         <title>{{ title }}</title>
-        <link rel="shortcut icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
+        {% include 'includes/head.html' %}
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode.css")}}">
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode_bitcoind.css")}}">
-        <link href="{{ url_for('static', filename="jquery_ui/jquery-ui.css")}}" rel="stylesheet">
-        <meta http-equiv="Content-Language" content="en">
-        <meta name="google" content="notranslate">
-        <script src="{{ url_for('static', filename="js/jquery-3.3.1.min.js")}}"></script>
-        <script src="{{ url_for('static', filename="jquery_ui/jquery-ui.js")}}"></script>
-        <script src="{{ url_for('static', filename="js/mynode.js")}}"></script>
         <meta http-equiv="refresh" content="120">
 
         <script>
@@ -110,7 +102,7 @@
      </head>
 
     <body>
-        <div class="logo_header"><a href="/"><img class="logo_image" src="{{ url_for('static', filename="images/logo.png")}}"/></a></div>
+        {% include 'includes/logo_header.html' %}
         <div class="mynode_back_div">
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/"><span class="ui-icon ui-icon-home"></span>home&nbsp;</a>
         </div>

rootfs/standard/var/www/mynode/templates/lnd_config.html

@@ -1,19 +1,11 @@
 <!DOCTYPE html lang="en">
     <head>
         <title>{{ title }}</title>
-        <link rel="shortcut icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
+        {% include 'includes/head.html' %}
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode.css")}}">
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode_bitcoind.css")}}">
-        <link href="{{ url_for('static', filename="jquery_ui/jquery-ui.css")}}" rel="stylesheet">
-        <meta http-equiv="Content-Language" content="en">
-        <meta name="google" content="notranslate">
-        <script src="{{ url_for('static', filename="js/jquery-3.3.1.min.js")}}"></script>
-        <script src="{{ url_for('static', filename="jquery_ui/jquery-ui.js")}}"></script>
-        <script src="{{ url_for('static', filename="js/mynode.js")}}"></script>
      </head>
 
     <body>
-        <div class="logo_header"><a href="/"><img class="logo_image" src="{{ url_for('static', filename="images/logo.png")}}"/></a></div>
+        {% include 'includes/logo_header.html' %}
         <div class="mynode_back_div">
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/"><span class="ui-icon ui-icon-home"></span>home&nbsp;</a>
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/lnd"><span class="ui-icon ui-icon-arrowthick-1-w"></span>back&nbsp;</a>

rootfs/standard/var/www/mynode/templates/lnd_error.html

@@ -1,19 +1,11 @@
 <!DOCTYPE html lang="en">
     <head>
         <title>{{ title }}</title>
-        <link rel="shortcut icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
+        {% include 'includes/head.html' %}
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode.css")}}">
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode_bitcoind.css")}}">
-        <link href="{{ url_for('static', filename="jquery_ui/jquery-ui.css")}}" rel="stylesheet">
-        <meta http-equiv="Content-Language" content="en">
-        <meta name="google" content="notranslate">
-        <script src="{{ url_for('static', filename="js/jquery-3.3.1.min.js")}}"></script>
-        <script src="{{ url_for('static', filename="jquery_ui/jquery-ui.js")}}"></script>
-        <script src="{{ url_for('static', filename="js/mynode.js")}}"></script>
      </head>
 
     <body>
-        <div class="logo_header"><a href="/"><img class="logo_image" src="{{ url_for('static', filename="images/logo.png")}}"/></a></div>
+        {% include 'includes/logo_header.html' %}
         <div class="mynode_back_div">
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/"><span class="ui-icon ui-icon-home"></span>home&nbsp;</a>
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/lnd"><span class="ui-icon ui-icon-transfer-e-w"></span>ln status&nbsp;</a>

rootfs/standard/var/www/mynode/templates/lnd_wallet_create.html

@@ -1,19 +1,11 @@
 <!DOCTYPE html lang="en">
     <head>
         <title>{{ title }}</title>
-        <link rel="shortcut icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
+        {% include 'includes/head.html' %}
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode.css")}}">
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode_bitcoind.css")}}">
-        <link href="{{ url_for('static', filename="jquery_ui/jquery-ui.css")}}" rel="stylesheet">
-        <meta http-equiv="Content-Language" content="en">
-        <meta name="google" content="notranslate">
-        <script src="{{ url_for('static', filename="js/jquery-3.3.1.min.js")}}"></script>
-        <script src="{{ url_for('static', filename="jquery_ui/jquery-ui.js")}}"></script>
-        <script src="{{ url_for('static', filename="js/mynode.js")}}"></script>
      </head>
 
     <body>
-        <div class="logo_header"><a href="/"><img class="logo_image" src="{{ url_for('static', filename="images/logo.png")}}"/></a></div>
+        {% include 'includes/logo_header.html' %}
         <div class="mynode_back_div">
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/"><span class="ui-icon ui-icon-home"></span>home&nbsp;</a>
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/lnd"><span class="ui-icon ui-icon-transfer-e-w"></span>ln wallet&nbsp;</a>

rootfs/standard/var/www/mynode/templates/lnd_wallet_create_confirm.html

@@ -1,15 +1,7 @@
 <!DOCTYPE html lang="en">
     <head>
         <title>{{ title }}</title>
-        <link rel="shortcut icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
+        {% include 'includes/head.html' %}
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode.css")}}">
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode_bitcoind.css")}}">
-        <link href="{{ url_for('static', filename="jquery_ui/jquery-ui.css")}}" rel="stylesheet">
-        <meta http-equiv="Content-Language" content="en">
-        <meta name="google" content="notranslate">
-        <script src="{{ url_for('static', filename="js/jquery-3.3.1.min.js")}}"></script>
-        <script src="{{ url_for('static', filename="jquery_ui/jquery-ui.js")}}"></script>
-        <script src="{{ url_for('static', filename="js/mynode.js")}}"></script>
         <script>
             $(document).ready(function() {
 
@@ -24,7 +16,7 @@
      </head>
 
     <body>
-        <div class="logo_header"><a href="/"><img class="logo_image" src="{{ url_for('static', filename="images/logo.png")}}"/></a></div>
+        {% include 'includes/logo_header.html' %}
         <div class="mynode_back_div">
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/"><span class="ui-icon ui-icon-home"></span>home&nbsp;</a>
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/lnd"><span class="ui-icon ui-icon-transfer-e-w"></span>ln wallet&nbsp;</a>

rootfs/standard/var/www/mynode/templates/lnd_wallet_create_with_seed.html

@@ -1,15 +1,7 @@
 <!DOCTYPE html lang="en">
     <head>
         <title>{{ title }}</title>
-        <link rel="shortcut icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
+        {% include 'includes/head.html' %}
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode.css")}}">
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode_bitcoind.css")}}">
-        <link href="{{ url_for('static', filename="jquery_ui/jquery-ui.css")}}" rel="stylesheet">
-        <meta http-equiv="Content-Language" content="en">
-        <meta name="google" content="notranslate">
-        <script src="{{ url_for('static', filename="js/jquery-3.3.1.min.js")}}"></script>
-        <script src="{{ url_for('static', filename="jquery_ui/jquery-ui.js")}}"></script>
-        <script src="{{ url_for('static', filename="js/mynode.js")}}"></script>
         <script>
             $(document).ready(function() {
 
@@ -24,7 +16,7 @@
      </head>
 
     <body>
-        <div class="logo_header"><a href="/"><img class="logo_image" src="{{ url_for('static', filename="images/logo.png")}}"/></a></div>
+        {% include 'includes/logo_header.html' %}
         <div class="mynode_back_div">
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/"><span class="ui-icon ui-icon-home"></span>home&nbsp;</a>
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/lnd"><span class="ui-icon ui-icon-transfer-e-w"></span>ln wallet&nbsp;</a>

rootfs/standard/var/www/mynode/templates/lndconnect.html

@@ -1,15 +1,7 @@
 <!DOCTYPE html lang="en">
     <head>
         <title>{{ title }}</title>
-        <link rel="shortcut icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
+        {% include 'includes/head.html' %}
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode.css")}}">
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode_bitcoind.css")}}">
-        <link href="{{ url_for('static', filename="jquery_ui/jquery-ui.css")}}" rel="stylesheet">
-        <meta http-equiv="Content-Language" content="en">
-        <meta name="google" content="notranslate">
-        <script src="{{ url_for('static', filename="js/jquery-3.3.1.min.js")}}"></script>
-        <script src="{{ url_for('static', filename="jquery_ui/jquery-ui.js")}}"></script>
-        <script src="{{ url_for('static', filename="js/mynode.js")}}"></script>
 
         <script>
             $(document).ready(function() {
@@ -21,7 +13,7 @@
      </head>
 
     <body>
-        <div class="logo_header"><a href="/"><img class="logo_image" src="{{ url_for('static', filename="images/logo.png")}}"/></a></div>
+        {% include 'includes/logo_header.html' %}
         <div class="mynode_back_div">
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/"><span class="ui-icon ui-icon-home"></span>home&nbsp;</a>
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/lnd"><span class="ui-icon ui-icon-transfer-e-w"></span>ln wallet&nbsp;</a>

rootfs/standard/var/www/mynode/templates/login.html

@@ -1,18 +1,11 @@
 <!DOCTYPE html lang="en">
     <head>
         <title>myNode Login</title>
-        <link rel="shortcut icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
+        {% include 'includes/head.html' %}
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode.css")}}">
-        <link href="{{ url_for('static', filename="jquery_ui/jquery-ui.css")}}" rel="stylesheet">
-        <meta http-equiv="Content-Language" content="en">
-        <meta name="google" content="notranslate">
-        <script src="{{ url_for('static', filename="js/jquery-3.3.1.min.js")}}"></script>
-        <script src="{{ url_for('static', filename="jquery_ui/jquery-ui.js")}}"></script>
-        <script src="{{ url_for('static', filename="js/mynode.js")}}"></script>
      </head>
 
     <body>
-        <div class="logo_header"><a href="/"><img class="logo_image" src="{{ url_for('static', filename="images/logo.png")}}"/></a></div>
+        {% include 'includes/logo_header.html' %}
 
         <div class="main_header">Login</div>
 

rootfs/standard/var/www/mynode/templates/main.html

@@ -1,14 +1,7 @@
 <!DOCTYPE html lang="en">
     <head>
         <title>{{ title }}</title>
-        <link rel="shortcut icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
+        {% include 'includes/head.html' %}
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode.css")}}">
-        <link href="{{ url_for('static', filename="jquery_ui/jquery-ui.css")}}" rel="stylesheet">
-        <meta http-equiv="Content-Language" content="en">
-        <meta name="google" content="notranslate">
-        <script src="{{ url_for('static', filename="js/jquery-3.3.1.min.js")}}"></script>
-        <script src="{{ url_for('static', filename="jquery_ui/jquery-ui.js")}}"></script>
-        <script src="{{ url_for('static', filename="js/mynode.js")}}"></script>
         <meta http-equiv="refresh" content="120">
 
         <script>
@@ -128,7 +121,7 @@
      </head>
 
     <body>
-        <div class="logo_header"><a href="/"><img class="logo_image" src="{{ url_for('static', filename="images/logo.png")}}"/></a></div>
+        {% include 'includes/logo_header.html' %}
         
         <div class="mynode_top_right_div">
             <a class="ui-button ui-widget ui-corner-all mynode_back" id="https" style="display: none;" href="#">&nbsp;<span class="ui-icon ui-icon-locked"></span>&nbsp;</a>

rootfs/standard/var/www/mynode/templates/product_key.html

@@ -1,14 +1,7 @@
 <!DOCTYPE html lang="en">
     <head>
         <title>{{ title }}</title>
-        <link rel="shortcut icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
+        {% include 'includes/head.html' %}
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode.css")}}">
-        <link rel="stylesheet" href="{{ url_for('static', filename="jquery_ui/jquery-ui.css")}}">
-        <meta http-equiv="Content-Language" content="en">
-        <meta name="google" content="notranslate">
-        <script src="{{ url_for('static', filename="js/jquery-3.3.1.min.js")}}"></script>
-        <script src="{{ url_for('static', filename="jquery_ui/jquery-ui.js")}}"></script>
-        <script src="{{ url_for('static', filename="js/mynode.js")}}"></script>
         <script>
         $(document).ready(function() {
 
@@ -86,7 +79,7 @@
      </head>
 
     <body>
-        <div class="logo_header"><a href="/"><img class="logo_image" src="{{ url_for('static', filename="images/logo.png")}}"/></a></div>
+        {% include 'includes/logo_header.html' %}
         
         <div class="state_header">{{ header_text }}</div>
         <div class="state_subheader">Please enter your product key...</div>

rootfs/standard/var/www/mynode/templates/reboot.html

@@ -1,12 +1,7 @@
 <!DOCTYPE html lang="en">
     <head>
         <title>{{ title }}</title>
-        <link rel="shortcut icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
+        {% include 'includes/head.html' %}
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode.css")}}">
-        <meta http-equiv="Content-Language" content="en">
-        <meta name="google" content="notranslate">
-        <script src="{{ url_for('static', filename="js/jquery-3.3.1.min.js")}}"></script>
-        <script src="{{ url_for('static', filename="js/mynode.js")}}"></script>
 
         <script>
             $(document).ready(function() {
@@ -42,7 +37,7 @@
      </head>
 
     <body>
-        <div class="logo_header"><a href="/"><img class="logo_image" src="{{ url_for('static', filename="images/logo.png")}}"/></a></div>
+        {% include 'includes/logo_header.html' %}
         
         <div class="state_header">{{ header_text }}</div>
         <div class="state_subheader">

rootfs/standard/var/www/mynode/templates/settings.html

@@ -1,14 +1,7 @@
 <!DOCTYPE html lang="en">
     <head>
         <title>{{ title }}</title>
-        <link rel="shortcut icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
+        {% include 'includes/head.html' %}
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode.css")}}">
-        <link href="{{ url_for('static', filename="jquery_ui/jquery-ui.css")}}" rel="stylesheet">
-        <meta http-equiv="Content-Language" content="en">
-        <meta name="google" content="notranslate">
-        <script src="{{ url_for('static', filename="js/jquery-3.3.1.min.js")}}"></script>
-        <script src="{{ url_for('static', filename="jquery_ui/jquery-ui.js")}}"></script>
-        <script src="{{ url_for('static', filename="js/mynode.js")}}"></script>
 
         <script>
             $(document).ready(function() {
@@ -285,7 +278,7 @@
      </head>
 
     <body>
-        <div class="logo_header"><a href="/"><img class="logo_image" src="{{ url_for('static', filename="images/logo.png")}}"/></a></div>
+        {% include 'includes/logo_header.html' %}
         <div class="mynode_back_div">
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/"><span class="ui-icon ui-icon-home"></span>home&nbsp;</a>
         </div>
@@ -356,6 +349,14 @@
             </table>
             <div class="divider"></div>
 
+            <div class="settings_block_subheader">User Interface</div>
+            {% if ui_settings['darkmode'] %}
+                <a href="/settings/toggle-darkmode" class="ui-button ui-widget ui-corner-all settings_button">Disable Dark Mode</a>
+            {% else %}
+                <a href="/settings/toggle-darkmode" class="ui-button ui-widget ui-corner-all settings_button">Enable Dark Mode</a>
+            {% endif %}
+            <div class="divider"></div>
+
             <div class="settings_block_subheader">Change Log</div>
             <button id="show_mynode_changelog" class="ui-button ui-widget ui-corner-all settings_button">View Change Log</button>
             <div id="mynode_changelog" style='text-align: left; font-size: 12px; width: 800px; display: none;'><pre>{{changelog}}</pre></div>

rootfs/standard/var/www/mynode/templates/shutdown.html

@@ -1,12 +1,7 @@
 <!DOCTYPE html lang="en">
     <head>
         <title>{{ title }}</title>
-        <link rel="shortcut icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
+        {% include 'includes/head.html' %}
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode.css")}}">
-        <meta http-equiv="Content-Language" content="en">
-        <meta name="google" content="notranslate">
-        <script src="{{ url_for('static', filename="js/jquery-3.3.1.min.js")}}"></script>
-        <script src="{{ url_for('static', filename="js/mynode.js")}}"></script>
 
         <script>
             $(document).ready(function() {
@@ -42,7 +37,7 @@
      </head>
 
     <body>
-        <div class="logo_header"><a href="/"><img class="logo_image" src="{{ url_for('static', filename="images/logo.png")}}"/></a></div>
+        {% include 'includes/logo_header.html' %}
         
         <div class="state_header">{{ header_text }}</div>
         <div class="state_subheader">

rootfs/standard/var/www/mynode/templates/state.html

@@ -1,19 +1,12 @@
 <!DOCTYPE html lang="en">
     <head>
         <title>{{ title }}</title>
-        <link rel="shortcut icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
+        {% include 'includes/head.html' %}
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode.css")}}">
-        <link href="{{ url_for('static', filename="jquery_ui/jquery-ui.css")}}" rel="stylesheet">
-        <meta http-equiv="Content-Language" content="en">
-        <meta name="google" content="notranslate">
-        <script src="{{ url_for('static', filename="js/jquery-3.3.1.min.js")}}"></script>
-        <script src="{{ url_for('static', filename="jquery_ui/jquery-ui.js")}}"></script>
-        <script src="{{ url_for('static', filename="js/mynode.js")}}"></script>
         <meta http-equiv="refresh" content="30">
      </head>
 
     <body>
-        <div class="logo_header"><a href="/"><img class="logo_image" src="{{ url_for('static', filename="images/logo.png")}}"/></a></div>
+        {% include 'includes/logo_header.html' %}
         
         <div class="state_header">{{ header_text }}</div>
         <div class="state_subheader">{{ subheader_text }}</div>

rootfs/standard/var/www/mynode/templates/tor.html

@@ -1,20 +1,12 @@
 <!DOCTYPE html lang="en">
     <head>
         <title>{{ title }}</title>
-        <link rel="shortcut icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
+        {% include 'includes/head.html' %}
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode.css")}}">
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode_bitcoind.css")}}">
-        <link href="{{ url_for('static', filename="jquery_ui/jquery-ui.css")}}" rel="stylesheet">
-        <meta http-equiv="Content-Language" content="en">
-        <meta name="google" content="notranslate">
-        <script src="{{ url_for('static', filename="js/jquery-3.3.1.min.js")}}"></script>
-        <script src="{{ url_for('static', filename="jquery_ui/jquery-ui.js")}}"></script>
-        <script src="{{ url_for('static', filename="js/mynode.js")}}"></script>
 
     </head>
 
     <body>
-        <div class="logo_header"><a href="/"><img class="logo_image" src="{{ url_for('static', filename="images/logo.png")}}"/></a></div>
+        {% include 'includes/logo_header.html' %}
         <div class="mynode_back_div">
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/"><span class="ui-icon ui-icon-home"></span>home&nbsp;</a>
         </div>

rootfs/standard/var/www/mynode/templates/uploader.html

@@ -1,19 +1,12 @@
 <!DOCTYPE html lang="en">
     <head>
         <title>{{ title }}</title>
-        <link rel="shortcut icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
+        {% include 'includes/head.html' %}
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode.css")}}">
-        <link href="{{ url_for('static', filename="jquery_ui/jquery-ui.css")}}" rel="stylesheet">
-        <meta http-equiv="Content-Language" content="en">
-        <meta name="google" content="notranslate">
-        <script src="{{ url_for('static', filename="js/jquery-3.3.1.min.js")}}"></script>
-        <script src="{{ url_for('static', filename="jquery_ui/jquery-ui.js")}}"></script>
-        <script src="{{ url_for('static', filename="js/mynode.js")}}"></script>
         <meta http-equiv="refresh" content="30">
      </head>
 
     <body>
-        <div class="logo_header"><a href="/"><img class="logo_image" src="{{ url_for('static', filename="images/logo.png")}}"/></a></div>
+        {% include 'includes/logo_header.html' %}
         
         <div class="state_header">{{ header_text }}</div>
 

rootfs/standard/var/www/mynode/templates/vpn_info.html

@@ -1,15 +1,7 @@
 <!DOCTYPE html lang="en">
     <head>
         <title>{{ title }}</title>
-        <link rel="shortcut icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
+        {% include 'includes/head.html' %}
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode.css")}}">
-        <link rel="stylesheet" href="{{ url_for('static', filename="css/mynode_bitcoind.css")}}">
-        <link href="{{ url_for('static', filename="jquery_ui/jquery-ui.css")}}" rel="stylesheet">
-        <meta http-equiv="Content-Language" content="en">
-        <meta name="google" content="notranslate">
-        <script src="{{ url_for('static', filename="js/jquery-3.3.1.min.js")}}"></script>
-        <script src="{{ url_for('static', filename="jquery_ui/jquery-ui.js")}}"></script>
-        <script src="{{ url_for('static', filename="js/mynode.js")}}"></script>
 
         <script>
             $(document).ready(function() {
@@ -74,7 +66,7 @@
     </head>
 
     <body>
-        <div class="logo_header"><a href="/"><img class="logo_image" src="{{ url_for('static', filename="images/logo.png")}}"/></a></div>
+        {% include 'includes/logo_header.html' %}
         <div class="mynode_back_div">
             <a class="ui-button ui-widget ui-corner-all mynode_back" href="/"><span class="ui-icon ui-icon-home"></span>home&nbsp;</a>
         </div>

rootfs/standard/var/www/mynode/tor.py

@@ -1,6 +1,7 @@
 from flask import Blueprint, render_template, session, abort, Markup, request, redirect
 from bitcoinrpc.authproxy import AuthServiceProxy, JSONRPCException
 from pprint import pprint, pformat
+from settings import read_ui_settings
 from device_info import is_community_edition, get_bitcoin_rpc_password
 from user_management import check_logged_in
 import os
@@ -54,7 +55,8 @@ def page_tor():
         "title": "myNode Tor Services",
         "mynode_onion_hostname": mynode_onion_hostname,
         "mynode_onion_password": mynode_onion_password,
+        "services": services,
         "fully_noded_link": fully_noded_link,
-        "services": services
+        "ui_settings": read_ui_settings()
     }
     return render_template('tor.html', **templateData)

rootfs/standard/var/www/mynode/vpn.py

@@ -1,10 +1,12 @@
 from flask import Blueprint, render_template, session, abort, Markup, request, redirect, send_from_directory, url_for, flash
 from thread_functions import get_public_ip
 from device_info import is_community_edition
+from settings import read_ui_settings
 from user_management import check_logged_in
 import subprocess
 import pam
 import os
+import json
 
 
 mynode_vpn = Blueprint('mynode_vpn',__name__)
@@ -40,7 +42,8 @@ def page_vpn_info():
         "vpn_file_exists": vpn_file_exists,
         "port_forwarded": port_forwarded,
         "public_ip": ip,
-        "port": "51194"
+        "port": "51194",
+        "ui_settings": read_ui_settings()
     }
     return render_template('vpn_info.html', **templateData)