Dark mode fixes

[dave-regan]

• Aligned navbar brand element with other nav elements
• Added @1x and @2x banner assets for light and dark mode
• Updated CSS media query to switch between assets
• Updated pages with banner to use new assets

Tested in Brave and Safari, MacOS Monterey 12.6.1.

[shermand100]

Thanks so much for this. Love the changes, it's much cleaner to look at.

So I'm looking at how html and html-light directories interact and there will need a final tweak to make this work. It relates to how the web ui "installer" moves the files into place. Specifically lines 197 - 210 of https://github.com/monero-ecosystem/PiNode-XMR/blob/ubuntuServer-20.04/ubuntu-install-continue.sh

So html-light uses the same assets, css, php, everything, minus the nav bar changes with the blockexplorer and p2pool links removed.

Therefore I'd consider the html dir the master web dir, that installs as default (html-light the minor). Then how about if lightmode is selected only the html-light dir .html files overwrite and remove those links. This would reduce the duplication of assets and images.

The current merge req is missing the new logos from the assets dir if html install is selected.

I hope that makes sense, I can clarify if not. You can probably tell from the obscure way things have been built over time this really appreciates fresh eyes.

So to implement your changes, which i really want to do I'm tempted to make those lines mentioned above become something like:

if [[ $LIGHTMODE = TRUE ]]
then
#First move hidden file specifically .htaccess file then entire directory
sudo mv /home/pinodexmr/PiNode-XMR/HTML/.htaccess /var/www/html/ 2>&1 | tee -a /home/pinodexmr/debug.log
sudo rsync -a /home/pinodexmr/PiNode-XMR/HTML/* /var/www/html/ 2>&1 | tee -a /home/pinodexmr/debug.log
sudo rsync -a /home/pinodexmr/PiNode-XMR/HTML-LIGHT/*.html /var/www/html/ 2>&1 | tee -a /home/pinodexmr/debug.log
sudo chown www-data -R /var/www/html/ 2>&1 | tee -a /home/pinodexmr/debug.log
sudo chmod 777 -R /var/www/html/ 2>&1 | tee -a /home/pinodexmr/debug.log
else
#First move hidden file specifically .htaccess file then entire directory
sudo mv /home/pinodexmr/PiNode-XMR/HTML/.htaccess /var/www/html/ 2>&1 | tee -a /home/pinodexmr/debug.log
sudo rsync -a /home/pinodexmr/PiNode-XMR/HTML/* /var/www/html/ 2>&1 | tee -a /home/pinodexmr/debug.log
sudo chown www-data -R /var/www/html/ 2>&1 | tee -a /home/pinodexmr/debug.log
sudo chmod 777 -R /var/www/html/ 2>&1 | tee -a /home/pinodexmr/debug.log
fi

So the above installs the master "html" dir in both instances. 'lightmode=true' means that "html" is installed, then "html-light" overwrites the xxx.html files to remove navbar options.

Therefore everything can be removes from the HTML-LIGHT dir but .html files?

[shermand100]

Hi Dave I've implemented what I was talking about so I hope that's clearer whilst keeping all your changes.

[dave-regan]

Have to admit most of the commands went over my head, but I think I broadly follow the logic: because either HTML or HTML-LIGHT will be installed, but both exist in the source files, you're preventing the need to maintain duplicate assets in each...? (I saw Master has gulpfiles, so I was worried I'd broken a buildchain somewhere!)

Anyway, glad it was helpful. Working on a few bigger ideas, will share separately!

[shermand100]

Yeah I'll merge this once I'm certain the new installer script isn't broken by my changes. And yes the deletions are to remove the need to maintain those duplications.

Have fun with whatever you're up to. If you need any clarification on why something is the way it is just tag me and I'll see what I've done wrong.