ugliness
The BlueFreeBSD style is unusable due to ugliness.
The regular FreeBSD style is good. Nothing - besides the missing background - should be changed.For FreeBSD Style, which of the perceptibly non-ugly elements would you like to remain unchanged?
Hmm, it seems to tack on the png path to the specific page. That should be https://forums.freebsd.org/styles/freebsd/xenforo/freebsd_hdr_fill.png
To:background-image: url("styles/freebsd/xenforo/freebsd_hdr_fill.png")
background-image: url(/styles/freebsd/xenforo/freebsd_hdr_fill.png)
<style>.p-nav-smallLogo {display: none !important;}div#freebsd_menu ul.first,div#freebsd_menu ul:first-of-type {border-left: 0 !important;padding-left: 0;}div#freebsd_menu span.closingButton {display: none;}button#btn-hamburger {display: none;}div.frontdonateroundbox.donate-left {display: none;}@media screen and (max-width: 919px) {div.frontdonateroundbox {display: none;}html.menu-open {overflow-y: hidden !important}body {background-image: none;}div#freebsd_headercontainer {width: auto;font-size: 0px;letter-spacing: 0px;word-spacing: 0px;text-align: center;padding-bottom: 0;margin-bottom: 0px;background-color: black;border-bottom: 0px;}div#freebsd_menu {width: auto;margin: 0 !important;float: none;display: inline-block;font-size: 12px;box-sizing: border-box;padding-top: 5px;text-align: left;}div#freebsd_headercontainer {height: 77px;background-image: url(/styles/freebsd/xenforo/freebsd_hdr_fill.png);}div#freebsd_headerlogoleft {margin: 0 auto;text-align: left;overflow: hidden;}div#freebsd_headerlogoleft img {width: auto;height: 75px;}div#freebsd_menu {display: none;position: absolute;top: 0;left: 0;width: 100%;height: 100%;margin: 0;padding: 61px 0 0px;text-align: center;z-index: 5000;background: #e5e5e5;overflow-y: auto;}div#freebsd_menu ul {border: none;display: inline-block;width: 100%;height: auto;overflow: auto;padding: 0 0 20px 0;cursor: pointer;}div#freebsd_menu ul ul {display: none !important;}html.submenu-open div#freebsd_menu ul ul {display: block !important;}div#freebsd_menu ul {display: inline-block;overflow: auto;}div#freebsd_menu ul ul {position: static;}div#freebsd_menu ul ul {margin-top: 20px;border-top: 1px solid #B4B4B4;padding: 20px 0 0;}div#freebsd_menu ul ul li {border-top: none;padding: 0 0 20px 0;}div#freebsd_menu span.closingButton {display: block;position: absolute;top: 20px;right: 20px;cursor: pointer;}button#btn-hamburger {box-sizing: border-box;display: block;position: absolute;top: 0;right: 0;height: 75px;width: 75px;padding: 17px 22px 18px 23px;cursor: pointer;margin: 0;border: 0;background: transparent;outline: 0 !important;}button#btn-hamburger span.icon-bar {display: block;box-sizing: border-box;border-radius: 2px;background-color: #eee;width: 30px;height: 4px;margin: 6px 0;}button#btn-hamburger:hover span.icon-bar {background-color: #fff;}div.frontdonateroundbox.donate-left {display: block;margin: -10px 4px 8px 20px;float: left;font-size: 11px;}}@media screen and (max-width: 410px) {div.frontdonateroundbox.donate-left {line-height: 13px !important;vertical-align: middle;margin-top: 6px;}}@media screen and (max-width: 559px) {div#freebsd_headerlogoleft img {height: 59px;}div#freebsd_headercontainer {height: 61px;background-image: url(/styles/freebsd/xenforo/freebsd_hdr_fill.png);background-position: 0 -16px;}button#btn-hamburger {height: 59px;width: 59px;padding: 11px 15px 10px 14px;}}@media screen and (max-width: 429px) {div#freebsd_headerlogoleft {width: 212px;overflow: hidden;}div#freebsd_headerlogoleft img {max-width: 457px;}}@media screen and (max-width: 359px) {div.frontdonateroundbox.donate-left {margin: -10px 0 0 10px;}}@media screen and (max-width: 329px) {div.frontdonateroundbox.donate-left {float: none;margin: -10px 0 10px 10px;}}@media screen and (min-width: 651px) and (max-width: 919px) {div.frontdonateroundbox.donate-left {margin-bottom: 4px;}}</style>
I have this artefact on the desktop (win 10, Firefox 115.5esr, display res. 1920x1080) as well; there is a change between the two states when the width of the browser window goes below a certain value, see attached parts of screenshots (full width, height cropped):The real question here is why is this happening on mobile but not on the desktop version.
Yes. I know, can reproduce the error just by resizing the browser window. That's useful but doesn't narrow down the exact location of the issue.I have this artefact on the desktop (win 10, Firefox 115.5esr, display res. 1920x1080) as well; there is a change between the two states when the width of the browser window goes below a certain value
its embedded in the js file aboveYes. I know, can reproduce the error just by resizing the browser window. That's useful but doesn't narrow down the exact location of the issue.
I've gone through all the styles, can't find a reference to it anywhere. I'll have a look through the javascript file. Maybe that has some identifiable markers.
div#freebsd_headercontainer {height: 77px;background-image: url("styles/freebsd/xenforo/freebsd_hdr_fill.png");}
freebsd_headercontainer
is defined somewhere. Those styles and templates are riddled with macros, so it's as clear as mud trying to figure out where things come from.Maybe try to fix the real error instead.That's only a subsequent fault of duplicating code.
The real issue here is the use of different templates for the header / same task.
Only a fool runs the same code twice and expects different results.