Comments page review.

git-svn-id: http://piwigo.org/svn/trunk@2706 68402e56-0260-453c-a942-63ccdbb3a9ee

4 files changed, 40 insertions, 36 deletions

diff --git a/template/yoga/comment_list.tpl b/template/yoga/comment_list.tpl
index d295015ed..57c2a73cb 100644
--- a/template/yoga/comment_list.tpl
+++ b/template/yoga/comment_list.tpl
@@ -1,38 +1,41 @@
 {* $Id$ *}
+<ul class="thumbnailCategories">
 {foreach from=$comments item=comment}
+<li>
 	<div class="thumbnailCategory">
-	{if isset($comment.TN_SRC)}
-		<div class="illustration">
-			<a href="{$comment.U_PICTURE}">
-				<img src="{$comment.TN_SRC}" alt="{$comment.ALT}" />
-			</a>
-		</div>
-	{/if}
-		<div class="description">
-			{if isset($comment.U_DELETE) or isset($comment.U_VALIDATE) }
-			<ul class="actions" style="float:right">
-				{if isset($comment.U_DELETE)}
-				<li>
-					<a href="{$comment.U_DELETE}" title="{'delete this comment'|@translate}">
-						<img src="{$ROOT_URL}{$themeconf.icon_dir}/delete.png" class="button" alt="[delete]" />
-					</a>
-				</li>
-				{/if}
-				{if isset($comment.U_VALIDATE)}
-				<li>
-					<a href="{$comment.U_VALIDATE}" title="validate this comment">
-						<img src="{$ROOT_URL}{$themeconf.icon_dir}/validate_s.png" class="button" alt="[validate]" />
-					</a>
-				</li>
-				{/if}
-			</ul>
-			{/if}
-			<span class="author">{$comment.AUTHOR}</span> - <span class="date">{$comment.DATE}</span>
-			<blockquote>{$comment.CONTENT}</blockquote>
-		</div>
-    <div class="border">{* Sylvia needs that stupid dummy block *}&nbsp;</div>
-	</div>
-	{if isset($comment_separator)}
-	<hr/>
-	{/if}
+    {if isset($comment.TN_SRC)}
+    <div class="illustration">
+      <a href="{$comment.U_PICTURE}">
+        <img src="{$comment.TN_SRC}" alt="{$comment.ALT}" />
+      </a>
+    </div>
+    {/if}
+    <div class="description">
+      {if isset($comment.U_DELETE) or isset($comment.U_VALIDATE) }
+      <ul class="actions" style="float:right">
+        {if isset($comment.U_DELETE)}
+        <li>
+          <a href="{$comment.U_DELETE}" title="{'delete this comment'|@translate}">
+            <img src="{$ROOT_URL}{$themeconf.icon_dir}/delete.png" class="button" alt="[delete]" />
+          </a>
+        </li>
+        {/if}
+        {if isset($comment.U_VALIDATE)}
+        <li>
+          <a href="{$comment.U_VALIDATE}" title="validate this comment">
+            <img src="{$ROOT_URL}{$themeconf.icon_dir}/validate_s.png" class="button" alt="[validate]" />
+          </a>
+        </li>
+        {/if}
+      </ul>
+      {/if}
+      <span class="author">{$comment.AUTHOR}</span> - <span class="date">{$comment.DATE}</span>
+      <blockquote>{$comment.CONTENT}</blockquote>
+    </div>
+  </div>
+</li>
+{if isset($comment_separator)}
+<hr/>
+{/if}
 {/foreach}
+</ul>
\ No newline at end of file
diff --git a/template/yoga/default-layout.css b/template/yoga/default-layout.css
index f7b102a96..96a0f4a81 100644
--- a/template/yoga/default-layout.css
+++ b/template/yoga/default-layout.css
@@ -276,7 +276,7 @@ TABLE.tagLetterContent {
 
 #theNotificationPage dl,
 #thePopuphelpPage dl { margin: 0 25px 25px; }
-
+#content #comments ul.thumbnailCategories li { width:99%; }
 /* jQuery datepicker */
 img.ui-datepicker-trigger {
 	cursor : pointer;
diff --git a/template/yoga/icon/validate_s.png b/template/yoga/icon/validate_s.png
new file mode 100644
index 000000000..400bf8a24
--- /dev/null
+++ b/template/yoga/icon/validate_s.png
diff --git a/template/yoga/theme/Sylvia/theme.css b/template/yoga/theme/Sylvia/theme.css
index 4ef7fd3fa..e7cedf685 100644
--- a/template/yoga/theme/Sylvia/theme.css
+++ b/template/yoga/theme/Sylvia/theme.css
@@ -58,7 +58,7 @@ padding: 0 0 0 10px; margin: 0; }
 .content .thumbnailCategory div.illustration a { display: block; margin: 0; padding:20px 0 0 8px; }
 #content .thumbnailCategory div.description { background:transparent url(images/cat_top-right.gif) no-repeat scroll right top;
 margin: 0; padding:15px 10px 3px 0; overflow: hidden; }
-#content .thumbnailCategory div.border { background:transparent url(images/cat_bottom-right.gif) no-repeat scroll right bottom;
+
 height:7px; margin:0; overflow:hidden; padding:0; width:100%; }
 #content .thumbnailCategory div.description .text { display:block; margin:10px 2px 0 0;
 overflow: auto; overflow-x:hidden; padding:0 0 5px;  /* Only IE family supports colored scrollbar */
@@ -90,6 +90,7 @@ border: 1px solid #666;	/* thumbnails border color and style */
 border-radius: 4px 4px;	/* round corners with CSS3 compliant browsers */ }
 .content UL.thumbnails SPAN.wrap2:hover { color: #666;
 background-color: #111; border:1px solid #ff3363;	/* thumbnails border color when mouse cursor is over it */ }
+#comments ul.actions li, #comments ul.actions li:hover { background:transparent none; padding: 0 22px; clear:both; }
 A, INPUT.rateButton { color:#f70; border-width: 0; }
 A:hover, A:active { color: #f33; border-bottom: 1px solid #f33; cursor: pointer; }
 #theImage A, .illustration A, A.navThumb, A.navThumb { border-bottom-width: 0; }