- further reduce css rules and remove unused ones

- added a smarty prefilter so that html output is nicely indented now ...

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

11 files changed, 74 insertions, 130 deletions

diff --git a/template-common/default-layout.css b/template-common/default-layout.css
index 2355d39f3..fb030f5a1 100644
--- a/template-common/default-layout.css
+++ b/template-common/default-layout.css
@@ -27,9 +27,6 @@ BODY#thePopuphelpPage {
 .content DIV.thumbnailCategory DIV.description {
   height: 140px;    /* max thumbnail height + 2px */
 }
-DIV#comments DIV.comment A.illustration {
-	width: 140px; /*maximum thumbnail width + ~5px */
-}
 
 
 /* Category thumbnails on main page */
diff --git a/template/yoga/comment_list.tpl b/template/yoga/comment_list.tpl
index 334b07a1a..320f79717 100644
--- a/template/yoga/comment_list.tpl
+++ b/template/yoga/comment_list.tpl
@@ -1,32 +1,37 @@
 {* $Id$ *}
 {foreach from=$comments item=comment}
-	<div class="comment" >
-	  {if isset($comment.TN_SRC)}
-	  	<a class="illustration" href="{$comment.U_PICTURE}"><img src="{$comment.TN_SRC}" alt="{$comment.ALT}" /></a>
-	  {/if}
-		<div class="commentHeader">
+	<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>
+				<li>
 					<a href="{$comment.U_DELETE}" title="{'comments_del'|@translate}">
-						<img src="{$ROOT_URL}{$themeconf.icon_dir}/delete.png" class="button" alt="[{'delete'|@translate}]"/>
+						<img src="{$ROOT_URL}{$themeconf.icon_dir}/delete.png" class="button" alt="[delete]" />
 					</a>
-					</li>{/if}
-
+				</li>
+				{/if}
 				{if isset($comment.U_VALIDATE)}
-					<li>
+				<li>
 					<a href="{$comment.U_VALIDATE}" title="validate this comment">
-						<img src="{$ROOT_URL}{$themeconf.icon_dir}/validate_s.png" class="button" alt="[validate]"/>
+						<img src="{$ROOT_URL}{$themeconf.icon_dir}/validate_s.png" class="button" alt="[validate]" />
 					</a>
-					</li>{/if}
+				</li>
+				{/if}
 			</ul>
 			{/if}
 			<span class="author">{$comment.AUTHOR}</span> - <span class="date">{$comment.DATE}</span>
+			<blockquote>{$comment.CONTENT}</blockquote>
 		</div>
-
-		<blockquote>{$comment.CONTENT}</blockquote>
 	</div>
+	{if isset($comment_separator)}
 	<hr/>
+	{/if}
 {/foreach}
-
diff --git a/template/yoga/content.css b/template/yoga/content.css
index ab82321f9..40aa4a37d 100644
--- a/template/yoga/content.css
+++ b/template/yoga/content.css
@@ -73,24 +73,6 @@ UL.categoryActions {
 	margin-bottom: -5px;
 }
 
-/* User comments */
-
-DIV#comments {
-	padding-left: 5px;
-	padding-right: 5px;
-}
-
-DIV#comments HR {
-	clear:both;
-}
-
-DIV#comments DIV.comment A.illustration {
-	display: block;
-	float: left;
-	margin: 0.5em 1em 0 0.5em;
-	width: 140px;
-}
-
 /* begin chronology/calendar elements*/
 .content DIV.calendarViews {
 	display: block;
@@ -209,3 +191,14 @@ DIV.calImg {
 	margin: 2px 0 0 2px;
 	float: left;
 }
+
+
+/* User comments */
+DIV#comments {
+	padding-left: 5px;
+	padding-right: 5px;
+}
+
+DIV#comments DIV.description {
+	font-size: 100%;
+}
diff --git a/template/yoga/menubar.css b/template/yoga/menubar.css
index 94f1d0a56..a69109593 100644
--- a/template/yoga/menubar.css
+++ b/template/yoga/menubar.css
@@ -10,7 +10,7 @@
 }
 
 #menubar .button {
-	margin: 0 2px;
+	margin: 2px 2px ;
 	width: auto;
 	padding: 0;
 	text-indent: 0;
diff --git a/template/yoga/not-ie.css b/template/yoga/not-ie.css
index 0a4bfe618..c39e4cfa0 100644
--- a/template/yoga/not-ie.css
+++ b/template/yoga/not-ie.css
@@ -7,7 +7,3 @@
   -moz-border-radius: 4px;	/* round corners with Geko */
   -webkit-border-radius: 4px; /* Safari webkit project */
 }
