Minimize references to fonts in the Dashboard stylesheets

[RanYanivHartstein]

The stylesheets under wp-admin/css includes several redundant references to the default font stack, for example:

#dashboard_recent_comments .comment-meta .approve {
	font-style: italic;
	font-family: Arial, "Bitstream Vera Sans", Helvetica, Verdana, sans-serif;
	font-size: 10px;
}

These fonts are also references under global.css, for the body element and other elements. All these references are redundant - they make the stylesheets needlessly complicated, and they make it much harder to re-style the Dashboard with different fonts.

The problem is much more pronounced in the RTL stylesheets - see for example this snippet, which repeats dozens of times in different selectors:

.widefat th {
	font-family: Tahoma, Arial, sans-serif;
}

The main issue for me is the difficulty in reseting these fonts to Arial for the Hebrew version. This would cause similar issues for anyone developing Dashboard themes.

I propose we minimize these calls to the very minimum necessary - I'm not aware of any reason to have so many redundant references, instead of inheriting the styles from just one. I'll write the patch for this, I just wanted to present the issue first in case there actually is a good reason and I'm just missing it.

[scribu]

Sounds like a good idea to me.

[azaozz]

Looked at doing this couple of weeks ago. It will let us override the font-face and font-size easily when needed, for example on Linux, in RTL and non-Roman languages, etc. The only difficulty here could be that some browsers don't inherit the body font for some elements, mostly for <input type="button"> and <input type="submit"> but think we can force it there.

[RanYanivHartstein]

Score one for theme devs - I really owe someone an apology for saying there were "dozens of redundant calls". I attached a patch that removes that handful of redundancies I found in the Dashboard stylesheets - both LTR and RTL. Also changing this to enhancement.

[azaozz]

Replying to RanYanivHartstein:

What I had in mind was to try to use only one body { font-family:... } declaration and force in for buttons, etc. Of course this has to be confirmed working in all supported browsers. Even thinking we can use

font-family: inherit !important;
font-size: inherit !important;

if needed. I hate using !important for anything but perhaps it's warranted in this case

[RanYanivHartstein]

Replying to azaozz:

Replying to RanYanivHartstein:

What I had in mind was to try to use only one body { font-family:... } declaration and force in for buttons, etc.

This is what this patch is supposed to do, if I'm following you correctly. There was already a deceleration for body, but in some case it was also being overrden by other identical declarations. This patch removes those identical redundant declarations. I only tested only on Mac browsers. I didn't do the inherit thing but I'm not sure I understand where would it be necessary.

[RanYanivHartstein]

Patch to consolidate some redundant font calls in the dashboard stylesheets

[RanYanivHartstein]

Updated the patch with some fixes.

[jkudish]

updating keywords

[ocean90]

#18314