Files
Piwigo/template/cclear/content.css
plegall b08df04688 - modification : adaptation of template variables and blocks in comments
page to display comment by comment instead of picture by picture.

- [template cclear] comments.tpl copied and adapted from template
  default. Return to home new icon. As asked by chrisaga, special id
  #commentsPage in comments.tpl to set the #content margin-left to 0 (since
  no #menubar to display).

- [template cclear] FORM.filter rules taken from template default (these
  rules have been written some time ago by yoDan.

- [template cclear] bug fixed on #theImage : display:block must be used only
  on IMG and not on the P>A (yes, in BSF you can have HTML in picture and
  categories descriptions)


git-svn-id: http://piwigo.org/svn/trunk@848 68402e56-0260-453c-a942-63ccdbb3a9ee
2005-08-21 21:23:17 +00:00

158 lines
3.2 KiB
CSS

/* $Id$ */
#content {
margin-left: 14em;
margin-right: 1em;
margin-bottom: 1em; /* when it's longer than menu bar */
}
#commentsPage #content {
margin: 1em;
}
#content H2 {
margin-bottom: 1ex;
}
#content H3 {
margin-bottom: 1ex;
}
#content UL.thumbnails {
margin: 0; padding: 0;
list-style-type: none;
text-align: center; /*eventuellement */
}
#content LI.thumbnails {
display: inline;
padding: 0; text-indent: 0;
margin: 0 10px 10px 10px;
}
#content UL.thumbnails UL {
margin: 0; padding: 0; text-indent: 0;
list-style-type: none;
}
#content UL.thumbnails UL LI {
text-align: center;
}
#content UL.thumbnails div {
margin: 0;
vertical-align: top; /*geko doesn't eat that :-(*/
text-align: center;
width: 128px;
}
/* IE block level element inline-block hack */
* html #content UL.thumbnails div {display:inline-block;}
* html #content UL.thumbnails div {display:inline;}
/* end of IE hack*/
/* for non-IE */
#content UL.thumbnails li>div {display:table-cell;display:inline-table;}
/* Geko hack to get thumbnails top aligned*/
/* not proud of that still looking for a better one */
#content UL.thumbnails li>div {height:150px;}
/* endof Geko hack*/
/* align top with geko */
/*#content UL.thumbnails li>div>div {
display: block;
position: relative;
height:128px;
}
#content UL.thumbnails li>div>div>a { position: absolute; top: 0; }
#content UL.thumbnails li>div img.thumbnail { position: relative; left: -50%; }
#content UL.thumbnails li>div ul {position: absolute; bottom: 0;}
doesn't work :-((*/
/*#content UL.thumbnails LI>SPAN { vertical-align: baseline; }*/
#content UL.thumbnails LI IMG.thumbnail { margin-bottom: .4ex; }
#content UL.thumbnails IMG.thumbnail { border: 1px solid #000000; }
/*#content UL.thumbnails SPAN A:first-child { border: none }*/
#content .navigationBar, #content .additional_info {
margin: 10px 0;
text-align: center;
}
#content .pageNumberSelected {
font-style: italic;
}
#content .additional_info {
font-size: 110%;
}
#content FORM {
text-align: left;
}
/* content defaults */
#content dl, dd { margin: 10px; }
#content dt {
margin-bottom: 5px;
font-style: italic;
font-size: 110%;
}
/* actions */
ul.categoryActions {
text-align: center;
margin: 1px 1px 0 0;
padding: 0;
text-indent: 0;
}
#content div.titrePage ul.categoryActions {
float: right;
}
#content ul.categoryActions>li {
display: inline;
}
#content ul.categoryActions a img, ul.categoryActions a {
border: none;
}
/* User comments */
#content DIV.comment {
margin: 5px;
border: 1px solid gray;
}
#content DIV.comment > A.illustration {
display: block;
float: left;
margin: 5px;
}
#content DIV.comment > A.illustration IMG {
border: 1px solid gray;
}
#content DIV.comment P.commentHeader {
text-align: right;
margin: 0.5em 0.5em 0 0;
}
#content DIV.comment UL.actions {
text-align: center;
margin: 0.2em;
clear: left;
}
#content DIV.comment > UL.actions > LI {
display: inline;
}
#content DIV.comment BLOCKQUOTE {
margin: 1em 1em 1em 150px; /* margin-left corresponds to maximum thumbnail width */
border: 1px solid #d3d3d3;
border-left: 2px solid gray;
padding: 0.5em;
}