1
0
Fork 0
mirror of https://we.phorge.it/source/phorge.git synced 2024-12-22 05:20:56 +01:00
phorge-phorge/webroot/rsrc/css/application/conpherence/durable-column.css
Chad Little 9170e90112 [Redesign] Move basefont to Lato, remove Source Sans Pro
Summary: Working towards a more unified look and feel. This brings in Lato as a complete base font over Helvetica Neue, as well as removing Source Sans Pro from DocumentView and Conpherence. Design-wise Lato provides the nice readability at larger font sizes that Source Sans Pro did, with the ability to scale down to tables and UI widgets with ease. This gives us one font instead of two, and now Object descriptions and Timeline posts all can benefit from a consistent, readable font.

Test Plan:
Test main UI, smaller elements like tables, menus, DocumentViews, Previews, Conpherence.

{F498135}

{F498136}

Reviewers: btrahan, epriestley

Reviewed By: epriestley

Subscribers: epriestley, Korvin

Differential Revision: https://secure.phabricator.com/D13276
2015-06-13 20:32:45 +01:00

338 lines
7 KiB
CSS

/**
* @provides conpherence-durable-column-view
*/
.with-durable-column .phabricator-standard-page-body {
margin-right: 300px;
}
.with-durable-margin .phabricator-standard-page-body {
margin-right: 312px;
}
.with-durable-column .phabricator-main-menu {
padding-right: 304px;
}
.with-durable-margin .phabricator-main-menu {
padding-right: 316px;
}
.with-durable-column
.phabricator-global-upload-instructions {
font-size: 28px;
width: 50%;
}
.global-upload-mask {
pointer-events: none;
}
.with-durable-column .global-upload-mask {
right: 300px;
}
.with-durable-margin .global-upload-mask {
right: 312px;
}
.conpherence-durable-column {
position: fixed;
top: 0;
bottom: 0;
right: 0;
width: 300px;
background: #fff;
}
.with-durable-margin .conpherence-durable-column {
border-right: 12px solid {$lightgreybackground};
}
.conpherence-durable-column .loading-mask {
position: absolute;
top: 90px;
bottom: 0;
right: 1px;
width: 298px;
background: #fff;
display: none;
opacity: .6;
z-index: 2;
}
.device-desktop .conpherence-durable-column.loading .loading-mask {
display: block;
}
.conpherence-durable-column-header .conpherence-settings-dropdown {
z-index: 1;
}
.conpherence-durable-column-header .phabricator-application-menu {
display: block;
float: right;
padding-right: 4px;
width: 36px;
}
.conpherence-durable-column-header
.phabricator-application-menu .phui-list-item-view.core-menu-item {
display: block;
}
.conpherence-durable-column-header
.phabricator-application-menu .phui-list-item-name {
display: none;
}
.conpherence-durable-column-header
.phabricator-application-menu .phui-list-item-view {
float: left;
position: relative;
width: 36px;
height: 36px;
margin-top: 4px;
}
.conpherence-durable-column-header
.phabricator-application-menu .phui-list-item-href {
background: transparent;
border: none;
padding: 0;
}
.conpherence-durable-column-header
.phabricator-dark-menu .phui-list-item-type-link {
background: transparent;
}
.conpherence-durable-column-header
.phabricator-application-menu
.phui-list-item-view.core-menu-item {
display: block;
}
.conpherence-durable-column-header {
border-left: 1px solid rgba(0,0,0,.1);
border-right: 1px solid rgba(0,0,0,.1);
}
.conpherence-durable-column-header-text {
float: left;
padding: 13px 0 12px 12px;
font-size: 15px;
color: {$hoverwhite};
font-weight: 400;
width: 230px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.conpherence-durable-column-header-text .phui-icon-view {
color: {$hoverwhite};
}
.conpherence-durable-column-icon-bar {
height: 38px;
padding: 4px;
background-color: {$lightgreybackground};
}
.conpherence-durable-column-icon-bar .conpherence-durable-column-thread-icon {
float: left;
display: block;
height: 34px;
width: 34px;
border: 2px solid transparent;
border-radius: 3px;
margin: 0 4px 0 0;
}
.conpherence-durable-column-icon-bar .conpherence-durable-column-search-button {
margin: 4px 0px 0px 0px;
}
.conpherence-durable-column-icon-bar .phui-button-bar {
}
.conpherence-durable-column-icon-bar .phui-button-bar a.button.has-icon {
height: 21px;
}
.conpherence-durable-column-icon-bar .phui-button-bar .button .phui-icon-view {
top: 8px;
}
.conpherence-durable-column-icon-bar
.conpherence-durable-column-thread-icon.selected {
border-color: {$sky};
}
.conpherence-durable-column-icon-bar
.conpherence-durable-column-thread-icon span {
position: relative;
display: block;
width: 30px;
height: 30px;
top: 2px;
left: 2px;
background-size: 30px 30px;
}
.conpherence-durable-column-body {
position: absolute;
top: 44px;
bottom: 0;
right: 0;
left: 0;
border-left: 1px solid {$lightblueborder};
}
.with-durable-margin .conpherence-durable-column-body {
border-right: 1px solid {$lightblueborder};
}
.conpherence-durable-column-main {
position: absolute;
top: 46px;
bottom: 134px;
left: 0;
right: 0;
overflow-x: hidden;
border-top: 1px solid {$thinblueborder};
}
.conpherence-durable-column-transactions {
padding: 8px 12px 0;
}
.conpherence-durable-column-transactions
.conpherence-transaction-view.conpherence-edited {
color: {$lightgreytext};
font-size: 12px;
margin: 0;
padding: 0;
}
.conpherence-durable-column-transactions .conpherence-edited
.conpherence-transaction-header {
display: none;
}
.conpherence-durable-column-transactions .conpherence-transaction-view {
background: none;
margin: 0;
padding: 4px 0;
min-height: 0;
}
.conpherence-durable-column-transactions
.conpherence-transaction-view
.conpherence-message {
word-wrap: break-word;
}
.conpherence-durable-column-transactions .conpherence-transaction-detail {
border: 0;
margin: 0;
}
.conpherence-durable-column-transactions .conpherence-transaction-detail
.conpherence-transaction-header {
background: none;
padding: 0 0 2px 0;
}
.conpherence-durable-column-transactions
.conpherence-transaction-view.date-marker {
margin: 20px 0px 8px;
}
.conpherence-durable-column-transactions
.conpherence-transaction-view.date-marker .date {
left: 0;
font-size: 12px;
top: -14px;
padding: 0 6px 0 0;
}
.conpherence-durable-column-transactions .conpherence-transaction-detail
.conpherence-transaction-header .conpherence-transaction-info {
color: {$lightbluetext};
float: none;
font-size: 12px;
}
.conpherence-transaction-header .epoch-link {
color: {$lightgreytext};
}
.conpherence-durable-column-transactions .conpherence-transaction-detail
.conpherence-transaction-header .phui-link-person {
margin: 0 8px 0 0;
}
.conpherence-durable-column-transactions .conpherence-transaction-detail
.conpherence-transaction-content .phui-link-person {
color: {$darkbluetext};
}
.conpherence-durable-column-transactions
.conpherence-transaction-detail
.conpherence-transaction-content
.phui-pinboard-item-view {
width: 273px;
}
.conpherence-durable-column-transactions
.conpherence-transaction-detail
.conpherence-transaction-content
.phui-pinboard-item-view
.phui-pinboard-item-image-link
img {
width: 265px;
height: 199px;
}
.conpherence-durable-column-transactions .conpherence-transaction-detail
.conpherence-transaction-content {
background: #fff;
padding: 0 0 8px 0;
}
.conpherence-durable-column-textarea {
position: absolute;
left: 0;
right: 0;
bottom: 34px;
height: 100px;
margin: 0;
border-width: 1px 0;
border-style: solid;
border-top-color: {$thinblueborder};
border-bottom-color: {$thinblueborder};
padding: 8px 12px;
width: 100%;
resize: none;
}
.conpherence-durable-column-textarea:focus {
outline: 0;
border-top-color: {$sky};
border-bottom-color: {$sky};
box-shadow: none;
}
.conpherence-durable-column-footer {
position: absolute;
height: 26px;
padding: 4px 8px 4px 12px;
left: 0;
right: 0;
bottom: 0;
background-color: {$lightgreybackground};
}
.conpherence-durable-column-footer button {
float: right;
}
.conpherence-durable-column-status {
vertical-align: middle;
line-height: 24px;
font-size: 12px;
color: {$lightbluetext};
}