revi-archive/phorge-phorge
1
0
Fork 0
mirror of https://we.phorge.it/source/phorge.git synced 2024-11-10 00:42:41 +01:00
Code Issues Releases Wiki Activity

Update tables to table-kit view.

Browse source 
Summary: Reskinning tables to table-kit mocks, which includes new textures, spacing, slightly larger fonts. Looking for early feedback before adding in new row colors and other items into the class.

Test Plan: http://phab1.pushlabs.net/uiexample/view/PhabricatorSortTableExample/

Reviewers: btrahan, epriestley

Reviewed By: epriestley

CC: aran, Korvin

Differential Revision: https://secure.phabricator.com/D4396
This commit is contained in:
Chad Little 2013-01-11 11:24:35 -08:00
parent 30345cfbdd
commit 16a0f4a88e
6 changed files with 134 additions and 109 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

110
src/__celerity_resource_map__.php
View file

@ -546,6 +546,20 @@ celerity_register_resource_map(array(
'disk' => '/rsrc/image/texture/dark-menu.png',
'type' => 'png',
),
'/rsrc/image/texture/table_header.png' =>
array(
'hash' => '4ed3f56a30d3749e8f62052b9735a316',
'uri' => '/res/4ed3f56a/rsrc/image/texture/table_header.png',
'disk' => '/rsrc/image/texture/table_header.png',
'type' => 'png',
),
'/rsrc/image/texture/table_header_hover.png' =>
array(
'hash' => 'ea1f71a604e9b4859de1e25751540437',
'uri' => '/res/ea1f71a6/rsrc/image/texture/table_header_hover.png',
'disk' => '/rsrc/image/texture/table_header_hover.png',
'type' => 'png',
),
'/rsrc/swf/aphlict.swf' =>
array(
'hash' => '4b9a9d83bebaf254f3790e87b45c1f92',
@ -681,7 +695,7 @@ celerity_register_resource_map(array(
),
'aphront-table-view-css' =>
array(
'uri' => '/res/94d76d56/rsrc/css/aphront/table-view.css',
'uri' => '/res/fa7af0ad/rsrc/css/aphront/table-view.css',
'type' => 'css',
'requires' =>
array(
@ -1289,7 +1303,7 @@ celerity_register_resource_map(array(
),
'javelin-behavior-diffusion-commit-graph' =>
array(
'uri' => '/res/cfe336e8/rsrc/js/application/diffusion/behavior-commit-graph.js',
'uri' => '/res/62bd2035/rsrc/js/application/diffusion/behavior-commit-graph.js',
'type' => 'js',
'requires' =>
array(
@ -3232,7 +3246,7 @@ celerity_register_resource_map(array(
), array(
'packages' =>
array(
'e4a42bf7' =>
'6e748adf' =>
array(
'name' => 'core.pkg.css',
'symbols' =>
@ -3277,7 +3291,7 @@ celerity_register_resource_map(array(
37 => 'phabricator-object-item-list-view-css',
38 => 'global-drag-and-drop-css',
),
'uri' => '/res/pkg/e4a42bf7/core.pkg.css',
'uri' => '/res/pkg/6e748adf/core.pkg.css',
'type' => 'css',
),
'2921e259' =>
@ -3395,7 +3409,7 @@ celerity_register_resource_map(array(
'uri' => '/res/pkg/c8ce2d88/diffusion.pkg.css',
'type' => 'css',
),
'5e68be89' =>
'f96657b8' =>
array(
'name' => 'diffusion.pkg.js',
'symbols' =>
@ -3404,7 +3418,7 @@ celerity_register_resource_map(array(
1 => 'javelin-behavior-diffusion-commit-graph',
2 => 'javelin-behavior-audit-preview',
),
'uri' => '/res/pkg/5e68be89/diffusion.pkg.js',
'uri' => '/res/pkg/f96657b8/diffusion.pkg.js',
'type' => 'js',
),
'fbeded59' =>
@ -3466,19 +3480,19 @@ celerity_register_resource_map(array(
'reverse' =>
array(
'aphront-attached-file-view-css' => 'ac211174',
'aphront-crumbs-view-css' => 'e4a42bf7',
'aphront-dialog-view-css' => 'e4a42bf7',
'aphront-error-view-css' => 'e4a42bf7',
'aphront-form-view-css' => 'e4a42bf7',
'aphront-crumbs-view-css' => '6e748adf',
'aphront-dialog-view-css' => '6e748adf',
'aphront-error-view-css' => '6e748adf',
'aphront-form-view-css' => '6e748adf',
'aphront-headsup-action-list-view-css' => '20933a11',
'aphront-headsup-view-css' => 'e4a42bf7',
'aphront-list-filter-view-css' => 'e4a42bf7',
'aphront-pager-view-css' => 'e4a42bf7',
'aphront-panel-view-css' => 'e4a42bf7',
'aphront-table-view-css' => 'e4a42bf7',
'aphront-tokenizer-control-css' => 'e4a42bf7',
'aphront-tooltip-css' => 'e4a42bf7',
'aphront-typeahead-control-css' => 'e4a42bf7',
'aphront-headsup-view-css' => '6e748adf',
'aphront-list-filter-view-css' => '6e748adf',
'aphront-pager-view-css' => '6e748adf',
'aphront-panel-view-css' => '6e748adf',
'aphront-table-view-css' => '6e748adf',
'aphront-tokenizer-control-css' => '6e748adf',
'aphront-tooltip-css' => '6e748adf',
'aphront-typeahead-control-css' => '6e748adf',
'differential-changeset-view-css' => '20933a11',
'differential-core-view-css' => '20933a11',
'differential-inline-comment-editor' => '76556a8f',
@ -3492,7 +3506,7 @@ celerity_register_resource_map(array(
'differential-table-of-contents-css' => '20933a11',
'diffusion-commit-view-css' => 'c8ce2d88',
'diffusion-icons-css' => 'c8ce2d88',
'global-drag-and-drop-css' => 'e4a42bf7',
'global-drag-and-drop-css' => '6e748adf',
'inline-comment-summary-css' => '20933a11',
'javelin-aphlict' => '2921e259',
'javelin-behavior' => 'fbeded59',
@ -3502,7 +3516,7 @@ celerity_register_resource_map(array(
'javelin-behavior-aphront-drag-and-drop' => '76556a8f',
'javelin-behavior-aphront-drag-and-drop-textarea' => '76556a8f',
'javelin-behavior-aphront-form-disable-on-submit' => '2921e259',
'javelin-behavior-audit-preview' => '5e68be89',
'javelin-behavior-audit-preview' => 'f96657b8',
'javelin-behavior-dark-console' => '8edbada5',
'javelin-behavior-dark-console-ajax' => '8edbada5',
'javelin-behavior-device' => '2921e259',
@ -3518,8 +3532,8 @@ celerity_register_resource_map(array(
'javelin-behavior-differential-show-more' => '76556a8f',
'javelin-behavior-differential-toggle-files' => '76556a8f',
'javelin-behavior-differential-user-select' => '76556a8f',
'javelin-behavior-diffusion-commit-graph' => '5e68be89',
'javelin-behavior-diffusion-pull-lastmodified' => '5e68be89',
'javelin-behavior-diffusion-commit-graph' => 'f96657b8',
'javelin-behavior-diffusion-pull-lastmodified' => 'f96657b8',
'javelin-behavior-error-log' => '8edbada5',
'javelin-behavior-global-drag-and-drop' => '2921e259',
'javelin-behavior-konami' => '2921e259',
@ -3561,49 +3575,49 @@ celerity_register_resource_map(array(
'javelin-util' => 'fbeded59',
'javelin-vector' => 'fbeded59',
'javelin-workflow' => 'fbeded59',
'lightbox-attachment-css' => 'e4a42bf7',
'lightbox-attachment-css' => '6e748adf',
'maniphest-task-summary-css' => 'ac211174',
'maniphest-transaction-detail-css' => 'ac211174',
'phabricator-app-buttons-css' => 'e4a42bf7',
'phabricator-app-buttons-css' => '6e748adf',
'phabricator-busy' => '2921e259',
'phabricator-content-source-view-css' => '20933a11',
'phabricator-core-buttons-css' => 'e4a42bf7',
'phabricator-core-css' => 'e4a42bf7',
'phabricator-crumbs-view-css' => 'e4a42bf7',
'phabricator-directory-css' => 'e4a42bf7',
'phabricator-core-buttons-css' => '6e748adf',
'phabricator-core-css' => '6e748adf',
'phabricator-crumbs-view-css' => '6e748adf',
'phabricator-directory-css' => '6e748adf',
'phabricator-drag-and-drop-file-upload' => '76556a8f',
'phabricator-dropdown-menu' => '2921e259',
'phabricator-file-upload' => '2921e259',
'phabricator-filetree-view-css' => 'e4a42bf7',
'phabricator-flag-css' => 'e4a42bf7',
'phabricator-form-view-css' => 'e4a42bf7',
'phabricator-header-view-css' => 'e4a42bf7',
'phabricator-jump-nav' => 'e4a42bf7',
'phabricator-filetree-view-css' => '6e748adf',
'phabricator-flag-css' => '6e748adf',
'phabricator-form-view-css' => '6e748adf',
'phabricator-header-view-css' => '6e748adf',
'phabricator-jump-nav' => '6e748adf',
'phabricator-keyboard-shortcut' => '2921e259',
'phabricator-keyboard-shortcut-manager' => '2921e259',
'phabricator-main-menu-view' => 'e4a42bf7',
'phabricator-main-menu-view' => '6e748adf',
'phabricator-menu-item' => '2921e259',
'phabricator-nav-view-css' => 'e4a42bf7',
'phabricator-nav-view-css' => '6e748adf',
'phabricator-notification' => '2921e259',
'phabricator-notification-css' => 'e4a42bf7',
'phabricator-notification-menu-css' => 'e4a42bf7',
'phabricator-object-item-list-view-css' => 'e4a42bf7',
'phabricator-notification-css' => '6e748adf',
'phabricator-notification-menu-css' => '6e748adf',
'phabricator-object-item-list-view-css' => '6e748adf',
'phabricator-object-selector-css' => '20933a11',
'phabricator-paste-file-upload' => '2921e259',
'phabricator-prefab' => '2921e259',
'phabricator-project-tag-css' => 'ac211174',
'phabricator-remarkup-css' => 'e4a42bf7',
'phabricator-remarkup-css' => '6e748adf',
'phabricator-shaped-request' => '76556a8f',
'phabricator-side-menu-view-css' => 'e4a42bf7',
'phabricator-standard-page-view' => 'e4a42bf7',
'phabricator-side-menu-view-css' => '6e748adf',
'phabricator-standard-page-view' => '6e748adf',
'phabricator-textareautils' => '2921e259',
'phabricator-tooltip' => '2921e259',
'phabricator-transaction-view-css' => 'e4a42bf7',
'phabricator-zindex-css' => 'e4a42bf7',
'sprite-apps-large-css' => 'e4a42bf7',
'sprite-gradient-css' => 'e4a42bf7',
'sprite-icon-css' => 'e4a42bf7',
'sprite-menu-css' => 'e4a42bf7',
'syntax-highlighting-css' => 'e4a42bf7',
'phabricator-transaction-view-css' => '6e748adf',
'phabricator-zindex-css' => '6e748adf',
'sprite-apps-large-css' => '6e748adf',
'sprite-gradient-css' => '6e748adf',
'sprite-icon-css' => '6e748adf',
'sprite-menu-css' => '6e748adf',
'syntax-highlighting-css' => '6e748adf',
),
));

10
src/view/control/AphrontTableView.php
View file

@ -171,10 +171,10 @@ final class AphrontTableView extends AphrontView {
$classes[] = 'aphront-table-view-sortable';
$sort_value = $sort_values[$col_num];
$sort_glyph = "\xE2\x86\x93";
$sort_glyph_class = 'aphront-table-down-sort';
if ($sort_value == $this->sortSelected) {
if ($this->sortReverse) {
$sort_glyph = "\xE2\x86\x91";
$sort_glyph_class = 'aphront-table-up-sort';
} else if (!$this->sortReverse) {
$sort_value = '-'.$sort_value;
}
@ -184,9 +184,9 @@ final class AphrontTableView extends AphrontView {
$sort_glyph = phutil_render_tag(
'span',
array(
'class' => 'aphront-table-view-sort-glyph',
'class' => $sort_glyph_class,
),
$sort_glyph);
'');
$header = phutil_render_tag(
'a',
@ -194,7 +194,7 @@ final class AphrontTableView extends AphrontView {
'href' => $this->sortURI->alter($this->sortParam, $sort_value),
'class' => 'aphront-table-view-sort-link',
),
$sort_glyph.' '.$header);
$header.' '.$sort_glyph);
}
if ($classes) {

121
webroot/rsrc/css/aphront/table-view.css
View file

@ -3,49 +3,78 @@
*/
.aphront-table-view {
width: 100%;
width: 100%;
border-collapse: collapse;
background: #fdfdfd;
border: 1px solid #003366;
background: #fff;
border: 1px solid #d5dae0;
}
.aphront-table-view tr.alt {
background: #efefef;
background: #f1f3f8;
}
.aphront-table-view th {
font-size: 12px;
font-weight: bold;
background: #003366;
color: white;
white-space: nowrap;
color: #525252;
text-shadow: 0 1px 0 white;
font-weight: bold;
background-image: url(/rsrc/image/texture/table_header.png);
background-repeat: repeat-x;
}
th.aphront-table-view-sortable-selected {
background-image: url(/rsrc/image/texture/table_header_hover.png);
}
.aphront-table-view th a,
.aphront-table-view th a:hover,
.aphront-table-view th a:link {
padding: 4px 8px;
color: white;
color: #525252;
text-shadow: 0 1px 0 white;
display: block;
text-decoration: none;
}
.aphront-table-view th a:hover {
background: #3366aa;
text-decoration: underline;
}
.aphront-table-view td.header {
padding: 4px 8px;
background: #3b5998;
color: white;
white-space: nowrap;
text-align: right;
padding: 4px 8px;
white-space: nowrap;
text-align: right;
color: #525252;
font-weight: bold;
}
.aphront-table-view td {
font-size: 11px;
white-space: nowrap;
vertical-align: middle;
white-space: nowrap;
vertical-align: middle;
}
.aphront-table-down-sort {
display: inline-block;
margin-top: 5px;
width: 0;
height: 0;
vertical-align: top;
border-top: 4px solid black;
border-right: 4px solid transparent;
border-left: 4px solid transparent;
content: "";
}
.aphront-table-up-sort {
display: inline-block;
margin-top: 5px;
width: 0;
height: 0;
vertical-align: top;
border-bottom: 4px solid black;
border-right: 4px solid transparent;
border-left: 4px solid transparent;
content: "";
}
/* - Padding -------------------------------------------------------------------
@ -58,11 +87,13 @@
*/
.aphront-table-view th {
padding: 4px 8px;
padding: 8px 10px;
font-size: 12px;
}
.aphront-table-view td {
padding: 4px 8px;
padding: 6px 10px;
font-size: 12px;
}
.device-tablet .aphront-table-view td,
@ -87,11 +118,11 @@
}
.aphront-table-view td.sorted-column {
background: #f6f6fd;
background: #f1f3f8;
}
.aphront-table-view tr.alt td.sorted-column {
background: #e0e0ef;
background: #e4e6eb;
}
.aphront-table-view td.action {
@ -100,31 +131,31 @@
}
.aphront-table-view td.larger {
font-size: 14px;
font-size: 14px;
}
.aphront-table-view td.pri {
font-weight: bold;
font-weight: bold;
}
.aphront-table-view td.wide {
white-space: normal;
width: 100%;
white-space: normal;
width: 100%;
}
.aphront-table-view td.right {
text-align: right;
text-align: right;
}
.aphront-table-view td.mono {
font-family: "Monaco", monospace;
font-size: 10px;
font-family: "Monaco", monospace;
font-size: 11px;
}
.aphront-table-view td.n {
font-family: "Monaco", monospace;
font-size: 10px;
text-align: right;
font-family: "Monaco", monospace;
font-size: 11px;
text-align: right;
}
.aphront-table-view td.wrap {
@ -147,14 +178,13 @@ span.single-display-line-content {
}
.aphront-table-view tr.highlighted {
background: #ffff99;
background: #fcf8e2;
}
.aphront-table-view tr.alt-highlighted {
background: #f3f399;
background: #fcf2bb;
}
.aphront-table-view tr.no-data td {
padding: 1em;
text-align: center;
@ -182,25 +212,6 @@ span.single-display-line-content {
padding: 2px 4px 0px;
}
.aphront-table-view th.aphront-table-view-sortable {
padding: 0;
}
.aphront-table-view-sort-glyph {
float: right;
padding-left: 8px;
color: #6677bb;
}
th a:hover .aphront-table-view-sort-glyph {
color: #ffffff;
}
.aphront-table-view-sortable-selected .aphront-table-view-sort-glyph {
display: block;
color: white;
}
.device-desktop .aphront-table-view-device {
display: none;
}
@ -221,6 +232,6 @@ th a:hover .aphront-table-view-sort-glyph {
.aphront-table-view td.link a {
display: block;
padding: 6px;
padding: 6px 8px;
font-weight: bold;
}

BIN
webroot/rsrc/image/texture/table_header.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 2.2 KiB

BIN
webroot/rsrc/image/texture/table_header_hover.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 2.2 KiB

2
webroot/rsrc/js/application/diffusion/behavior-commit-graph.js
View file

@ -52,7 +52,7 @@ JX.behavior('diffusion-commit-graph', function(config) {
return (col * cell) + (cell / 2);
}
var h = 24;
var h = 26;
var w = cell * config.count;
var canvas = JX.$N('canvas', {width: w, height: h});