1
0
Fork 0
mirror of https://we.phorge.it/source/phorge.git synced 2024-11-26 00:32:42 +01:00

Update pinboard view styles, move to PHUI

Summary: Tightens up the CSS to display more items (4 wide on 15") and fixes some mobile CSS issues with appseach. Fixes T3614

Test Plan: Tested Pholio, Macros, mobile layouts

Reviewers: epriestley, btrahan

Reviewed By: epriestley

CC: aran, Korvin

Maniphest Tasks: T3614

Differential Revision: https://secure.phabricator.com/D6694
This commit is contained in:
Chad Little 2013-08-07 10:58:09 -07:00
parent 8b07c498d4
commit 9c999e3548
8 changed files with 97 additions and 98 deletions

View file

@ -863,7 +863,7 @@ celerity_register_resource_map(array(
),
'aphront-list-filter-view-css' =>
array(
'uri' => '/res/d7b529ce/rsrc/css/aphront/list-filter-view.css',
'uri' => '/res/a90a0c94/rsrc/css/aphront/list-filter-view.css',
'type' => 'css',
'requires' =>
array(
@ -3345,15 +3345,6 @@ celerity_register_resource_map(array(
),
'disk' => '/rsrc/js/core/phtize.js',
),
'phabricator-pinboard-view-css' =>
array(
'uri' => '/res/61ecd7cf/rsrc/css/layout/phabricator-pinboard-view.css',
'type' => 'css',
'requires' =>
array(
),
'disk' => '/rsrc/css/layout/phabricator-pinboard-view.css',
),
'phabricator-prefab' =>
array(
'uri' => '/res/511859ca/rsrc/js/core/Prefab.js',
@ -3825,6 +3816,15 @@ celerity_register_resource_map(array(
),
'disk' => '/rsrc/css/phui/phui-list.css',
),
'phui-pinboard-view-css' =>
array(
'uri' => '/res/3b961aa1/rsrc/css/phui/phui-pinboard-view.css',
'type' => 'css',
'requires' =>
array(
),
'disk' => '/rsrc/css/phui/phui-pinboard-view.css',
),
'phui-remarkup-preview-css' =>
array(
'uri' => '/res/4535e062/rsrc/css/phui/phui-remarkup-preview.css',
@ -4161,7 +4161,7 @@ celerity_register_resource_map(array(
), array(
'packages' =>
array(
'604768b8' =>
'00dd9b38' =>
array(
'name' => 'core.pkg.css',
'symbols' =>
@ -4209,7 +4209,7 @@ celerity_register_resource_map(array(
40 => 'phabricator-property-list-view-css',
41 => 'phabricator-tag-view-css',
),
'uri' => '/res/pkg/604768b8/core.pkg.css',
'uri' => '/res/pkg/00dd9b38/core.pkg.css',
'type' => 'css',
),
'606f7152' =>
@ -4400,16 +4400,16 @@ celerity_register_resource_map(array(
),
'reverse' =>
array(
'aphront-dialog-view-css' => '604768b8',
'aphront-error-view-css' => '604768b8',
'aphront-form-view-css' => '604768b8',
'aphront-list-filter-view-css' => '604768b8',
'aphront-pager-view-css' => '604768b8',
'aphront-panel-view-css' => '604768b8',
'aphront-table-view-css' => '604768b8',
'aphront-tokenizer-control-css' => '604768b8',
'aphront-tooltip-css' => '604768b8',
'aphront-typeahead-control-css' => '604768b8',
'aphront-dialog-view-css' => '00dd9b38',
'aphront-error-view-css' => '00dd9b38',
'aphront-form-view-css' => '00dd9b38',
'aphront-list-filter-view-css' => '00dd9b38',
'aphront-pager-view-css' => '00dd9b38',
'aphront-panel-view-css' => '00dd9b38',
'aphront-table-view-css' => '00dd9b38',
'aphront-tokenizer-control-css' => '00dd9b38',
'aphront-tooltip-css' => '00dd9b38',
'aphront-typeahead-control-css' => '00dd9b38',
'differential-changeset-view-css' => 'dd27a69b',
'differential-core-view-css' => 'dd27a69b',
'differential-inline-comment-editor' => '48040be9',
@ -4423,7 +4423,7 @@ celerity_register_resource_map(array(
'differential-table-of-contents-css' => 'dd27a69b',
'diffusion-commit-view-css' => 'c8ce2d88',
'diffusion-icons-css' => 'c8ce2d88',
'global-drag-and-drop-css' => '604768b8',
'global-drag-and-drop-css' => '00dd9b38',
'inline-comment-summary-css' => 'dd27a69b',
'javelin-aphlict' => '606f7152',
'javelin-behavior' => '2dbbb7d1',
@ -4496,55 +4496,55 @@ celerity_register_resource_map(array(
'javelin-util' => '2dbbb7d1',
'javelin-vector' => '2dbbb7d1',
'javelin-workflow' => '2dbbb7d1',
'lightbox-attachment-css' => '604768b8',
'lightbox-attachment-css' => '00dd9b38',
'maniphest-task-summary-css' => '06bacb9a',
'maniphest-transaction-detail-css' => '06bacb9a',
'phabricator-action-list-view-css' => '604768b8',
'phabricator-application-launch-view-css' => '604768b8',
'phabricator-action-list-view-css' => '00dd9b38',
'phabricator-application-launch-view-css' => '00dd9b38',
'phabricator-busy' => '606f7152',
'phabricator-content-source-view-css' => 'dd27a69b',
'phabricator-core-css' => '604768b8',
'phabricator-crumbs-view-css' => '604768b8',
'phabricator-core-css' => '00dd9b38',
'phabricator-crumbs-view-css' => '00dd9b38',
'phabricator-drag-and-drop-file-upload' => '48040be9',
'phabricator-dropdown-menu' => '606f7152',
'phabricator-file-upload' => '606f7152',
'phabricator-filetree-view-css' => '604768b8',
'phabricator-flag-css' => '604768b8',
'phabricator-form-view-css' => '604768b8',
'phabricator-header-view-css' => '604768b8',
'phabricator-filetree-view-css' => '00dd9b38',
'phabricator-flag-css' => '00dd9b38',
'phabricator-form-view-css' => '00dd9b38',
'phabricator-header-view-css' => '00dd9b38',
'phabricator-hovercard' => '606f7152',
'phabricator-jump-nav' => '604768b8',
'phabricator-jump-nav' => '00dd9b38',
'phabricator-keyboard-shortcut' => '606f7152',
'phabricator-keyboard-shortcut-manager' => '606f7152',
'phabricator-main-menu-view' => '604768b8',
'phabricator-main-menu-view' => '00dd9b38',
'phabricator-menu-item' => '606f7152',
'phabricator-nav-view-css' => '604768b8',
'phabricator-nav-view-css' => '00dd9b38',
'phabricator-notification' => '606f7152',
'phabricator-notification-css' => '604768b8',
'phabricator-notification-menu-css' => '604768b8',
'phabricator-object-item-list-view-css' => '604768b8',
'phabricator-notification-css' => '00dd9b38',
'phabricator-notification-menu-css' => '00dd9b38',
'phabricator-object-item-list-view-css' => '00dd9b38',
'phabricator-object-selector-css' => 'dd27a69b',
'phabricator-phtize' => '606f7152',
'phabricator-prefab' => '606f7152',
'phabricator-project-tag-css' => '06bacb9a',
'phabricator-property-list-view-css' => '604768b8',
'phabricator-remarkup-css' => '604768b8',
'phabricator-property-list-view-css' => '00dd9b38',
'phabricator-remarkup-css' => '00dd9b38',
'phabricator-shaped-request' => '48040be9',
'phabricator-side-menu-view-css' => '604768b8',
'phabricator-standard-page-view' => '604768b8',
'phabricator-tag-view-css' => '604768b8',
'phabricator-side-menu-view-css' => '00dd9b38',
'phabricator-standard-page-view' => '00dd9b38',
'phabricator-tag-view-css' => '00dd9b38',
'phabricator-textareautils' => '606f7152',
'phabricator-tooltip' => '606f7152',
'phabricator-transaction-view-css' => '604768b8',
'phabricator-zindex-css' => '604768b8',
'phui-button-css' => '604768b8',
'phui-form-css' => '604768b8',
'phui-icon-view-css' => '604768b8',
'phui-spacing-css' => '604768b8',
'sprite-apps-large-css' => '604768b8',
'sprite-gradient-css' => '604768b8',
'sprite-icons-css' => '604768b8',
'sprite-menu-css' => '604768b8',
'syntax-highlighting-css' => '604768b8',
'phabricator-transaction-view-css' => '00dd9b38',
'phabricator-zindex-css' => '00dd9b38',
'phui-button-css' => '00dd9b38',
'phui-form-css' => '00dd9b38',
'phui-icon-view-css' => '00dd9b38',
'phui-spacing-css' => '00dd9b38',
'sprite-apps-large-css' => '00dd9b38',
'sprite-gradient-css' => '00dd9b38',
'sprite-icons-css' => '00dd9b38',
'sprite-menu-css' => '00dd9b38',
'syntax-highlighting-css' => '00dd9b38',
),
));

View file

@ -748,6 +748,8 @@ phutil_register_library_map(array(
'PHUIListView' => 'view/phui/PHUIListView.php',
'PHUIListViewTestCase' => 'view/layout/__tests__/PHUIListViewTestCase.php',
'PHUIPagedFormView' => 'view/form/PHUIPagedFormView.php',
'PHUIPinboardItemView' => 'view/phui/PHUIPinboardItemView.php',
'PHUIPinboardView' => 'view/phui/PHUIPinboardView.php',
'PHUIRemarkupPreviewPanel' => 'view/phui/PHUIRemarkupPreviewPanel.php',
'PHUIStatusItemView' => 'view/phui/PHUIStatusItemView.php',
'PHUIStatusListView' => 'view/phui/PHUIStatusListView.php',
@ -1408,8 +1410,6 @@ phutil_register_library_map(array(
'PhabricatorPhortuneConfigOptions' => 'applications/phortune/option/PhabricatorPhortuneConfigOptions.php',
'PhabricatorPhrequentConfigOptions' => 'applications/phrequent/config/PhabricatorPhrequentConfigOptions.php',
'PhabricatorPhrictionConfigOptions' => 'applications/phriction/config/PhabricatorPhrictionConfigOptions.php',
'PhabricatorPinboardItemView' => 'view/layout/PhabricatorPinboardItemView.php',
'PhabricatorPinboardView' => 'view/layout/PhabricatorPinboardView.php',
'PhabricatorPolicies' => 'applications/policy/constants/PhabricatorPolicies.php',
'PhabricatorPolicy' => 'applications/policy/filter/PhabricatorPolicy.php',
'PhabricatorPolicyAwareQuery' => 'infrastructure/query/policy/PhabricatorPolicyAwareQuery.php',
@ -2764,6 +2764,8 @@ phutil_register_library_map(array(
'PHUIListView' => 'AphrontTagView',
'PHUIListViewTestCase' => 'PhabricatorTestCase',
'PHUIPagedFormView' => 'AphrontTagView',
'PHUIPinboardItemView' => 'AphrontView',
'PHUIPinboardView' => 'AphrontView',
'PHUIRemarkupPreviewPanel' => 'AphrontTagView',
'PHUIStatusItemView' => 'AphrontTagView',
'PHUIStatusListView' => 'AphrontTagView',
@ -3471,8 +3473,6 @@ phutil_register_library_map(array(
'PhabricatorPhortuneConfigOptions' => 'PhabricatorApplicationConfigOptions',
'PhabricatorPhrequentConfigOptions' => 'PhabricatorApplicationConfigOptions',
'PhabricatorPhrictionConfigOptions' => 'PhabricatorApplicationConfigOptions',
'PhabricatorPinboardItemView' => 'AphrontView',
'PhabricatorPinboardView' => 'AphrontView',
'PhabricatorPolicies' => 'PhabricatorPolicyConstants',
'PhabricatorPolicyAwareQuery' => 'PhabricatorOffsetPagedQuery',
'PhabricatorPolicyAwareTestQuery' => 'PhabricatorPolicyAwareQuery',

View file

@ -36,11 +36,11 @@ final class PhabricatorMacroListController extends PhabricatorMacroController
$this->getLoadedHandles(),
$author_phids);
$pinboard = new PhabricatorPinboardView();
$pinboard = new PHUIPinboardView();
foreach ($macros as $macro) {
$file = $macro->getFile();
$item = new PhabricatorPinboardItemView();
$item = new PHUIPinboardItemView();
if ($file) {
$item->setImageURI($file->getThumb280x210URI());
$item->setImageSize(280, 210);

View file

@ -37,9 +37,9 @@ final class PholioMockListController
}
$this->loadHandles($author_phids);
$board = new PhabricatorPinboardView();
$board = new PHUIPinboardView();
foreach ($mocks as $mock) {
$item = id(new PhabricatorPinboardItemView())
$item = id(new PHUIPinboardItemView())
->setHeader('M'.$mock->getID().' '.$mock->getName())
->setURI('/M'.$mock->getID())
->setImageURI($mock->getCoverFile()->getThumb280x210URI())

View file

@ -1,6 +1,6 @@
<?php
final class PhabricatorPinboardItemView extends AphrontView {
final class PHUIPinboardItemView extends AphrontView {
private $imageURI;
private $uri;
@ -42,7 +42,7 @@ final class PhabricatorPinboardItemView extends AphrontView {
$header = phutil_tag(
'div',
array(
'class' => 'phabricator-pinboard-item-header',
'class' => 'phui-pinboard-item-header',
),
phutil_tag('a', array('href' => $this->uri), $this->header));
}
@ -51,7 +51,7 @@ final class PhabricatorPinboardItemView extends AphrontView {
'a',
array(
'href' => $this->uri,
'class' => 'phabricator-pinboard-item-image-link',
'class' => 'phui-pinboard-item-image-link',
),
phutil_tag(
'img',
@ -69,21 +69,21 @@ final class PhabricatorPinboardItemView extends AphrontView {
'span',
array(
'class' =>
'phabricator-pinboard-icon sprite-icons icons-'.$block[0].'-grey',
'phui-pinboard-icon sprite-icons icons-'.$block[0].'-grey',
),
'');
$count = phutil_tag('span', array(), $block[1]);
$icon_list[] = phutil_tag(
'span',
array(
'class' => 'phabricator-pinboard-item-count',
'class' => 'phui-pinboard-item-count',
),
array($icon, $count));
}
$icons = phutil_tag(
'div',
array(
'class' => 'phabricator-pinboard-icons',
'class' => 'phui-pinboard-icons',
),
$icon_list);
}
@ -93,7 +93,7 @@ final class PhabricatorPinboardItemView extends AphrontView {
$content = phutil_tag(
'div',
array(
'class' => 'phabricator-pinboard-item-content',
'class' => 'phui-pinboard-item-content',
),
$content);
}
@ -101,7 +101,7 @@ final class PhabricatorPinboardItemView extends AphrontView {
return phutil_tag(
'div',
array(
'class' => 'phabricator-pinboard-item-view',
'class' => 'phui-pinboard-item-view',
),
array(
$header,

View file

@ -1,6 +1,6 @@
<?php
final class PhabricatorPinboardView extends AphrontView {
final class PHUIPinboardView extends AphrontView {
private $items = array();
private $noDataString;
@ -10,13 +10,13 @@ final class PhabricatorPinboardView extends AphrontView {
return $this;
}
public function addItem(PhabricatorPinboardItemView $item) {
public function addItem(PHUIPinboardItemView $item) {
$this->items[] = $item;
return $this;
}
public function render() {
require_celerity_resource('phabricator-pinboard-view-css');
require_celerity_resource('phui-pinboard-view-css');
if (!$this->items) {
$string = nonempty($this->noDataString, pht('No data.'));
@ -29,7 +29,7 @@ final class PhabricatorPinboardView extends AphrontView {
return phutil_tag(
'div',
array(
'class' => 'phabricator-pinboard-view',
'class' => 'phui-pinboard-view',
),
$this->items);
}

View file

@ -16,8 +16,8 @@
box-shadow: 0 1px 2px rgba(0,0,0,0.2);
}
.device-phone .aphront-list-filter-view {
margin: 0;
.device-phone .aphront-list-filter-wrap {
margin: 0 -2px;
}
.aphront-list-filter-view-content .aphront-form-view {
@ -58,7 +58,7 @@
.device .aphront-list-filter-reveal {
width: 98%;
margin: auto;
padding: 4px 0;
padding: 8px;
}
.aphront-list-filter-reveal a {
@ -67,9 +67,8 @@
}
.device .aphront-list-filter-reveal a {
margin: 4px auto 0;
float: none;
display: block;
margin: 4px 0;
float: left;
}
.aphront-list-filter-description {

View file

@ -1,41 +1,41 @@
/**
* @provides phabricator-pinboard-view-css
* @provides phui-pinboard-view-css
*/
.phabricator-pinboard-view {
padding: 10px 0 20px 20px;
.phui-pinboard-view {
padding: 8px 0 20px 20px;
overflow: hidden;
margin: 1em 0;
margin: 12px 0;
}
.device-phone .phabricator-pinboard-view {
.device-phone .phui-pinboard-view {
padding: 0;
}
.phabricator-pinboard-item-view {
margin: 0 16px 16px 0;
.phui-pinboard-item-view {
margin: 0 8px 16px 0;
border: 1px solid #d5d9df;
background: #ffffff;
border-radius: 3px;
float: left;
width: 300px;
width: 288px;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
text-align: left;
}
.device-desktop .phabricator-pinboard-item-view:hover {
.device-desktop .phui-pinboard-item-view:hover {
cursor: pointer;
box-shadow: 0 1px 6px rgba(0, 0, 0, 0.30);
}
/* On phones, show a single column of items. */
.device-phone .phabricator-pinboard-item-view {
.device-phone .phui-pinboard-item-view {
float: none;
margin: 0 auto 16px;
}
.phabricator-pinboard-item-header {
.phui-pinboard-item-header {
padding: 5px 10px;
display: block;
background: #edf0f4;
@ -47,28 +47,28 @@
overflow: hidden;
}
.phabricator-pinboard-item-header a {
.phui-pinboard-item-header a {
color: #333;
}
.phabricator-pinboard-item-image-link {
padding: 10px;
.phui-pinboard-item-image-link {
padding: 8px 4px;
display: block;
}
.phabricator-pinboard-item-content {
.phui-pinboard-item-content {
padding: 0 10px 5px;
overflow: hidden;
color: #777;
font-size: 11px;
}
.phabricator-pinboard-item-count {
.phui-pinboard-item-count {
float: left;
margin-left: 10px;
}
.phabricator-pinboard-icons {
.phui-pinboard-icons {
padding: 0 10px 10px 0;
color: #aaa;
border-bottom: 1px solid #e7e7e7;
@ -76,7 +76,7 @@
overflow: hidden;
}
.phabricator-pinboard-icon {
.phui-pinboard-icon {
height: 14px;
width: 14px;
float: left;