-ul.tabsheet li {
-  -moz-border-radius: 6px 6px 0px 0px;	/* round corners with Geko */
-  -webkit-border-radius: 6px 6px 0px 0px; /* Safari webkit project */
-}
diff --git a/template/yoga/picture.tpl b/template/yoga/picture.tpl
index fa76a7e01..9ba9d6ffa 100644
--- a/template/yoga/picture.tpl
+++ b/template/yoga/picture.tpl
@@ -244,28 +244,29 @@ y.callService(
 
 {if isset($COMMENT_COUNT)}
 <div id="comments">
-  <h2>[{$COMMENT_COUNT}] {'comments_title'|@translate}</h2>
+	<h3>[{$COMMENT_COUNT}] {'comments_title'|@translate}</h3>
 
-  <div class="navigationBar">{$COMMENT_NAV_BAR}</div>
+	{if !empty($COMMENT_NAV_BAR)}
+	<div class="navigationBar">{$COMMENT_NAV_BAR}</div>
+	{/if}
 
-  {if isset($comments)}
-		{include file='comment_list.tpl'}
-  {/if}
-
-  {if isset($comment_add)}
-  <form  method="post" action="{$comment_add.F_ACTION}" class="filter" id="addComment">
-    <fieldset>
-      <legend>{'comments_add'|@translate}</legend>
-      {if $comment_add.SHOW_AUTHOR}
-      <label>{'upload_author'|@translate}<input type="text" name="author"></label>
-      {/if}
-      <label>{'comment'|@translate}<textarea name="content" rows="5" cols="80">{$comment_add.CONTENT}</textarea></label>
-      <input type="hidden" name="key" value="{$comment_add.KEY}" />
-      <input class="submit" type="submit" value="{'Submit'|@translate}">
-    </fieldset>
-  </form>
-  {/if}
+	{if isset($comments)}
+		{include file='comment_list.tpl' comment_separator=true}
+	{/if}
 
+	{if isset($comment_add)}
+	<form  method="post" action="{$comment_add.F_ACTION}" class="filter" id="addComment">
+	<fieldset>
+		<legend>{'comments_add'|@translate}</legend>
+		{if $comment_add.SHOW_AUTHOR}
+		<label>{'upload_author'|@translate}<input type="text" name="author"></label>
+		{/if}
+		<label>{'comment'|@translate}<textarea name="content" rows="5" cols="80">{$comment_add.CONTENT}</textarea></label>
+		<input type="hidden" name="key" value="{$comment_add.KEY}" />
+		<input class="submit" type="submit" value="{'Submit'|@translate}">
+	</fieldset>
+	</form>
+	{/if}
 </div>
 {/if} {*comments*}
 
diff --git a/template/yoga/theme/clear/theme.css b/template/yoga/theme/clear/theme.css
index 033073494..0b65b6647 100644
--- a/template/yoga/theme/clear/theme.css
+++ b/template/yoga/theme/clear/theme.css
@@ -3,16 +3,16 @@
 /* text color */
 BODY, H1, H2, H3, DT,
 INPUT.rateButtonSelected /* <= why IE doesn't inherit this ? */ {
-  color:#696969;	/* dimgray */
+	color:#696969;	/* dimgray */
 }
 
 /* backgrounds */
-BODY, H3, .throw {
-  background-color: #ffffff;	/* white */
+BODY, H3 {
+	background-color: #ffffff;	/* white */
 }
 
-H2, #menubar DT, #imageHeaderBar, #imageToolBar A:hover, .row1 {
-  background-color: #d3d3d3;
+H2, #menubar DT, #imageHeaderBar, #imageToolBar A:hover {
+	background-color: #d3d3d3;
 }
 
 #menubar DL, .content, #imageToolBar, .header_notes {
@@ -33,7 +33,6 @@ H2, #menubar DT, #imageHeaderBar, #imageToolBar A:hover, .row1 {
 }
 
 FIELDSET, INPUT, SELECT, TEXTAREA,
-.content DIV.comment  A.illustration IMG,
 .content DIV.thumbnailCategory {
   border: 1px solid gray;
 }
@@ -80,8 +79,3 @@ SPAN.calItem, SPAN.calItemEmpty
 #qsearchInput:focus { color: #005e89; }
 
 
-UL.tabsheet LI.normal_tab { background-color: #d3d3d3; }
-UL.tabsheet LI.selected_tab { background-color: #eeeeee; }
-
-UL.tabsheet, UL.tabsheet LI {border-color: gray;}
-UL.tabsheet LI.normal_tab:hover { border-color: black; }
diff --git a/template/yoga/theme/dark/theme.css b/template/yoga/theme/dark/theme.css
index f89c42a27..959f36f07 100644
--- a/template/yoga/theme/dark/theme.css
+++ b/template/yoga/theme/dark/theme.css
@@ -6,22 +6,22 @@ INPUT.rateButtonSelected /* <= why IE doesn't inherit this ? */ {
 	color:#d0d0d0;
 }
 
-H2, #menubar DT, .throw {
+H2, #menubar DT {
 	color: #fff48e;
 }
 
 
 /* backgrounds */
 
-BODY, H3, #imageHeaderBar, #imageToolBar A:hover, .row1, UL.tabsheet LI.normal_tab {
+BODY, H3, #imageHeaderBar, #imageToolBar A:hover {
 	background-color: #2f2f2f;
 }
 
