1
0
Fork 0
mirror of https://we.phorge.it/source/phorge.git synced 2024-11-18 21:02:41 +01:00

Move ToC in Phriction to it's own column

Summary: Adds additional CSS to make the Table of Contents into it's own column (if one exists).

Test Plan:
Tested a page with and without a table of contents. Tested tablet, mobile, and desktop breakpoints. Tested Conpherence, scrolling seemed fine still on trackpad and mouse.

{F370973}

Reviewers: btrahan, epriestley

Reviewed By: epriestley

Subscribers: Korvin, epriestley

Differential Revision: https://secure.phabricator.com/D12417
This commit is contained in:
Chad Little 2015-04-14 16:02:30 -07:00
parent e9c7310e83
commit 9537970a42
4 changed files with 39 additions and 8 deletions

View file

@ -7,7 +7,7 @@
*/ */
return array( return array(
'names' => array( 'names' => array(
'core.pkg.css' => 'b13bb594', 'core.pkg.css' => '5efa6280',
'core.pkg.js' => '6a4f677f', 'core.pkg.js' => '6a4f677f',
'darkconsole.pkg.js' => '8ab24e01', 'darkconsole.pkg.js' => '8ab24e01',
'differential.pkg.css' => '3500921f', 'differential.pkg.css' => '3500921f',
@ -107,7 +107,7 @@ return array(
'rsrc/css/application/tokens/tokens.css' => '3d0f239e', 'rsrc/css/application/tokens/tokens.css' => '3d0f239e',
'rsrc/css/application/uiexample/example.css' => '528b19de', 'rsrc/css/application/uiexample/example.css' => '528b19de',
'rsrc/css/core/core.css' => '76e8ee93', 'rsrc/css/core/core.css' => '76e8ee93',
'rsrc/css/core/remarkup.css' => 'bc65f3cc', 'rsrc/css/core/remarkup.css' => 'e10512ff',
'rsrc/css/core/syntax.css' => '56c1ba38', 'rsrc/css/core/syntax.css' => '56c1ba38',
'rsrc/css/core/z-index.css' => 'd1a30710', 'rsrc/css/core/z-index.css' => 'd1a30710',
'rsrc/css/diviner/diviner-shared.css' => '38813222', 'rsrc/css/diviner/diviner-shared.css' => '38813222',
@ -128,7 +128,7 @@ return array(
'rsrc/css/phui/phui-box.css' => '7b3a2eed', 'rsrc/css/phui/phui-box.css' => '7b3a2eed',
'rsrc/css/phui/phui-button.css' => 'f780e520', 'rsrc/css/phui/phui-button.css' => 'f780e520',
'rsrc/css/phui/phui-crumbs-view.css' => '594d719e', 'rsrc/css/phui/phui-crumbs-view.css' => '594d719e',
'rsrc/css/phui/phui-document.css' => 'ffaf9eb9', 'rsrc/css/phui/phui-document.css' => '94d5dcd8',
'rsrc/css/phui/phui-feed-story.css' => 'c9f3a0b5', 'rsrc/css/phui/phui-feed-story.css' => 'c9f3a0b5',
'rsrc/css/phui/phui-fontkit.css' => '1fa79503', 'rsrc/css/phui/phui-fontkit.css' => '1fa79503',
'rsrc/css/phui/phui-form-view.css' => 'b147d2ed', 'rsrc/css/phui/phui-form-view.css' => 'b147d2ed',
@ -741,7 +741,7 @@ return array(
'phabricator-phtize' => 'd254d646', 'phabricator-phtize' => 'd254d646',
'phabricator-prefab' => '72da38cc', 'phabricator-prefab' => '72da38cc',
'phabricator-profile-css' => '1a20dcbf', 'phabricator-profile-css' => '1a20dcbf',
'phabricator-remarkup-css' => 'bc65f3cc', 'phabricator-remarkup-css' => 'e10512ff',
'phabricator-search-results-css' => '15c71110', 'phabricator-search-results-css' => '15c71110',
'phabricator-shaped-request' => '7cbe244b', 'phabricator-shaped-request' => '7cbe244b',
'phabricator-side-menu-view-css' => '7e8c6341', 'phabricator-side-menu-view-css' => '7e8c6341',
@ -781,7 +781,7 @@ return array(
'phui-calendar-list-css' => 'c1d0ca59', 'phui-calendar-list-css' => 'c1d0ca59',
'phui-calendar-month-css' => 'a92e47d2', 'phui-calendar-month-css' => 'a92e47d2',
'phui-crumbs-view-css' => '594d719e', 'phui-crumbs-view-css' => '594d719e',
'phui-document-view-css' => 'ffaf9eb9', 'phui-document-view-css' => '94d5dcd8',
'phui-feed-story-css' => 'c9f3a0b5', 'phui-feed-story-css' => 'c9f3a0b5',
'phui-font-icon-base-css' => '3dad2ae3', 'phui-font-icon-base-css' => '3dad2ae3',
'phui-fontkit-css' => '1fa79503', 'phui-fontkit-css' => '1fa79503',

View file

@ -98,10 +98,13 @@ final class PhrictionContent extends PhrictionDAO
$output, $output,
PhutilMarkupEngine $engine) { PhutilMarkupEngine $engine) {
$classes = array();
$classes[] = 'phabricator-remarkup';
$toc = PhutilRemarkupHeaderBlockRule::renderTableOfContents( $toc = PhutilRemarkupHeaderBlockRule::renderTableOfContents(
$engine); $engine);
if ($toc) { if ($toc) {
$classes[] = 'remarkup-has-toc';
$toc = phutil_tag_div('phabricator-remarkup-toc', array( $toc = phutil_tag_div('phabricator-remarkup-toc', array(
phutil_tag_div( phutil_tag_div(
'phabricator-remarkup-toc-header', 'phabricator-remarkup-toc-header',
@ -110,7 +113,12 @@ final class PhrictionContent extends PhrictionDAO
)); ));
} }
return phutil_tag_div('phabricator-remarkup', array($toc, $output)); return phutil_tag(
'div',
array(
'class' => implode(' ', $classes),
),
array($toc, $output));
} }

View file

@ -235,8 +235,8 @@
} }
.phabricator-remarkup-toc-header { .phabricator-remarkup-toc-header {
font-size: 13px; font-size: 14px;
line-height: 12px; line-height: 13px;
color: {$darkbluetext}; color: {$darkbluetext};
font-weight: bold; font-weight: bold;
margin-bottom: 4px; margin-bottom: 4px;

View file

@ -147,3 +147,26 @@
.phui-document-view .phui-info-severity-nodata { .phui-document-view .phui-info-severity-nodata {
background-color: {$lightgreybackground}; background-color: {$lightgreybackground};
} }
.phui-document-view .phabricator-remarkup.remarkup-has-toc {
position: relative;
margin-right: 192px;
}
.phui-document-view .remarkup-has-toc .phabricator-remarkup-toc {
position: absolute;
top: 0;
right: -186px;
bottom: 0;
border-left: 1px solid {$thinblueborder};
padding: 16px 12px;
margin: 0;
}
.device-phone .phui-document-view .phabricator-remarkup.remarkup-has-toc {
margin-right: 0;
}
.device-phone .phui-document-view .remarkup-has-toc .phabricator-remarkup-toc {
display: none;
}