From c5be40decbfdb488b79bb4f53bf9d238fae20f0c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Fernando=20San=20Juli=C3=A1n?= Date: Sat, 1 Aug 2015 02:26:14 +0200 Subject: [PATCH] new markdown styles --- modules/base/markdown.go | 2 +- public/css/markdown.css | 559 +++++++++++++++---------- public/ng/css/gogs.css | 494 +++++++++++++++------- public/ng/less/gogs/markdown.less | 667 +++++++++++++++++++++--------- 4 files changed, 1147 insertions(+), 575 deletions(-) diff --git a/modules/base/markdown.go b/modules/base/markdown.go index e860f9705..d06e1338e 100644 --- a/modules/base/markdown.go +++ b/modules/base/markdown.go @@ -198,7 +198,7 @@ func RenderRawMarkdown(body []byte, urlPrefix string) []byte { extensions |= blackfriday.EXTENSION_FENCED_CODE extensions |= blackfriday.EXTENSION_AUTOLINK extensions |= blackfriday.EXTENSION_STRIKETHROUGH - //extensions |= blackfriday.EXTENSION_HARD_LINE_BREAK + extensions |= blackfriday.EXTENSION_HARD_LINE_BREAK extensions |= blackfriday.EXTENSION_SPACE_HEADERS extensions |= blackfriday.EXTENSION_NO_EMPTY_LINE_BEFORE_BLOCK diff --git a/public/css/markdown.css b/public/css/markdown.css index d46fd9436..e682b080d 100644 --- a/public/css/markdown.css +++ b/public/css/markdown.css @@ -1,235 +1,408 @@ .markdown { - font-size: 14px; + overflow: hidden; + font-family: "Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif; + font-size: 16px; + line-height: 1.6; + word-wrap: break-word; + padding: 0 2em 2em !important; +} +.markdown > *:first-child { + margin-top: 0 !important; +} +.markdown > *:last-child { + margin-bottom: 0 !important; } - -.markdown a { - color: #4183C4; +.markdown a:not([href]) { + color: inherit; + text-decoration: none; +} +.markdown .absent { + color: #c00; +} +.markdown .anchor { + position: absolute; + top: 0; + left: 0; + display: block; + padding-right: 6px; + padding-left: 30px; + margin-left: -30px; +} +.markdown .anchor:focus { + outline: none; } - .markdown h1, .markdown h2, .markdown h3, .markdown h4, .markdown h5, .markdown h6 { - line-height: 1.7; - padding: 15px 0 0; - margin: 0 0 15px; - color: #444; + position: relative; + margin-top: 1em; + margin-bottom: 16px; font-weight: bold; + line-height: 1.4; +} +.markdown h1 .octicon-link, +.markdown h2 .octicon-link, +.markdown h3 .octicon-link, +.markdown h4 .octicon-link, +.markdown h5 .octicon-link, +.markdown h6 .octicon-link { + display: none; + color: #000; + vertical-align: middle; +} +.markdown h1:hover .anchor, +.markdown h2:hover .anchor, +.markdown h3:hover .anchor, +.markdown h4:hover .anchor, +.markdown h5:hover .anchor, +.markdown h6:hover .anchor { + padding-left: 8px; + margin-left: -30px; + text-decoration: none; } - -.markdown h1, -.markdown h2 { - border-bottom: 1px solid #EEE; +.markdown h1:hover .anchor .octicon-link, +.markdown h2:hover .anchor .octicon-link, +.markdown h3:hover .anchor .octicon-link, +.markdown h4:hover .anchor .octicon-link, +.markdown h5:hover .anchor .octicon-link, +.markdown h6:hover .anchor .octicon-link { + display: inline-block; } - -.markdown h2 { - border-bottom: 1px solid #EEE; +.markdown h1 tt, +.markdown h1 code, +.markdown h2 tt, +.markdown h2 code, +.markdown h3 tt, +.markdown h3 code, +.markdown h4 tt, +.markdown h4 code, +.markdown h5 tt, +.markdown h5 code, +.markdown h6 tt, +.markdown h6 code { + font-size: inherit; } - .markdown h1 { - color: #000; - font-size: 33px + padding-bottom: 0.3em; + font-size: 2.25em; + line-height: 1.2; + border-bottom: 1px solid #eee; +} +.markdown h1 .anchor { + line-height: 1; } - .markdown h2 { - color: #333; - font-size: 28px + padding-bottom: 0.3em; + font-size: 1.75em; + line-height: 1.225; + border-bottom: 1px solid #eee; +} +.markdown h2 .anchor { + line-height: 1; } - .markdown h3 { - font-size: 22px + font-size: 1.5em; + line-height: 1.43; +} +.markdown h3 .anchor { + line-height: 1.2; } - .markdown h4 { - font-size: 18px + font-size: 1.25em; +} +.markdown h4 .anchor { + line-height: 1.2; } - .markdown h5 { - font-size: 14px + font-size: 1em; +} +.markdown h5 .anchor { + line-height: 1.1; } - .markdown h6 { - font-size: 14px + font-size: 1em; + color: #777; +} +.markdown h6 .anchor { + line-height: 1.1; +} +.markdown p, +.markdown blockquote, +.markdown ul, +.markdown ol, +.markdown dl, +.markdown table, +.markdown pre { + margin-top: 0; + margin-bottom: 16px; +} +.markdown hr { + height: 4px; + padding: 0; + margin: 16px 0; + background-color: #e7e7e7; + border: 0 none; +} +.markdown ul, +.markdown ol { + padding-left: 2em; +} +.markdown ul.no-list, +.markdown ol.no-list { + padding: 0; + list-style-type: none; +} +.markdown ul ul, +.markdown ul ol, +.markdown ol ol, +.markdown ol ul { + margin-top: 0; + margin-bottom: 0; +} +.markdown ol ol, +.markdown ul ol { + list-style-type: lower-roman; +} +.markdown li > p { + margin-top: 16px; +} +.markdown dl { + padding: 0; +} +.markdown dl dt { + padding: 0; + margin-top: 16px; + font-size: 1em; + font-style: italic; + font-weight: bold; +} +.markdown dl dd { + padding: 0 16px; + margin-bottom: 16px; +} +.markdown blockquote { + padding: 0 15px; + color: #777; + border-left: 4px solid #ddd; +} +.markdown blockquote > :first-child { + margin-top: 0; +} +.markdown blockquote > :last-child { + margin-bottom: 0; } - .markdown table { - border-collapse: collapse; - border-spacing: 0; display: block; - overflow: auto; width: 100%; - margin: 0 0 9px; + overflow: auto; + word-break: normal; + word-break: keep-all; } - .markdown table th { - font-weight: 700 + font-weight: bold; } - .markdown table th, .markdown table td { - border: 1px solid #DDD; - padding: 6px 13px; + padding: 6px 13px !important; + border: 1px solid #ddd; } - .markdown table tr { - background-color: #FFF; - border-top: 1px solid #CCC; + background-color: #fff; + border-top: 1px solid #ccc; } - .markdown table tr:nth-child(2n) { - background-color: #F8F8F8 + background-color: #f8f8f8; } - -.markdown li { - line-height: 1.6; - margin-top: 6px; +.markdown img { + max-width: 100%; + box-sizing: border-box; } - -.markdown li:first-child { - margin-top: 0; +.markdown .emoji { + max-width: none; } - -.markdown dl dt { - font-style: italic; - margin-top: 9px; +.markdown span.frame { + display: block; + overflow: hidden; } - -.markdown dl dd { - margin: 0 0 9px; - padding: 0 9px; +.markdown span.frame > span { + display: block; + float: left; + width: auto; + padding: 7px; + margin: 13px 0 0; + overflow: hidden; + border: 1px solid #ddd; } - -.markdown blockquote, -.markdown blockquote p { - font-size: 14px; - background-color: #f5f5f5; +.markdown span.frame span img { + display: block; + float: left; } - -.markdown > pre { - line-height: 1.6; - overflow: auto; - background: #f8f8f8; - border: 1px solid #ddd; - padding: 0; +.markdown span.frame span span { + display: block; + padding: 5px 0 0; + clear: both; + color: #333; } - -.markdown > pre.linenums { - padding: 0; +.markdown span.align-center { + display: block; + overflow: hidden; + clear: both; } - -.markdown > pre > ol.linenums { - list-style: none; - padding: 0; +.markdown span.align-center > span { + display: block; + margin: 13px auto 0; + overflow: hidden; + text-align: center; } - -.markdown > pre > ol.linenums > li { - margin-top: 2px; +.markdown span.align-center span img { + margin: 0 auto; + text-align: center; } - -.markdown > pre.nums-style > ol.linenums { - list-style-type: decimal; - padding: 0 0 0 40px; - -webkit-box-shadow: inset 40px 0 0 #f5f5f5, inset 41px 0 0 #ccc; - box-shadow: inset 40px 0 0 #f5f5f5, inset 41px 0 0 #ccc; +.markdown span.align-right { + display: block; + overflow: hidden; + clear: both; } - -.markdown > pre > code { - white-space: pre; - word-wrap: normal; +.markdown span.align-right > span { + display: block; + margin: 13px 0 0; + overflow: hidden; + text-align: right; +} +.markdown span.align-right span img { + margin: 0; + text-align: right; +} +.markdown span.float-left { + display: block; + float: left; + margin-right: 13px; + overflow: hidden; +} +.markdown span.float-left span { + margin: 13px 0 0; } - -.markdown > pre > ol.linenums > li { - padding: 0 10px; +.markdown span.float-right { + display: block; + float: right; + margin-left: 13px; + overflow: hidden; } - -.markdown > pre > ol.linenums > li:first-child { - padding-top: 12px; +.markdown span.float-right > span { + display: block; + margin: 13px auto 0; + overflow: hidden; + text-align: right; } - -.markdown > pre > ol.linenums > li:last-child { - padding-bottom: 12px; +.markdown code, +.markdown tt { + padding: 0; + padding-top: 0.2em; + padding-bottom: 0.2em; + margin: 0; + font-size: 85%; + background-color: rgba(0, 0, 0, 0.04); + border-radius: 3px; +} +.markdown code:before, +.markdown code:after, +.markdown tt:before, +.markdown tt:after { + letter-spacing: -0.2em; + content: "\00a0"; +} +.markdown code br, +.markdown tt br { + display: none; } - -.markdown > pre.nums-style > ol.linenums > li { - border-left: 1px solid #ddd; +.markdown del code { + text-decoration: inherit; } - -.markdown hr { - border: none; - color: #ccc; - height: 4px; +.markdown pre > code { padding: 0; - margin: 15px 0; - border-bottom: 2px solid #EEE; -} - -.markdown blockquote:last-child, -.markdown ul:last-child, -.markdown ol:last-child, -.markdown > pre:last-child, -.markdown > pre:last-child, -.markdown p:last-child { - margin-bottom: 0; + margin: 0; + font-size: 100%; + word-break: normal; + white-space: pre; + background: transparent; + border: 0; } - -.markdown img { - max-width: 100%; +.markdown .highlight { + margin-bottom: 16px; } - -.markdown .btn { - color: #fff; +.markdown .highlight pre, +.markdown pre { + padding: 16px; + overflow: auto; + font-size: 85%; + line-height: 1.45; + background-color: #f7f7f7; + border-radius: 3px; } - -.markdown .anchor-wrap { - /*margin-top: -50px;*/ - /*padding-top: 50px;*/ +.markdown .highlight pre { + margin-bottom: 0; + word-break: normal; } - -.markdown h1 a, .markdown h2 a, .markdown h3 a { - text-decoration: none; +.markdown pre { + word-wrap: normal; } - -.markdown h1 a.anchor, -.markdown h2 a.anchor, -.markdown h3 a.anchor, -.markdown h4 a.anchor, -.markdown h5 a.anchor, -.markdown h6 a.anchor { - text-decoration:none; - line-height:1; - padding-left:0; - margin-left:5px; - top:15%; -} -.markdown a span.octicon { - font-size: 16px; - font-family: "FontAwesome"; - line-height: 1; +.markdown pre code, +.markdown pre tt { + display: inline; + max-width: initial; + padding: 0; + margin: 0; + overflow: initial; + line-height: inherit; + word-wrap: normal; + background-color: transparent; + border: 0; +} +.markdown pre code:before, +.markdown pre code:after, +.markdown pre tt:before, +.markdown pre tt:after { + content: normal; +} +.markdown kbd { display: inline-block; - text-decoration: none; - -webkit-font-smoothing: antialiased; + padding: 3px 5px; + font-size: 11px; + line-height: 10px; + color: #555; + vertical-align: middle; + background-color: #fcfcfc; + border: solid 1px #ccc; + border-bottom-color: #bbb; + border-radius: 3px; + box-shadow: inset 0 -1px 0 #bbbbbb; +} +.markdown .csv-data td, +.markdown .csv-data th { + padding: 5px; + overflow: hidden; + font-size: 12px; + line-height: 1; + text-align: left; + white-space: nowrap; } - -.markdown a span.octicon-link { - display: none; - color: #000; +.markdown .csv-data .blob-num { + padding: 10px 8px 9px; + text-align: right; + background: #fff; + border: 0; } - -.markdown a span.octicon-link:before { - content: "\f0c1"; +.markdown .csv-data tr { + border-top: 0; } - -.markdown h1:hover .octicon-link, -.markdown h2:hover .octicon-link, -.markdown h3:hover .octicon-link, -.markdown h4:hover .octicon-link, -.markdown h5:hover .octicon-link, -.markdown h6:hover .octicon-link { - display:inline-block +.markdown .csv-data th { + font-weight: bold; + background: #f8f8f8; + border-top: 0; } - /* Author: jmblog */ /* Project: https://github.com/jmblog/color-themes-for-google-code-prettify */ /* GitHub Theme */ @@ -239,74 +412,60 @@ .pln { color: #333333; } - @media screen { /* string content */ .str { color: #dd1144; } - /* a keyword */ .kwd { color: #333333; } - /* a comment */ .com { color: #999988; font-style: italic; } - /* a type name */ .typ { color: #445588; } - /* a literal value */ .lit { color: #445588; } - /* punctuation */ .pun { color: #333333; } - /* lisp open bracket */ .opn { color: #333333; } - /* lisp close bracket */ .clo { color: #333333; } - /* a markup tag name */ .tag { color: navy; } - /* a markup attribute name */ .atn { color: teal; } - /* a markup attribute value */ .atv { color: #dd1144; } - /* a declaration */ .dec { color: #333333; } - /* a variable name */ .var { color: teal; } - /* a function name */ .fun { color: #990000; @@ -317,69 +476,39 @@ .str { color: #006600; } - .kwd { color: #006; font-weight: bold; } - .com { color: #600; font-style: italic; } - .typ { color: #404; font-weight: bold; } - .lit { color: #004444; } - - .pun, .opn, .clo { + .pun, + .opn, + .clo { color: #444400; } - .tag { color: #006; font-weight: bold; } - .atn { color: #440044; } - .atv { color: #006600; } } - /* Specify class=linenums on a pre to get line numbering */ ol.linenums { margin-top: 0; margin-bottom: 0; } - -/* IE indents via margin-left */ -li.L0, -li.L1, -li.L2, -li.L3, -li.L4, -li.L5, -li.L6, -li.L7, -li.L8, -li.L9 { - /* */ -} - -/* Alternate shading for lines */ -li.L1, -li.L3, -li.L5, -li.L7, -li.L9 { - /* */ -} \ No newline at end of file diff --git a/public/ng/css/gogs.css b/public/ng/css/gogs.css index 60b0c5c80..17c8af909 100644 --- a/public/ng/css/gogs.css +++ b/public/ng/css/gogs.css @@ -279,226 +279,409 @@ img.avatar-100 { list-style: none; } .markdown { - background-color: white; + overflow: hidden; + font-family: "Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif; font-size: 16px; - line-height: 24px; + line-height: 1.6; + word-wrap: break-word; + padding: 0 2em 2em !important; +} +.markdown > *:first-child { + margin-top: 0 !important; +} +.markdown > *:last-child { + margin-bottom: 0 !important; +} +.markdown a:not([href]) { + color: inherit; + text-decoration: none; +} +.markdown .absent { + color: #c00; +} +.markdown .anchor { + position: absolute; + top: 0; + left: 0; + display: block; + padding-right: 6px; + padding-left: 30px; + margin-left: -30px; } -.markdown .markdown-body { - padding-left: 24px; - padding-right: 16px; +.markdown .anchor:focus { + outline: none; } +.markdown h1, +.markdown h2, +.markdown h3, +.markdown h4, .markdown h5, .markdown h6 { + position: relative; + margin-top: 1em; + margin-bottom: 16px; + font-weight: bold; + line-height: 1.4; +} +.markdown h1 .octicon-link, +.markdown h2 .octicon-link, +.markdown h3 .octicon-link, +.markdown h4 .octicon-link, +.markdown h5 .octicon-link, +.markdown h6 .octicon-link { + display: none; + color: #000; + vertical-align: middle; +} +.markdown h1:hover .anchor, +.markdown h2:hover .anchor, +.markdown h3:hover .anchor, +.markdown h4:hover .anchor, +.markdown h5:hover .anchor, +.markdown h6:hover .anchor { + padding-left: 8px; + margin-left: -30px; + text-decoration: none; +} +.markdown h1:hover .anchor .octicon-link, +.markdown h2:hover .anchor .octicon-link, +.markdown h3:hover .anchor .octicon-link, +.markdown h4:hover .anchor .octicon-link, +.markdown h5:hover .anchor .octicon-link, +.markdown h6:hover .anchor .octicon-link { + display: inline-block; +} +.markdown h1 tt, +.markdown h1 code, +.markdown h2 tt, +.markdown h2 code, +.markdown h3 tt, +.markdown h3 code, +.markdown h4 tt, +.markdown h4 code, +.markdown h5 tt, +.markdown h5 code, +.markdown h6 tt, +.markdown h6 code { + font-size: inherit; +} +.markdown h1 { + padding-bottom: 0.3em; + font-size: 2.25em; + line-height: 1.2; + border-bottom: 1px solid #eee; +} +.markdown h1 .anchor { + line-height: 1; +} +.markdown h2 { + padding-bottom: 0.3em; + font-size: 1.75em; + line-height: 1.225; + border-bottom: 1px solid #eee; +} +.markdown h2 .anchor { + line-height: 1; +} +.markdown h3 { + font-size: 1.5em; + line-height: 1.43; +} +.markdown h3 .anchor { + line-height: 1.2; +} +.markdown h4 { + font-size: 1.25em; +} +.markdown h4 .anchor { + line-height: 1.2; +} +.markdown h5 { font-size: 1em; } -.markdown ul { - padding: 10px 0 0 15px; +.markdown h5 .anchor { + line-height: 1.1; +} +.markdown h6 { + font-size: 1em; + color: #777; } -.markdown ul li { - list-style: inside; +.markdown h6 .anchor { + line-height: 1.1; } -.markdown ol > li { - list-style: decimal inside; +.markdown p, +.markdown blockquote, +.markdown ul, +.markdown ol, +.markdown dl, +.markdown table, +.markdown pre { + margin-top: 0; + margin-bottom: 16px; } -.markdown li { - line-height: 1.6; - margin-top: 6px; +.markdown hr { + height: 4px; + padding: 0; + margin: 16px 0; + background-color: #e7e7e7; + border: 0 none; } -.markdown li:first-child { +.markdown ul, +.markdown ol { + padding-left: 2em; +} +.markdown ul.no-list, +.markdown ol.no-list { + padding: 0; + list-style-type: none; +} +.markdown ul ul, +.markdown ul ol, +.markdown ol ol, +.markdown ol ul { margin-top: 0; + margin-bottom: 0; } -.markdown code { - padding: 0.2em 0.5em; - margin: 0; - background-color: rgba(0, 0, 0, 0.04); - border-radius: 3px; +.markdown ol ol, +.markdown ul ol { + list-style-type: lower-roman; } -.markdown > pre { - font-size: 14px; - line-height: 1.6; - overflow: auto; - border: 1px solid #ddd; - border-radius: .25em; - margin: 5px 0; - padding: 10px; - background-color: #f8f8f8; +.markdown li > p { + margin-top: 16px; } -.markdown > pre code { +.markdown dl { padding: 0; - background-color: inherit; } -.markdown img { - padding: 10px 0; - max-width: 100%; +.markdown dl dt { + padding: 0; + margin-top: 16px; + font-size: 1em; + font-style: italic; + font-weight: bold; } -.markdown blockquote { - border-left: 4px solid #ddd; +.markdown dl dd { + padding: 0 16px; margin-bottom: 16px; } -.markdown blockquote p { - font-size: 14px; - padding: 5px 15px; +.markdown blockquote { + padding: 0 15px; color: #777; + border-left: 4px solid #ddd; +} +.markdown blockquote > :first-child { + margin-top: 0; +} +.markdown blockquote > :last-child { + margin-bottom: 0; } .markdown table { + display: block; width: 100%; overflow: auto; word-break: normal; - margin: 15px 0; - border-collapse: collapse; - border-spacing: 0; - display: block; + word-break: keep-all; } .markdown table th { - font-weight: 700; + font-weight: bold; } .markdown table th, .markdown table td { - border: 1px solid #DDD; padding: 6px 13px !important; + border: 1px solid #ddd; } .markdown table tr { - background-color: #FFF; - border-top: 1px solid #CCC; + background-color: #fff; + border-top: 1px solid #ccc; } .markdown table tr:nth-child(2n) { - background-color: #F8F8F8; -} -.markdown p { - margin: 20px 0; + background-color: #f8f8f8; } -.markdown a { - color: #428BCA; +.markdown img { + max-width: 100%; + box-sizing: border-box; } -.markdown h1, -.markdown h2, -.markdown h3, -.markdown h4, -.markdown h5, -.markdown h6 { - line-height: 1.7; - padding: 15px 0 0; - margin: 0 0 15px; - color: #444; - font-weight: bold; +.markdown .emoji { + max-width: none; } -.markdown h1, -.markdown h2 { - border-bottom: 1px solid #E0E0E0; +.markdown span.frame { + display: block; + overflow: hidden; } -.markdown h2 { - border-bottom: 1px solid #E0E0E0; +.markdown span.frame > span { + display: block; + float: left; + width: auto; + padding: 7px; + margin: 13px 0 0; + overflow: hidden; + border: 1px solid #ddd; } -.markdown h1 { - color: #000; - font-size: 33px; +.markdown span.frame span img { + display: block; + float: left; } -.markdown h2 { +.markdown span.frame span span { + display: block; + padding: 5px 0 0; + clear: both; color: #333; - font-size: 28px; } -.markdown h3 { - font-size: 22px; +.markdown span.align-center { + display: block; + overflow: hidden; + clear: both; } -.markdown h4 { - font-size: 18px; +.markdown span.align-center > span { + display: block; + margin: 13px auto 0; + overflow: hidden; + text-align: center; } -.markdown dl dt { - font-style: italic; - margin-top: 9px; +.markdown span.align-center span img { + margin: 0 auto; + text-align: center; } -.markdown dl dd { - margin: 0 0 9px; - padding: 0 9px; +.markdown span.align-right { + display: block; + overflow: hidden; + clear: both; } -.markdown > pre.linenums { - padding: 0; +.markdown span.align-right > span { + display: block; + margin: 13px 0 0; + overflow: hidden; + text-align: right; } -.markdown > pre > ol.linenums { - list-style: none; +.markdown span.align-right span img { + margin: 0; + text-align: right; +} +.markdown span.float-left { + display: block; + float: left; + margin-right: 13px; + overflow: hidden; +} +.markdown span.float-left span { + margin: 13px 0 0; +} +.markdown span.float-right { + display: block; + float: right; + margin-left: 13px; + overflow: hidden; +} +.markdown span.float-right > span { + display: block; + margin: 13px auto 0; + overflow: hidden; + text-align: right; +} +.markdown code, +.markdown tt { padding: 0; + padding-top: 0.2em; + padding-bottom: 0.2em; + margin: 0; + font-size: 85%; + background-color: rgba(0, 0, 0, 0.04); + border-radius: 3px; } -.markdown > pre > ol.linenums > li { - margin-top: 2px; +.markdown code:before, +.markdown code:after, +.markdown tt:before, +.markdown tt:after { + letter-spacing: -0.2em; + content: "\00a0"; +} +.markdown code br, +.markdown tt br { + display: none; } -.markdown > pre.nums-style > ol.linenums { - list-style-type: decimal; - padding: 0 0 0 40px; - -webkit-box-shadow: inset 40px 0 0 #f5f5f5, inset 41px 0 0 #ccc; - box-shadow: inset 40px 0 0 #f5f5f5, inset 41px 0 0 #ccc; +.markdown del code { + text-decoration: inherit; } -.markdown > pre > code { +.markdown pre > code { + padding: 0; + margin: 0; + font-size: 100%; + word-break: normal; white-space: pre; - word-wrap: normal; + background: transparent; + border: 0; } -.markdown > pre > ol.linenums > li { - padding: 0 10px; +.markdown .highlight { + margin-bottom: 16px; } -.markdown > pre > ol.linenums > li:first-child { - padding-top: 12px; +.markdown .highlight pre, +.markdown pre { + padding: 16px; + overflow: auto; + font-size: 85%; + line-height: 1.45; + background-color: #f7f7f7; + border-radius: 3px; } -.markdown > pre > ol.linenums > li:last-child { - padding-bottom: 12px; +.markdown .highlight pre { + margin-bottom: 0; + word-break: normal; } -.markdown > pre.nums-style > ol.linenums > li { - border-left: 1px solid #ddd; +.markdown pre { + word-wrap: normal; } -.markdown hr { - border: none; - color: #ccc; - height: 4px; +.markdown pre code, +.markdown pre tt { + display: inline; + max-width: initial; padding: 0; - margin: 15px 0; - border-bottom: 2px solid #EEE; -} -.markdown blockquote:last-child, -.markdown ul:last-child, -.markdown ol:last-child, -.markdown > pre:last-child, -.markdown > pre:last-child, -.markdown p:last-child { - margin-bottom: 0; + margin: 0; + overflow: initial; + line-height: inherit; + word-wrap: normal; + background-color: transparent; + border: 0; } -.markdown .btn { - color: #fff; +.markdown pre code:before, +.markdown pre code:after, +.markdown pre tt:before, +.markdown pre tt:after { + content: normal; } -.markdown h1 a, -.markdown h2 a, -.markdown h3 a { - text-decoration: none; +.markdown kbd { + display: inline-block; + padding: 3px 5px; + font-size: 11px; + line-height: 10px; + color: #555; + vertical-align: middle; + background-color: #fcfcfc; + border: solid 1px #ccc; + border-bottom-color: #bbb; + border-radius: 3px; + box-shadow: inset 0 -1px 0 #bbbbbb; } -.markdown h1 a.anchor, -.markdown h2 a.anchor, -.markdown h3 a.anchor, -.markdown h4 a.anchor, -.markdown h5 a.anchor, -.markdown h6 a.anchor { - text-decoration: none; +.markdown .csv-data td, +.markdown .csv-data th { + padding: 5px; + overflow: hidden; + font-size: 12px; line-height: 1; - padding-left: 0; - margin-left: -24px; - top: 15%; + text-align: left; + white-space: nowrap; } -.markdown a span.octicon { - font-size: 16px; - line-height: 1; - display: inline-block; - text-decoration: none; - -webkit-font-smoothing: antialiased; - margin-left: 30px; +.markdown .csv-data .blob-num { + padding: 10px 8px 9px; + text-align: right; + background: #fff; + border: 0; } -.markdown a span.octicon-link { - opacity: 0; - color: #444; +.markdown .csv-data tr { + border-top: 0; } -.markdown h1:hover .octicon-link, -.markdown h2:hover .octicon-link, -.markdown h3:hover .octicon-link, -.markdown h4:hover .octicon-link, -.markdown h5:hover .octicon-link, -.markdown h6:hover .octicon-link { - display: inline-block; - opacity: 1; +.markdown .csv-data th { + font-weight: bold; + background: #f8f8f8; + border-top: 0; } /* Author: jmblog */ /* Project: https://github.com/jmblog/color-themes-for-google-code-prettify */ @@ -966,6 +1149,11 @@ The register and sign-in page style .sign-form.form-align .form-label { width: 160px; } +.sign-form.form-align .chk-label { + width: auto; + text-align: left; + margin-left: 176px; +} .sign-form.form-align .alert { margin: 0 30px 24px 30px; } diff --git a/public/ng/less/gogs/markdown.less b/public/ng/less/gogs/markdown.less index cd2eef99b..9cbfc7436 100644 --- a/public/ng/less/gogs/markdown.less +++ b/public/ng/less/gogs/markdown.less @@ -1,225 +1,480 @@ .markdown { - background-color: white; - font-size: 16px; - line-height: 24px; - .markdown-body { - padding-left: 24px; - padding-right: 16px; + overflow:hidden; + font-family:"Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif; + font-size:16px; + line-height:1.6; + word-wrap:break-word; + padding: 0 2em 2em !important; + + >*:first-child { + margin-top:0 !important; + } + + >*:last-child { + margin-bottom:0 !important; + } + + a:not([href]) { + color:inherit; + text-decoration:none; + } + + .absent { + color:#c00; + } + + .anchor { + position:absolute; + top:0; + left:0; + display:block; + padding-right:6px; + padding-left:30px; + margin-left:-30px; + } + + .anchor:focus { + outline:none; } + + h1, + h2, + h3, + h4, h5, h6 { - font-size: 1em; + position:relative; + margin-top:1em; + margin-bottom:16px; + font-weight:bold; + line-height:1.4; } - ul { - padding: 10px 0 0 15px; - li { - list-style: inside; - } + + h1 .octicon-link, + h2 .octicon-link, + h3 .octicon-link, + h4 .octicon-link, + h5 .octicon-link, + h6 .octicon-link { + display:none; + color:#000; + vertical-align:middle; } - ol li { - list-style: decimal inside; + + h1:hover .anchor, + h2:hover .anchor, + h3:hover .anchor, + h4:hover .anchor, + h5:hover .anchor, + h6:hover .anchor { + padding-left:8px; + margin-left:-30px; + text-decoration:none; } - li { - line-height: 1.6; - margin-top: 6px; - &:first-child { - margin-top: 0; - } + + h1:hover .anchor .octicon-link, + h2:hover .anchor .octicon-link, + h3:hover .anchor .octicon-link, + h4:hover .anchor .octicon-link, + h5:hover .anchor .octicon-link, + h6:hover .anchor .octicon-link { + display:inline-block; } - code { - padding: 0.2em 0.5em; - margin: 0; - background-color: rgba(0,0,0,0.04); - border-radius: 3px; - } - >pre { - font-size: 14px; - line-height: 1.6; - overflow: auto; - border: 1px solid #ddd; - border-radius: .25em; - margin: 5px 0; - padding: 10px; - background-color: #f8f8f8; - code { - padding: 0; - background-color: inherit; - } + + h1 tt, + h1 code, + h2 tt, + h2 code, + h3 tt, + h3 code, + h4 tt, + h4 code, + h5 tt, + h5 code, + h6 tt, + h6 code { + font-size:inherit; } - img { - padding: 10px 0; - max-width: 100%; + + h1 { + padding-bottom:0.3em; + font-size:2.25em; + line-height:1.2; + border-bottom:1px solid #eee; + } + + h1 .anchor { + line-height:1; + } + + h2 { + padding-bottom:0.3em; + font-size:1.75em; + line-height:1.225; + border-bottom:1px solid #eee; + } + + h2 .anchor { + line-height:1; + } + + h3 { + font-size:1.5em; + line-height:1.43; + } + + h3 .anchor { + line-height:1.2; + } + + h4 { + font-size:1.25em; + } + + h4 .anchor { + line-height:1.2; + } + + h5 { + font-size:1em; + } + + h5 .anchor { + line-height:1.1; + } + + h6 { + font-size:1em;color:#777; + } + + h6 .anchor { + line-height:1.1; } + + p, + blockquote, + ul, + ol, + dl, + table, + pre { + margin-top:0; + margin-bottom:16px; + } + + hr { + height:4px; + padding:0; + margin:16px 0; + background-color:#e7e7e7; + border:0 none; + } + + ul, + ol { + padding-left:2em; + } + + ul.no-list, + ol.no-list { + padding:0; + list-style-type:none; + } + + ul ul, + ul ol, + ol ol, + ol ul { + margin-top:0; + margin-bottom:0; + } + + ol ol, + ul ol { + list-style-type: lower-roman; + } + + li>p { + margin-top:16px; + } + + dl { + padding:0; + } + + dl dt { + padding:0; + margin-top:16px; + font-size:1em; + font-style:italic; + font-weight:bold; + } + + dl dd { + padding:0 16px; + margin-bottom:16px; + } + blockquote { - border-left: 4px solid #ddd; - margin-bottom: 16px; - p { - font-size: 14px; - padding: 5px 15px; - color: #777; - } + padding:0 15px; + color:#777; + border-left:4px solid #ddd; } + + blockquote>:first-child { + margin-top:0; + } + + blockquote>:last-child { + margin-bottom:0; + } + table { - display: block; - width: 100%; - overflow: auto; - word-break: normal; - margin: 15px 0; - border-collapse: collapse; - border-spacing: 0; - display: block; - th { - font-weight: 700; - } - th, td { - border: 1px solid #DDD; - padding: 6px 13px !important; - } - tr { - background-color: #FFF; - border-top: 1px solid #CCC; - &:nth-child(2n) { - background-color: #F8F8F8; - } - } + display:block; + width:100%; + overflow:auto; + word-break:normal; + word-break:keep-all; } - p { - margin: 20px 0; + + table th { + font-weight:bold; } + + table th, + table td { + padding:6px 13px !important; + border:1px solid #ddd; + } + + table tr { + background-color:#fff; + border-top:1px solid #ccc; + } + + table tr:nth-child(2n) { + background-color:#f8f8f8; + } + + img { + max-width:100%; + box-sizing:border-box; + } + + .emoji { + max-width:none; + } + + span.frame { + display:block; + overflow:hidden; + } + + span.frame>span { + display:block; + float:left; + width:auto; + padding:7px; + margin:13px 0 0; + overflow:hidden; + border:1px solid #ddd; + } + + span.frame span img { + display:block; + float:left; + } + + span.frame span span { + display:block; + padding:5px 0 0; + clear:both; + color:#333; + } + + span.align-center { + display:block; + overflow:hidden; + clear:both; + } + + span.align-center>span { + display:block; + margin:13px auto 0; + overflow:hidden; + text-align:center; + } + + span.align-center span img { + margin:0 auto; + text-align:center; + } + + span.align-right { + display:block; + overflow:hidden; + clear:both; + } + + span.align-right>span { + display:block; + margin:13px 0 0; + overflow:hidden; + text-align:right; + } + + span.align-right span img { + margin:0; + text-align:right; + } + + span.float-left { + display:block; + float:left; + margin-right:13px; + overflow:hidden; + } + + span.float-left span { + margin:13px 0 0; + } + + span.float-right { + display:block; + float:right; + margin-left:13px; + overflow:hidden; + } + + span.float-right>span { + display:block; + margin:13px auto 0; + overflow:hidden; + text-align:right; + } + + code, + tt { + padding:0; + padding-top:0.2em; + padding-bottom:0.2em; + margin:0; + font-size:85%; + background-color:rgba(0,0,0,0.04); + border-radius:3px; + } + + code:before, + code:after, + tt:before, + tt:after { + letter-spacing:-0.2em; + content:"\00a0"; + } + + code br, + tt br { + display:none; + } + + del code { + text-decoration:inherit; + } + + pre>code { + padding:0; + margin:0; + font-size:100%; + word-break:normal; + white-space:pre; + background:transparent; + border:0; + } + + .highlight { + margin-bottom:16px; + } + + .highlight pre, + pre { + padding:16px; + overflow:auto; + font-size:85%; + line-height:1.45; + background-color:#f7f7f7; + border-radius:3px; + } + + .highlight pre { + margin-bottom:0; + word-break:normal; + } + + pre { + word-wrap:normal; + } + + pre code, + pre tt { + display:inline; + max-width:initial; + padding:0; + margin:0; + overflow:initial; + line-height:inherit; + word-wrap:normal; + background-color:transparent; + border:0; + } + + pre code:before, + pre code:after, + pre tt:before, + pre tt:after { + content:normal; + } + + kbd { + display:inline-block; + padding:3px 5px; + font-size:11px; + line-height:10px; + color:#555; + vertical-align:middle; + background-color:#fcfcfc; + border:solid 1px #ccc; + border-bottom-color:#bbb; + border-radius:3px; + box-shadow:inset 0 -1px 0 #bbb; + } + + .csv-data td, + .csv-data th { + padding:5px; + overflow:hidden; + font-size:12px; + line-height:1; + text-align:left; + white-space:nowrap; + } + + .csv-data .blob-num { + padding:10px 8px 9px; + text-align:right; + background:#fff;border:0; + } + + .csv-data tr { + border-top:0; + } + + .csv-data th { + font-weight:bold; + background:#f8f8f8;border-top:0; + } + } -.markdown a { - color: #428BCA; -} -.markdown h1, -.markdown h2, -.markdown h3, -.markdown h4, -.markdown h5, -.markdown h6 { - line-height: 1.7; - padding: 15px 0 0; - margin: 0 0 15px; - color: #444; - font-weight: bold; -} -.markdown h1, -.markdown h2 { - border-bottom: 1px solid #E0E0E0; -} -.markdown h2 { - border-bottom: 1px solid #E0E0E0; -} -.markdown h1 { - color: #000; - font-size: 33px -} -.markdown h2 { - color: #333; - font-size: 28px -} -.markdown h3 { - font-size: 22px -} -.markdown h4 { - font-size: 18px -} -.markdown dl dt { - font-style: italic; - margin-top: 9px; -} -.markdown dl dd { - margin: 0 0 9px; - padding: 0 9px; -} -.markdown > pre.linenums { - padding: 0; -} -.markdown > pre > ol.linenums { - list-style: none; - padding: 0; -} -.markdown > pre > ol.linenums > li { - margin-top: 2px; -} -.markdown > pre.nums-style > ol.linenums { - list-style-type: decimal; - padding: 0 0 0 40px; - -webkit-box-shadow: inset 40px 0 0 #f5f5f5, inset 41px 0 0 #ccc; - box-shadow: inset 40px 0 0 #f5f5f5, inset 41px 0 0 #ccc; -} -.markdown > pre > code { - white-space: pre; - word-wrap: normal; -} -.markdown > pre > ol.linenums > li { - padding: 0 10px; -} -.markdown > pre > ol.linenums > li:first-child { - padding-top: 12px; -} -.markdown > pre > ol.linenums > li:last-child { - padding-bottom: 12px; -} -.markdown > pre.nums-style > ol.linenums > li { - border-left: 1px solid #ddd; -} -.markdown hr { - border: none; - color: #ccc; - height: 4px; - padding: 0; - margin: 15px 0; - border-bottom: 2px solid #EEE; -} -.markdown blockquote:last-child, -.markdown ul:last-child, -.markdown ol:last-child, -.markdown > pre:last-child, -.markdown > pre:last-child, -.markdown p:last-child { - margin-bottom: 0; -} -.markdown .btn { - color: #fff; -} -.markdown h1 a, -.markdown h2 a, -.markdown h3 a { - text-decoration: none; -} -.markdown h1 a.anchor, -.markdown h2 a.anchor, -.markdown h3 a.anchor, -.markdown h4 a.anchor, -.markdown h5 a.anchor, -.markdown h6 a.anchor { - text-decoration: none; - line-height: 1; - padding-left: 0; - margin-left: -24px; - top: 15%; -} -.markdown a span.octicon { - font-size: 16px; - line-height: 1; - display: inline-block; - text-decoration: none; - -webkit-font-smoothing: antialiased; - margin-left: 30px; -} -.markdown a span.octicon-link { - opacity: 0; - color: #444; -} -.markdown h1:hover .octicon-link, -.markdown h2:hover .octicon-link, -.markdown h3:hover .octicon-link, -.markdown h4:hover .octicon-link, -.markdown h5:hover .octicon-link, -.markdown h6:hover .octicon-link { - display: inline-block; - opacity: 1; -} + /* Author: jmblog */ /* Project: https://github.com/jmblog/color-themes-for-google-code-prettify */