mirror of
https://we.phorge.it/source/phorge.git
synced 2024-12-18 19:40:55 +01:00
[Redesign] Better Headers, more options
Summary: Ref T8099, Adds ability to set header as "tall" and provide better control over height of actual header text. Also fixed some color issues with multiple object boxes. Test Plan: Review a commit, review dashboards, review a diff, review home. Reviewers: btrahan, epriestley Reviewed By: epriestley Subscribers: Korvin, epriestley Maniphest Tasks: T8099 Differential Revision: https://secure.phabricator.com/D13077
This commit is contained in:
parent
cc20a6c4d3
commit
3dcb672076
8 changed files with 45 additions and 62 deletions
|
@ -7,7 +7,7 @@
|
|||
*/
|
||||
return array(
|
||||
'names' => array(
|
||||
'core.pkg.css' => 'b6b5fe6c',
|
||||
'core.pkg.css' => 'db211713',
|
||||
'core.pkg.js' => 'fbf1d615',
|
||||
'darkconsole.pkg.js' => 'e7393ebb',
|
||||
'differential.pkg.css' => '7d01bee8',
|
||||
|
@ -26,7 +26,7 @@ return array(
|
|||
'rsrc/css/aphront/pager-view.css' => '2e3539af',
|
||||
'rsrc/css/aphront/panel-view.css' => '8427b78d',
|
||||
'rsrc/css/aphront/phabricator-nav-view.css' => '0ecd30a1',
|
||||
'rsrc/css/aphront/table-view.css' => '15fedf7a',
|
||||
'rsrc/css/aphront/table-view.css' => '4f2ed0bf',
|
||||
'rsrc/css/aphront/tokenizer.css' => '04875312',
|
||||
'rsrc/css/aphront/tooltip.css' => '7672b60f',
|
||||
'rsrc/css/aphront/two-column.css' => '16ab3ad2',
|
||||
|
@ -129,18 +129,18 @@ return array(
|
|||
'rsrc/css/phui/phui-box.css' => 'a5bb366d',
|
||||
'rsrc/css/phui/phui-button.css' => 'b995182d',
|
||||
'rsrc/css/phui/phui-crumbs-view.css' => 'ce840ec2',
|
||||
'rsrc/css/phui/phui-document.css' => '8be7a5e3',
|
||||
'rsrc/css/phui/phui-document.css' => '88f0c90b',
|
||||
'rsrc/css/phui/phui-feed-story.css' => '92f55311',
|
||||
'rsrc/css/phui/phui-fontkit.css' => 'b664ac96',
|
||||
'rsrc/css/phui/phui-form-view.css' => 'a0e8f168',
|
||||
'rsrc/css/phui/phui-form.css' => 'f535f938',
|
||||
'rsrc/css/phui/phui-header-view.css' => '47b8f221',
|
||||
'rsrc/css/phui/phui-header-view.css' => '7716c613',
|
||||
'rsrc/css/phui/phui-icon.css' => '88ba9081',
|
||||
'rsrc/css/phui/phui-image-mask.css' => '5a8b09c8',
|
||||
'rsrc/css/phui/phui-info-panel.css' => '27ea50a1',
|
||||
'rsrc/css/phui/phui-info-view.css' => '33e54618',
|
||||
'rsrc/css/phui/phui-list.css' => 'e448b6ba',
|
||||
'rsrc/css/phui/phui-object-box.css' => '59db5c05',
|
||||
'rsrc/css/phui/phui-object-box.css' => '92f2ddcf',
|
||||
'rsrc/css/phui/phui-object-item-list-view.css' => '29ded459',
|
||||
'rsrc/css/phui/phui-pinboard-view.css' => '55b27bc3',
|
||||
'rsrc/css/phui/phui-property-list-view.css' => '1baf23eb',
|
||||
|
@ -483,7 +483,7 @@ return array(
|
|||
'aphront-multi-column-view-css' => 'fd18389d',
|
||||
'aphront-pager-view-css' => '2e3539af',
|
||||
'aphront-panel-view-css' => '8427b78d',
|
||||
'aphront-table-view-css' => '15fedf7a',
|
||||
'aphront-table-view-css' => '4f2ed0bf',
|
||||
'aphront-tokenizer-control-css' => '04875312',
|
||||
'aphront-tooltip-css' => '7672b60f',
|
||||
'aphront-two-column-view-css' => '16ab3ad2',
|
||||
|
@ -763,20 +763,20 @@ return array(
|
|||
'phui-calendar-list-css' => 'c1c7f338',
|
||||
'phui-calendar-month-css' => '476be7e0',
|
||||
'phui-crumbs-view-css' => 'ce840ec2',
|
||||
'phui-document-view-css' => '8be7a5e3',
|
||||
'phui-document-view-css' => '88f0c90b',
|
||||
'phui-feed-story-css' => '92f55311',
|
||||
'phui-font-icon-base-css' => '3dad2ae3',
|
||||
'phui-fontkit-css' => 'b664ac96',
|
||||
'phui-form-css' => 'f535f938',
|
||||
'phui-form-view-css' => 'a0e8f168',
|
||||
'phui-header-view-css' => '47b8f221',
|
||||
'phui-header-view-css' => '7716c613',
|
||||
'phui-icon-view-css' => '88ba9081',
|
||||
'phui-image-mask-css' => '5a8b09c8',
|
||||
'phui-info-panel-css' => '27ea50a1',
|
||||
'phui-info-view-css' => '33e54618',
|
||||
'phui-inline-comment-view-css' => 'aa16f165',
|
||||
'phui-list-view-css' => 'e448b6ba',
|
||||
'phui-object-box-css' => '59db5c05',
|
||||
'phui-object-box-css' => '92f2ddcf',
|
||||
'phui-object-item-list-view-css' => '29ded459',
|
||||
'phui-pinboard-view-css' => '55b27bc3',
|
||||
'phui-property-list-view-css' => '1baf23eb',
|
||||
|
|
|
@ -148,6 +148,7 @@ final class DiffusionCommitController extends DiffusionController {
|
|||
),
|
||||
$message));
|
||||
|
||||
$headsup_view->setTall(true);
|
||||
$object_box = id(new PHUIObjectBoxView())
|
||||
->setHeader($headsup_view)
|
||||
->addPropertyList($property_list)
|
||||
|
|
|
@ -24,6 +24,7 @@ final class PHUIDocumentView extends AphrontTagView {
|
|||
}
|
||||
|
||||
public function setHeader(PHUIHeaderView $header) {
|
||||
$header->setTall(true);
|
||||
$this->header = $header;
|
||||
return $this;
|
||||
}
|
||||
|
@ -111,21 +112,7 @@ final class PHUIDocumentView extends AphrontTagView {
|
|||
|
||||
$book = null;
|
||||
if ($this->bookname) {
|
||||
$book = phutil_tag(
|
||||
'div',
|
||||
array(
|
||||
'class' => 'phui-document-bookname grouped',
|
||||
),
|
||||
array(
|
||||
phutil_tag(
|
||||
'span',
|
||||
array('class' => 'bookname'),
|
||||
$this->bookname),
|
||||
phutil_tag(
|
||||
'span',
|
||||
array('class' => 'bookdescription'),
|
||||
$this->bookdescription),
|
||||
));
|
||||
$book = pht('%s (%s)', $this->bookname, $this->bookdescription);
|
||||
}
|
||||
|
||||
$topnav = null;
|
||||
|
@ -159,13 +146,13 @@ final class PHUIDocumentView extends AphrontTagView {
|
|||
$main_content = $this->renderChildren();
|
||||
}
|
||||
|
||||
$this->header->setSubheader($book);
|
||||
$content_inner = phutil_tag(
|
||||
'div',
|
||||
array(
|
||||
'class' => 'phui-document-inner',
|
||||
),
|
||||
array(
|
||||
$book,
|
||||
$this->header,
|
||||
$topnav,
|
||||
$main_content,
|
||||
|
|
|
@ -13,6 +13,7 @@ final class PHUIHeaderView extends AphrontTagView {
|
|||
private $headerIcon;
|
||||
private $noBackground;
|
||||
private $bleedHeader;
|
||||
private $tall;
|
||||
private $properties = array();
|
||||
private $actionLinks = array();
|
||||
private $buttonBar = null;
|
||||
|
@ -35,6 +36,11 @@ final class PHUIHeaderView extends AphrontTagView {
|
|||
return $this;
|
||||
}
|
||||
|
||||
public function setTall($tall) {
|
||||
$this->tall = $tall;
|
||||
return $this;
|
||||
}
|
||||
|
||||
public function addTag(PHUITagView $tag) {
|
||||
$this->tags[] = $tag;
|
||||
return $this;
|
||||
|
@ -147,7 +153,8 @@ final class PHUIHeaderView extends AphrontTagView {
|
|||
$classes[] = 'phui-bleed-header';
|
||||
}
|
||||
|
||||
if ($this->properties || $this->policyObject || $this->subheader) {
|
||||
if ($this->properties || $this->policyObject ||
|
||||
$this->subheader || $this->tall) {
|
||||
$classes[] = 'phui-header-tall';
|
||||
}
|
||||
|
||||
|
@ -230,7 +237,12 @@ final class PHUIHeaderView extends AphrontTagView {
|
|||
->setIconFont($this->headerIcon);
|
||||
$left[] = $icon;
|
||||
}
|
||||
$left[] = $this->header;
|
||||
$left[] = phutil_tag(
|
||||
'span',
|
||||
array(
|
||||
'class' => 'phui-header-header',
|
||||
),
|
||||
$this->header);
|
||||
|
||||
if ($this->objectName) {
|
||||
array_unshift(
|
||||
|
|
|
@ -18,8 +18,7 @@
|
|||
.aphront-table-view td.aphront-table-notice {
|
||||
padding: 12px 16px;
|
||||
font-size: 13px;
|
||||
color: {$blue};
|
||||
font-weight: bold;
|
||||
color: {$darkbluetext};
|
||||
border-bottom: 1px solid {$thinblueborder};
|
||||
}
|
||||
|
||||
|
|
|
@ -10,6 +10,7 @@
|
|||
|
||||
.phui-document-view .phui-header-shell {
|
||||
padding: 16px;
|
||||
background-color: #F5F7FA;
|
||||
}
|
||||
|
||||
.phui-document-content {
|
||||
|
@ -47,8 +48,8 @@
|
|||
.device-phone .phui-document-sidenav {
|
||||
position: static;
|
||||
width: auto;
|
||||
border-top: 1px solid #d7d7d7;
|
||||
border-bottom: 1px solid #d7d7d7;
|
||||
border-top: 1px solid {$thinblueborder};
|
||||
border-bottom: 1px solid {$thinblueborder};
|
||||
}
|
||||
|
||||
.device-phone .phui-sidenav-view .phui-document-inner {
|
||||
|
@ -57,29 +58,10 @@
|
|||
|
||||
.phui-sidenav-view .phui-document-inner {
|
||||
margin-right: 200px;
|
||||
border-right: 1px solid #e7e7e7;
|
||||
border-right: 1px solid {$thinblueborder};
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.phui-document-bookname {
|
||||
padding: 8px 16px;
|
||||
color: #9ca5b5;
|
||||
background-color: #fff;
|
||||
border-bottom: 1px solid {$lightblueborder};
|
||||
}
|
||||
|
||||
.device-phone .phui-document-bookname {
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
.phui-document-bookname .bookname {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.phui-document-bookname .bookdescription {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.phui-document-content .phui-header-shell {
|
||||
border-top: none;
|
||||
border-bottom: 1px solid {$thinblueborder};
|
||||
|
|
|
@ -64,23 +64,28 @@ body .phui-header-shell.phui-bleed-header
|
|||
}
|
||||
|
||||
.phui-header-view {
|
||||
font-size: 16px;
|
||||
color: #000;
|
||||
font-weight: 500;
|
||||
position: relative;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.device-phone .phui-header-view {
|
||||
.phui-header-header {
|
||||
color: #000;
|
||||
font-size: 15px;
|
||||
font-weight: 500;
|
||||
line-height: 20px;
|
||||
}
|
||||
|
||||
.device-phone .phui-header-header {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.phui-object-box .phui-header-tall h1.phui-header-view,
|
||||
.phui-document-view .phui-header-tall h1.phui-header-view {
|
||||
.phui-object-box .phui-header-tall .phui-header-header,
|
||||
.phui-document-view .phui-header-tall .phui-header-header {
|
||||
font-size: 18px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.phui-header-view .phui-header-col2 > a {
|
||||
.phui-header-view .phui-header-header a {
|
||||
color: #000;
|
||||
}
|
||||
|
||||
|
@ -90,6 +95,7 @@ body .phui-header-shell.phui-bleed-header
|
|||
|
||||
.phui-object-box .phui-header-view .phui-header-action-links {
|
||||
margin-right: 4px;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.device-phone .phui-object-box .phui-header-view .phui-header-action-links {
|
||||
|
|
|
@ -125,7 +125,3 @@ div.phui-object-box.phui-object-box-flush {
|
|||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.phui-box-border + .phui-box-border {
|
||||
border-top: 1px solid {$thinblueborder};
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue