A lot of things

style_properties.less

@@ -44,6 +44,7 @@
 @xf-paletteNeutral1: #f1f1f1;
 @xf-paletteNeutral2: #a1a1aa;
 @xf-paletteNeutral3: #111111;
+@xf-publicLogoUrl: ~'data/assets/logo_default/plaza-logo-wide.webp';
 @xf-selectedItemBgColor: @xf-paletteAccent1;
 @xf-selectedItemColor: @xf-paletteAccent3;
 @xf-styleType: dark;

style_properties/_metadata.json

@@ -131,6 +131,9 @@
     "paletteNeutral3.json": {
         "hash": "1ec2ef5d3d83ad10b6b7232aaa08c440"
     },
+    "publicLogoUrl.json": {
+        "hash": "aabe78e8cf804421f6dfa2a20b5028da"
+    },
     "selectedItemBgColor.json": {
         "hash": "1b6dcccfb12810ca097e9609b6190590"
     },

style_properties/publicLogoUrl.json

@@ -0,0 +1,17 @@
+{
+    "group_name": "basic",
+    "title": "Logo URL",
+    "description": "The path from your XenForo root directory to your logo. If you specify alternate variations, they should be the same size. If you specify an SVG, you should set <b>Emails &gt; Email logo URL</b> to a PNG, or similar, for better compatibility.",
+    "property_type": "value",
+    "css_components": [],
+    "value_type": "string",
+    "value_parameters": "asset=logo",
+    "has_variations": true,
+    "depends_on": "",
+    "value_group": "logo",
+    "property_value": {
+        "default": "data/assets/logo_default/plaza-logo-wide.webp",
+        "alternate": "data/assets/logo_alternate/plaza-logo-wide.webp"
+    },
+    "display_order": 101
+}

templates/_metadata.json

@@ -3,7 +3,7 @@
         "addon_id": "XF",
         "version_id": 2031070,
         "version_string": "2.3.10",
-        "hash": "122ec8228c6c2b8046c4d75aa413e316"
+        "hash": "a857862c1389c9a7592865e46a440848"
     },
     "public/account_alerts_popup.html": {
         "addon_id": "XF",
@@ -11,6 +11,12 @@
         "version_string": "2.3.10",
         "hash": "625739bb3c29b990a3dfc58e44fd24e8"
     },
+    "public/account_preferences_popup.html": {
+        "addon_id": "RomhackPlaza/Master",
+        "version_id": 1000000,
+        "version_string": "1.0.0",
+        "hash": "5de44b0169e7c63fb664aefc04832ba3"
+    },
     "public/alert_macros.html": {
         "addon_id": "XF",
         "version_id": 2031070,
@@ -27,7 +33,7 @@
         "addon_id": "XF",
         "version_id": 2031070,
         "version_string": "2.3.10",
-        "hash": "e5bc61bbe761757ea341047fe034fc40"
+        "hash": "3944286126e45dbc6af560fd1618744e"
     },
     "public/member_tooltip.html": {
         "addon_id": "XF",
@@ -41,22 +47,28 @@
         "version_string": "2.3.10",
         "hash": "5a95069e23fb2a8c740d3d380a0feb34"
     },
+    "public/misc_preferences_popup.html": {
+        "addon_id": "RomhackPlaza/Master",
+        "version_id": 1000000,
+        "version_string": "1.0.0",
+        "hash": "35f51014f2dfed0104697930d0eff39e"
+    },
     "public/romhackplaza_css.html": {
         "addon_id": "",
         "version_id": 0,
         "version_string": "",
-        "hash": "9f45a4c55e49ec4481f9e58b20038717"
+        "hash": "7ef3afe6786ee66da180c97f23f17fcd"
     },
     "public/romhackplaza_js.html": {
         "addon_id": "",
         "version_id": 0,
         "version_string": "",
-        "hash": "30324ecf51ac365509fce5ef1db2ecd1"
+        "hash": "211bbfb5f0c06de1d7c6a662d8580604"
     },
     "public/topbar_actions.html": {
         "addon_id": "RomhackPlaza/Master",
         "version_id": 1000000,
         "version_string": "1.0.0",
-        "hash": "883175f080ec2926eca33fb50f0def1e"
+        "hash": "c69a27c5c117caf5625183e0e627c89d"
     }
 }

templates/public/PAGE_CONTAINER.html

@@ -85,26 +85,28 @@
 <main id="app">
 	<nav id="menu">
 		<div class="$menu-header">
-			<div class="$menu-logo">
+					<xf:macro id="style_variation_macros::picture"
-				RP
+			arg-property="publicLogoUrl"
-			</div>
+			arg-propertyRetina="publicLogoUrl2x"
-			<div class="$menu-title">
+			arg-width="{{ property('publicLogoWidth') }}"
-				Romhack Plaza
+			arg-height="{{ property('publicLogoHeight') }}"
-			</div>
+			arg-alt="{$xf.options.boardTitle}" />
 		</div>
 		<div class="$menu-navigation">
 
 
-        <div class="$menu-group">
+
 			<xf:foreach loop="$navTree" key="$navSection" value="$navEntry" i="$i" if="{{ $navSection != $xf.app.defaultNavigationId }}">
+				<div class="$menu-group">
 				<div class="$menu-group-title">{{ $navEntry.title }}</div>
