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

Have home dashboards go to single column on narrow desktops

Summary: Ref T6723. Because of the sidenav, some dashboard layouts may perform poorly on more narrow desktop displays. This provides an additional media query and CSS rules.

Test Plan:
Move viewport to 1001 px, see desktop, move to 999 pixels, see tablet-like display.

{F248158}

{F248159}

{F248160}

Reviewers: btrahan, epriestley

Reviewed By: epriestley

Subscribers: Korvin, epriestley

Maniphest Tasks: T6723

Differential Revision: https://secure.phabricator.com/D10956
This commit is contained in:
Chad Little 2014-12-10 08:51:09 -08:00
parent edc4c219ca
commit 786c7b0df6
2 changed files with 32 additions and 2 deletions

View file

@ -23,7 +23,7 @@ return array(
'rsrc/css/aphront/error-view.css' => '3462dbee',
'rsrc/css/aphront/lightbox-attachment.css' => '7acac05d',
'rsrc/css/aphront/list-filter-view.css' => '2ae43867',
'rsrc/css/aphront/multi-column.css' => '1b95ab2e',
'rsrc/css/aphront/multi-column.css' => '6d72e772',
'rsrc/css/aphront/notification.css' => '9c279160',
'rsrc/css/aphront/pager-view.css' => '2e3539af',
'rsrc/css/aphront/panel-view.css' => '5846dfa2',
@ -503,7 +503,7 @@ return array(
'aphront-dialog-view-css' => '4dbbe3bb',
'aphront-error-view-css' => '3462dbee',
'aphront-list-filter-view-css' => '2ae43867',
'aphront-multi-column-view-css' => '1b95ab2e',
'aphront-multi-column-view-css' => '6d72e772',
'aphront-pager-view-css' => '2e3539af',
'aphront-panel-view-css' => '5846dfa2',
'aphront-table-view-css' => 'b22b7216',

View file

@ -152,3 +152,33 @@
border: none;
padding-bottom: 0;
}
/* Make Dashboards reasonably display on homepage with narrow widths */
@media (max-width: 1000px) {
.device-desktop .dashboard-view .aphront-multi-column-inner {
display: block;
width: auto;
}
.device-desktop .aphront-multi-column-column-outer {
display: block;
border: none;
}
.device-desktop .aphront-multi-column-column.mlr {
margin: 0;
}
.device-desktop .aphront-multi-column-fluid .aphront-multi-column-2-up
.aphront-multi-column-column-outer.half {
width: auto;
margin: 0 0 16px;
}
.device-desktop .aphront-multi-column-fluid .aphront-multi-column-2-up
.aphront-multi-column-column-outer.thirds {
width: auto;
margin: 0 0 16px;
}
.device-desktop .aphront-multi-column-fluid .aphront-multi-column-2-up
.aphront-multi-column-column-outer.third {
width: auto;
margin: 0 0 16px;
}
}