mirror of
https://we.phorge.it/source/phorge.git
synced 2024-12-22 05:20:56 +01:00
Tidy up Workboard CSS a little
Summary: - Custom scrollbars, colors - New div with some better padding (floor for the column) - More consistent spacing around the board itself. - Slightly darker columns - Smaller horizonal scrollbar Test Plan: Chrome Mac / Desktop. {F1100342} Reviewers: epriestley Reviewed By: epriestley Subscribers: Korvin Differential Revision: https://secure.phabricator.com/D15217
This commit is contained in:
parent
07f1a03262
commit
9c95b387bd
5 changed files with 46 additions and 21 deletions
resources/celerity
src/view/phui
webroot/rsrc/css/phui/workboards
|
@ -154,9 +154,9 @@ return array(
|
||||||
'rsrc/css/phui/phui-tag-view.css' => '9d5d4400',
|
'rsrc/css/phui/phui-tag-view.css' => '9d5d4400',
|
||||||
'rsrc/css/phui/phui-timeline-view.css' => '2efceff8',
|
'rsrc/css/phui/phui-timeline-view.css' => '2efceff8',
|
||||||
'rsrc/css/phui/phui-two-column-view.css' => 'c75bfc5b',
|
'rsrc/css/phui/phui-two-column-view.css' => 'c75bfc5b',
|
||||||
'rsrc/css/phui/workboards/phui-workboard.css' => '2b5367d2',
|
'rsrc/css/phui/workboards/phui-workboard.css' => '0047084f',
|
||||||
'rsrc/css/phui/workboards/phui-workcard.css' => 'a869098a',
|
'rsrc/css/phui/workboards/phui-workcard.css' => '3646fb96',
|
||||||
'rsrc/css/phui/workboards/phui-workpanel.css' => 'e1bd8d04',
|
'rsrc/css/phui/workboards/phui-workpanel.css' => 'a78c0661',
|
||||||
'rsrc/css/sprite-login.css' => '60e8560e',
|
'rsrc/css/sprite-login.css' => '60e8560e',
|
||||||
'rsrc/css/sprite-menu.css' => '9dd65b92',
|
'rsrc/css/sprite-menu.css' => '9dd65b92',
|
||||||
'rsrc/css/sprite-tokens.css' => '4f399012',
|
'rsrc/css/sprite-tokens.css' => '4f399012',
|
||||||
|
@ -831,9 +831,9 @@ return array(
|
||||||
'phui-theme-css' => 'ab7b848c',
|
'phui-theme-css' => 'ab7b848c',
|
||||||
'phui-timeline-view-css' => '2efceff8',
|
'phui-timeline-view-css' => '2efceff8',
|
||||||
'phui-two-column-view-css' => 'c75bfc5b',
|
'phui-two-column-view-css' => 'c75bfc5b',
|
||||||
'phui-workboard-view-css' => '2b5367d2',
|
'phui-workboard-view-css' => '0047084f',
|
||||||
'phui-workcard-view-css' => 'a869098a',
|
'phui-workcard-view-css' => '3646fb96',
|
||||||
'phui-workpanel-view-css' => 'e1bd8d04',
|
'phui-workpanel-view-css' => 'a78c0661',
|
||||||
'phuix-action-list-view' => 'b5c256b8',
|
'phuix-action-list-view' => 'b5c256b8',
|
||||||
'phuix-action-view' => '8cf6d262',
|
'phuix-action-view' => '8cf6d262',
|
||||||
'phuix-autocomplete' => '9196fb06',
|
'phuix-autocomplete' => '9196fb06',
|
||||||
|
@ -1631,6 +1631,9 @@ return array(
|
||||||
'javelin-uri',
|
'javelin-uri',
|
||||||
'phabricator-notification',
|
'phabricator-notification',
|
||||||
),
|
),
|
||||||
|
'a78c0661' => array(
|
||||||
|
'phui-workcard-view-css',
|
||||||
|
),
|
||||||
'a80d0378' => array(
|
'a80d0378' => array(
|
||||||
'javelin-behavior',
|
'javelin-behavior',
|
||||||
'javelin-stratcom',
|
'javelin-stratcom',
|
||||||
|
@ -1919,9 +1922,6 @@ return array(
|
||||||
'javelin-dom',
|
'javelin-dom',
|
||||||
'phabricator-prefab',
|
'phabricator-prefab',
|
||||||
),
|
),
|
||||||
'e1bd8d04' => array(
|
|
||||||
'phui-workcard-view-css',
|
|
||||||
),
|
|
||||||
'e1d25dfb' => array(
|
'e1d25dfb' => array(
|
||||||
'javelin-behavior',
|
'javelin-behavior',
|
||||||
'javelin-stratcom',
|
'javelin-stratcom',
|
||||||
|
|
|
@ -103,10 +103,12 @@ final class PHUIWorkpanelView extends AphrontTagView {
|
||||||
$body = phutil_tag(
|
$body = phutil_tag(
|
||||||
'div',
|
'div',
|
||||||
array(
|
array(
|
||||||
'class' => 'phui-workpanel-body',
|
'class' => 'phui-workpanel-body-content',
|
||||||
),
|
),
|
||||||
$this->cards);
|
$this->cards);
|
||||||
|
|
||||||
|
$body = phutil_tag_div('phui-workpanel-body', $body);
|
||||||
|
|
||||||
$view = id(new PHUIBoxView())
|
$view = id(new PHUIBoxView())
|
||||||
->setColor(PHUIBoxView::GREY)
|
->setColor(PHUIBoxView::GREY)
|
||||||
->addClass('phui-workpanel-view-inner')
|
->addClass('phui-workpanel-view-inner')
|
||||||
|
|
|
@ -35,8 +35,8 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.phui-workboard-view-shadow::-webkit-scrollbar {
|
.phui-workboard-view-shadow::-webkit-scrollbar {
|
||||||
height: 12px;
|
height: 8px;
|
||||||
width: 12px;
|
width: 8px;
|
||||||
background: rgba(200,200,200,.6);
|
background: rgba(200,200,200,.6);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -72,12 +72,6 @@
|
||||||
margin: 16px;
|
margin: 16px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.device-desktop .phui-workpanel-body {
|
|
||||||
max-height: calc(100vh - 170px);
|
|
||||||
overflow-y: scroll;
|
|
||||||
overflow-x: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
.device-desktop .phui-workboard-view .aphront-multi-column-view {
|
.device-desktop .phui-workboard-view .aphront-multi-column-view {
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
}
|
}
|
||||||
|
|
|
@ -110,6 +110,10 @@
|
||||||
background-color: {$sh-greenbackground};
|
background-color: {$sh-greenbackground};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.phui-object-item-list-view .phui-workcard:last-child {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
/* - Draggable Colors --------------------------------------------------------*/
|
/* - Draggable Colors --------------------------------------------------------*/
|
||||||
|
|
||||||
|
|
|
@ -35,8 +35,12 @@
|
||||||
user-select: none;
|
user-select: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.phui-workpanel-view .phui-box-grey {
|
||||||
|
background-color: rgba(71,87,120,0.1);
|
||||||
|
}
|
||||||
|
|
||||||
.phui-workpanel-view.phui-workboard-column-milestone .phui-box-grey {
|
.phui-workpanel-view.phui-workboard-column-milestone .phui-box-grey {
|
||||||
background-color: rgba(234, 230, 247, 0.75);
|
background-color: rgba(234, 230, 247, 0.85);
|
||||||
}
|
}
|
||||||
|
|
||||||
.phui-workpanel-view .phui-header-col2 .phui-icon-view {
|
.phui-workpanel-view .phui-header-col2 .phui-icon-view {
|
||||||
|
@ -46,11 +50,14 @@
|
||||||
.phui-workpanel-view .phui-workpanel-header-action {
|
.phui-workpanel-view .phui-workpanel-header-action {
|
||||||
float: right;
|
float: right;
|
||||||
width: 24px;
|
width: 24px;
|
||||||
border-left: 1px solid #b3b5b6;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.phui-workpanel-view .phui-workpanel-body {
|
.phui-workpanel-view .phui-workpanel-body {
|
||||||
padding: 8px 8px 4px 8px;
|
padding: 8px 4px 8px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.phui-workpanel-view .phui-workpanel-body-content {
|
||||||
|
padding: 0 4px 0 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.device .phui-workpanel-view .phui-workpanel-body {
|
.device .phui-workpanel-view .phui-workpanel-body {
|
||||||
|
@ -89,6 +96,24 @@
|
||||||
opacity: 0.75;
|
opacity: 0.75;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.device-desktop .phui-workpanel-body-content {
|
||||||
|
max-height: calc(100vh - 162px);
|
||||||
|
overflow-y: auto;
|
||||||
|
overflow-x: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.device-desktop .phui-workpanel-body-content::-webkit-scrollbar {
|
||||||
|
height: 8px;
|
||||||
|
width: 8px;
|
||||||
|
background: rgba(71,87,120,0.2);
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.device-desktop .phui-workpanel-body-content::-webkit-scrollbar-thumb {
|
||||||
|
background: rgba(71,87,120,0.4);
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
.project-panel-empty .phui-object-item-list-view {
|
.project-panel-empty .phui-object-item-list-view {
|
||||||
background: {$sh-indigobackground};
|
background: {$sh-indigobackground};
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
|
|
Loading…
Reference in a new issue