-#menubar DL, .content, #imageToolBar, .header_notes, UL.tabsheet LI.selected_tab {
+#menubar DL, .content, #imageToolBar, .header_notes {
 	background-color: #505050;
 }
 
-H2, #menubar DT, .throw {
+H2, #menubar DT {
 	background-image: url(images/tableh1_bg.png);
 }
 
@@ -50,7 +50,6 @@ H2, #menubar DT, #imageToolBar {
 }
 
 FIELDSET, INPUT, SELECT, TEXTAREA,
-.content DIV.comment  A.illustration IMG,
 .content DIV.thumbnailCategory {
 	border: 1px solid gray;
 }
@@ -68,7 +67,6 @@ FIELDSET, INPUT, SELECT, TEXTAREA,
 	color: black;
 }
 
-UL.tabsheet LI.normal_tab:hover { border-color: #fff48e; }
 
 /* links */
 A, INPUT.rateButton {
diff --git a/template/yoga/theme/p0w0/theme.css b/template/yoga/theme/p0w0/theme.css
index d7fd45003..98a165292 100644
--- a/template/yoga/theme/p0w0/theme.css
+++ b/template/yoga/theme/p0w0/theme.css
@@ -17,8 +17,8 @@
 
 /******************************************************************************/
 /* Texts Only */
-BODY, H1, H3, DT, H2, .throw { color: #369; }
-H2, #menubar DT, .throw, TD H3 {
+BODY, H1, H3, DT, H2 { color: #369; }
+H2, #menubar DT, TD H3 {
   color: #fff;
 }
 #menubar DT, #menubar DT A {
@@ -71,7 +71,7 @@ input.rateButtonSelected,
  font-weight: normal;
  letter-spacing: 0em;
 }
-#thePicturePage #comments H2 {
+#thePicturePage #comments H3 {
   color: #69c;
 }
 .content ul.thumbnailCategories li div.thumbnailCategory .description p {
@@ -80,11 +80,10 @@ input.rateButtonSelected,
 .content ul.thumbnailCategories li div.thumbnailCategory .description p + p {
   color: #369;
 }
-.tabsheet li, .tabsheet li a,
 .content div.thumbnailCategory .description h3 a {
   color: #fff;
 }
-.tabsheet li a:hover, .content div.thumbnailCategory .description h3 a:hover {
+.content div.thumbnailCategory .description h3 a:hover {
   color: #f92;
 }
 
@@ -97,15 +96,14 @@ BODY { background: #cde; }
 #thePicturePage #theImage,
 .content { background-color: #dfe8ff; }
 #the_page { background-color: #dfe8ff; }
-#menubar, H3, #imageHeaderBar,
-.row1  { background-color: #eef; }
-H2, #menubar DT, .throw, TD H3,
+#menubar, H3, #imageHeaderBar { background-color: #eef; }
+H2, #menubar DT, TD H3,
 #imageToolBar,
-#imageHeaderBar, #imageHeaderBar H2, .tabsheet li,
+#imageHeaderBar, #imageHeaderBar H2,
 .content H2 { background-color: #369; }
 .content .infos { background-color: #47a; ;}
 .content .errors { background-color: #fc5; ;}
-#thePicturePage #comments H2 { background-color: #eef; ;}
+#thePicturePage #comments H3 { background-color: #eef; ;}
 .content ul.thumbnailCategories li div.thumbnailCategory .description h3 {
   background-color: #69c; 
 }
@@ -119,7 +117,6 @@ H2, #menubar DT, .throw, TD H3,
 }
 input#qsearchInput { background-color: #cde; }
 .virtual_cat { background: #fff !important; }
-.selected_tab { background-color: #69c !important; }
 /******************************************************************************/
 /* Borders, Margins, Padding Only */
 BODY { margin: 0px;  padding: 0px; }
@@ -158,7 +155,7 @@ A:hover { text-decoration: none; border: 0px; }
   margin: 0px;
   padding: 3px 0px 15px 0px;
 }
-#thePicturePage #comments H2 {
+#thePicturePage #comments H3 {
   border-top: 2px solid #69c;
   border-bottom: 1px solid #369;
 }
@@ -180,7 +177,6 @@ H2, #imageToolBar {
   border: 0px;
 }
 FIELDSET, INPUT, SELECT, TEXTAREA,
-.content DIV.comment  A.illustration IMG,
 .content DIV.thumbnailCategory {
   border: 1px solid #69c;
   background-color: #dfe8ff;
@@ -205,8 +201,6 @@ A.navThumb, A.navThumb:hover,
   padding: 5px 0px 30px 0px;
   margin: 0px;
 }
-ul.tabsheet, ul.tabsheet li { border-color: #369 !important; }
-.tabsheet li:hover { border-color: #f92 !important; }
 
 /******************************************************************************/
 /* Display, Visibility, buttons and others */
@@ -253,5 +247,3 @@ input.submit:active {
 }
 * { outline: none; }
 
-tr.throw td a { color: #fff; }
-tr.throw td a:focus { color: #f92; }
\ No newline at end of file
diff --git a/template/yoga/theme/wipi/theme.css b/template/yoga/theme/wipi/theme.css
index 60829051c..880153011 100644
--- a/template/yoga/theme/wipi/theme.css
+++ b/template/yoga/theme/wipi/theme.css
@@ -10,7 +10,7 @@ INPUT.rateButtonSelected /* <= why IE doesn't inherit this ? */ {
   background-color: transparent;
   border: 0px;
 }
-H2, .throw {
+H2 {
   color: #eee;
 }
 #menubar DT, #menubar DT A {
@@ -62,7 +62,7 @@ BODY {
   margin: 0px;
   padding: 0px;
 }
-H3, #imageToolBar A:hover, .row1, .tabsheet li  {
+H3, #imageToolBar A:hover {
   background-color: #222;
 }
 
@@ -72,7 +72,6 @@ H3, #imageToolBar A:hover, .row1, .tabsheet li  {
 #imageToolBar, .header_notes {
   background-color: #333;
 }
-.selected_tab { background-color: eee !important; }
 A {
   border-color: #69c;
 }
@@ -85,7 +84,7 @@ A:hover {
   padding: 5px;
 }
 
-H2, #menubar DT, .throw, TD H3 {
+H2, #menubar DT, TD H3 {
   background-image: url(images/tableh1_bg.png);
   background-repeat: repeat-x;
 }
@@ -145,7 +144,7 @@ H2, #menubar DT, .throw, TD H3 {
   padding: 3px 0px 15px 0px;
 }
 
-#thePicturePage #comments H2 {
+#thePicturePage #comments H3 {
   background-image: none;
   background-color: #222;
   border-top: 2px solid #69c;
@@ -174,7 +173,6 @@ H2, #imageToolBar {
   border: 0px;
 }
 FIELDSET, INPUT, SELECT, TEXTAREA,
-.content DIV.comment  A.illustration IMG,
 .content DIV.thumbnailCategory {
   border: 1px solid gray;
 }
@@ -194,15 +192,6 @@ FIELDSET, INPUT, SELECT, TEXTAREA,
   border-color: #69c;		/* thumbnails border color when mouse cursor is over it */
 }
 
-#menubar .buttonmenu {
-  margin: 0 2px;
-  width: auto;
-  padding: 0;
-  text-indent: 0;
-  list-style: none;
-  text-align: center;
-  float: left;
-}
 /* links */
 A, INPUT.rateButton, legend {
   color: #69c;
@@ -286,16 +275,3 @@ a.PWG:hover .G { color : #f92; }
 #menubar .menuInfoCatByChild,
 h2.showtitle, #theImage p.showlegend { display: none }
 * { outline-width: 0px; }
-ul.tabsheet, ul.tabsheet li {
-  border-color: #69c;
-}
-ul.tabsheet li.normal_tab {
-  background-image: url(images/tableh1_bg.png);
-  background-repeat: repeat-x;
-}
-ul.tabsheet li.normal_tab:hover { border-color: #f92 }
-ul.tabsheet li {
-  -moz-border-radius: 0px 0px 3px 3px;
-  border-radius:  0px 0px 12px 12px;
-  -webkit-border-radius: 0px 0px 3px 3px;
-}
diff --git a/template/yoga/thumbnails.css b/template/yoga/thumbnails.css
index 8d02e7742..a50b59253 100644
--- a/template/yoga/thumbnails.css
+++ b/template/yoga/thumbnails.css
@@ -50,11 +50,3 @@
   left: 2px;
   top: 2px;
 }
- 
-UL.thumbnails .levelIndicatorB {
-display:block; position:absolute; z-index:100;padding:0px 0 0 14px; color:black; font-weight:bold; fontsize:120%;
-}
-
-UL.thumbnails .levelIndicatorF {
-display:block; position:absolute; z-index:101;padding:1px 0 0 15px; color:white; font-weight:bold; fontsize:120%;
-}
\ No newline at end of file