mirror of
https://we.phorge.it/source/phorge.git
synced 2024-12-24 22:40:55 +01:00
Modernize Remarkup CSS
Summary: Uses standard spacing and colors in Remarkup. Also removed 'remarkup dark' since it doesn't exist anymore (Pholio). Left font sizes in em's for spacing. Test Plan: Tested a few dozen Diviner pages, my wiki pages, and a few tasks. Reviewers: btrahan, epriestley Reviewed By: epriestley CC: Korvin, epriestley, aran Differential Revision: https://secure.phabricator.com/D8439
This commit is contained in:
parent
0488ce73c4
commit
03216eff78
2 changed files with 53 additions and 69 deletions
|
@ -7,7 +7,7 @@
|
||||||
return array(
|
return array(
|
||||||
'names' =>
|
'names' =>
|
||||||
array(
|
array(
|
||||||
'core.pkg.css' => '2ed3f133',
|
'core.pkg.css' => '59d88410',
|
||||||
'core.pkg.js' => 'b7bdab05',
|
'core.pkg.js' => 'b7bdab05',
|
||||||
'darkconsole.pkg.js' => 'ca8671ce',
|
'darkconsole.pkg.js' => 'ca8671ce',
|
||||||
'differential.pkg.css' => 'd1b3a605',
|
'differential.pkg.css' => 'd1b3a605',
|
||||||
|
@ -112,7 +112,7 @@ return array(
|
||||||
'rsrc/css/application/tokens/tokens.css' => 'fb286311',
|
'rsrc/css/application/tokens/tokens.css' => 'fb286311',
|
||||||
'rsrc/css/application/uiexample/example.css' => '4741b891',
|
'rsrc/css/application/uiexample/example.css' => '4741b891',
|
||||||
'rsrc/css/core/core.css' => 'da26ddb2',
|
'rsrc/css/core/core.css' => 'da26ddb2',
|
||||||
'rsrc/css/core/remarkup.css' => 'ca7f2265',
|
'rsrc/css/core/remarkup.css' => 'c3692a93',
|
||||||
'rsrc/css/core/syntax.css' => '3c18c1cb',
|
'rsrc/css/core/syntax.css' => '3c18c1cb',
|
||||||
'rsrc/css/core/z-index.css' => '0fd29d49',
|
'rsrc/css/core/z-index.css' => '0fd29d49',
|
||||||
'rsrc/css/diviner/diviner-shared.css' => '38813222',
|
'rsrc/css/diviner/diviner-shared.css' => '38813222',
|
||||||
|
@ -712,7 +712,7 @@ return array(
|
||||||
'phabricator-prefab' => '0326e5d0',
|
'phabricator-prefab' => '0326e5d0',
|
||||||
'phabricator-profile-css' => '9bdb9804',
|
'phabricator-profile-css' => '9bdb9804',
|
||||||
'phabricator-project-tag-css' => '095c9404',
|
'phabricator-project-tag-css' => '095c9404',
|
||||||
'phabricator-remarkup-css' => 'ca7f2265',
|
'phabricator-remarkup-css' => 'c3692a93',
|
||||||
'phabricator-search-results-css' => 'f240504c',
|
'phabricator-search-results-css' => 'f240504c',
|
||||||
'phabricator-settings-css' => 'ea8f5915',
|
'phabricator-settings-css' => 'ea8f5915',
|
||||||
'phabricator-shaped-request' => 'dfa181a4',
|
'phabricator-shaped-request' => 'dfa181a4',
|
||||||
|
|
|
@ -7,7 +7,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.phabricator-remarkup p {
|
.phabricator-remarkup p {
|
||||||
margin: 0 0 1em;
|
margin: 0 0 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.phabricator-remarkup p:last-child {
|
.phabricator-remarkup p:last-child {
|
||||||
|
@ -15,37 +15,43 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.phabricator-remarkup .remarkup-code-block {
|
.phabricator-remarkup .remarkup-code-block {
|
||||||
margin: 1em 2em;
|
margin: 12px;
|
||||||
white-space: pre;
|
white-space: pre;
|
||||||
font-family: "Monaco", monospace;
|
font-family: "Monaco", monospace;
|
||||||
font-size: 10px;
|
font-size: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.phabricator-remarkup .remarkup-code-header {
|
.phabricator-remarkup .remarkup-code-header {
|
||||||
padding: .25em 1em;
|
padding: 6px 8px;
|
||||||
background: #edead7;
|
background: {$lightyellow};
|
||||||
color: {$darkgreytext};
|
color: rgba(0,0,0,.75);
|
||||||
|
font-weight: bold;
|
||||||
|
display: inline-block;
|
||||||
|
border-top: 1px solid {$yellow};
|
||||||
|
border-left: 1px solid {$yellow};
|
||||||
|
border-right: 1px solid {$yellow};
|
||||||
|
margin-bottom: -1px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.phabricator-remarkup .remarkup-code-block pre {
|
.phabricator-remarkup .remarkup-code-block pre {
|
||||||
background: #fdfae7;
|
background: {$lightyellow};
|
||||||
border: 1px solid #f5e178;
|
border: 1px solid {$yellow};
|
||||||
display: block;
|
display: block;
|
||||||
color: #000000;
|
color: #000000;
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
padding: .5em 1em;
|
padding: 8px;
|
||||||
font-family: "Monaco", monospace;
|
font-family: "Monaco", monospace;
|
||||||
}
|
}
|
||||||
|
|
||||||
.phabricator-remarkup pre.remarkup-counterexample {
|
.phabricator-remarkup pre.remarkup-counterexample {
|
||||||
border: 1px solid #aa0000;
|
border: 1px solid {$red};
|
||||||
background-color: #ffaaaa;
|
background-color: {$lightred};
|
||||||
}
|
}
|
||||||
|
|
||||||
.phabricator-remarkup tt {
|
.phabricator-remarkup tt {
|
||||||
color: #333333;
|
color: #333333;
|
||||||
background: #ebebeb;
|
background: #ebebeb;
|
||||||
padding: 0 .25em;
|
padding: 0 4px;
|
||||||
white-space: pre-wrap;
|
white-space: pre-wrap;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -57,19 +63,19 @@
|
||||||
|
|
||||||
.phabricator-remarkup ul {
|
.phabricator-remarkup ul {
|
||||||
list-style: disc;
|
list-style: disc;
|
||||||
margin: 1em 0 1em 3em;
|
margin: 12px 0 12px 30px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.phabricator-remarkup ol {
|
.phabricator-remarkup ol {
|
||||||
list-style: decimal;
|
list-style: decimal;
|
||||||
margin: 1em 0 1em 3em;
|
margin: 12px 0 12px 30px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.phabricator-remarkup ul ol,
|
.phabricator-remarkup ul ol,
|
||||||
.phabricator-remarkup ul ul,
|
.phabricator-remarkup ul ul,
|
||||||
.phabricator-remarkup ol ol,
|
.phabricator-remarkup ol ol,
|
||||||
.phabricator-remarkup ol ul {
|
.phabricator-remarkup ol ul {
|
||||||
margin: .25em 0 .25em 2em;
|
margin: 4px 0 4px 24px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.phabricator-remarkup li.phantom-item,
|
.phabricator-remarkup li.phantom-item,
|
||||||
|
@ -98,45 +104,45 @@
|
||||||
.phabricator-remarkup h1 {
|
.phabricator-remarkup h1 {
|
||||||
font-size: 1.625em;
|
font-size: 1.625em;
|
||||||
line-height: 1.625em;
|
line-height: 1.625em;
|
||||||
margin: .8em 0;
|
margin: 8px 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.phabricator-remarkup h2 {
|
.phabricator-remarkup h2 {
|
||||||
font-size: 1.5em;
|
font-size: 1.5em;
|
||||||
line-height: 1.5em;
|
line-height: 1.5em;
|
||||||
margin: .75em 0;
|
margin: 8px 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.phabricator-remarkup h3 {
|
.phabricator-remarkup h3 {
|
||||||
font-size: 1.375em;
|
font-size: 1.375em;
|
||||||
line-height: 1.375em;
|
line-height: 1.375em;
|
||||||
margin: .69em 0;
|
margin: 8px 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.phabricator-remarkup h4 {
|
.phabricator-remarkup h4 {
|
||||||
font-size: 1.25em;
|
font-size: 1.25em;
|
||||||
line-height: 1.25em;
|
line-height: 1.25em;
|
||||||
margin: .63em 0;
|
margin: 8px 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.phabricator-remarkup h5 {
|
.phabricator-remarkup h5 {
|
||||||
font-size: 1.125em;
|
font-size: 1.125em;
|
||||||
line-height: 1.125em;
|
line-height: 1.125em;
|
||||||
margin: .56em 0;
|
margin: 4px 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.phabricator-remarkup h6 {
|
.phabricator-remarkup h6 {
|
||||||
font-size: 1em;
|
font-size: 1em;
|
||||||
line-height: 1em;
|
line-height: 1em;
|
||||||
margin: .5em 0;
|
margin: 4px 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.phabricator-remarkup blockquote {
|
.phabricator-remarkup blockquote {
|
||||||
border-left: 1px solid #AAAAAA;
|
border-left: 3px solid {$lightbluetext};
|
||||||
color: #333333;
|
color: {$bluetext};
|
||||||
font-style: italic;
|
font-style: italic;
|
||||||
margin: .5em 0em;
|
margin: 4px 0;
|
||||||
padding: .25em 1em;
|
padding: 4px 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.phabricator-remarkup blockquote em {
|
.phabricator-remarkup blockquote em {
|
||||||
|
@ -172,39 +178,40 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.phabricator-remarkup .remarkup-note {
|
.phabricator-remarkup .remarkup-note {
|
||||||
margin: 1em 1.5em;
|
margin: 12px 24px;
|
||||||
padding: 0.5em 1em;
|
padding: 8px;
|
||||||
border: 1px solid #ddddff;
|
border: 1px solid {$blue};
|
||||||
background: #f3f3ff;
|
background: {$lightblue};
|
||||||
}
|
}
|
||||||
|
|
||||||
.phabricator-remarkup .remarkup-warning {
|
.phabricator-remarkup .remarkup-warning {
|
||||||
margin: 1em 1.5em;
|
margin: 12px 24px;
|
||||||
padding: 0.5em 1em;
|
padding: 8px;
|
||||||
border: 1px solid {$yellow};
|
border: 1px solid {$yellow};
|
||||||
background: {$lightyellow};
|
background: {$lightyellow};
|
||||||
}
|
}
|
||||||
|
|
||||||
.phabricator-remarkup .remarkup-important {
|
.phabricator-remarkup .remarkup-important {
|
||||||
margin: 1em 1.5em;
|
margin: 12px 24px;
|
||||||
padding: 0.5em 1em;
|
padding: 8px;
|
||||||
border: 1px solid {$red};
|
border: 1px solid {$red};
|
||||||
background: {$lightred};
|
background: {$lightred};
|
||||||
}
|
}
|
||||||
|
|
||||||
.phabricator-remarkup-toc {
|
.phabricator-remarkup-toc {
|
||||||
float: right;
|
float: right;
|
||||||
border: 1px solid #d7d7d7;
|
border: 1px solid {$lightblueborder};
|
||||||
background: #f7f7f7;
|
background: {$lightgreybackground};
|
||||||
padding: 4px 12px;
|
padding: 8px;
|
||||||
width: 180px;
|
width: 180px;
|
||||||
margin: 0 0 5px 10px;
|
margin: 0 0 4px 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.phabricator-remarkup-toc-header {
|
.phabricator-remarkup-toc-header {
|
||||||
font-size: 11px;
|
font-size: 12px;
|
||||||
color: {$greytext};
|
line-height: 12px;
|
||||||
border-bottom: 1px solid #d7d7d7;
|
color: {$darkbluetext};
|
||||||
|
font-weight: bold;
|
||||||
margin-bottom: 4px;
|
margin-bottom: 4px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -259,10 +266,10 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.phabricator-remarkup table.remarkup-table {
|
.phabricator-remarkup table.remarkup-table {
|
||||||
border-collapse: separate;
|
border-collapse: separate;
|
||||||
border-spacing: 1px;
|
border-spacing: 1px;
|
||||||
background: #d3d3d3;
|
background: #d3d3d3;
|
||||||
margin: 1em;
|
margin: 12px 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.phabricator-remarkup table.remarkup-table th {
|
.phabricator-remarkup table.remarkup-table th {
|
||||||
|
@ -402,26 +409,3 @@
|
||||||
margin: auto;
|
margin: auto;
|
||||||
max-width: 95%;
|
max-width: 95%;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* phabricator-remarkup-dark assumes a dark backround with light text,
|
|
||||||
so here are custom rules to override remarkup defaults. */
|
|
||||||
|
|
||||||
div.phabricator-remarkup-dark blockquote {
|
|
||||||
color: {$lightgreytext};
|
|
||||||
}
|
|
||||||
|
|
||||||
div.phabricator-remarkup-dark tt {
|
|
||||||
color: #EEE;
|
|
||||||
background: {$darkgreytext};
|
|
||||||
}
|
|
||||||
|
|
||||||
div.phabricator-remarkup-dark .remarkup-note,
|
|
||||||
div.phabricator-remarkup-dark .remarkup-warning,
|
|
||||||
div.phabricator-remarkup-dark .remarkup-important,
|
|
||||||
div.phabricator-remarkup-dark table {
|
|
||||||
color: #000;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.phabricator-remarkup-dark hr {
|
|
||||||
border-color: #555;
|
|
||||||
}
|
|
||||||
|
|
Loading…
Reference in a new issue