1
0
Fork 0
mirror of https://we.phorge.it/source/phorge.git synced 2024-09-20 17:28:51 +02:00
phorge-phorge/webroot/rsrc/css/application/ponder/ponder-view.css
Chad Little e9f4ca6ca3 Redesign PonderQuestionView
Summary: Full new UI, testing some upcoming treatments for consideration in other View controllers. Small tweaks to allow PHUITwoColumnView to have fixed and fluid width, and let TransactionCommentView go fullWidth.

Test Plan:
Tested a number of Ponder cases, New Question, with and without summary, with and without answers, with and without comments. Mobile, Tablet, and Desktop layouts. Verify Project and Profile UI's still in tact.

{F1120961}

{F1120962}

{F1120963}

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin

Differential Revision: https://secure.phabricator.com/D15315
2016-02-23 17:20:07 -08:00

224 lines
4.3 KiB
CSS

/**
* @provides ponder-view-css
*/
.ponder-question-view {
background: #fff;
padding-bottom: 64px;
}
.device-desktop .ponder-question-view.phui-two-column-view .phui-side-column {
width: 300px;
}
.ponder-question-view .phui-object-box,
.ponder-question-view .phui-info-view {
margin-left: 0;
margin-right: 0;
}
.device-phone .ponder-question-view .phui-profile-header.phui-header-shell
.phui-header-header {
font-size: 20px;
}
.ponder-question-container {
border-top: 1px solid {$thinblueborder};
}
.ponder-question-content {
margin: 0 24px;
padding: 24px 0;
border-top: 1px solid rgba({$alphagrey}, .15);
}
.device-phone .ponder-question-content {
margin: 0 16px;
}
.device .ponder-view-properties {
border-left: none;
border-right: none;
border-radius: 0;
}
.device .ponder-question-view .phui-timeline-view,
.device .ponder-question-view .phui-timeline-event-view {
margin: 0;
padding: 0;
}
.ponder-view-properties .phui-property-list-container {
margin: 0;
padding: 0;
}
.ponder-question-view .phui-document-container {
border: none;
}
.ponder-view-properties .phui-property-list-stacked
.phui-property-list-properties .phui-property-list-key {
padding: 0;
}
.ponder-view-properties .phui-property-list-stacked
.phui-property-list-properties .phui-property-list-value {
margin-bottom: 16px;
padding: 0;
}
.phui-box.ponder-answer-wiki {
padding: 16px;
margin: 24px 0;
}
.ponder-details-subtitle {
height: 24px;
line-height: 24px;
margin-bottom: 12px;
color: {$greytext};
position: relative;
padding-left: 32px;
}
.ponder-details-subtitle a {
color: {$darkgreytext};
}
.ponder-details-author-image {
height: 24px;
width: 24px;
background-size: 100%;
margin-right: 8px;
border-radius: 3px;
display: inline-block;
position: absolute;
top: 0;
left: 0;
}
.ponder-detail-view .phabricator-remarkup {
margin-left: 32px;
}
.ponder-question-content .phui-timeline-view {
padding-right: 0;
}
.ponder-question-content .phui-timeline-view .phui-timeline-core-content {
background-color: {$lightbluebackground};
}
.ponder-answer-view {
margin-top: 16px;
}
.device-desktop .ponder-answer-view .phui-timeline-view {
margin-left: 32px;
}
.ponder-answer-view .phui-header-subheader {
display: inline;
margin-left: 12px;
}
.ponder-question-view .ponder-answer-view .phui-header-shell {
padding: 4px 8px 3px 8px;
}
.ponder-answer-view .phui-header-image-href {
display: flex;
}
.ponder-answer-view .phui-header-view .phui-header-header {
font-size: 15px;
}
.ponder-answer-view .phui-header-col1 {
width: 40px;
}
.ponder-answer-view .ponder-answer-content {
background-color: #fff;
padding: 16px 16px 0 16px;
}
.device-phone .ponder-answer-view .ponder-answer-content {
padding: 12px 12px 0 12px;
}
.ponder-answer-view .phui-header-image {
height: 30px;
width: 30px;
border-radius: 3px;
}
.ponder-answer-wiki-header {
font-weight: bold;
border-bottom: 1px solid {$lightblueborder};
color: {$bluetext};
padding-bottom: 8px;
margin-bottom: 16px;
}
.ponder-footer-view {
text-align: left;
margin-top: 16px;
border-bottom: 1px solid {$thinblueborder};
}
.ponder-answer-view .ponder-footer-view {
margin-top: 24px;
border-top: 1px solid rgba({$alphagrey}, .15);
border-bottom: none;
}
body .phui-main-column .ponder-question-content .ponder-answer-view
.phui-object-box.ponder-answer {
margin: 0;
padding: 0;
}
.ponder-footer-view .ponder-footer-action {
padding: 8px 0;
margin-right: 8px;
display: inline-block;
}
.ponder-add-answer-header {
margin-top: 64px;
}
.ponder-add-answer-view {
margin-top: 16px;
}
.ponder-question-content div.ponder-question-add-comment-view
div.phui-box.phui-object-box {
background: {$lightbluebackground};
margin-right: 0;
margin-left: 32px;
}
.device .ponder-question-content div.ponder-question-add-comment-view
div.phui-box.phui-object-box {
margin: 0;
}
.ponder-add-answer-view .phui-form-full-width.phui-form-view
label.aphront-form-label,
.ponder-question-add-comment-view .phui-form-full-width.phui-form-view
label.aphront-form-label{
display: none;
}
.ponder-add-answer-view.phui-box-grey .phui-header-shell {
border: none;
padding-bottom: 8px;
}
.ponder-add-answer-view .remarkup-assist-textarea,
.ponder-question-add-comment-view .remarkup-assist-textarea {
height: 8em;
}