1
0
Fork 0
mirror of https://we.phorge.it/source/phorge.git synced 2024-11-30 18:52:42 +01:00
phorge-phorge/webroot/rsrc/css/phui/phui-document.css
Chad Little 90b45b3a0a PHUIDocument view for mobile devices.
Summary: Adds collapsing of the sidebar, also allows you to say where it goes on mobile (above or below content). ToC for example, above. General Navbar, below. Up to you.

Test Plan: Review UIExamples and Diviner.

Reviewers: epriestley, btrahan

Reviewed By: epriestley

CC: aran, Korvin

Differential Revision: https://secure.phabricator.com/D6150
2013-06-06 12:47:40 -07:00

136 lines
2.6 KiB
CSS

/**
* @provides phui-document-view-css
*/
.phui-document-view {
margin-bottom: 16px;
position: relative;
}
.device-desktop .phui-document-view {
border-left: 1px solid #e7e7e7;
border-right: 1px solid #e7e7e7;
border-bottom: 1px solid #c0c5d1;
max-width: 960px;
margin: 16px auto;
}
.device-desktop .phui-document-view.phui-offset-view {
max-width: 800px;
}
.phui-document-sidenav {
position:absolute;
width: 200px;
text-overflow: ellipsis;
top: 0;
right: 0;
}
.device-phone .phui-document-sidenav {
position: static;
width: auto;
border-top: 1px solid #d7d7d7;
border-bottom: 1px solid #d7d7d7;
}
.device-phone .phui-sidenav-view .phui-document-inner {
margin: 0;
}
.phui-sidenav-view .phui-document-inner {
margin-right: 200px;
border-right: 1px solid #e7e7e7;
background: #fff;
}
.phui-document-bookname {
padding: 8px 16px;
color: #9ca5b5;
}
.phui-document-bookname .bookname {
font-size: 14px;
font-weight: bold;
float: left;
}
.phui-document-bookname .bookdescription {
font-size: 14px;
float: right;
}
.phui-document-content .phabricator-header-shell {
background-color: #f6f7f8;
border-top: 1px solid #e7e7e7;
border-bottom: 1px solid #e7e7e7;
}
.phui-document-content .phabricator-header-view {
padding: 16px;
}
.phui-document-content .phabricator-property-list-view {
border: none;
box-shadow: none;
margin: 0;
background-color: #f6f7f8;
}
.phui-document-content {
box-shadow: 0 1px 2px rgba(0,0,0,0.2);
min-height: 240px;
background: #fff;
/* NOTE: This fixes margins, not floats, and can not be replaced with
the ".group" class. See T3150.
*/
overflow: hidden;
}
.device-desktop .phui-document-content .phabricator-action-list-view {
margin: 10px 10px 0 0;
background: #f7f7f7;
}
.device-phone .phui-document-content .phabricator-action-list-view {
margin: 0;
border-bottom: 1px solid #c0c5d1;
background: #f7f7f7;
}
.phui-document-content .phabricator-remarkup {
padding: 16px;
}
.device-phone .phui-document-content .phabricator-remarkup {
padding: 8px;
}
.device-desktop .phui-document-content .phabricator-action-list-view {
position: absolute;
top: 50px;
right: -172px;
float: none;
background: #fff;
border-radius: 0;
box-shadow: none;
border: none;
border-top: 1px solid #e7e7e7;
border-bottom: 1px solid #e7e7e7;
border-right: 1px solid #e7e7e7;
width: 160px;
}
.device-phone .phui-document-content .phabricator-remarkup-toc {
width: 120px;
}
.phui-document-content .phabricator-remarkup .remarkup-code-block {
clear: both;
margin: 16px 0;
}
.device-desktop .phui-document-offset {
padding-right: 160px;
}