Webinterface menue in 2 rows after update

jimp

I'm not saying it's minor – for those it affects it is major -- I'm saying it's more subtle, as in it's not as obvious as people are saying. Whinging about a lack of testing for example.

For reference, on my Lubuntu VM I don't have Tahoma installed, nor do I have Verdana or Arial or Helvetica which may be a better thing to check for. What fonts do you have installed? Maybe it's not just that Tahoma is missing but that Tahoma is missing but you have Verdana, etc. What add-on font packages do you have installed? ttf-liberation? ttf-mscorefonts-installer? Something else?

EDIT: The reasoning for wanting to know the above is so that more of us can replicate and confirm a potential fix.

exlfrnk

@jimp:

I'm not saying it's minor – for those it affects it is major -- I'm saying it's more subtle, as in it's not as obvious as people are saying. Whinging about a lack of testing for example.

Right you are! Now i got your idea.

@jimp:

For reference, on my Lubuntu VM I don't have Tahoma installed, nor do I have Verdana or Arial or Helvetica which may be a better thing to check for. What fonts do you have installed? Maybe it's not just that Tahoma is missing but that Tahoma is missing but you have Verdana, etc. What add-on font packages do you have installed? ttf-liberation? ttf-mscorefonts-installer? Something else?

EDIT: The reasoning for wanting to know the above is so that more of us can replicate and confirm a potential fix.

Hmm, no ttf-liberation. ttf-mscorefonts=yes.

I just tried with firefox in safe mode, all add-ons deactivated. no change.

I'll try the ttf-liberatio way now. maybe that's it. Will keep you posted here.

exlfrnk

no change after installing the ttf-liberation either.

font-browser sais i have verdana.

Will now try rebooting the firewall once over (did the reboot automatically after the upgrade, but who knows).

jimp

ttf-mscorefonts-installer seems to be the one that causes it. It adds Verdana and Arial but not Tahoma, and since removing Verdana from the CSS line appears to be what "fixes" it for people then Arial must be OK.

After adding that package I can replicate it locally.

$ fc-list | egrep -ci '(tahoma|verdana|arial|helve)'
16
$ sudo apt-get remove ttf-mscorefonts-installer
[...]
$ fc-list | egrep -ci '(tahoma|verdana|arial|helve)'
0

That narrows it down…

jimp

I created https://redmine.pfsense.org/issues/3842 with the correct and relevant information. That should let us dial in and test a fix a lot easier.

exlfrnk

aye,
firewall-reboot didn't fix it,
subsequent laptop-reboot didn't fix it.

BUT REMOVING ttf-mscorefonts-installer FIXED it!!!!

There ya go!

Now, thing is, having verdana on the system makes some sense if you exchange .docs.

I can live with that for the moment, but i think it needs fixing.

Supermule

http://en.wikipedia.org/wiki/Core_fonts_for_the_Web

These should be the ones tested for on every major OS and 3-4 major browsers.

jimp

Removing Verdana from our list of fonts in CSS is probably the best fix. In other threads, people have said that has also been enough to make it render properly.

ronnieredd

Find "#navigation" in /usr/local/www/themes/pfsense_ng/all.css

Change from
width: 750px;
TO
width: 950px;

So it reads like:
#navigation {
position: fixed;
top: 0px;
left: 100px;
width: 950px;
padding: 0px;
height: 28px;
z-index: 3;
}
Reload the browser css or alt-f5 to clear cache
Not the prettiest, however prettier than it started.

stephenw10

Ah this now makes sense. I have not added the mscorefonts package on any machine I have here and have had no issues other than having to initially refresh the page. Three boxes running Xubuntu 14.04, firefox 31, different resolutions. Using 'inspect element' the menu headers seem to be rendering with Liberation Sans.

Steve

Guest

Just for the LULZ:

I installed a fresh i386 PCBSD (9.1) today, opened the browser and had the issue with the "HELP" over "General" menu… No caching involved, definitely...

jimp

See above, re: Which of the fonts mentioned are present on your system?

stephenw10

No page for 9.1 but for 9.2:
@http://wiki.pcbsd.org/index.php/Java:

PC-BSD installs Microsoft TrueType fonts for you which includes the Times New Roman, Courier New, Georgia, Trebuchet MS, Comic Sans MS Arial, Arial Black, Verdana, Andale Mono, and Impact fonts.

Steve

Guest

The systems comes with Konqueror 4.9.3, font used is Bitstream Vera (changing to Arial doesn't help).

Installing Firefox (21 is apparently the latest available…) uses sans-serif 18 and produces the problem, changing to Arial resolves the issue.

stephenw10

The suggested fix would not help in that particular case then. Using a browser other than Konqueror seems like an acceptable workaround for now at least. I don't know what percentage of pfSense users also use Konqueror on PC-BSD but it's probably quite small. ;)

Steve

doktornotor

Generic note: when you need to mess with fonts in desperate hunt for a couple of remaining pixels of space left for menu, it's pretty clear that the GUI needs a major rewrite. ::)

You guys checked in the past couple of years what's the common resolution used by people?

Guest

…its on a Dell Precision M with 1920 x 1200 (over 10 years old).

doktornotor

@chemlud:

…its on a Dell Precision M with 1920 x 1200 (over 10 years old).

The HW is not at fault, the 750px menu design (and the GUI with loads of non-valid HTML tables) made for 20 years old monitors is.

stephenw10

I don't think even that is a problem. I have machines here that are 1024x768 and the dashboard fits no problem, there's still space for more headings. Though I agree, when a few pixels makes the difference it indicates a deeper problem. A redesigned gui would not necessarily be compromised by fitting a low resolution target IMHO.
Even though, yes, almost everyone has a higher resolution display these days it really annoys me when I visit a site that's been needlessly fixed to width that doesn't fit on my display. Almost as much as endless scroll. ;)

Steve

asayler

I agree that if the UI is cutting spacing so close to the edge that the choice of font causes this issue, then there is a deeper problem that needs to be addressed here. Simply removing one of the potential fonts from the CSS isn't going to fix this for everyone. Eventually someone will come along who has a system that chooses Veranda or some other slightly larger font to satisfy the sans-serif fall back in the CSS (which should work fine as far as the browser is concerned) and it will trigger this issue again. The main menu is a critcial enough part of the UI that is should work fine regardless of font choice, at least among some subset of standardized web-friendly fonts like http://en.wikipedia.org/wiki/Core_fonts_for_the_Web.