diff options
Diffstat (limited to '')
| -rw-r--r-- | themes/default/fix-ie5-ie6.css | 7 | ||||
| -rw-r--r-- | themes/default/fix-ie7.css | 6 | ||||
| -rw-r--r-- | themes/default/template/picture.tpl | 261 | ||||
| -rw-r--r-- | themes/default/theme.css | 62 | ||||
| -rw-r--r-- | themes/elegant/template/picture.tpl | 396 | ||||
| -rw-r--r-- | themes/elegant/theme.css | 11 |
6 files changed, 218 insertions, 525 deletions
diff --git a/themes/default/fix-ie5-ie6.css b/themes/default/fix-ie5-ie6.css index b3ed58996..312b64e30 100644 --- a/themes/default/fix-ie5-ie6.css +++ b/themes/default/fix-ie5-ie6.css @@ -70,3 +70,10 @@ H1, #theHeader { .pwg-icon { display: block; } + +.imageInfoTable {display:block; margin: 0 200px;} +.imageInfo {display:block; line-height:16px;} +.imageInfo dt {display:block; text-align:left; font-weight:bold; padding-right:0.5em;} +.imageInfo dd {display:block; text-align:left; font-weight:normal;} +.relSwitchBox {position:static;} +#imageInfos dd { margin: 0 0 5px 20px;}
\ No newline at end of file diff --git a/themes/default/fix-ie7.css b/themes/default/fix-ie7.css index d4c343f24..4284f6381 100644 --- a/themes/default/fix-ie7.css +++ b/themes/default/fix-ie7.css @@ -23,3 +23,9 @@ display: block; } +.imageInfoTable {display:block; margin: 0 200px;} +.imageInfo {display:block; line-height:16px;} +.imageInfo dt {display:block; text-align:left; font-weight:bold; padding-right:0.5em;} +.imageInfo dd {display:block; text-align:left; font-weight:normal;} +.relSwitchBox {position:static;} +#imageInfos dd { margin: 0 0 5px 20px;}
\ No newline at end of file diff --git a/themes/default/template/picture.tpl b/themes/default/template/picture.tpl index 17b2c7750..da9dd1036 100644 --- a/themes/default/template/picture.tpl +++ b/themes/default/template/picture.tpl @@ -12,10 +12,10 @@ <div class="browsePath"> {$SECTION_TITLE}<span class="browsePathSeparator">{$LEVEL_SEPARATOR}</span><h2>{$current.TITLE}</h2> </div> - <div class="imageNumber">{$PHOTO}</div> </div> <div id="imageToolBar"> +<div class="imageNumber">{$PHOTO}</div> <div class="actionButtons"> {if count($current.unique_derivatives)>1} @@ -139,74 +139,80 @@ y.callService( </p> {/if} -</div> +</div><!-- -<div id="imageInfos"> +--><div id="infoSwitcher"></div><!-- +--><div id="imageInfos"> {if $DISPLAY_NAV_THUMB} -{if isset($previous)} -<a class="navThumb" id="linkPrev" href="{$previous.U_IMG}" title="{'Previous'|@translate} : {$previous.TITLE}" rel="prev"> - <img src="{$previous.THUMB_SRC}" alt="{$previous.TITLE}"> -</a> -{/if} -{if isset($next)} -<a class="navThumb" id="linkNext" href="{$next.U_IMG}" title="{'Next'|@translate} : {$next.TITLE}" rel="next"> - <img src="{$next.THUMB_SRC}" alt="{$next.TITLE}"> -</a> -{/if} + <div class="navThumbs"> + {if isset($previous)} + <a class="navThumb" id="linkPrev" href="{$previous.U_IMG}" title="{'Previous'|@translate} : {$previous.TITLE}" rel="prev"> + <span class="thumbHover prevThumbHover"> </span> + <img src="{$previous.derivatives.square->get_url()}" alt="{$previous.TITLE}"> + </a> + {/if} + {if isset($next)} + <a class="navThumb" id="linkNext" href="{$next.U_IMG}" title="{'Next'|@translate} : {$next.TITLE}" rel="next"> + <span class="thumbHover nextThumbHover"> </span> + <img src="{$next.derivatives.square->get_url()}" alt="{$next.TITLE}"> + </a> + {/if} + </div> {/if} -<table id="standard" class="infoTable"> +<dl id="standard" class="imageInfoTable infoTable"> {strip} {if $display_info.author} - <tr id="Author"> - <td class="label">{'Author'|@translate}</td> - <td class="value">{if isset($INFO_AUTHOR)}{$INFO_AUTHOR}{else}{'N/A'|@translate}{/if}</td> - </tr> + <div id="Author" class="imageInfo"> + <dt>{'Author'|@translate}</dt> + <dd>{if isset($INFO_AUTHOR)}{$INFO_AUTHOR}{else}{'N/A'|@translate}{/if}</dd> + </div> {/if} {if $display_info.created_on} - <tr id="datecreate"> - <td class="label">{'Created on'|@translate}</td> - <td class="value">{if isset($INFO_CREATION_DATE)}{$INFO_CREATION_DATE}{else}{'N/A'|@translate}{/if}</td> - </tr> + <div id="datecreate" class="imageInfo"> + <dt>{'Created on'|@translate}</dt> + <dd>{if isset($INFO_CREATION_DATE)}{$INFO_CREATION_DATE}{else}{'N/A'|@translate}{/if}</dd> + </div> {/if} {if $display_info.posted_on} - <tr id="datepost"> - <td class="label">{'Posted on'|@translate}</td> - <td class="value">{$INFO_POSTED_DATE}</td> - </tr> + <div id="datepost" class="imageInfo"> + <dt>{'Posted on'|@translate}</dt> + <dd>{$INFO_POSTED_DATE}</dd> + </div> {/if} {if $display_info.dimensions} - <tr id="Dimensions"> - <td class="label">{'Dimensions'|@translate}</td> - <td class="value">{if isset($INFO_DIMENSIONS)}{$INFO_DIMENSIONS}{else}{'N/A'|@translate}{/if}</td> - </tr> + <div id="Dimensions" class="imageInfo"> + <dt>{'Dimensions'|@translate}</dt> + <dd>{if isset($INFO_DIMENSIONS)}{$INFO_DIMENSIONS}{else}{'N/A'|@translate}{/if}</dd> + </div> {/if} {if $display_info.file} - <tr id="File"> - <td class="label">{'File'|@translate}</td> - <td class="value">{$INFO_FILE}</td> - </tr> + <div id="File" class="imageInfo"> + <dt>{'File'|@translate}</dt> + <dd>{$INFO_FILE}</dd> + </div> {/if} {if $display_info.filesize} - <tr id="Filesize"> - <td class="label">{'Filesize'|@translate}</td> - <td class="value">{if isset($INFO_FILESIZE)}{$INFO_FILESIZE}{else}{'N/A'|@translate}{/if}</td> - </tr> + <div id="Filesize" class="imageInfo"> + <dt>{'Filesize'|@translate}</dt> + <dd>{if isset($INFO_FILESIZE)}{$INFO_FILESIZE}{else}{'N/A'|@translate}{/if}</dd> + </div> {/if} - {if $display_info.tags} - <tr id="Tags"> - <td class="label">{'Tags'|@translate}</td> - <td class="value"> + {if $display_info.tags } + <div id="Tags" class="imageInfo"> + <dt>{'Tags'|@translate}</dt> + <dd> {if isset($related_tags)} {foreach from=$related_tags item=tag name=tag_loop}{if !$smarty.foreach.tag_loop.first}, {/if}<a href="{$tag.URL}">{$tag.name}</a>{/foreach} + {else} {/if} - </td> - </tr> + </dd> + </div> {/if} {if $display_info.categories} - <tr id="Categories"> - <td class="label">{'Albums'|@translate}</td> - <td class="value"> + <div id="Categories" class="imageInfo"> + <dt>{'Albums'|@translate}</dt> + <dd> {if isset($related_categories)} <ul> {foreach from=$related_categories item=cat} @@ -214,35 +220,35 @@ y.callService( {/foreach} </ul> {/if} - </td> - </tr> + </dd> + </div> {/if} {if $display_info.visits} - <tr id="Visits"> - <td class="label">{'Visits'|@translate}</td> - <td class="value">{$INFO_VISITS}</td> - </tr> + <div id="Visits" class="imageInfo"> + <dt>{'Visits'|@translate}</dt> + <dd>{$INFO_VISITS}</dd> + </div> {/if} {if $display_info.rating_score and isset($rate_summary)} - <tr id="Average"> - <td class="label">{'Rating score'|@translate}</td> - <td class="value"> + <div id="Average" class="imageInfo"> + <dt>{'Rating score'|@translate}</dt> + <dd> {if $rate_summary.count} <span id="ratingScore">{$rate_summary.score}</span> <span id="ratingCount">({assign var='rate_text' value='%d rates'|@translate}{$pwg->sprintf($rate_text, $rate_summary.count)})</span> {else} <span id="ratingScore">{'no rate'|@translate}</span> <span id="ratingCount"></span> {/if} - </td> - </tr> + </dd> + </div> {/if} {if isset($rating)} - <tr id="rating"> - <td class="label"> + <div id="rating" class="imageInfo"> + <dt> <span id="updateRate">{if isset($rating.USER_RATE)}{'Update your rating'|@translate}{else}{'Rate this photo'|@translate}{/if}</span> - </td> - <td class="value"> + </dt> + <dd> <form action="{$rating.F_ACTION}" method="post" id="rateForm" style="margin:0;"> <div> {foreach from=$rating.marks item=mark name=rate_loop} @@ -269,87 +275,118 @@ y.callService( {/strip} </div> </form> - </td> - </tr> + </dd> + </div> {/if} {if $display_info.privacy_level and isset($available_permission_levels)} - <tr id="Privacy"> - <td class="label">{'Who can see this photo?'|@translate}</td> - <td class="value"> -{combine_script id='core.scripts' load='async' path='themes/default/js/scripts.js'} + <div id="Privacy" class="imageInfo"><div class="relSwitchBox"> + <dt><a id="privacyLevelLink" href="javascript:togglePrivacyLevelBox()">{'Who can see this photo?'|@translate}</a></dt> + <dd> +{combine_script id='core.scripts' require='jquery' load='async' path='themes/default/js/scripts.js'} {footer_script} -{literal}function setPrivacyLevel(selectElement, rootUrl, id, level) +{literal}function setPrivacyLevel(rootUrl, id, level) { -selectElement.disabled = true; var y = new PwgWS(rootUrl); y.callService( "pwg.images.setPrivacyLevel", {image_id: id, level:level} , { method: "POST", - onFailure: function(num, text) { selectElement.disabled = false; alert(num + " " + text); }, - onSuccess: function(result) { selectElement.disabled = false; } + onFailure: function(num, text) { alert(num + " " + text); }, + onSuccess: function(result) { + jQuery('.levelCheck').hide(); + jQuery('#levelCheck'+level).show(); + jQuery('#privacyLevelBox .switchSelected').css('visibility','hidden'); + jQuery('#switchLevel'+level).css('visibility','visible'); + } } ); -}{/literal} +} +function togglePrivacyLevelBox() +{ + var elt = document.getElementById("privacyLevelBox"), + ePos = document.getElementById("privacyLevelLink"); + if (elt.style.display == "none") + { + elt.style.left = (ePos.offsetLeft)+"px"; + elt.style.top = (ePos.offsetTop+ePos.offsetHeight)+"px"; + elt.style.display=""; + } + else + elt.style.display="none"; +} +{/literal} {/footer_script} - <select onchange="setPrivacyLevel(this, '{$ROOT_URL}', {$current.id}, this.options[selectedIndex].value)"> - {foreach from=$available_permission_levels item=label key=level} - <option label="{$label}" value="{$level}"{if $level == $current.level} selected="selected"{/if}>{$label}</option> - {/foreach} - </select> - </td></tr> + + <div id="privacyLevelBox" class="switchBox" onclick="togglePrivacyLevelBox()" style="display:none" onmouseout="e=event.toElement||event.relatedTarget;e.parentNode==this||e==this||togglePrivacyLevelBox()"> + {foreach from=$available_permission_levels item=label key=level} + <span id="levelCheck{$level}" class="levelCheck switchCheck" {if $level != $current.level}style="visibility:hidden"{/if}>✔ </span> + <a id="switchLevel{$level}" {if $level == $current.level}class="switchSelected"{else}class="switchUnselected"{/if} href="javascript:setPrivacyLevel('{$ROOT_URL}', {$current.id}, {$level})">{$label}</a><br> + {/foreach} + </div> + + </dd> + </div></div> {/if} {/strip} -</table> +</dl> {if isset($metadata)} -<table id="Metadata" class="infoTable2"> +<dl id="Metadata" class="imageInfoTable infoTable2"> {foreach from=$metadata item=meta} - <tr> - <th colspan="2">{$meta.TITLE}</th> - </tr> + <h3>{$meta.TITLE}</h3> {foreach from=$meta.lines item=value key=label} - <tr> - <td class="label">{$label}</td> - <td class="value">{$value}</td> - </tr> + <div class="imageInfo"> + <dt>{$label}</dt> + <dd>{$value}</dd> + </div> {/foreach} {/foreach} -</table> +</dl> {/if} </div> </div> {if isset($COMMENT_COUNT)} -<div id="comments"> +<div id="comments" {if (!isset($comment_add) && ($COMMENT_COUNT == 0))}class="noCommentContent"{else}class="commentContent"{/if}><div id="commentsSwitcher"></div> {if $COMMENT_COUNT > 0} <h3>{$pwg->l10n_dec('%d comment', '%d comments',$COMMENT_COUNT)}</h3> - {if $COMMENT_COUNT > 2} - <a href="{$COMMENTS_ORDER_URL}#comments" rel="nofollow">{$COMMENTS_ORDER_TITLE}</a> - {/if} {else} - <h3 class="noCommentText">{$pwg->l10n_dec('%d comment', '%d comments',$COMMENT_COUNT)}</h3> - {/if} - {if !empty($navbar)}{include file='navigation_bar.tpl'|@get_extent:'navbar'}{/if} - - {if isset($comments)} - {include file='comment_list.tpl'} + <h3><span class="noCommentText">{$pwg->l10n_dec('%d comment', '%d comments',$COMMENT_COUNT)}</span></h3> {/if} - - {if isset($comment_add)} - <form method="post" action="{$comment_add.F_ACTION}" class="filter" id="addComment"> - <fieldset> - <legend>{'Add a comment'|@translate}</legend> - {if $comment_add.SHOW_AUTHOR} - <label>{'Author'|@translate}<input type="text" name="author"></label> + + <div id="pictureComments"> + {if isset($comment_add)} + <div id="commentAdd"> + <h4>{'Add a comment'|@translate}</h4> + <form method="post" action="{$comment_add.F_ACTION}" class="filter" id="addComment" > + {if $comment_add.SHOW_AUTHOR} + <p><label>{'Author'|@translate} :</label></p> + <p><input type="text" name="author" /></p> + {/if} + <p><label>{'Comment'|@translate} :</label></p> + <p><textarea name="content" id="contentid" rows="10" cols="50">{$comment_add.CONTENT}</textarea></p> + <p><input type="hidden" name="key" value="{$comment_add.KEY}" /> + <input class="submit" type="submit" value="{'Submit'|@translate}"></p> + </form> + </div> {/if} - <label>{'Comment'|@translate}<textarea name="content" id="contentid" rows="5" cols="80">{$comment_add.CONTENT}</textarea></label> - <input type="hidden" name="key" value="{$comment_add.KEY}"> - <input type="submit" value="{'Submit'|@translate}"> - </fieldset> - </form> - {/if} + {if isset($comments)} + <div id="pictureCommentList"> + {if (($COMMENT_COUNT > 2) || !empty($navbar))} + <div id="pictureCommentNavBar"> + {if $COMMENT_COUNT > 2} + <a href="{$COMMENTS_ORDER_URL}#comments" rel="nofollow" class="commentsOrder">{$COMMENTS_ORDER_TITLE}</a> + {/if} + {if !empty($navbar) }{include file='navigation_bar.tpl'|@get_extent:'navbar'}{/if} + </div> + {/if} + {include file='comment_list.tpl'} + </div> + {/if} + <div style="clear: both;"></div> + </div> + </div> {/if}{*comments*} diff --git a/themes/default/theme.css b/themes/default/theme.css index e21756ca5..ab418542b 100644 --- a/themes/default/theme.css +++ b/themes/default/theme.css @@ -350,9 +350,9 @@ TD.calDayHead { margin-left: 10px; } -#imageHeaderBar .imageNumber { +#imageToolBar .imageNumber { float: right; - margin-right: 10px; + margin:-20px 9px 0 0; } #imageHeaderBar H2 { @@ -377,7 +377,7 @@ TD.calDayHead { padding: 0.5em 5px; border-radius: 4px; z-index: 100; - text-align: left; + text-align:left; position: absolute; /*left, right set through js*/ } @@ -387,6 +387,10 @@ TD.calDayHead { margin-bottom:5px; } +.relSwitchBox { + position: relative; +} + #theImage { clear: left; text-align: center; @@ -398,17 +402,13 @@ TD.calDayHead { } #linkPrev { - position:absolute; - left:0; - margin-right: 10px; - margin-left: 5px; + float: left; + margin: 5px 10px 0 5px; } #linkNext { - position:absolute; - right:0; - margin-right: 5px; - margin-left: 10px; + float: right; + margin: 5px 5px 0 10px; } .infoTable .label { @@ -816,3 +816,43 @@ LEGEND { line-height: 1.5em; } +/* image comments rules */ + +#commentAdd, #pictureCommentList { width: 48%; padding: 0 1%;} +#commentAdd { float: left; } +#pictureCommentList { float: right; } + +#commentAdd input[type="text"], +#commentAdd textarea { + min-width: 100%; + max-width: 100%; + width: 100%; + font-family: Arial,Helvetica,sans-serif; + font-size: 100%; +} +#pictureCommentList li { + clear: both; + display: block; + padding: 0.5em 0; + margin-bottom: 5px; + border-radius: 5px; + width: 100%; +} +#pictureCommentList ul { list-style: none; padding: 0;} +#pictureCommentList li ul { list-style-type: none; padding: 4px;} +#pictureCommentList .author { font-weight: bold;} +#pictureCommentList .date { font-style: italic;} +#pictureCommentList .commentsOrder { float: left; margin-bottom: 5px;} +#pictureCommentList .navigationBar { float: right; margin-bottom: 5px;} +#pictureComments h4 { margin: 0;} +#pictureComments form p { margin: 5px 0; text-align: left;} +#pictureComments form p textarea { margin: 10px 0;} +#pictureComments INPUT { margin: 10px;} +#pictureComments INPUT[type=submit] { margin: 0;} + +/* image info table */ + +.imageInfoTable {display:table; margin: auto;} +.imageInfo {display:table-row; line-height:20px;} +.imageInfo dt {display:table-cell; text-align:right; font-weight:bold; padding-right:0.5em;} +.imageInfo dd {display:table-cell; text-align:left; font-weight:normal;} diff --git a/themes/elegant/template/picture.tpl b/themes/elegant/template/picture.tpl deleted file mode 100644 index 948229e38..000000000 --- a/themes/elegant/template/picture.tpl +++ /dev/null @@ -1,396 +0,0 @@ -{* Example of resizeable -{include file='include/autosize.inc.tpl'} -*} -{if isset($MENUBAR)}{$MENUBAR}{/if} -<div id="content" {if isset($MENUBAR)}class="contentWithMenu"{/if}> -{if isset($errors) or not empty($infos)} -{include file='infos_errors.tpl'} -{/if} -{if !empty($PLUGIN_PICTURE_BEFORE)}{$PLUGIN_PICTURE_BEFORE}{/if} - -<div id="imageHeaderBar"> - <div class="browsePath"> - {$SECTION_TITLE}<span class="browsePathSeparator">{$LEVEL_SEPARATOR}</span><h2>{$current.TITLE}</h2> - </div> -</div> - -<div id="imageToolBar"> -<div class="imageNumber">{$PHOTO}</div> -<div class="actionButtons"> - -{if count($current.unique_derivatives)>1} -{footer_script}{literal} -function changeImgSrc(url,typeSave,typeMap) -{ - var theImg = document.getElementById("theMainImage"); - if (theImg) - { - theImg.removeAttribute("width");theImg.removeAttribute("height"); - theImg.src = url; - theImg.useMap = "#map"+typeMap; - } - jQuery('.derivativeChecked').hide(); - jQuery('#derivativeChecked'+typeSave).show(); - jQuery('#derivativeSwitchBox .switchSelected').addClass('switchUnselected').removeClass('switchSelected'); - jQuery('#derivativeName'+typeSave).addClass('switchSelected').removeClass('switchUnselected'); - document.cookie = 'picture_deriv='+typeSave+';path={/literal}{$COOKIE_PATH}{literal}'; -} - -function toggleDerivativeSwitchBox() -{ - var elt = document.getElementById("derivativeSwitchBox"), - ePos = document.getElementById("derivativeSwitchLink"); - if (elt.style.display==="none") - { - elt.style.position = "absolute"; - elt.style.left = (ePos.offsetLeft)+"px"; - elt.style.top = (ePos.offsetTop+ePos.offsetHeight)+"px"; - elt.style.display=""; - } - else - elt.style.display="none"; -} -{/literal}{/footer_script} -{strip}<a id="derivativeSwitchLink" href="javascript:toggleDerivativeSwitchBox()" title="{'Photo sizes'|@translate}" class="pwg-state-default pwg-button" rel="nofollow"> -<span class="pwg-icon pwg-icon-sizes"> </span><span class="pwg-button-text">{'Photo sizes'|@translate}</span></a> -<div id="derivativeSwitchBox" class="switchBox" onclick="toggleDerivativeSwitchBox()" style="display:none" onmouseout="e=event.toElement||event.relatedTarget;e.parentNode==this||e.parentNode.parentNode==this||e==this||toggleDerivativeSwitchBox()"> -<div class="switchBoxTitle">{'Photo sizes'|@translate}</div> -{foreach from=$current.unique_derivatives item=derivative key=derivative_type} -<span class="derivativeChecked switchCheck" - id="derivativeChecked{$derivative_type}" {if $derivative->get_type() ne $current.selected_derivative->get_type()}style="display:none"{/if}>✔ </span> -<a href="javascript:changeImgSrc('{$derivative->get_url()|@escape:javascript}','{$derivative_type}','{$derivative->get_type()}')" - id="derivativeName{$derivative_type}" - class="{if $derivative->get_type() == $current.selected_derivative->get_type()}switchSelected{else}switchUnselected{/if}"> - {$derivative->get_type()|@translate}<span class="derivativeSizeDetails"> ({$derivative->get_size_hr()})</span> -</a><br> -{/foreach} -{if isset($U_ORIGINAL)} -<a href="javascript:phpWGOpenWindow('{$U_ORIGINAL}','xxx','scrollbars=yes,toolbar=no,status=no,resizable=yes')" rel="nofollow">{'Original'|@translate}</a> -{/if} -</div> -{/strip}{/if} - - -{strip}{if isset($U_SLIDESHOW_START)} - <a href="{$U_SLIDESHOW_START}" title="{'slideshow'|@translate}" class="pwg-state-default pwg-button" rel="nofollow"> - <span class="pwg-icon pwg-icon-slideshow"> </span><span class="pwg-button-text">{'slideshow'|@translate}</span> - </a> -{/if}{/strip} -{strip}{if isset($U_METADATA)} - <a href="{$U_METADATA}" title="{'Show file metadata'|@translate}" class="pwg-state-default pwg-button" rel="nofollow"> - <span class="pwg-icon pwg-icon-camera-info"> </span><span class="pwg-button-text">{'Show file metadata'|@translate}</span> - </a> -{/if}{/strip} -{strip}{if isset($current.U_DOWNLOAD)} - <a href="{$current.U_DOWNLOAD}" title="{'Download this file'|@translate}" class="pwg-state-default pwg-button" rel="nofollow"> - <span class="pwg-icon pwg-icon-save"> </span><span class="pwg-button-text">{'Download'|@translate}</span> - </a> -{/if}{/strip} -{if isset($PLUGIN_PICTURE_ACTIONS)}{$PLUGIN_PICTURE_ACTIONS}{/if} -{strip}{if isset($favorite)} - <a href="{$favorite.U_FAVORITE}" title="{if $favorite.IS_FAVORITE}{'delete this photo from your favorites'|@translate}{else}{'add this photo to your favorites'|@translate}{/if}" class="pwg-state-default pwg-button" rel="nofollow"> - <span class="pwg-icon pwg-icon-favorite-{if $favorite.IS_FAVORITE}del{else}add{/if}"> </span><span class="pwg-button-text">{'Favorites'|@translate}</span> - </a> -{/if}{/strip} -{strip}{if isset($U_SET_AS_REPRESENTATIVE)} - <a href="{$U_SET_AS_REPRESENTATIVE}" title="{'set as album representative'|@translate}" class="pwg-state-default pwg-button" rel="nofollow"> - <span class="pwg-icon pwg-icon-representative"> </span><span class="pwg-button-text">{'representative'|@translate}</span> - </a> -{/if}{/strip} -{strip}{if isset($U_ADMIN)} - <a href="{$U_ADMIN}" title="{'Modify information'|@translate}" class="pwg-state-default pwg-button" rel="nofollow"> - <span class="pwg-icon pwg-icon-edit"> </span><span class="pwg-button-text">{'Edit'|@translate}</span> - </a> -{/if}{/strip} -{strip}{if isset($U_CADDIE)}{*caddie management BEGIN*} -{footer_script} -{literal}function addToCadie(aElement, rootUrl, id) -{ -if (aElement.disabled) return; -aElement.disabled=true; -var y = new PwgWS(rootUrl); -y.callService( - "pwg.caddie.add", {image_id: id} , - { - onFailure: function(num, text) { alert(num + " " + text); document.location=aElement.href; }, - onSuccess: function(result) { aElement.disabled = false; } - } - ); -}{/literal} -{/footer_script} - <a href="{$U_CADDIE}" onclick="addToCadie(this, '{$ROOT_URL}', {$current.id}); return false;" title="{'Add to caddie'|@translate}" class="pwg-state-default pwg-button" rel="nofollow"> - <span class="pwg-icon pwg-icon-caddie-add"> </span><span class="pwg-button-text">{'Caddie'|@translate}</span> - </a> -{/if}{/strip}{*caddie management END*} -</div> - - {include file='picture_nav_buttons.tpl'|@get_extent:'picture_nav_buttons'} -</div>{*<!-- imageToolBar -->*} - -<div id="theImageAndInfos"> -<div id="theImage"> -{$ELEMENT_CONTENT} - -{if isset($COMMENT_IMG)} -<p class="imageComment">{$COMMENT_IMG}</p> -{/if} - -{if isset($U_SLIDESHOW_STOP)} -<p> - [ <a href="{$U_SLIDESHOW_STOP}">{'stop the slideshow'|@translate}</a> ] -</p> -{/if} - -</div><!-- - ---><div id="infoSwitcher"></div><!-- ---><div id="imageInfos"> -{if $DISPLAY_NAV_THUMB} - <div class="navThumbs"> - {if isset($previous)} - <a class="navThumb" id="linkPrev" href="{$previous.U_IMG}" title="{'Previous'|@translate} : {$previous.TITLE}" rel="prev"> - <span class="thumbHover prevThumbHover"> </span> - <img src="{$previous.derivatives.square->get_url()}" alt="{$previous.TITLE}"> - </a> - {/if} - {if isset($next)} - <a class="navThumb" id="linkNext" href="{$next.U_IMG}" title="{'Next'|@translate} : {$next.TITLE}" rel="next"> - <span class="thumbHover nextThumbHover"> </span> - <img src="{$next.derivatives.square->get_url()}" alt="{$next.TITLE}"> - </a> - {/if} - </div> -{/if} - -<dl id="standard" class="infoTable"> -{strip} - {if $display_info.author} - <div id="Author"> - <dt>{'Author'|@translate}</dt> - <dd>{if isset($INFO_AUTHOR)}{$INFO_AUTHOR}{else}{'N/A'|@translate}{/if}</dd> - </div> - {/if} - {if $display_info.created_on} - <div id="datecreate"> - <dt>{'Created on'|@translate}</dt> - <dd>{if isset($INFO_CREATION_DATE)}{$INFO_CREATION_DATE}{else}{'N/A'|@translate}{/if}</dd> - </div> - {/if} - {if $display_info.posted_on} - <div id="datepost"> - <dt>{'Posted on'|@translate}</dt> - <dd>{$INFO_POSTED_DATE}</dd> - </div> - {/if} - {if $display_info.dimensions} - <div id="Dimensions"> - <dt>{'Dimensions'|@translate}</dt> - <dd>{if isset($INFO_DIMENSIONS)}{$INFO_DIMENSIONS}{else}{'N/A'|@translate}{/if}</dd> - </div> - {/if} - {if $display_info.file} - <div id="File"> - <dt>{'File'|@translate}</dt> - <dd>{$INFO_FILE}</dd> - </div> - {/if} - {if $display_info.filesize} - <div id="Filesize"> - <dt>{'Filesize'|@translate}</dt> - <dd>{if isset($INFO_FILESIZE)}{$INFO_FILESIZE}{else}{'N/A'|@translate}{/if}</dd> - </div> - {/if} - {if $display_info.tags } - <div id="Tags"> - <dt>{'Tags'|@translate}</dt> - <dd> - {if isset($related_tags)} - {foreach from=$related_tags item=tag name=tag_loop}{if !$smarty.foreach.tag_loop.first}, {/if}<a href="{$tag.URL}">{$tag.name}</a>{/foreach} - {else} - {/if} - </dd> - </div> - {/if} - {if $display_info.categories} -<!-- <div id="Categories">--> - <dt>{'Albums'|@translate}</dt> - <dd> - {if isset($related_categories)} - <ul> - {foreach from=$related_categories item=cat} - <li>{$cat}</li> - {/foreach} - </ul> - {/if} - </dd> -<!-- </div>--> - {/if} - {if $display_info.visits} - <div id="Visits"> - <dt>{'Visits'|@translate}</dt> - <dd>{$INFO_VISITS}</dd> - </div> - {/if} - -{if $display_info.rating_score and isset($rate_summary)} - <div id="Average"> - <dt>{'Rating score'|@translate}</dt> - <dd> - {if $rate_summary.count} - <span id="ratingScore">{$rate_summary.score}</span> <span id="ratingCount">({assign var='rate_text' value='%d rates'|@translate}{$pwg->sprintf($rate_text, $rate_summary.count)})</span> - {else} - <span id="ratingScore">{'no rate'|@translate}</span> <span id="ratingCount"></span> - {/if} - </dd> - </div> -{/if} - -{if isset($rating)} - <div id="rating"> - <dt> - <span id="updateRate">{if isset($rating.USER_RATE)}{'Update your rating'|@translate}{else}{'Rate this photo'|@translate}{/if}</span> - </dt> - <dd> - <form action="{$rating.F_ACTION}" method="post" id="rateForm" style="margin:0;"> - <div> - {foreach from=$rating.marks item=mark name=rate_loop} - {if isset($rating.USER_RATE) && $mark==$rating.USER_RATE} - <input type="button" name="rate" value="{$mark}" class="rateButtonSelected" title="{$mark}"> - {else} - <input type="submit" name="rate" value="{$mark}" class="rateButton" title="{$mark}"> - {/if} - {/foreach} - {strip}{combine_script id='core.scripts' load='async' path='themes/default/js/scripts.js'} - {combine_script id='rating' load='async' require='core.scripts' path='themes/default/js/rating.js'} - {footer_script} - var _pwgRatingAutoQueue = _pwgRatingAutoQueue||[]; - _pwgRatingAutoQueue.push( {ldelim}rootUrl: '{$ROOT_URL}', image_id: {$current.id}, - onSuccess : function(rating) {ldelim} - var e = document.getElementById("updateRate"); - if (e) e.innerHTML = "{'Update your rating'|@translate|@escape:'javascript'}"; - e = document.getElementById("ratingScore"); - if (e) e.innerHTML = rating.score; - e = document.getElementById("ratingCount"); - if (e) e.innerHTML = "({'%d rates'|@translate|@escape:'javascript'})".replace( "%d", rating.count); - {rdelim}{rdelim} ); - {/footer_script} - {/strip} - </div> - </form> - </dd> - </div> -{/if} - -{if $display_info.privacy_level and isset($available_permission_levels)} - <div id="Privacy"> - <dt><a id="privacyLevelLink" href="javascript:togglePrivacyLevelBox()">{'Who can see this photo?'|@translate}</a></dt> - <dd> -{combine_script id='core.scripts' require='jquery' load='async' path='themes/default/js/scripts.js'} -{footer_script} -{literal}function setPrivacyLevel(rootUrl, id, level) -{ -var y = new PwgWS(rootUrl); -y.callService( - "pwg.images.setPrivacyLevel", {image_id: id, level:level} , - { - method: "POST", - onFailure: function(num, text) { alert(num + " " + text); }, - onSuccess: function(result) { - jQuery('.levelCheck').hide(); - jQuery('#levelCheck'+level).show(); - jQuery('#privacyLevelBox .switchSelected').addClass('switchUnselected').removeClass('switchSelected'); - jQuery('#switchLevel'+level).addClass('switchSelected').removeClass('switchUnselected'); - } - } - ); -} -function togglePrivacyLevelBox() -{ - var elt = document.getElementById("privacyLevelBox"), - ePos = document.getElementById("privacyLevelLink"); - if (elt.style.display == "none") - { - elt.style.position = "absolute"; - elt.style.left = (ePos.offsetLeft)+"px"; - elt.style.top = (ePos.offsetTop+ePos.offsetHeight)+"px"; - elt.style.display=""; - } - else - elt.style.display="none"; -} -{/literal} -{/footer_script} - - <div id="privacyLevelBox" class="switchBox" onclick="togglePrivacyLevelBox()" style="display:none" onmouseout="e=event.toElement||event.relatedTarget;e.parentNode==this||e==this||togglePrivacyLevelBox()"> - {foreach from=$available_permission_levels item=label key=level} - <span id="levelCheck{$level}" class="levelCheck switchCheck" {if $level != $current.level}style="display:none;"{/if}>✔ </span> - <a id="switchLevel{$level}" {if $level == $current.level}class="switchSelected"{else}class="switchUnselected"{/if} href="javascript:setPrivacyLevel('{$ROOT_URL}', {$current.id}, {$level})">{$label}</a><br> - {/foreach} - </div> - - </dd> - </div> -{/if} -{/strip} -</dl> - -{if isset($metadata)} -<dl id="Metadata" class="infoTable2"> -{foreach from=$metadata item=meta} - <h3>{$meta.TITLE}</h3> - {foreach from=$meta.lines item=value key=label} - <dt>{$label}</dt> - <dd>{$value}</dd> - {/foreach} -{/foreach} -</dl> -{/if} -</div> -</div> - -{if isset($COMMENT_COUNT)} -<div id="comments" {if (!isset($comment_add) && ($COMMENT_COUNT == 0))}class="noCommentContent"{else}class="commentContent"{/if}><div id="commentsSwitcher"></div> - {if $COMMENT_COUNT > 0} - <h3>{$pwg->l10n_dec('%d comment', '%d comments',$COMMENT_COUNT)}</h3> - {else} - <h3 class="noCommentText">{$pwg->l10n_dec('%d comment', '%d comments',$COMMENT_COUNT)}</h3> - {/if} - - <div id="pictureComments"> - {if isset($comment_add)} - <div id="commentAdd"> - <h4>{'Add a comment'|@translate}</h4> - <form method="post" action="{$comment_add.F_ACTION}" class="filter" id="addComment" > - {if $comment_add.SHOW_AUTHOR} - <p><label>{'Author'|@translate} :</label></p> - <p><input type="text" name="author" /></p> - {/if} - <p><label>{'Comment'|@translate} :</label></p> - <p><textarea name="content" id="contentid" rows="10" cols="50">{$comment_add.CONTENT}</textarea></p> - <p><input type="hidden" name="key" value="{$comment_add.KEY}" /> - <input class="submit" type="submit" value="{'Submit'|@translate}"></p> - </form> - </div> - {/if} - {if isset($comments)} - <div id="pictureCommentList"> - {if (($COMMENT_COUNT > 2) || !empty($navbar))} - <div id="pictureCommentNavBar"> - {if $COMMENT_COUNT > 2} - <a href="{$COMMENTS_ORDER_URL}#comments" rel="nofollow" class="commentsOrder">{$COMMENTS_ORDER_TITLE}</a> - {/if} - {if !empty($navbar) }{include file='navigation_bar.tpl'|@get_extent:'navbar'}{/if} - </div> - {/if} - {include file='comment_list.tpl'} - </div> - {/if} - <div style="clear: both;"></div> - </div> - -</div> -{/if}{*comments*} - -{if !empty($PLUGIN_PICTURE_AFTER)}{$PLUGIN_PICTURE_AFTER}{/if} - -</div> diff --git a/themes/elegant/theme.css b/themes/elegant/theme.css index 5a88a4f3d..86387d230 100644 --- a/themes/elegant/theme.css +++ b/themes/elegant/theme.css @@ -149,8 +149,6 @@ a:hover { border-bottom: none;} text-align: left; z-index: 100; } -.switchBox .switchCheck { width: 18px; text-align: left; display: inline-block; line-height:17px;} -.switchBox .switchUnselected { margin-left: 18px; line-height:17px;} .derivativeSizeDetails { display: none;} /* thumbnails */ @@ -176,7 +174,7 @@ a:hover { border-bottom: none;} font-weight:bold; margin:0; } -.imageNumber { display: inline-block; float: right; line-height: 26px; margin-right: 2px; min-width: 40px; text-align: center;} +.imageNumber { display: inline-block; float: right; line-height: 26px; margin: 0 2px 0 0; min-width: 40px; text-align: center;} #imageToolBar { margin-top: -28px; margin-bottom: 0; float: right;} #thePicturePage .pwg-button { width: 26px;} #thePicturePage .actionButtons { margin-right: 26px;} @@ -220,9 +218,10 @@ a:hover { border-bottom: none;} #imageInfos .nextThumbHover { background: transparent url(icon/none.png) no-repeat center center;} #imageInfos .nextThumbHover:hover { background: transparent url(icon/img_next.png) no-repeat center center;} -#imageInfos dl { padding: 0 15px;} -#imageInfos dt { font-weight: bold;} -#imageInfos dd { margin: 0 0 5px 20px;} +#imageInfos dl.imageInfoTable { display: block; padding: 0 15px; margin: 12px auto;} +#imageInfos .imageInfo { display: block; line-height: 16px;} +#imageInfos .imageInfo dt { display: block; font-weight: bold; text-align: left; padding: 0;} +#imageInfos .imageInfo dd { display: block; text-align: left; margin: 0 0 5px 20px;} #imageInfos h3 { margin: 20px 0 10px;} |