diff options
Diffstat (limited to 'assets/_primer/markdown/markdown-body.scss')
-rw-r--r-- | assets/_primer/markdown/markdown-body.scss | 99 |
1 files changed, 99 insertions, 0 deletions
diff --git a/assets/_primer/markdown/markdown-body.scss b/assets/_primer/markdown/markdown-body.scss new file mode 100644 index 0000000..6581f19 --- /dev/null +++ b/assets/_primer/markdown/markdown-body.scss @@ -0,0 +1,99 @@ +// All of our block level items should have the same margin +// stylelint-disable selector-max-type + +// This is styling for generic markdownized text. Anything you put in a +// container with .markdown-body on it should render generally well. It also +// includes some GitHub Flavored Markdown specific styling (like @mentions) +.markdown-body { + font-family: $body-font; + font-size: $h4-size; + line-height: $body-line-height; + word-wrap: break-word; + + @import "../base/kbd.scss"; // adds support for keyboard shortcuts + + // Clearfix on the markdown body + &::before { + display: table; + content: ""; + } + + &::after { + display: table; + clear: both; + content: ""; + } + + > *:first-child { + margin-top: 0 !important; + } + + > *:last-child { + margin-bottom: 0 !important; + } + + // Anchors like <a name="examples">. These sometimes end up wrapped around + // text when users mistakenly forget to close the tag or use self-closing tag + // syntax. We don't want them to appear like links. + // FIXME: a:not(:link):not(:visited) would be a little clearer here (and + // possibly faster to match), but it breaks styling of <a href> elements due + // to https://bugs.webkit.org/show_bug.cgi?id=142737. + a:not([href]) { + color: inherit; + text-decoration: none; + } + + // Link Colors + .absent { + color: $text-red; + } + + .anchor { + float: left; + padding-right: $spacer-1; + // stylelint-disable-next-line primer/spacing + margin-left: -20px; + line-height: $lh-condensed-ultra; + + &:focus { + outline: none; + } + } + + p, + blockquote, + ul, + ol, + dl, + table, + pre, + details { + margin-top: 0; + margin-bottom: $spacer-3; + } + + hr { + height: $em-spacer-3; + padding: 0; + margin: $spacer-4 0; + // stylelint-disable-next-line primer/colors + background-color: $gray-200; + border: 0; + } + + blockquote { + // stylelint-disable-next-line primer/spacing + padding: 0 1em; + color: $text-gray-light; + // stylelint-disable-next-line primer/borders + border-left: 0.25em $border-style lighten($gray-300, 5%); + + > :first-child { + margin-top: 0; + } + + > :last-child { + margin-bottom: 0; + } + } +} |