feature 2588: rename css classes 'thumbnailCategories' and 'thumbnailCategory' on comment_list.tpl

git-svn-id: http://piwigo.org/svn/trunk@13697 68402e56-0260-453c-a942-63ccdbb3a9ee
This commit is contained in:
mistic100 2012-03-24 20:33:18 +00:00
commit bab1dbfcfb
6 changed files with 85 additions and 29 deletions

View file

@ -2,7 +2,7 @@
.content .thumbnailCategory div.illustration {
width:165px !important; /* Usable range 162px-360px , optimal : Thumbnail width + 40px */
}
#comments .thumbnailCategory div.illustration {
#comments .commentElement div.illustration {
width:220px !important; /* Usable range 219px-360px , optimal : Thumbnail width + 95px */
}
@ -266,31 +266,43 @@
}
/* User comments */
#theCommentsPage .content .thumbnailCategories li,
#theCommentsPage .content .thumbnailCategory ,
#theCommentsPage .content .thumbnailCategory .description,
#theCommentsPage .content .thumbnailCategory div.illustration {
background-image: none;
#comments {
padding: 0 0 5px 10px;
}
#theCommentsPage .content .thumbnailCategory {
.content .commentsList li {
padding: 0 0;
margin:0;
}
.content .commentElement {
padding: 15px 2px 6px 12px;
margin:0;
border: 1px solid #666;
}
#theCommentsPage .content .odd {
.content .commentElement.odd {
background-color: #222;
border-top:0 !important;
}
#theCommentsPage .content .even {
.content .commentElement.even {
background-color: #111;
}
#theCommentsPage .content .thumbnailCategories li:hover {
background-color: transparent;
.content .commentElement div.illustration {
padding: 0 0 0 10px;
margin: 0 !important;
}
#theCommentsPage #comments {
padding: 0 0 5px 10px;
.content .commentElement div.illustration a {
display: block;
margin: 0;
padding:20px 0 0 8px;
border:0;
}
.content .commentElement .description {
margin: 0;
padding:15px 10px 3px 0;
overflow-x: hidden !important;
height:158px;
}
#comments .thumbnailCategories hr {display:none;}
#comments .commentsList hr {display:none;}
#comments .filter input[type="submit"] { margin-top:1.8em; }
/* Thumbnails */
@ -339,14 +351,14 @@
background-image: url('icon/rating-stars.gif');
}
#thePicturePage .thumbnailCategory {
#thePicturePage .commentElement {
padding: 15px 2px 6px 12px;
border: 1px solid #666;
}
#thePicturePage .thumbnailCategory .date, #thePicturePage .thumbnailCategory .author {
#thePicturePage .commentElement .date, #thePicturePage .commentElementy .author {
font-weight:bold;
}
#thePicturePage .thumbnailCategories {
#thePicturePage .commentsList {
padding-left: 12px;
padding-right: 12px;
}

View file

@ -33,7 +33,8 @@ H2, #menubar DT, #imageHeaderBar, #imageToolBar A:hover {
}
FIELDSET, INPUT, SELECT, TEXTAREA,
.content .thumbnailCategory {
.content .thumbnailCategory,
.content .commentElement {
border: 1px solid gray;
}
@ -43,7 +44,9 @@ FIELDSET, INPUT, SELECT, TEXTAREA,
.thumbnails .wrap2:hover,
.content .thumbnailCategories .thumbnailCategory:hover,
.content .thumbnailCategories .thumbnailCategory:hover A {
.content .thumbnailCategories .thumbnailCategory:hover A,
.content .commentsList .commentElement:hover,
.content .commentsList .commentElement:hover A {
background-color: #faebd7;
border-color: yellow; /* thumbnails border color when mouse cursor is over it */
color: black;

View file

@ -40,13 +40,15 @@ BODY, H3, #imageToolBar A:hover {
FIELDSET, INPUT, SELECT, TEXTAREA,
.content .thumbnailCategory ,
.content .commentElement ,
.thumbnails .wrap2 {
border: 1px solid gray;
}
.thumbnails .wrap2:hover,
.content .thumbnailCategories .thumbnailCategory:hover{
.content .thumbnailCategories .thumbnailCategory:hover,
.content .commentsList .commentElement:hover{
border-color: yellow; /* thumbnails border color when mouse cursor is over it */
}

View file

@ -1,18 +1,18 @@
{if isset($comment_derivative_params)}
{strip}{html_style}
.thumbnailCategory DIV.illustration{ldelim}
.commentElement DIV.illustration{ldelim}
width: {$comment_derivative_params->max_width()+5}px;
}
.content .thumbnailCategory .description{ldelim}
.content .commentElement .description{ldelim}
height: {$comment_derivative_params->max_height()+5}px;
}
{/html_style}{/strip}
{/if}
<ul class="thumbnailCategories">
<ul class="commentsList">
{foreach from=$comments item=comment name=comment_loop}
<li>
<div class="thumbnailCategory {if $smarty.foreach.comment_loop.index is odd}odd{else}even{/if}">
<div class="commentElement {if $smarty.foreach.comment_loop.index is odd}odd{else}even{/if}">
{if isset($comment.src_image)}
<div class="illustration">
<a href="{$comment.U_PICTURE}">

View file

@ -261,8 +261,49 @@ TD.calDayHead {
padding-right: 5px;
}
#comments .description {
.commentsList {
margin: 0;
padding: 0;
list-style: none;
overflow: hidden;
width: 100%;
}
.commentsList LI {
margin: 0;
padding: 0;
float: left;
width:99%;
}
.commentElement {
display:block;
padding: 2px 0 0 2px;
margin: 5px;
}
.commentElement .description {
font-size: 100%;
overflow: auto;
/*width: inherit;*/
}
.commentElement .description H3 {
text-align: left;
background: transparent;
margin: 0;
padding: 0.1em;
font-size: 120%;
}
.commentElement .description P {
margin: 0;
}
.commentElement DIV.illustration {
text-align: left;
margin: 2px 0 0 2px;
float: left;
}
/* Thumbnails */
@ -673,8 +714,6 @@ TABLE.tagLetterContent {
#theHeader {text-align: center;}
#comments .thumbnailCategories LI { width:99%; }
/* jQuery datepicker */
IMG.ui-datepicker-trigger {
cursor : pointer;

View file

@ -122,7 +122,7 @@ FIELDSET, INPUT, SELECT, TEXTAREA {
.thumbnails IMG {margin-bottom:0; vertical-align:middle;}
.thumbnailCategory DIV.illustration {margin: 2px; text-align:center;}
.thumbnailCategory DIV.illustration, .commentElement DIV.illustration {margin: 2px; text-align:center;}
/* picture page */
#thePicturePage {background-color:#111;}
@ -153,7 +153,7 @@ FIELDSET, INPUT, SELECT, TEXTAREA {
#thePicturePage .comments_toggle_off:before {content:'(-) '}
.comments_hidden ul, .comments_hidden form {display:none;}
.thumbnailCategory {background-color: #333;}
.thumbnailCategory, .commentElement {background-color: #333;}
.comments_toggle {cursor: pointer;}
.comments_toggle:hover {color:#fff;}