From 55e2efc6fcc366155b5699c2e033bf5f4515b049 Mon Sep 17 00:00:00 2001 From: Chad Little Date: Wed, 28 Aug 2013 10:29:02 -0700 Subject: [PATCH] Update PHUIDocument to use new header gradients Summary: Adds the new gradient to document views Test Plan: Tested multiple pages in my sandbox in Phriction, UIExamples. Reviewers: epriestley, btrahan Reviewed By: epriestley CC: Korvin, aran Differential Revision: https://secure.phabricator.com/D6827 --- src/__celerity_resource_map__.php | 94 +++++++++---------- .../PhrictionDocumentController.php | 5 +- src/view/layout/PhabricatorHeaderView.php | 11 +++ src/view/phui/PHUIDocumentView.php | 1 + .../phriction/phriction-document-css.css | 5 +- .../css/layout/phabricator-header-view.css | 2 +- .../layout/phabricator-property-list-view.css | 2 +- webroot/rsrc/css/phui/phui-document.css | 22 +++-- 8 files changed, 80 insertions(+), 62 deletions(-) diff --git a/src/__celerity_resource_map__.php b/src/__celerity_resource_map__.php index b78eb18193..c776c41b1b 100644 --- a/src/__celerity_resource_map__.php +++ b/src/__celerity_resource_map__.php @@ -3183,7 +3183,7 @@ celerity_register_resource_map(array( ), 'phabricator-header-view-css' => array( - 'uri' => '/res/da35cfa0/rsrc/css/layout/phabricator-header-view.css', + 'uri' => '/res/0c8871dc/rsrc/css/layout/phabricator-header-view.css', 'type' => 'css', 'requires' => array( @@ -3386,7 +3386,7 @@ celerity_register_resource_map(array( ), 'phabricator-property-list-view-css' => array( - 'uri' => '/res/1b2f0fa9/rsrc/css/layout/phabricator-property-list-view.css', + 'uri' => '/res/c4c66f5e/rsrc/css/layout/phabricator-property-list-view.css', 'type' => 'css', 'requires' => array( @@ -3748,7 +3748,7 @@ celerity_register_resource_map(array( ), 'phriction-document-css' => array( - 'uri' => '/res/754f6b37/rsrc/css/application/phriction/phriction-document-css.css', + 'uri' => '/res/200bbf46/rsrc/css/application/phriction/phriction-document-css.css', 'type' => 'css', 'requires' => array( @@ -3775,7 +3775,7 @@ celerity_register_resource_map(array( ), 'phui-document-view-css' => array( - 'uri' => '/res/fe374dee/rsrc/css/phui/phui-document.css', + 'uri' => '/res/0c895688/rsrc/css/phui/phui-document.css', 'type' => 'css', 'requires' => array( @@ -4172,7 +4172,7 @@ celerity_register_resource_map(array( ), array( 'packages' => array( - '0b011853' => + 'a75e0dea' => array( 'name' => 'core.pkg.css', 'symbols' => @@ -4219,7 +4219,7 @@ celerity_register_resource_map(array( 39 => 'phabricator-property-list-view-css', 40 => 'phabricator-tag-view-css', ), - 'uri' => '/res/pkg/0b011853/core.pkg.css', + 'uri' => '/res/pkg/a75e0dea/core.pkg.css', 'type' => 'css', ), '4f81c788' => @@ -4410,15 +4410,15 @@ celerity_register_resource_map(array( ), 'reverse' => array( - 'aphront-dialog-view-css' => '0b011853', - 'aphront-error-view-css' => '0b011853', - 'aphront-list-filter-view-css' => '0b011853', - 'aphront-pager-view-css' => '0b011853', - 'aphront-panel-view-css' => '0b011853', - 'aphront-table-view-css' => '0b011853', - 'aphront-tokenizer-control-css' => '0b011853', - 'aphront-tooltip-css' => '0b011853', - 'aphront-typeahead-control-css' => '0b011853', + 'aphront-dialog-view-css' => 'a75e0dea', + 'aphront-error-view-css' => 'a75e0dea', + 'aphront-list-filter-view-css' => 'a75e0dea', + 'aphront-pager-view-css' => 'a75e0dea', + 'aphront-panel-view-css' => 'a75e0dea', + 'aphront-table-view-css' => 'a75e0dea', + 'aphront-tokenizer-control-css' => 'a75e0dea', + 'aphront-tooltip-css' => 'a75e0dea', + 'aphront-typeahead-control-css' => 'a75e0dea', 'differential-changeset-view-css' => '09216861', 'differential-core-view-css' => '09216861', 'differential-inline-comment-editor' => 'd07a3bc2', @@ -4432,7 +4432,7 @@ celerity_register_resource_map(array( 'differential-table-of-contents-css' => '09216861', 'diffusion-commit-view-css' => 'c8ce2d88', 'diffusion-icons-css' => 'c8ce2d88', - 'global-drag-and-drop-css' => '0b011853', + 'global-drag-and-drop-css' => 'a75e0dea', 'inline-comment-summary-css' => '09216861', 'javelin-aphlict' => '4f81c788', 'javelin-behavior' => '2dbbb7d1', @@ -4505,55 +4505,55 @@ celerity_register_resource_map(array( 'javelin-util' => '2dbbb7d1', 'javelin-vector' => '2dbbb7d1', 'javelin-workflow' => '2dbbb7d1', - 'lightbox-attachment-css' => '0b011853', + 'lightbox-attachment-css' => 'a75e0dea', 'maniphest-task-summary-css' => '06bacb9a', 'maniphest-transaction-detail-css' => '06bacb9a', - 'phabricator-action-list-view-css' => '0b011853', - 'phabricator-application-launch-view-css' => '0b011853', + 'phabricator-action-list-view-css' => 'a75e0dea', + 'phabricator-application-launch-view-css' => 'a75e0dea', 'phabricator-busy' => '4f81c788', 'phabricator-content-source-view-css' => '09216861', - 'phabricator-core-css' => '0b011853', - 'phabricator-crumbs-view-css' => '0b011853', + 'phabricator-core-css' => 'a75e0dea', + 'phabricator-crumbs-view-css' => 'a75e0dea', 'phabricator-drag-and-drop-file-upload' => 'd07a3bc2', 'phabricator-dropdown-menu' => '4f81c788', 'phabricator-file-upload' => '4f81c788', - 'phabricator-filetree-view-css' => '0b011853', - 'phabricator-flag-css' => '0b011853', - 'phabricator-header-view-css' => '0b011853', + 'phabricator-filetree-view-css' => 'a75e0dea', + 'phabricator-flag-css' => 'a75e0dea', + 'phabricator-header-view-css' => 'a75e0dea', 'phabricator-hovercard' => '4f81c788', - 'phabricator-jump-nav' => '0b011853', + 'phabricator-jump-nav' => 'a75e0dea', 'phabricator-keyboard-shortcut' => '4f81c788', 'phabricator-keyboard-shortcut-manager' => '4f81c788', - 'phabricator-main-menu-view' => '0b011853', + 'phabricator-main-menu-view' => 'a75e0dea', 'phabricator-menu-item' => '4f81c788', - 'phabricator-nav-view-css' => '0b011853', + 'phabricator-nav-view-css' => 'a75e0dea', 'phabricator-notification' => '4f81c788', - 'phabricator-notification-css' => '0b011853', - 'phabricator-notification-menu-css' => '0b011853', - 'phabricator-object-item-list-view-css' => '0b011853', + 'phabricator-notification-css' => 'a75e0dea', + 'phabricator-notification-menu-css' => 'a75e0dea', + 'phabricator-object-item-list-view-css' => 'a75e0dea', 'phabricator-object-selector-css' => '09216861', 'phabricator-phtize' => '4f81c788', 'phabricator-prefab' => '4f81c788', 'phabricator-project-tag-css' => '06bacb9a', - 'phabricator-property-list-view-css' => '0b011853', - 'phabricator-remarkup-css' => '0b011853', + 'phabricator-property-list-view-css' => 'a75e0dea', + 'phabricator-remarkup-css' => 'a75e0dea', 'phabricator-shaped-request' => 'd07a3bc2', - 'phabricator-side-menu-view-css' => '0b011853', - 'phabricator-standard-page-view' => '0b011853', - 'phabricator-tag-view-css' => '0b011853', + 'phabricator-side-menu-view-css' => 'a75e0dea', + 'phabricator-standard-page-view' => 'a75e0dea', + 'phabricator-tag-view-css' => 'a75e0dea', 'phabricator-textareautils' => '4f81c788', 'phabricator-tooltip' => '4f81c788', - 'phabricator-transaction-view-css' => '0b011853', - 'phabricator-zindex-css' => '0b011853', - 'phui-button-css' => '0b011853', - 'phui-form-css' => '0b011853', - 'phui-form-view-css' => '0b011853', - 'phui-icon-view-css' => '0b011853', - 'phui-spacing-css' => '0b011853', - 'sprite-apps-large-css' => '0b011853', - 'sprite-gradient-css' => '0b011853', - 'sprite-icons-css' => '0b011853', - 'sprite-menu-css' => '0b011853', - 'syntax-highlighting-css' => '0b011853', + 'phabricator-transaction-view-css' => 'a75e0dea', + 'phabricator-zindex-css' => 'a75e0dea', + 'phui-button-css' => 'a75e0dea', + 'phui-form-css' => 'a75e0dea', + 'phui-form-view-css' => 'a75e0dea', + 'phui-icon-view-css' => 'a75e0dea', + 'phui-spacing-css' => 'a75e0dea', + 'sprite-apps-large-css' => 'a75e0dea', + 'sprite-gradient-css' => 'a75e0dea', + 'sprite-icons-css' => 'a75e0dea', + 'sprite-menu-css' => 'a75e0dea', + 'syntax-highlighting-css' => 'a75e0dea', ), )); diff --git a/src/applications/phriction/controller/PhrictionDocumentController.php b/src/applications/phriction/controller/PhrictionDocumentController.php index bb938745f4..591b7aa7c7 100644 --- a/src/applications/phriction/controller/PhrictionDocumentController.php +++ b/src/applications/phriction/controller/PhrictionDocumentController.php @@ -164,9 +164,9 @@ final class PhrictionDocumentController $page_content = id(new PHUIDocumentView()) ->setOffset(true) + ->setHeader($header) ->appendChild( array( - $header, $actions, $properties, $move_notice, @@ -412,7 +412,8 @@ final class PhrictionDocumentController phutil_tag( 'div', array( - 'class' => 'phriction-children-header', + 'class' => 'phriction-children-header '. + 'sprite-gradient gradient-lightblue-header', ), pht('Document Hierarchy')), phutil_tag( diff --git a/src/view/layout/PhabricatorHeaderView.php b/src/view/layout/PhabricatorHeaderView.php index 69e8a45d47..07a2fde4d3 100644 --- a/src/view/layout/PhabricatorHeaderView.php +++ b/src/view/layout/PhabricatorHeaderView.php @@ -7,6 +7,7 @@ final class PhabricatorHeaderView extends AphrontView { private $tags = array(); private $image; private $subheader; + private $gradient; public function setHeader($header) { $this->header = $header; @@ -33,12 +34,22 @@ final class PhabricatorHeaderView extends AphrontView { return $this; } + public function setGradient($gradient) { + $this->gradient = $gradient; + return $this; + } + public function render() { require_celerity_resource('phabricator-header-view-css'); $classes = array(); $classes[] = 'phabricator-header-shell'; + if ($this->gradient) { + $classes[] = 'sprite-gradient'; + $classes[] = 'gradient-'.$this->gradient.'-header'; + } + $image = null; if ($this->image) { $image = phutil_tag( diff --git a/src/view/phui/PHUIDocumentView.php b/src/view/phui/PHUIDocumentView.php index 6a70082c44..ead1fb0d7e 100644 --- a/src/view/phui/PHUIDocumentView.php +++ b/src/view/phui/PHUIDocumentView.php @@ -21,6 +21,7 @@ final class PHUIDocumentView extends AphrontTagView { } public function setHeader(PhabricatorHeaderView $header) { + $header->setGradient(PhabricatorActionHeaderView::HEADER_LIGHTBLUE); $this->header = $header; return $this; } diff --git a/webroot/rsrc/css/application/phriction/phriction-document-css.css b/webroot/rsrc/css/application/phriction/phriction-document-css.css index f04a1e147a..3c1d27eade 100644 --- a/webroot/rsrc/css/application/phriction/phriction-document-css.css +++ b/webroot/rsrc/css/application/phriction/phriction-document-css.css @@ -35,9 +35,12 @@ .phriction-children-header { background: #f7f7f7; - padding: 10px 0 10px 20px; + padding: 8px 0 8px 16px; font-weight: bold; margin-bottom: 15px; + border-bottom: 1px solid #BFCFDA; + color: #6b748c; + text-shadow: 0 1px 2px #fff; } .phriction-document-history-diff { diff --git a/webroot/rsrc/css/layout/phabricator-header-view.css b/webroot/rsrc/css/layout/phabricator-header-view.css index d6a0f5e09a..20ddd94aab 100644 --- a/webroot/rsrc/css/layout/phabricator-header-view.css +++ b/webroot/rsrc/css/layout/phabricator-header-view.css @@ -3,7 +3,7 @@ */ .phabricator-header-shell { - background: #e0e3ec; + background-color: #e0e3ec; border-width: 1px 0; border-style: solid; border-color: #c0c5d1; diff --git a/webroot/rsrc/css/layout/phabricator-property-list-view.css b/webroot/rsrc/css/layout/phabricator-property-list-view.css index f6b3448cac..3cc9e7ce42 100644 --- a/webroot/rsrc/css/layout/phabricator-property-list-view.css +++ b/webroot/rsrc/css/layout/phabricator-property-list-view.css @@ -28,7 +28,7 @@ border-color: #c0c5d1; border-style: solid; border-width: 0 0 1px; - background-color: #f6f6f6; + background-color: #F7F7F8; } .device-desktop .phabricator-property-list-container { diff --git a/webroot/rsrc/css/phui/phui-document.css b/webroot/rsrc/css/phui/phui-document.css index 038922bf60..9ca83f148a 100644 --- a/webroot/rsrc/css/phui/phui-document.css +++ b/webroot/rsrc/css/phui/phui-document.css @@ -8,9 +8,8 @@ } .device-desktop .phui-document-view { - border-left: 1px solid #e7e7e7; - border-right: 1px solid #e7e7e7; - border-bottom: 1px solid #c0c5d1; + border: 1px solid #BFCFDA; + border-bottom: 1px solid #95A6C5; max-width: 960px; margin: 16px auto; } @@ -47,27 +46,31 @@ .phui-document-bookname { padding: 8px 16px; color: #9ca5b5; + background-color: #fff; + border-bottom: 1px solid #BFCFDA; } .phui-document-bookname .bookname { - font-size: 14px; - font-weight: bold; float: left; } .phui-document-bookname .bookdescription { - font-size: 14px; float: right; } .phui-document-content .phabricator-header-shell { - background-color: #f6f7f8; - border-top: 1px solid #e7e7e7; - border-bottom: 1px solid #e7e7e7; + border-top: none; + border-bottom: 1px solid #BFCFDA; } .phui-document-content .phabricator-header-view { padding: 16px; + color: #6b748c; + text-shadow: 0 1px 2px #fff; +} + +.phui-document-content .phabricator-property-list-container { + border-color: #BFCFDA; } .phui-document-content .phabricator-property-list-view { @@ -78,7 +81,6 @@ } .phui-document-content { - box-shadow: 0 1px 2px rgba(0,0,0,0.2); min-height: 240px; background: #fff;