markdown: Fix display of inbox messages.

Inbox messages display with a tiny font size when viewing with the new markdown
styles.  This is due to a change introduced in e8d0ce7.

<longwindedexplaination>
    The idea behind that change was to make the default font-size for `.md`
    elements `14px` while still using relative font sizes (using `ems` and
    keywords).  This lets us continue to respect browser preferences _and_
    makes the styles a _little_ harder to break via custom css (before this,
    increasing the font size of `.md` could drastically increase a subreddit's
    font size).

    In order to do this, you actually have to use two elements, because
    browsers only provide a limited set of absolute font sizes that respect
    user preferences (via keywords). The outer element uses a keyword font size
    to reset the base font size to the nearest keyword value `small (13px)`,
    and the inner `.md` element scales that up to the desired default font size
    using `ems`.  I thought that using `.wiki-page-content` for wiki pages and
    `usertext-body` for everything else covered it, but it turns out that
    message pages don't wrap message with `UserText`, so the `.md` text there
    is getting scaled up from the site default size of `x-small (10px)`.

    The end result is that we can use `p { font-size: 1em; }`, so if some
    stylesheet author decides they want to set
    `.md { font-size: <whatever>px }`, that's what they'll get.
</longwindedexplaination>

Rather than adding _another_ css rule trying to target the messages page (which
I don't think is possible without side effects anyway), I did two things:
first, I added an extra css class _specifically_ for this purpose
(`.md-container`) and applied to both the `wiki-page-content` and
`usertext-body` elements; and second, wrapped the offending markdown on the
inbox page with an element of that class.
This commit is contained in:
Matt Lee
2014-12-12 15:20:19 -08:00
parent bbd76bd72f
commit 12d0d90670
4 changed files with 6 additions and 5 deletions

View File

@@ -50,8 +50,7 @@
}
.usertext-body,
.wiki-page-content {
.md-container {
font-size: @base-font-keyword;
}

View File

@@ -131,7 +131,9 @@ ${self.subject()}
</a>
</p>
%endif
${unsafe(safemarkdown(thing.body))}
<div class="md-container">
${unsafe(safemarkdown(thing.body))}
</div>
</%def>
<%def name="buttons()">

View File

@@ -126,7 +126,7 @@
<input type="hidden" name="thing_id" value="${thing.fullname}"/>
%if not thing.creating:
<div class="usertext-body may-blank-within">
<div class="usertext-body may-blank-within md-container">
% if not thing.expunged:
${unsafe(safemarkdown(thing.text, nofollow = thing.nofollow,
target = thing.target))}

View File

@@ -71,7 +71,7 @@
%endif
</span>
<div class="wiki-page-content">
<div class="wiki-page-content md-container">
%if thing.description:
<div class="description">
<h2>