From a6e24cb2be9cc15a0eeacd6b90811c4b148c76ab Mon Sep 17 00:00:00 2001 From: Chad Little Date: Fri, 27 Nov 2015 20:40:02 -0800 Subject: [PATCH] Remove pro-white-background, re-style PHUIDocumentViewPro Summary: This makes document views a little more automatic, and a little more style to the page. The Document itself remains on a pure white centered background, but footer and preceeding objects go back to the original body color. This provides a bit more depth and separation over content and definitions/comments. Test Plan: Tested Phriction, Diviner, Legalpad, Phame, Email Commands, HTTP Commands, with and without a footer. {F1005853} Reviewers: epriestley Reviewed By: epriestley Subscribers: Korvin Differential Revision: https://secure.phabricator.com/D14582 --- resources/celerity/map.php | 14 +++--- .../controller/DivinerAtomController.php | 5 +- .../controller/DivinerBookController.php | 1 - .../controller/DivinerMainController.php | 1 - .../LegalpadDocumentSignController.php | 1 - ...atorApplicationEmailCommandsController.php | 1 - .../post/PhamePostViewController.php | 14 ++---- .../PhrictionDocumentController.php | 3 +- .../editengine/PhabricatorEditEngine.php | 1 - src/view/phui/PHUIDocumentViewPro.php | 27 ++++------- .../application/base/standard-page-view.css | 4 +- webroot/rsrc/css/core/core.css | 4 -- webroot/rsrc/css/phui/phui-document-pro.css | 46 +++++++++++-------- 13 files changed, 51 insertions(+), 71 deletions(-) diff --git a/resources/celerity/map.php b/resources/celerity/map.php index 44ba4be6cd..5c86064bb8 100644 --- a/resources/celerity/map.php +++ b/resources/celerity/map.php @@ -7,7 +7,7 @@ */ return array( 'names' => array( - 'core.pkg.css' => '91bbffc2', + 'core.pkg.css' => 'ef642419', 'core.pkg.js' => '47dc9ebb', 'darkconsole.pkg.js' => 'e7393ebb', 'differential.pkg.css' => '2de124c9', @@ -36,7 +36,7 @@ return array( 'rsrc/css/application/base/notification-menu.css' => 'f31c0bde', 'rsrc/css/application/base/phabricator-application-launch-view.css' => '95351601', 'rsrc/css/application/base/phui-theme.css' => '6b451f24', - 'rsrc/css/application/base/standard-page-view.css' => 'a1096ed4', + 'rsrc/css/application/base/standard-page-view.css' => '3c99cdf4', 'rsrc/css/application/calendar/calendar-icon.css' => 'c69aa59f', 'rsrc/css/application/chatlog/chatlog.css' => 'd295b020', 'rsrc/css/application/conduit/conduit-api.css' => '7bc725c4', @@ -103,7 +103,7 @@ return array( 'rsrc/css/application/slowvote/slowvote.css' => 'da0afb1b', 'rsrc/css/application/tokens/tokens.css' => '3d0f239e', 'rsrc/css/application/uiexample/example.css' => '528b19de', - 'rsrc/css/core/core.css' => '78e8d7ea', + 'rsrc/css/core/core.css' => 'a76cefc9', 'rsrc/css/core/remarkup.css' => '88e1ebb6', 'rsrc/css/core/syntax.css' => '9fd11da8', 'rsrc/css/core/z-index.css' => '57ddcaa2', @@ -126,7 +126,7 @@ return array( 'rsrc/css/phui/phui-box.css' => 'a5bb366d', 'rsrc/css/phui/phui-button.css' => '16020a60', 'rsrc/css/phui/phui-crumbs-view.css' => '414406b5', - 'rsrc/css/phui/phui-document-pro.css' => '5f75ed99', + 'rsrc/css/phui/phui-document-pro.css' => 'e0fad431', 'rsrc/css/phui/phui-document.css' => 'a4a1c3b9', 'rsrc/css/phui/phui-feed-story.css' => 'b7b26d23', 'rsrc/css/phui/phui-fontkit.css' => '9cda225e', @@ -727,7 +727,7 @@ return array( 'phabricator-busy' => '59a7976a', 'phabricator-chatlog-css' => 'd295b020', 'phabricator-content-source-view-css' => '4b8b05d4', - 'phabricator-core-css' => '78e8d7ea', + 'phabricator-core-css' => 'a76cefc9', 'phabricator-countdown-css' => 'e7544472', 'phabricator-dashboard-css' => 'eb458607', 'phabricator-drag-and-drop-file-upload' => 'ad10aeac', @@ -755,7 +755,7 @@ return array( 'phabricator-side-menu-view-css' => 'bec2458e', 'phabricator-slowvote-css' => 'da0afb1b', 'phabricator-source-code-view-css' => 'cbeef983', - 'phabricator-standard-page-view' => 'a1096ed4', + 'phabricator-standard-page-view' => '3c99cdf4', 'phabricator-textareautils' => '5c93c52c', 'phabricator-title' => 'df5e11d2', 'phabricator-tooltip' => '1d298e3a', @@ -790,7 +790,7 @@ return array( 'phui-calendar-month-css' => '476be7e0', 'phui-crumbs-view-css' => '414406b5', 'phui-document-view-css' => 'a4a1c3b9', - 'phui-document-view-pro-css' => '5f75ed99', + 'phui-document-view-pro-css' => 'e0fad431', 'phui-feed-story-css' => 'b7b26d23', 'phui-font-icon-base-css' => 'ecbbb4c2', 'phui-fontkit-css' => '9cda225e', diff --git a/src/applications/diviner/controller/DivinerAtomController.php b/src/applications/diviner/controller/DivinerAtomController.php index 05bb80c16a..46506ff317 100644 --- a/src/applications/diviner/controller/DivinerAtomController.php +++ b/src/applications/diviner/controller/DivinerAtomController.php @@ -75,8 +75,7 @@ final class DivinerAtomController extends DivinerController { $document = id(new PHUIDocumentViewPro()) ->setBook($book->getTitle(), $group_name) ->setHeader($header) - ->addClass('diviner-view') - ->setPropertyList($prop_list); + ->addClass('diviner-view'); if ($atom) { $this->buildDefined($properties, $symbol); @@ -243,10 +242,10 @@ final class DivinerAtomController extends DivinerController { array( $crumbs, $document, + $prop_list, ), array( 'title' => $symbol->getTitle(), - 'class' => 'pro-white-background', )); } diff --git a/src/applications/diviner/controller/DivinerBookController.php b/src/applications/diviner/controller/DivinerBookController.php index 2731823588..38e6cc3767 100644 --- a/src/applications/diviner/controller/DivinerBookController.php +++ b/src/applications/diviner/controller/DivinerBookController.php @@ -111,7 +111,6 @@ final class DivinerBookController extends DivinerController { ), array( 'title' => $book->getTitle(), - 'class' => 'pro-white-background', )); } diff --git a/src/applications/diviner/controller/DivinerMainController.php b/src/applications/diviner/controller/DivinerMainController.php index a68d900d8a..3050199c8a 100644 --- a/src/applications/diviner/controller/DivinerMainController.php +++ b/src/applications/diviner/controller/DivinerMainController.php @@ -79,7 +79,6 @@ final class DivinerMainController extends DivinerController { ), array( 'title' => pht('Documentation Books'), - 'class' => 'pro-white-background', )); } } diff --git a/src/applications/legalpad/controller/LegalpadDocumentSignController.php b/src/applications/legalpad/controller/LegalpadDocumentSignController.php index b9c43e377b..ac24efbb5a 100644 --- a/src/applications/legalpad/controller/LegalpadDocumentSignController.php +++ b/src/applications/legalpad/controller/LegalpadDocumentSignController.php @@ -331,7 +331,6 @@ final class LegalpadDocumentSignController extends LegalpadController { ), array( 'title' => $title, - 'class' => 'pro-white-background', 'pageObjects' => array($document->getPHID()), )); } diff --git a/src/applications/meta/controller/PhabricatorApplicationEmailCommandsController.php b/src/applications/meta/controller/PhabricatorApplicationEmailCommandsController.php index 63f2d256e1..060ca951ba 100644 --- a/src/applications/meta/controller/PhabricatorApplicationEmailCommandsController.php +++ b/src/applications/meta/controller/PhabricatorApplicationEmailCommandsController.php @@ -147,7 +147,6 @@ final class PhabricatorApplicationEmailCommandsController ), array( 'title' => $title, - 'class' => 'pro-white-background', )); } diff --git a/src/applications/phame/controller/post/PhamePostViewController.php b/src/applications/phame/controller/post/PhamePostViewController.php index bff1113efe..fcf9dad8b8 100644 --- a/src/applications/phame/controller/post/PhamePostViewController.php +++ b/src/applications/phame/controller/post/PhamePostViewController.php @@ -49,8 +49,7 @@ final class PhamePostViewController extends PhamePostController { ->addActionLink($action_button); $document = id(new PHUIDocumentViewPro()) - ->setHeader($header) - ->setPropertyList($properties); + ->setHeader($header); if ($post->isDraft()) { $document->appendChild( @@ -94,15 +93,16 @@ final class PhamePostViewController extends PhamePostController { $timeline = phutil_tag_div('phui-document-view-pro-box', $timeline); $add_comment = $this->buildCommentForm($post); + $add_comment = phutil_tag_div('mlb mlt', $add_comment); return $this->newPage() ->setTitle($post->getTitle()) - ->addClass('pro-white-background') ->setPageObjectPHIDs(array($post->getPHID())) ->setCrumbs($crumbs) ->appendChild( array( $document, + $properties, $timeline, $add_comment, )); @@ -209,12 +209,6 @@ final class PhamePostViewController extends PhamePostController { private function buildCommentForm(PhamePost $post) { $viewer = $this->getViewer(); - $is_serious = PhabricatorEnv::getEnvConfig('phabricator.serious-business'); - - $add_comment_header = $is_serious - ? pht('Add Comment') - : pht('Derp Text'); - $draft = PhabricatorDraft::newFromUserAndKey( $viewer, $post->getPHID()); @@ -222,7 +216,7 @@ final class PhamePostViewController extends PhamePostController { ->setUser($viewer) ->setObjectPHID($post->getPHID()) ->setDraft($draft) - ->setHeaderText($add_comment_header) + ->setHeaderText(pht('Add Comment')) ->setAction($this->getApplicationURI('post/comment/'.$post->getID().'/')) ->setSubmitButtonName(pht('Add Comment')); diff --git a/src/applications/phriction/controller/PhrictionDocumentController.php b/src/applications/phriction/controller/PhrictionDocumentController.php index 14a929573a..a6d88df341 100644 --- a/src/applications/phriction/controller/PhrictionDocumentController.php +++ b/src/applications/phriction/controller/PhrictionDocumentController.php @@ -216,7 +216,6 @@ final class PhrictionDocumentController $page_content = id(new PHUIDocumentViewPro()) ->setHeader($header) - ->setPropertyList($prop_list) ->setToc($toc) ->appendChild( array( @@ -229,12 +228,12 @@ final class PhrictionDocumentController array( $crumbs->render(), $page_content, + $prop_list, $children, ), array( 'pageObjects' => array($document->getPHID()), 'title' => $page_title, - 'class' => 'pro-white-background', )); } diff --git a/src/applications/transactions/editengine/PhabricatorEditEngine.php b/src/applications/transactions/editengine/PhabricatorEditEngine.php index b398f226eb..599cc490f9 100644 --- a/src/applications/transactions/editengine/PhabricatorEditEngine.php +++ b/src/applications/transactions/editengine/PhabricatorEditEngine.php @@ -860,7 +860,6 @@ abstract class PhabricatorEditEngine return $controller->newPage() ->setTitle(pht('HTTP Parameters')) ->setCrumbs($crumbs) - ->addClass('pro-white-background') ->appendChild($document); } diff --git a/src/view/phui/PHUIDocumentViewPro.php b/src/view/phui/PHUIDocumentViewPro.php index 94854fba96..c18732e2c6 100644 --- a/src/view/phui/PHUIDocumentViewPro.php +++ b/src/view/phui/PHUIDocumentViewPro.php @@ -6,7 +6,6 @@ final class PHUIDocumentViewPro extends AphrontTagView { private $bookname; private $bookdescription; private $fluid; - private $propertyList; private $toc; public function setHeader(PHUIHeaderView $header) { @@ -26,11 +25,6 @@ final class PHUIDocumentViewPro extends AphrontTagView { return $this; } - public function setPropertyList($view) { - $this->propertyList = $view; - return $this; - } - public function setToc($toc) { $this->toc = $toc; return $this; @@ -39,12 +33,13 @@ final class PHUIDocumentViewPro extends AphrontTagView { protected function getTagAttributes() { $classes = array(); + $classes[] = 'phui-document-container'; if ($this->fluid) { $classes[] = 'phui-document-fluid'; } return array( - 'class' => $classes, + 'class' => implode(' ', $classes), ); } @@ -118,19 +113,13 @@ final class PHUIDocumentViewPro extends AphrontTagView { ), $content_inner); - $view = phutil_tag( - 'div', - array( - 'class' => implode(' ', $classes), - ), - $content); + return phutil_tag( + 'div', + array( + 'class' => implode(' ', $classes), + ), + $content); - $list = null; - if ($this->propertyList) { - $list = phutil_tag_div('phui-document-properties', $this->propertyList); - } - - return array($view, $list); } } diff --git a/webroot/rsrc/css/application/base/standard-page-view.css b/webroot/rsrc/css/application/base/standard-page-view.css index 35ccc5b1b3..9670ddd7ae 100644 --- a/webroot/rsrc/css/application/base/standard-page-view.css +++ b/webroot/rsrc/css/application/base/standard-page-view.css @@ -19,9 +19,9 @@ .phabricator-standard-page-footer { text-align: right; - margin: 4px 16px; + margin: 32px 16px 16px; padding: 12px 0; - border-top: 1px solid {$lightgreyborder}; + border-top: 1px solid rgba(71, 87, 120, 0.20); color: {$greytext}; } diff --git a/webroot/rsrc/css/core/core.css b/webroot/rsrc/css/core/core.css index c7229a54ae..87e6a98cce 100644 --- a/webroot/rsrc/css/core/core.css +++ b/webroot/rsrc/css/core/core.css @@ -173,7 +173,3 @@ hr { height: 2px; background: {$sky}; } - -html body.pro-white-background { - background-color: white; -} diff --git a/webroot/rsrc/css/phui/phui-document-pro.css b/webroot/rsrc/css/phui/phui-document-pro.css index 7d211ab956..ab3a22656c 100644 --- a/webroot/rsrc/css/phui/phui-document-pro.css +++ b/webroot/rsrc/css/phui/phui-document-pro.css @@ -2,23 +2,30 @@ * @provides phui-document-view-pro-css */ -.phui-document-view.phui-document-view-pro, +.phui-document-view.phui-document-view-pro { + max-width: 800px; + padding: 16px 16px 64px 16px; + margin: 0 auto; +} + +.phui-document-container { + background-color: #fff; + position: relative; + border-bottom: 1px solid #dedee1; +} + .phui-document-view-pro-box, .phui-document-properties { max-width: 800px; - padding: 0 16px; - position: relative; + margin: 0 auto; +} + +.phui-property-list-section { + max-width: 800px; margin: 16px auto; } -.phui-document-properties { - max-width: 768px; - background-color: {$lightgreybackground}; - margin: 16px auto; - border-radius: 3px; -} - -.device .phui-document-properties { +.device .phui-property-list-section { margin: 0 8px 16px; } @@ -29,7 +36,7 @@ .phui-document-view-pro .phui-document-toc { position: absolute; - top: 18px; + top: 34px; left: -36px; } @@ -49,7 +56,7 @@ a.button.phui-document-toc { position: absolute; z-index: 30; background-color: #fff; - top: 38px; + top: 52px; left: -44px; } @@ -131,8 +138,9 @@ a.button.phui-document-toc { .phui-document-view-pro-box .phui-timeline-view { - padding: 0; + padding: 16px 0 0 0; background: none; + border-top: 1px solid rgba(71, 87, 120, 0.20); } .phui-document-view-pro-box .phui-timeline-image { @@ -157,8 +165,10 @@ a.button.phui-document-toc { } .phui-document-view-pro-box .phui-timeline-title { - border-radius: 3px; - background-color: {$lightgreybackground}; + border-top-right-radius: 3px; + border-top-left-radius: 3px; + background-color: #fff; + border-bottom: 1px solid #F1F1F4; } .phui-document-view-pro-box .phui-timeline-title-with-icon { @@ -171,12 +181,10 @@ a.button.phui-document-toc { .phui-document-view-pro-box .phui-timeline-major-event .phui-timeline-content .phui-timeline-core-content { - padding-bottom: 24px; + } .phui-document-view-pro-box .phui-object-box { - background-color: {$lightgreybackground}; - border: none; margin: 0; }