Changeset 847 for trunk/template


Ignore:
Timestamp:
Aug 21, 2005, 1:32:12 PM (19 years ago)
Author:
plg
Message:
  • new way to display picture informations (template variables instead of template generic blocks)
  • new color for A:hover and its solid border-bottom, dotted border-bottom for A (same color as link color)
  • background color and border color for form input fields (input, select, textarea) to accentuate contrast with page background.
  • clear:both on #imageHeaderBar H1 let it be center on page
  • in infoTable keys are right aligned and values are left aligned (more beautiful, isn't it?)
  • add "set as representative" button to cclear template in picture.tpl. representative.png picture taken from Gorilla theme.
  • invisible horizontal rule on picture.tpl to separate user comments from the beginning of the page
Location:
trunk/template/cclear
Files:
5 edited

Legend:

Unmodified
Added
Removed

  • trunk/template/cclear/default-colors.css

    r837 r847  
    2626
    2727A:hover {
    28     color: #754300;
     28    color: #858460;
    2929}
    3030
    … …  
    115115input, select, textarea {
    116116        color:black;
    117         background-color:#eee;
     117        background-color: lightgrey;
     118        border: 1px solid gray;
    118119}
    119120.bouton {

  • trunk/template/cclear/default-layout.css

    r844 r847  
    3636A {
    3737    text-decoration:none;
    38     /*border-bottom: 1px dotted #000000;*/
     38    border-bottom: 1px dotted #005e89;
    3939}
    4040A:hover {
    41     border-bottom-style: solid;
     41    border-bottom: 1px solid #858460;
    4242}
    4343
    4444IMG {
    4545    border: none;
     46}
     47
     48HR.separation {
     49  visibility: hidden;
     50  clear: both;
    4651}
    4752

  • trunk/template/cclear/image.css

    r820 r847  
    88#imageHeaderBar H1 {
    99    margin: 1ex 0; /* override default-layout for less bottom-margin */
     10    clear: both;
    1011}
    1112
    … …  
    7475    margin: auto;
    7576}
    76 TABLE.infoTable TD {
     77TABLE.infoTable .value {
    7778    text-align: left;
    7879}
    … …  
    8081TABLE.infoTable .label {
    8182    font-weight: bold;
     83    text-align: right;
     84    padding-right: 0.5em;
     85}
     86
     87TABLE.infoTable TD.value UL {
     88  margin: 0;
     89  padding: 0 0 0 1.5em;
     90  list-style-type: square;
    8291}
    8392

  • trunk/template/cclear/picture.tpl

    r820 r847  
    1111<div id="imageToolBar">
    1212<div class="randomButtons">
    13   <a href="{U_SLIDESHOW}" title="{L_SLIDESHOW}">
    14     <img src="template/cclear/theme/slideshow.png" alt="{L_SLIDESHOW}">
    15   </a>
    16   <a href="{U_METADATA}" title="{L_PICTURE_METADATA}">
    17     <img src="template/cclear/theme/metadata.png" alt="{L_PICTURE_METADATA}">
    18   </a>
     13  <a href="{U_SLIDESHOW}" title="{L_SLIDESHOW}"><img src="template/cclear/theme/slideshow.png" alt="{L_SLIDESHOW}"></a>
     14  <a href="{U_METADATA}" title="{L_PICTURE_METADATA}"><img src="template/cclear/theme/metadata.png" alt="{L_PICTURE_METADATA}"></a>
     15<!-- BEGIN representative -->
     16  <a href="{representative.URL}" title="{lang:set as category representative}"><img src="template/cclear/theme/representative.png" alt="{lang:representative}" /></a>
     17<!-- END representative -->
    1918<!-- BEGIN favorite -->
    20   <a href="{favorite.U_FAVORITE}" title="{favorite.FAVORITE_HINT}">
    21     <img src="{favorite.FAVORITE_IMG}" alt="{favorite.FAVORITE_ALT}">
    22   </a>
     19  <a href="{favorite.U_FAVORITE}" title="{favorite.FAVORITE_HINT}"><img src="{favorite.FAVORITE_IMG}" alt="{favorite.FAVORITE_ALT}"></a>
    2320<!-- END favorite -->
    2421<!-- BEGIN download -->
    25   <a href="{download.U_DOWNLOAD}" title="{L_DOWNLOAD}">
    26     <img src="template/cclear/theme/save.png" alt="{L_DOWNLOAD}">
    27   </a>
     22  <a href="{download.U_DOWNLOAD}" title="{L_DOWNLOAD}"><img src="template/cclear/theme/save.png" alt="{L_DOWNLOAD}"></a>
    2823<!-- END download -->
    2924<!-- BEGIN admin -->
    30   <a href="{U_ADMIN}" title="{L_ADMIN}">
    31     <img src="template/cclear/theme/preferences.png" alt="{L_ADMIN}">
    32   </a>
     25  <a href="{U_ADMIN}" title="{L_ADMIN}"><img src="template/cclear/theme/preferences.png" alt="{L_ADMIN}"></a>
    3326<!-- END admin -->
    3427</div>
    3528<div class="navButtons">
    3629<!-- BEGIN next -->
    37   <a class="navButton next" href="{next.U_IMG}" title="{L_NEXT_IMG}{next.TITLE_IMG}">
    38     <img src="template/cclear/theme/right.png" alt="next">
    39   </a>
     30  <a class="navButton next" href="{next.U_IMG}" title="{L_NEXT_IMG}{next.TITLE_IMG}"><img src="template/cclear/theme/right.png" alt="next"></a>
    4031<!-- END next -->
    41   <a class="navButton up" href="{U_UP}" title="{L_UP_HINT}">
    42     <img src="template/cclear/theme/up.png" alt="{L_UP_ALT}">
    43   </a>
     32  <a class="navButton up" href="{U_UP}" title="{L_UP_HINT}"><img src="template/cclear/theme/up.png" alt="{L_UP_ALT}"></a>
    4433<!-- BEGIN previous -->
    45   <a class="navButton prev" href="{previous.U_IMG}" title="{L_PREV_IMG}{previous.TITLE_IMG}">
    46     <img src="template/cclear/theme/left.png" alt="previous">
    47   </a>
     34  <a class="navButton prev" href="{previous.U_IMG}" title="{L_PREV_IMG}{previous.TITLE_IMG}"><img src="template/cclear/theme/left.png" alt="previous"></a>
    4835<!-- END previous -->
    4936</div>
    50 </div>
     37</div> <!-- imageToolBar -->
    5138
    5239<div id="theImage">
    … …  
    8168
    8269<table class="infoTable" summary="Some info about this picture">
    83   <!-- BEGIN info_line -->
    8470  <tr>
    85     <td class="label">{info_line.INFO} :</td>
    86     <td class="value">{info_line.VALUE}</td>
     71    <td class="label">{lang:Author}</td>
     72    <td class="value">{INFO_AUTHOR}</td>
    8773  </tr>
    88   <!-- END info_line -->
     74  <tr>
     75    <td class="label">{lang:Created on}</td>
     76    <td class="value">{INFO_CREATION_DATE}</td>
     77  </tr>
     78  <tr>
     79    <td class="label">{lang:Registered on}</td>
     80    <td class="value">{INFO_AVAILABILITY_DATE}</td>
     81  </tr>
     82  <tr>
     83    <td class="label">{lang:Dimensions}</td>
     84    <td class="value">{INFO_DIMENSIONS}</td>
     85  </tr>
     86  <tr>
     87    <td class="label">{lang:File}</td>
     88    <td class="value">{INFO_FILE}</td>
     89  </tr>
     90  <tr>
     91    <td class="label">{lang:Filesize}</td>
     92    <td class="value">{INFO_FILESIZE}</td>
     93  </tr>
     94  <tr>
     95    <td class="label">{lang:Keywords}</td>
     96    <td class="value">{INFO_KEYWORDS}</td>
     97  </tr>
     98  <tr>
     99    <td class="label">{lang:Categories}</td>
     100    <td class="value">
     101      <ul>
     102        <!-- BEGIN category -->
     103        <li>{category.LINE}</li>
     104        <!-- END category -->
     105      </ul>
     106    </td>
     107  </tr>
     108  <tr>
     109    <td class="label">{lang:Visits}</td>
     110    <td class="value">{INFO_VISITS}</td>
     111  </tr>
     112  <!-- BEGIN info_rate -->
     113  <tr>
     114    <td class="label">{lang:Average rate}</td>
     115    <td class="value">{info_rate.CONTENT}</td>
     116  </tr>
     117  <!-- END info_rate -->
    89118</table>
    90119
    … …  
    113142</p>
    114143<!-- END rate -->
     144
     145<hr class="separation">
    115146
    116147<!-- BEGIN comments -->
Note: See TracChangeset for help on using the changeset viewer.