fix(gui): logo placement with no clock using margin

Flex isn't being used in the top bar correctly, which is causing
unpredictable issues when people implement new elements on the top bar.
The best solution for this is to use proper flex values but right now
it's important to get the layout back to normal for production so I'm
implementing this sub-par fix where we always include a spacer element.

src/gui/src/UI/UIDesktop.js

@@ -1108,6 +1108,9 @@ async function UIDesktop(options){
     
         //clock 
     ht += `<div id="clock" class="toolbar-clock" style="margin-left: 10px; margin-right: auto">12:00 AM Sun, Jan 01</div>`;
+
+    // clock spacer
+    ht += `<div class="toolbar-spacer"></div>`;
     
         // create account button
         ht += `<div class="toolbar-btn user-options-create-account-btn ${window.user.is_temp ? '' : 'hidden' }" style="padding:0; opacity:1;" title="Save Account">`;

src/gui/src/css/style.css

@@ -2413,6 +2413,10 @@ label {
     opacity: 0.8;
 }
 
+.toolbar-spacer {
+    margin-right: auto;
+}
+
 .device-phone #clock {
     display: none !important;
 }