Page MenuHomePhabricator

Definition list typo and definition formatting incorrect
Closed, ResolvedPublicBUG REPORT

Description

List of steps to reproduce (step by step, including full links if applicable):

  • View any page containing definition lists eg
; valerian
:herbal supplement

(or equivalent html e.g.

<dl><dt>valerian</dt><dd>etc</dd></dl>
  • View page to see issue
  • Error is most apparent when viewing the code, where dd is undefined and dt is defined twice

What happens?:

  • definition dd tag not formatted so ends up in a different font to the dt line above
  • dd padding is incorrect
  • definition term dt looks small due to the serif font, and this looks odd when used on a page with other text not in a definition list

What should have happened instead?:

  • dd defined
  • consistent look and feel
  • no redundant code

Software version (if not a Wikimedia wiki), browser information, screenshots, other information, etc:
All browsers, but tested on safari

Problem code:

  • screen-common.css
  dt {
		font-weight: normal;
		font-family: @fonts-secondary;
		line-height: 1.125;
		margin: 1.25em 0 0.5em;
  }

  dt {
		font-weight: bold;
		font-family: @fonts-secondary;
		line-height: 1.125;
		margin: 1.5em 0 0.5em;
		margin-bottom: 0.1em;
      }

Solution: alter first dt to be dd and inherit fonts instead of using secondary (serif) fonts:

   dd {
		font-weight: normal;
		font-family: inherit;
		line-height: 1.125;
		margin: 1.25em 0 0.5em;
  dt {
		font-weight: bold;
		font-family: inherit;
		line-height: 1.125;
		margin: 1.5em 0 0.5em;
		margin-bottom: 0.1em; 
  	}

Details

Related Changes in Gerrit: