We're updating the issue view to help you get more done. 

Buttons, button-style links in headings, and button-style status indications (e.g. Unread) in inbox have different fallback fonts than other elements

Description

If you are on a device that does not have the fonts Lucida Grande and Lucida Sans Unicode, but does have the font Arial Unicode MS, you will see certain things displayed in that font:

  • Button elements, e.g. the words Ratings, Warnings, Fandoms in the filters on works pages

  • Button-style links in headings, e.g. the up arrows next to the letters on media pages

  • Button-style status indications, e.g. the word Unread on unread items in your inbox

With most other things on the site, if you don't have Lucida Grande and Lucida Sans Unicode, you see things in GNU Unifont, Verdana, Helvetica, or the sans-serif of your device's choosing. Therefore, the elements mentioned above look different, and that's weird. They should have the same font stack as the rest of the site.

Testing
Since we can't guarantee that you don't have certain fonts installed, the best way to test this is to use your browser's developer tools to look at the computed styles for the elements described above. In Safari 11.1.1, for example:

  1. Ctrl-click on the word "Categories" in the filter

  2. Choose "Inspect Element" from the context menu that opens

  3. This should open the inspector on the Elements tab, with the page's HTML displayed on the left and a sidebar on the right, as shown in inspector.jpg

    • If you don't see the sidebar on the right, click the icon the black arrow is pointing to in inspector.jpg

  4. Click "Computed" (where the white arrow is pointing in inspector.jpg) to see the computed styles for the selected element

  5. Scroll through the "Properties" list until you find the "font-family" list as shown in computed_styles.jpg

  6. Confirm that it now says 'Lucida Grande', 'Lucida Sans Unicode', 'GNU Unifont', Verdana, Helvetica, sans-serif

Notes
Set to Medium priority rather than Low because the problem is more obvious now that we use button elements in filters.

Environment

None

Status

Assignee

Sarken

Reporter

Sarken

Roadmap

Misc

Priority

Medium

Affects versions

0.9.217

Fix versions

Components

FrontEnd

Difficulty

Easy

Required Access Level

None

Milestone

Internal 0.9