-				<xf:foreach loop="$navEntry.children" key="$childNavId" value="$childNavEntry" i="$j">
+					<xf:foreach loop="$navEntry.children" key="$childNavId" value="$childNavEntry" i="$j">
-					<a href="{{ $childNavEntry.href }}" class="$menu-item" >
+						<a href="{{ $childNavEntry.href }}" class="$menu-item" >
-						<i data-lucide="{{ $childNavEntry.attributes.icon}}"></i><span>{{ $childNavEntry.title }}</span>
+							<i data-lucide="{{ $childNavEntry.attributes.icon}}"></i><span>{{ $childNavEntry.title }}</span>
-					</a>
+						</a>
-				</xf:foreach>
+					</xf:foreach>
+				</div>
 			</xf:foreach>
-        </div>
+
 
     </div>
 
@@ -458,6 +460,7 @@
 
 {$ldJsonHtml|raw}
 
+<xf:js src="RomhackPlaza/Master/core.js" />
 <xf:include template="romhackplaza_js" />
 
 </body>

templates/public/misc_preferences_popup.html

@@ -0,0 +1,55 @@
+<div class="$settings-section">
+    <div class="$settings-section-title">
+        <i data-lucide="sun-moon" size="14"></i>
+        Theme
+    </div>
+        <xf:if is="$xf.visitor.style_variation === 'default'">
+            <button type="button" href="{{ link_type( 'public', link('misc/style-variation'), null, {
+                'variation': 'alternate',
+                'reset': null,
+                't': csrf_token(),
+                '_xfRedirect': $redirect
+            }) }}" class="$settings-theme-toggle" rel="nofollow" data-xf-click="style-variation" data-variation="alternate">
+                <span class="$settings-theme-toggle-inner">
+                    <i data-lucide="moon" size="15"></i>
+                    Dark
+                    <span class="$settings-theme-toggle-badge">ON</span>
+                </span>
+            </button>
+        </xf:if>
+        <xf:if is="$xf.visitor.style_variation === 'alternate'">
+            <button type="button" href="{{ link_type( 'public', link('misc/style-variation'), null, {
+                'variation': 'default',
+                'reset': null,
+                't': csrf_token(),
+                '_xfRedirect': $redirect
+            }) }}" class="$settings-theme-toggle" rel="nofollow" data-xf-click="style-variation" data-variation="default">
+                <span class="$settings-theme-toggle-inner">
+                    <i data-lucide="sun" size="15"></i>
+                    Light
+                    <span class="$settings-theme-toggle-badge">ON</span>
+                </span>
+            </button>
+        </xf:if>
+</div>
+
+<div class="$settings-separator"></div>
+
+<xf:if is="$xf.visitor.user_id">
+    <div class="$settings-section">
+        <div class="$settings-section-title">
+            <i data-lucide="user-cog" size="14"></i>
+            Account
+        </div>
+        <a href="{{ link('account') }}" class="$settings-link">
+            <i data-lucide="settings-2" size="14"></i>
+            XenForo settings
+            <i data-lucide="external-link" size="12" style="margin-left:auto"></i>
+        </a>
+    </div>
+</xf:if>
+<script>
+    if( window.refreshIcons !== undefined ) {
+        window.refreshIcons();
+    }
+</script>

templates/public/romhackplaza_css.html

@@ -1,3 +1,6 @@
 <style>
 	.lucide { fill: none !important; }
+    #menu { font-size: initial !important;}
+    .\$menu-group-title { font-size: 0.80rem !important; }
+    .\$menu-title { font-size: 1.275rem !important; }
 </style>

templates/public/romhackplaza_js.html

@@ -3,4 +3,10 @@
     document.addEventListener('DOMContentLoaded', function() {
         lucide.createIcons();
     });
+
+    window.refreshIcons = (container = document) => {
+        const pending = container.querySelectorAll('[data-lucide]');
+        if (pending.length === 0) return;
+        lucide.createIcons();
+    };
 </script>

templates/public/topbar_actions.html

@@ -29,8 +29,8 @@
     <xf:if is="$topbarModSeparator == true">
         <div class="$vertical-separator"></div>
     </xf:if>
-    <xf:if is="$xf.visitor.user_id">
+    <xf:if is="$xf.visitor.canCreateEntry()">
-        <a href="#" class="$btn">
+        <a href="{{ $xf.options.homePageUrl }}/submit" class="$btn">
             <i data-lucide="hard-drive-upload" size="18"></i>
         </a>
     </xf:if>
@@ -96,7 +96,24 @@
     </div>
 
     </xf:if>
-    <button class="$btn">
+    <a class="$btn" data-xf-click="menu" data-menu-pos-ref="< .p-navgroup" title="{{ phrase('settings')|for_attr }}" aria-haspopup="true">
         <i data-lucide="settings" size="18"></i>
-    </button>
+    </a>
+    <div class="menu menu--structural menu--medium" data-menu="menu" aria-hidden="true"
+         data-href="{{ link('misc/preferences-popup') }}"
+         data-nocache="true"
+         data-load-target=".js-convMenuBody"
+         data-xf-init="rhpz-dynamic-theme"
+    >
+        <div class="menu-content">
+            <div class="$settings-header">
+                <span>Settings</span>
+            </div>
+            <div class="js-convMenuBody">
+                <div class="$notifications-loading">
+                    <i data-lucide="loader-2" class="$spin"></i>
+                </div>
+            </div>
+        </div>
+    </div>
 </div>