1034201 - Clarify inline code snippets with alternate styling

Status: RESOLVED FIXED

(Websites :: wiki.mozilla.org, defect)

Description

[Gene Wood [:gene]]

Currently inline code snippets, using the <code> tag are rendered like this

http://i.imgur.com/RgxqfgI.png

This styling makes it difficult to differentiate between the code and the surrounding text as the only differentiator is the change from a variable width font to a fixed width font.

Github uses, in my opinion, an excellent styling to call out inline code by
* surrounding the span in a box
* using a different background

I've put together a PR here :

https://github.com/mozilla/mediawiki-skins-gmo/pull/6

which adds a <code> style css block which creates a clearer styling. With this style in place, inline code now looks like this :

http://i.imgur.com/eNbC4ur.png

Please take a look at this PR and if it looks good, merge. Thanks!

Comment 1

[Gene Wood [:gene]]

:ckoehler, how does this PR look? Suggestions? Something we can merge?

Comment 2

[Gene Wood [:gene]]

:ckohler, have you had a chance to take a look at my PR? Shouldn't take more than a minute or two, it's pretty small.

Comment 3

[Gene Wood [:gene]]

I meant :ckoehler not :ckohler

Comment 4

[Christie Koehler [:ckoehler]]

PR merged on github. Filed bug 1044482 to have theme updated on dev, stage and prod. 

Sorry for the delay!

Comment 5

[Christie Koehler [:ckoehler]]

This has been deployed to production.