Changeset 13474


Ignore:
Timestamp:
Mar 4, 2012, 5:28:42 PM (9 years ago)
Author:
Zaphod
Message:

feature 2588: template modification for v2.4
-> #content on picture & slideshow page
-> class 'browsePathSeparator' on LEVEL_SEPARATOR on browsePath
-> derivativeSwitchLink replaced by pwg-size icon (with associated css modification on themes)
-> new id #theImageAndInfos that contains #theImage and #imageInfos

Location:
trunk/themes
Files:
7 edited

Legend:

Unmodified
Added
Removed
  • trunk/themes/clear/theme.css

    r12881 r13474  
    1515}
    1616
    17 #menubar DL, .content, #imageToolBar, #derivativeSwitchLink, #derivativeSwitchBox, #sortOrderBox, .header_notes {
     17#menubar DL, .content, #imageToolBar, #derivativeSwitchBox, #sortOrderBox, .header_notes {
    1818  background-color: #eeeeee;
    1919}
    2020
    2121/* borders */
    22 #menubar DL, .content, #imageToolBar, #derivativeSwitchLink, #derivativeSwitchBox, #sortOrderBox {
     22#menubar DL, .content, #imageToolBar, #derivativeSwitchBox, #sortOrderBox {
    2323  border: 1px solid #d3d3d3;
    2424}
  • trunk/themes/dark/theme.css

    r12880 r13474  
    1818}
    1919
    20 #menubar DL, .content, #imageToolBar, #imageHeaderBar, #derivativeSwitchLink, #derivativeSwitchBox, #sortOrderBox, .header_notes {
     20#menubar DL, .content, #imageToolBar, #imageHeaderBar, #derivativeSwitchBox, #sortOrderBox, .header_notes {
    2121        background-color: #505050;
    2222}
     
    3131
    3232/* borders */
    33 #menubar DL, .content, #derivativeSwitchLink, #derivativeSwitchBox, #sortOrderBox{
     33#menubar DL, .content, #derivativeSwitchBox, #sortOrderBox{
    3434        border: 1px solid #000;
    3535}
  • trunk/themes/default/template/picture.tpl

    r13224 r13474  
    22{include file='include/autosize.inc.tpl'}
    33*}
    4 {if isset($MENUBAR)}
    5 {$MENUBAR}
    6 <div id="content" class="contentWithMenu">
    7 {/if}
     4{if isset($MENUBAR)}{$MENUBAR}{/if}
     5<div id="content" {if isset($MENUBAR)}class="contentWithMenu"{/if}>
    86{if isset($errors) or not empty($infos)}
    97{include file='infos_errors.tpl'}
     
    1311<div id="imageHeaderBar">
    1412        <div class="browsePath">
    15                 {$SECTION_TITLE} {$LEVEL_SEPARATOR} <h2>{$current.TITLE}</h2>
     13                {$SECTION_TITLE}<span class="browsePathSeparator">{$LEVEL_SEPARATOR}</span><h2>{$current.TITLE}</h2>
    1614        </div>
    1715        <div class="imageNumber">{$PHOTO}</div>
     
    2018<div id="imageToolBar">
    2119<div class="actionButtons">
     20
     21{if count($current.unique_derivatives)>1}
     22{footer_script}{literal}
     23function changeImgSrc(url,typeSave,typeMap,typeDisplay)
     24{
     25        var theImg = document.getElementById("theMainImage");
     26        if (theImg)
     27        {
     28                theImg.removeAttribute("width");theImg.removeAttribute("height");
     29                theImg.src = url;
     30                var elt = document.getElementById("derivativeSwitchLink");
     31                if (elt) elt.innerHTML = typeDisplay;
     32                theImg.useMap = "#map"+typeMap;
     33        }
     34        document.cookie = 'picture_deriv='+typeSave+';path={/literal}{$COOKIE_PATH}{literal}';
     35}
     36
     37function toggleDerivativeSwitchBox()
     38{
     39        var elt = document.getElementById("derivativeSwitchBox"),
     40                ePos = document.getElementById("derivativeSwitchLink");
     41        if (elt.style.display==="none")
     42        {
     43                elt.style.position = "absolute";
     44                elt.style.left = (ePos.offsetLeft+10)+"px";
     45                elt.style.top = (ePos.offsetTop+ePos.offsetHeight)+"px";
     46                elt.style.display="";
     47        }
     48        else
     49                elt.style.display="none";
     50}
     51{/literal}{/footer_script}
     52{strip}<a id="derivativeSwitchLink" href="javascript:toggleDerivativeSwitchBox()" title="{'Photo sizes'|@translate}" class="pwg-state-default pwg-button" rel="nofollow">
     53<span class="pwg-icon pwg-icon-sizes">&nbsp;</span><span class="pwg-button-text">{'Photo sizes'|@translate}</span></a>
     54<div id="derivativeSwitchBox" onclick="toggleDerivativeSwitchBox()" style="display:none">
     55{foreach from=$current.unique_derivatives item=derivative key=derivative_type}
     56<a href="javascript:changeImgSrc('{$derivative->get_url()|@escape:javascript}','{$derivative_type}','{$derivative->get_type()}','{$derivative->get_type()|@translate|@escape:javascript}')">{$derivative->get_type()|@translate} ({$derivative->get_size_hr()})</a><br>
     57{/foreach}
     58{if isset($U_ORIGINAL)}
     59<a href="javascript:phpWGOpenWindow('{$U_ORIGINAL}','xxx','scrollbars=yes,toolbar=no,status=no,resizable=yes')" rel="nofollow">{'Original'|@translate}</a>
     60{/if}
     61</div>
     62{/strip}{/if}
     63
     64
    2265{strip}{if isset($U_SLIDESHOW_START)}
    2366        <a href="{$U_SLIDESHOW_START}" title="{'slideshow'|@translate}" class="pwg-state-default pwg-button" rel="nofollow">
     
    76119</div>{*<!-- imageToolBar -->*}
    77120
     121<div id="theImageAndInfos">
    78122<div id="theImage">
    79123{$ELEMENT_CONTENT}
     
    269313{/if}
    270314</div>
     315</div>
    271316
    272317{if isset($COMMENT_COUNT)}
     
    274319        {if $COMMENT_COUNT > 0}
    275320                <h3>{$pwg->l10n_dec('%d comment', '%d comments',$COMMENT_COUNT)}</h3>
    276         {if $COMMENT_COUNT > 2}
    277                 <a href="{$COMMENTS_ORDER_URL}#comments" rel="nofollow">{$COMMENTS_ORDER_TITLE}</a>
    278         {/if}
     321                {if $COMMENT_COUNT > 2}
     322                        <a href="{$COMMENTS_ORDER_URL}#comments" rel="nofollow">{$COMMENTS_ORDER_TITLE}</a>
     323                {/if}
     324        {else}
     325                <h3 class="noCommentText">{$pwg->l10n_dec('%d comment', '%d comments',$COMMENT_COUNT)}</h3>
    279326        {/if}
    280327        {if !empty($navbar)}{include file='navigation_bar.tpl'|@get_extent:'navbar'}{/if}
  • trunk/themes/default/template/picture_content.tpl

    r13068 r13474  
    33        title="{$COMMENT_IMG|@strip_tags:false|@replace:'"':' '}" {else} title="{$current.TITLE|@replace:'"':' '} - {$ALT_IMG}"
    44{/if}>
    5 {if count($current.unique_derivatives)>1}
    6 {footer_script}{literal}
    7 function changeImgSrc(url,typeSave,typeMap,typeDisplay)
    8 {
    9         var theImg = document.getElementById("theMainImage");
    10         if (theImg)
    11         {
    12                 theImg.removeAttribute("width");theImg.removeAttribute("height");
    13                 theImg.src = url;
    14                 var elt = document.getElementById("derivativeSwitchLink");
    15                 if (elt) elt.innerHTML = typeDisplay;
    16                 theImg.useMap = "#map"+typeMap;
    17         }
    18         document.cookie = 'picture_deriv='+typeSave+';path={/literal}{$COOKIE_PATH}{literal}';
    19 }
    20 
    21 function toggleDerivativeSwitchBox()
    22 {
    23         var elt = document.getElementById("derivativeSwitchBox"),
    24                 ePos = document.getElementById("derivativeSwitchLink");
    25         if (elt.style.display==="none")
    26         {
    27                 elt.style.position = "absolute";
    28                 elt.style.left = (ePos.offsetLeft+10)+"px";
    29                 elt.style.top = (ePos.offsetTop+ePos.offsetHeight)+"px";
    30                 elt.style.display="";
    31         }
    32         else
    33                 elt.style.display="none";
    34 }
    35 {/literal}{/footer_script}
    36 <a id="derivativeSwitchLink" href="javascript:toggleDerivativeSwitchBox()">{$current.selected_derivative->get_type()|@translate}</a>
    37 <div id="derivativeSwitchBox" onclick="toggleDerivativeSwitchBox()" style="display:none">
    38 {foreach from=$current.unique_derivatives item=derivative key=derivative_type}
    39 <a href="javascript:changeImgSrc('{$derivative->get_url()|@escape:javascript}','{$derivative_type}','{$derivative->get_type()}','{$derivative->get_type()|@translate|@escape:javascript}')">{$derivative->get_type()|@translate} ({$derivative->get_size_hr()})</a><br>
    40 {/foreach}
    41 {if isset($U_ORIGINAL)}
    42 <a href="javascript:phpWGOpenWindow('{$U_ORIGINAL}','xxx','scrollbars=yes,toolbar=no,status=no,resizable=yes')" rel="nofollow">{'Original'|@translate}</a>
    43 {/if}
    44 </div>
    45 {/if}
    465
    476{foreach from=$current.unique_derivatives item=derivative key=derivative_type}{strip}
  • trunk/themes/default/template/slideshow.tpl

    r13115 r13474  
    1313</div>
    1414
     15<div id="content">
    1516<div id="theImage">
    1617  {$ELEMENT_CONTENT}
     
    1920  {/if}
    2021</div>
     22</div>
  • trunk/themes/default/theme.css

    r13240 r13474  
    341341#imageToolBar .pwg-button {width:42px;}
    342342
    343 
    344 #derivativeSwitchLink {
    345         padding: 0.2em;
    346         position: absolute;
    347         left: 5px;
    348         top: 12%;
    349 }
    350 
    351343#derivativeSwitchBox, #sortOrderBox {
    352344        padding: 0.5em 1em;
     
    421413}
    422414
     415.noCommentText {display:none;}
    423416
    424417/**
  • trunk/themes/elegant/theme.css

    r13466 r13474  
    1414        height:33px;
    1515        cursor:pointer;
    16         margin: 26px 0 0 -33px;
     16        margin: 28px 0 0 -35px;
    1717}
    1818
     
    2727#menuswitcher.menuhidden {
    2828        width:25px;
    29         margin: 28px 0 0 0;
     29        margin-left:0;
    3030}
    3131
     
    4040        border-bottom: 2px solid #444;
    4141        margin-bottom: 4px;
     42        padding-bottom: 4px;
    4243}
    4344
     
    4546        background-color: #111;
    4647        border-bottom: 2px solid #444;
    47         height: 28px;
    4848        padding:0;
    49         margin-bottom:8px;
     49        margin-bottom:4px;
    5050}
    5151
     
    9292
    9393
    94 #imageToolBar, #imageHeaderBar, #derivativeSwitchLink, #derivativeSwitchBox, #sortOrderBox, .header_notes {
     94#imageToolBar, #imageHeaderBar, #derivativeSwitchBox, #sortOrderBox, .header_notes {
    9595        background-color: #505050;
    9696}
     
    105105
    106106/* borders */
    107 #derivativeSwitchLink, #derivativeSwitchBox, #sortOrderBox{
     107#derivativeSwitchBox, #sortOrderBox{
    108108        border: 1px solid #000;
    109109}
     
    131131#theImage, #imageInfos, #comments {background:#222;}
    132132#theImage {padding-top:10px;}
    133 #imageHeaderBar  { height:28px;}
    134133#imageHeaderBar .browsePath {display:inline-block; float:none; font-size:120%; line-height:20px; padding: 8px 0 0 2px; font-weight:bold; margin:0;}
    135134#imageHeaderBar .imageNumber {display:inline-block; float:none; line-height:20px; padding: 8px 0 0 12px; font-weight:bold; margin:0;}
    136135#imageHeaderBar .imageNumber:before {content:'['}
    137136#imageHeaderBar .imageNumber:after {content:']'}
    138 #imageHeaderBar h2 {display:none;}
     137#imageHeaderBar h2 {font-size:100%;}
    139138#thePicturePage .pwg-button {width:26px;}
    140139#thePicturePage .actionButtons {margin-right: 26px;}
     
    143142#thePicturePage #comments {padding-top:12px; padding-bottom:12px;}
    144143#thePicturePage #comments fieldset{margin-top: 0; margin-bottom:0;}
    145 #copyright {padding-top:4px; text-align:right;}
     144.noCommentText {display:block;}
     145#copyright {padding:4px 4px 0 0; text-align:right;}
    146146
     147#thePicturePage .comments_toggle_on:before {content:'(+) '}
     148#thePicturePage .comments_toggle_off:before {content:'(-) '}
    147149
     150.comments_hidden ul, .comments_hidden form {display:none;}
    148151.thumbnailCategory {background-color: #303030;}
     152.comments_toggle {cursor: pointer;}
     153.comments_toggle:hover {color:#fff;}
     154
    149155#the_page .content .stuffs {margin:0!important}
     156
     157#thumbnails  {padding-top: 5px;}
     158
     159INPUT[type="text"], INPUT[type="password"], INPUT[type="button"], INPUT[type="submit"], INPUT[type="reset"], INPUT[type="file"] {background-color:#999;}
     160INPUT:focus, SELECT:focus, TEXTAREA:focus {background-color:#ccc;}
    150161
    151162/* links */
Note: See TracChangeset for help on using the changeset viewer.