quattro: add comment box

diff --git a/view/theme/quattro/colors.less b/view/theme/quattro/colors.less
index 12b0d08a66c0935d948f62978d283bd1ea5f6f65..564cf6d24330d6d3aa8bde18877d7fbc3c0fdaaa 100644 (file)
--- a/view/theme/quattro/colors.less
+++ b/view/theme/quattro/colors.less
@@ -67,3 +67,8 @@
 @NoticeBackgroundColor: #511919;
 
 @ThreadBackgroundColor: #f6f7f8;
+
+@CommentBoxEmptyColor: @Grey3;
+@CommentBoxEmptyBorderColor: @Grey3;
+@CommentBoxFullColor: @Grey5;
+@CommentBoxFullBorderColor: @Grey5;

diff --git a/view/theme/quattro/quattro.less b/view/theme/quattro/quattro.less
index 1be65ea917cf217f83cca9b4882252b3058cfb14..31a25694f0982a53a51af1a9bd0cf8d0db18d64a 100644 (file)
--- a/view/theme/quattro/quattro.less
+++ b/view/theme/quattro/quattro.less
@@ -3,7 +3,7 @@
 /* global */
 body {
        font-family: Liberation Sans,helvetica,arial,clean,sans-serif;
-       font-size: 10px;
+       font-size: 12px;
        background-color: @BodyBackground;
        color: @BodyColor;
        margin: 50px 0px 0px 0px;
@@ -324,18 +324,17 @@ section {
        .wall-item-ago { padding-right: 40px; }
        .wall-item-name { font-weight: bold; }
        
-       .wall-item-actions-author { float: left; width: 25%; margin-top: 0.5em; }
-       .wall-item-actions-social { float: left; width: 50%; margin-top: 0.5em;
+       .wall-item-actions-author { float: left; width: 20em; margin-top: 0.5em; }
+       .wall-item-actions-social { float: left; margin-top: 0.5em;
                a { margin-right: 3em; }
         }
-       .wall-item-actions-tools { float: right; width: 25%; 
+       .wall-item-actions-tools { float: right; width: 15%; 
                a { float: right; }
                input { float: right; }
        }
 }
 
 
-
 .wall-item-container.comment {
        margin-top: 50px;
        .wall-item-photo { width: 32px; height: 32px; margin-left: 16px;}       
@@ -345,3 +344,34 @@ section {
        }
        .wall-item-links { padding-left: 12px; }
 }
+
+.wall-item-comment-wrapper {
+       margin: 30px 2em 2em 60px;
+       .comment-edit-photo { display: none; }
+       textarea {      
+               height: 1em; width: 100%; font-size: 10px;
+               color: @CommentBoxEmptyColor;
+               border: 1px solid @CommentBoxEmptyBorderColor;
+               padding:0.3em;
+       }
+       .comment-edit-text-full {
+               font-size: 14px;
+               height: 4em;
+               color: @CommentBoxFullColor;
+               border: 1px solid @CommentBoxFullBorderColor;
+       }
+}
+
+#profile-jot-wrapper {
+       width: 100%;
+       margin: 0px 2em 20px 0px;
+       
+       
+}
+.profile-jot-text {
+       height: 1em; width: 100%; font-size: 10px;
+       color: @CommentBoxEmptyColor;
+       border: 1px solid @CommentBoxEmptyBorderColor;
+       padding:0.3em;
+}
+

diff --git a/view/theme/quattro/style.css b/view/theme/quattro/style.css
index 4d9e12540aacd4956bb7a75297337a7e051f9aa1..f3237801dfe9c58d29d3c246c2e77c4ca044dd1f 100644 (file)
--- a/view/theme/quattro/style.css
+++ b/view/theme/quattro/style.css
@@ -153,7 +153,7 @@
 /* global */
 body {
   font-family: Liberation Sans, helvetica, arial, clean, sans-serif;
-  font-size: 10px;
+  font-size: 12px;
   background-color: #ffffff;
   color: #2d2d2d;
   margin: 50px 0px 0px 0px;
@@ -574,12 +574,11 @@ section {
 }
 .wall-item-container .wall-item-actions-author {
   float: left;
-  width: 25%;
+  width: 20em;
   margin-top: 0.5em;
 }
 .wall-item-container .wall-item-actions-social {
   float: left;
-  width: 50%;
   margin-top: 0.5em;
 }
 .wall-item-container .wall-item-actions-social a {
@@ -587,7 +586,7 @@ section {
 }
 .wall-item-container .wall-item-actions-tools {
   float: right;
-  width: 25%;
+  width: 15%;
 }
 .wall-item-container .wall-item-actions-tools a {
   float: right;
@@ -610,3 +609,35 @@ section {
 .wall-item-container.comment .wall-item-links {
   padding-left: 12px;
 }
+.wall-item-comment-wrapper {
+  margin: 30px 2em 2em 60px;
+}
+.wall-item-comment-wrapper .comment-edit-photo {
+  display: none;
+}
+.wall-item-comment-wrapper textarea {
+  height: 1em;
+  width: 100%;
+  font-size: 10px;
+  color: #999999;
+  border: 1px solid #999999;
+  padding: 0.3em;
+}
+.wall-item-comment-wrapper .comment-edit-text-full {
+  font-size: 14px;
+  height: 4em;
+  color: #2d2d2d;
+  border: 1px solid #2d2d2d;
+}
+#profile-jot-wrapper {
+  width: 100%;
+  margin: 0px 2em 20px 0px;
+}
+.profile-jot-text {
+  height: 1em;
+  width: 100%;
+  font-size: 10px;
+  color: #999999;
+  border: 1px solid #999999;
+  padding: 0.3em;
+}

diff --git a/view/wall_item.tpl b/view/wall_item.tpl
index 7db8b86977232129d3558a8c98c3d101233ac896..cec5e54048df6f293725bac48d97b7ec756e2f68 100644 (file)
--- a/view/wall_item.tpl
+++ b/view/wall_item.tpl
@@ -66,4 +66,6 @@
                </div>
        </div>
 </div>
-
+<div class="wall-item-comment-wrapper" >
+       $comment
+</div>

diff --git a/view/wallwall_item.tpl b/view/wallwall_item.tpl
index 502bdda32725c02b18a1f24da89d0c4c17344085..2429bc20f7ddb4a44fbc5f99ccfae20267c999c8 100644 (file)
--- a/view/wallwall_item.tpl
+++ b/view/wallwall_item.tpl
@@ -1,58 +1,3 @@
-{#<div class="wall-item-outside-wrapper$indent wallwall" id="wall-item-outside-wrapper-$id" >
-       <div class="wall-item-content-wrapper$indent" id="wall-item-content-wrapper-$id" >
-               <div class="wall-item-info wallwall" id="wall-item-info-$id">
-                       <div class="wall-item-photo-wrapper mframe wwto" id="wall-item-ownerphoto-wrapper-$id" >
-                               <a href="$owner_url" target="redir" title="$olinktitle" class="wall-item-photo-link" id="wall-item-ownerphoto-link-$id">
-                               <img src="$owner_photo" class="wall-item-photo$osparkle" id="wall-item-ownerphoto-$id" style="height: 80px; width: 80px;" alt="$owner_name" /></a>
-                       </div>
-                       <div class="wall-item-arrowphoto-wrapper" ><img src="images/larrow.gif" alt="$wall" /></div>
-                       <div class="wall-item-photo-wrapper mframe wwfrom" id="wall-item-photo-wrapper-$id" 
-                               onmouseover="if (typeof t$id != 'undefined') clearTimeout(t$id); openMenu('wall-item-photo-menu-button-$id')"
-                onmouseout="t$id=setTimeout('closeMenu(\'wall-item-photo-menu-button-$id\'); closeMenu(\'wall-item-photo-menu-$id\');',200)">
-                               <a href="$profile_url" target="redir" title="$linktitle" class="wall-item-photo-link" id="wall-item-photo-link-$id">
-                               <img src="$thumb" class="wall-item-photo$sparkle" id="wall-item-photo-$id" style="height: 80px; width: 80px;" alt="$name" /></a>
-                               <span onclick="openClose('wall-item-photo-menu-$id');" class="fakelink wall-item-photo-menu-button" id="wall-item-photo-menu-button-$id">menu</span>
-                <div class="wall-item-photo-menu" id="wall-item-photo-menu-$id">
-                    <ul>
-                        $item_photo_menu
-                    </ul>
-                </div>
-
-                       </div>
-                       <div class="wall-item-photo-end"></div>
-                       <div class="wall-item-wrapper" id="wall-item-wrapper-$id" >
-                               $lock
-                               <div class="wall-item-location" id="wall-item-location-$id">$location</div>
-                       </div>
-               </div>
-               <div class="wall-item-author">
-                               <a href="$profile_url" target="redir" title="$linktitle" class="wall-item-name-link"><span class="wall-item-name$sparkle" id="wall-item-name-$id" >$name</span></a> $to <a href="$owner_url" target="redir" title="$olinktitle" class="wall-item-name-link"><span class="wall-item-name$osparkle" id="wall-item-ownername-$id">$owner_name</span></a> $vwall<br />
-                               <div class="wall-item-ago"  id="wall-item-ago-$id">$ago</div>                           
-               </div>                  
-               <div class="wall-item-content" id="wall-item-content-$id" >
-                       <div class="wall-item-title" id="wall-item-title-$id">$title</div>
-                       <div class="wall-item-title-end"></div>
-                       <div class="wall-item-body" id="wall-item-body-$id" >$body</div>
-               </div>
-               <div class="wall-item-tools" id="wall-item-tools-$id">
-               $vote
-               $plink
-               $edpost
-               $star
-               $drop
-               </div>
-       </div>  
-       <div class="wall-item-wrapper-end"></div>
-       <div class="wall-item-like" id="wall-item-like-$id">$like</div>
-       <div class="wall-item-dislike" id="wall-item-dislike-$id">$dislike</div>
-       <div class="wall-item-comment-separator"></div>
-       <div class="wall-item-comment-wrapper" >
-       $comment
-       </div>
-
-<div class="wall-item-outside-wrapper-end$indent" ></div>
-</div> #}
-
 {{ if $indent }}{{ else }}
 <div class="wall-item-decor">
        <span class="icon s22 star $isstarred" id="starred-$id" title="$star.starred">$star.starred</span>
@@ -63,12 +8,12 @@
 <div class="wall-item-container $indent">
        <div class="wall-item-item">
                <div class="wall-item-info">
-                       <div class="wall-item-photo-wrapper wwto" id="wall-item-ownerphoto-wrapper-$id" >
+                       <div class="wall-item-photo-wrapper mframe wwto" id="wall-item-ownerphoto-wrapper-$id" >
                                <a href="$owner_url" target="redir" title="$olinktitle" class="wall-item-photo-link" id="wall-item-ownerphoto-link-$id">
                                        <img src="$owner_photo" class="wall-item-photo$osparkle" id="wall-item-ownerphoto-$id" alt="$owner_name" />
                                </a>
                        </div>
-                       <div class="wall-item-photo-wrapper wwfrom"
+                       <div class="wall-item-photo-wrapper mframe wwfrom"
                                onmouseover="if (typeof t$id != 'undefined') clearTimeout(t$id); openMenu('wall-item-photo-menu-button-$id')" 
                                onmouseout="t$id=setTimeout('closeMenu(\'wall-item-photo-menu-button-$id\'); closeMenu(\'wall-item-photo-menu-$id\');',200)">
                                <a href="$profile_url" target="redir" title="$linktitle" class="wall-item-photo-link" id="wall-item-photo-link-$id">
@@ -128,3 +73,6 @@
                </div>
        </div>
 </div>
+<div class="wall-item-comment-wrapper" >
+       $comment
+</div>