revi-archive/phorge-phorge
1
0
Fork 0
mirror of https://we.phorge.it/source/phorge.git synced 2024-11-23 15:22:41 +01:00
Code Issues Releases Wiki Activity

Always show inline comment column in Pholio

Browse source 
Summary:
  - Always show the column so there's no jumping around when comments are added.
  - Set width to 320px so we can mobile it (not 100% sure how this will work yet).
  - When there are too many comments, scroll them internally.

Test Plan: {F33552}

Reviewers: ljalonen, chad

Reviewed By: chad

CC: aran

Differential Revision: https://secure.phabricator.com/D5071
This commit is contained in:
epriestley 2013-02-22 10:29:56 -08:00
parent 0cdce03b52
commit 5fdaebf158
2 changed files with 10 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
src/applications/pholio/view/PholioMockImagesView.php
View file

@ -47,7 +47,6 @@ final class PholioMockImagesView extends AphrontView {
), ),
$main_image_tag); $main_image_tag);
$inline_comments_holder = javelin_tag( $inline_comments_holder = javelin_tag(
'div', 'div',
array( array(

16
webroot/rsrc/css/application/pholio/pholio.css
View file

@ -5,6 +5,7 @@
background-color: #282828; background-color: #282828;
text-align: center; text-align: center;
vertical-align: middle; vertical-align: middle;
position: relative;
} }
.pholio-mock-carousel { .pholio-mock-carousel {
@ -56,24 +57,27 @@
.pholio-mock-wrapper { .pholio-mock-wrapper {
position: relative; position: relative;
margin: 20px 340px 20px 20px;
display: inline-block; display: inline-block;
cursor: crosshair; cursor: crosshair;
padding: 0px; padding: 0px;
margin: 10px 0px;
} }
.pholio-mock-inline-comments { .pholio-mock-inline-comments {
display: inline-block; width: 320px;
margin-left: 10px; border-left: 1px solid #101010;
position: absolute;
top: 0;
bottom: 0;
right: 0;
overflow-x: auto;
text-align: left; text-align: left;
padding-bottom: 10px;
} }
.pholio-inline-comment { .pholio-inline-comment {
border: 1px solid #aa8; border: 1px solid #aa8;
background: #f9f9f1; background: #f9f9f1;
margin-bottom: 2px; margin: 2px;
padding: 8px 10px; padding: 8px 10px;
} }