1
0

Buttonized some links for better UI consistency.

This commit is contained in:
Matthias Mees
2013-01-04 19:07:37 +01:00
parent 166a811104
commit 1342d5408b
10 changed files with 61 additions and 40 deletions

@ -155,8 +155,8 @@
</details>
<ul class="plainList edit_actions">
<li><a class="icon_link" href="?serendipity[adminModule]=category&amp;serendipity[adminAction]=edit&amp;serendipity[cid]={$category.categoryid}" title="{$CONST.EDIT}"><span class="icon-edit"></span><span class="visuallyhidden"> {$CONST.EDIT}</span></a></li>
<li><a class="icon_link" href="?serendipity[adminModule]=category&amp;serendipity[adminAction]=delete&amp;serendipity[cid]={$category.categoryid}" title="{$CONST.DELETE}"><span class="icon-trash"></span><span class="visuallyhidden"> {$CONST.DELETE}</span></a></li>
<li><a class="button_link" href="?serendipity[adminModule]=category&amp;serendipity[adminAction]=edit&amp;serendipity[cid]={$category.categoryid}" title="{$CONST.EDIT}"><span class="icon-edit"></span><span class="visuallyhidden"> {$CONST.EDIT}</span></a></li>
<li><a class="button_link" href="?serendipity[adminModule]=category&amp;serendipity[adminAction]=delete&amp;serendipity[cid]={$category.categoryid}" title="{$CONST.DELETE}"><span class="icon-trash"></span><span class="visuallyhidden"> {$CONST.DELETE}</span></a></li>
</ul>
</li>
{/foreach}

@ -144,18 +144,18 @@
<ul class="actions clearfix">
{if ($comment.status == 'pending') || ($comment.status == 'confirm')}
<li><a class="icon_link" href="?serendipity[action]=admin&amp;serendipity[adminModule]=comments&amp;serendipity[adminAction]=approve&amp;serendipity[id]={$comment.id}&amp;{$urltoken}" title="{$CONST.APPROVE}"><span class="icon-lock-open"></span><span class="visuallyhidden">{$CONST.APPROVE}</span></a></li>
<li><a class="button_link" href="?serendipity[action]=admin&amp;serendipity[adminModule]=comments&amp;serendipity[adminAction]=approve&amp;serendipity[id]={$comment.id}&amp;{$urltoken}" title="{$CONST.APPROVE}"><span class="icon-lock-open"></span><span class="visuallyhidden">{$CONST.APPROVE}</span></a></li>
{/if}
{if ($comment.status == 'approved')}
<li><a class="icon_link" href="?serendipity[action]=admin&amp;serendipity[adminModule]=comments&amp;serendipity[adminAction]=pending&amp;serendipity[id]={$comment.id}&amp;{$urltoken}" title="{$CONST.SET_TO_MODERATED}"><span class="icon-lock"></span><span class="visuallyhidden"> {$CONST.SET_TO_MODERATED}</span></a></li>
<li><a class="button_link" href="?serendipity[action]=admin&amp;serendipity[adminModule]=comments&amp;serendipity[adminAction]=pending&amp;serendipity[id]={$comment.id}&amp;{$urltoken}" title="{$CONST.SET_TO_MODERATED}"><span class="icon-lock"></span><span class="visuallyhidden"> {$CONST.SET_TO_MODERATED}</span></a></li>
{/if}
{if $comment.excerpt}
<li><a class="icon_link" href="#c{$comment.id}" onclick="FT_toggle({$comment.id}); return false;" title="{$CONST.TOGGLE_ALL}"><span id="{$comment.id}_text">{$CONST.TOGGLE_ALL}</span></a></li>
<li><a class="button_link" href="#c{$comment.id}" onclick="FT_toggle({$comment.id}); return false;" title="{$CONST.TOGGLE_ALL}"><span id="{$comment.id}_text">{$CONST.TOGGLE_ALL}</span></a></li>
{/if}
<li><a class="icon_link" href="{$comment.entrylink}" title="{$CONST.VIEW}"><span class="icon-eye"></span><span class="visuallyhidden"> {$CONST.VIEW}</span></a></li>
<li><a class="icon_link" href="?serendipity[action]=admin&amp;serendipity[adminModule]=comments&amp;serendipity[adminAction]=edit&amp;serendipity[id]={$comment.id}&amp;serendipity[entry_id]={$comment.entry_id}&amp;{$urltoken}" title="{$CONST.EDIT}"><span class="icon-edit"></span><span class="visuallyhidden"> {$CONST.EDIT}</span></a></li>
<li><a class="icon_link" href="?serendipity[action]=admin&amp;serendipity[adminModule]=comments&amp;serendipity[adminAction]=delete&amp;serendipity[id]={$comment.id}&amp;serendipity[entry_id]={$comment.entry_id}&amp;{$urltoken}" onclick='return confirm("{($CONST.COMMENT_DELETE_CONFIRM|sprintf:$comment.id:$comment.author)|escape}")' title="{$CONST.DELETE}"><span class="icon-trash"></span><span class="visuallyhidden"> {$CONST.DELETE}</span></a></li>
<li><a class="icon_link" onclick="cf = window.open(this.href, 'CommentForm', 'width=800,height=600,toolbar=no,scrollbars=1,scrollbars,resize=1,resizable=1'); cf.focus(); return false;" href="?serendipity[action]=admin&amp;serendipity[adminModule]=comments&amp;serendipity[adminAction]=reply&amp;serendipity[id]={$comment.id}&amp;serendipity[entry_id]={$comment.entry_id}&amp;serendipity[noBanner]=true&amp;serendipity[noSidebar]=true&amp;{$urltoken}" title="{$CONST.REPLY}"><span class="icon-chat"></span><span class="visuallyhidden"> {$CONST.REPLY}</span></a></li>
<li><a class="button_link" href="{$comment.entrylink}" title="{$CONST.VIEW}"><span class="icon-eye"></span><span class="visuallyhidden"> {$CONST.VIEW}</span></a></li>
<li><a class="button_link" href="?serendipity[action]=admin&amp;serendipity[adminModule]=comments&amp;serendipity[adminAction]=edit&amp;serendipity[id]={$comment.id}&amp;serendipity[entry_id]={$comment.entry_id}&amp;{$urltoken}" title="{$CONST.EDIT}"><span class="icon-edit"></span><span class="visuallyhidden"> {$CONST.EDIT}</span></a></li>
<li><a class="button_link" href="?serendipity[action]=admin&amp;serendipity[adminModule]=comments&amp;serendipity[adminAction]=delete&amp;serendipity[id]={$comment.id}&amp;serendipity[entry_id]={$comment.entry_id}&amp;{$urltoken}" onclick='return confirm("{($CONST.COMMENT_DELETE_CONFIRM|sprintf:$comment.id:$comment.author)|escape}")' title="{$CONST.DELETE}"><span class="icon-trash"></span><span class="visuallyhidden"> {$CONST.DELETE}</span></a></li>
<li><a class="button_link" onclick="cf = window.open(this.href, 'CommentForm', 'width=800,height=600,toolbar=no,scrollbars=1,scrollbars,resize=1,resizable=1'); cf.focus(); return false;" href="?serendipity[action]=admin&amp;serendipity[adminModule]=comments&amp;serendipity[adminAction]=reply&amp;serendipity[id]={$comment.id}&amp;serendipity[entry_id]={$comment.entry_id}&amp;serendipity[noBanner]=true&amp;serendipity[noSidebar]=true&amp;{$urltoken}" title="{$CONST.REPLY}"><span class="icon-chat"></span><span class="visuallyhidden"> {$CONST.REPLY}</span></a></li>
</ul>
{$comment.action_more}
</div>

@ -140,12 +140,12 @@
<ul class="actions">
{if $entry.preview || (!$showFutureEntries && ($entry.timestamp >= $serverOffsetHour))}
<li><a class="icon_link" href="{$entry.preview_link}" title="{$CONST.PREVIEW} #{$entry.id}"><span class="icon-eye"></span><span class="visuallyhidden"> {$CONST.PREVIEW}</span></a></li>
<li><a class="button_link" href="{$entry.preview_link}" title="{$CONST.PREVIEW} #{$entry.id}"><span class="icon-eye"></span><span class="visuallyhidden"> {$CONST.PREVIEW}</span></a></li>
{else}
<li><a class="icon_link" href="{$entry.archive_link}" title="{$CONST.VIEW} #{$entry.id}"><span class="icon-eye"></span><span class="visuallyhidden"> {$CONST.VIEW}</span></a></li>
<li><a class="button_link" href="{$entry.archive_link}" title="{$CONST.VIEW} #{$entry.id}"><span class="icon-eye"></span><span class="visuallyhidden"> {$CONST.VIEW}</span></a></li>
{/if}
<li><a class="icon_link" href="?serendipity[action]=admin&amp;serendipity[adminModule]=entries&amp;serendipity[adminAction]=edit&amp;serendipity[id]={$entry.id}" title="{$CONST.EDIT} #{$entry.id}"><span class="icon-edit"></span><span class="visuallyhidden"> {$CONST.EDIT}</span></a></li>
<li><a class="icon_link" href="?serendipity[action]=admin&amp;serendipity[adminModule]=entries&amp;serendipity[adminAction]=delete&amp;serendipity[id]={$entry.id}&amp;{$urltoken}" title="{$CONST.DELETE} #{$entry.id}" title="{$CONST.DELETE}"><span class="icon-trash"></span><span class="visuallyhidden"> {$CONST.DELETE}</span></a></li>
<li><a class="button_link" href="?serendipity[action]=admin&amp;serendipity[adminModule]=entries&amp;serendipity[adminAction]=edit&amp;serendipity[id]={$entry.id}" title="{$CONST.EDIT} #{$entry.id}"><span class="icon-edit"></span><span class="visuallyhidden"> {$CONST.EDIT}</span></a></li>
<li><a class="button_link" href="?serendipity[action]=admin&amp;serendipity[adminModule]=entries&amp;serendipity[adminAction]=delete&amp;serendipity[id]={$entry.id}&amp;{$urltoken}" title="{$CONST.DELETE} #{$entry.id}" title="{$CONST.DELETE}"><span class="icon-trash"></span><span class="visuallyhidden"> {$CONST.DELETE}</span></a></li>
</ul>
</li>
{/foreach}

@ -1,4 +1,4 @@
{* HTML5: Yes *}
{* jQuery: NN *}
<span class="block_level standalone"><span class="icon-rss"></span> <a id="export_rss" href="{$serendipityBaseURL}rss.php?version=2.0&all=1">{$CONST.EXPORT_FEED}</a></span>
<a id="export_rss" class="button_link icon_link standalone" href="{$serendipityBaseURL}rss.php?version=2.0&all=1"><span class="icon-rss"></span> {$CONST.EXPORT_FEED}</a>

@ -19,8 +19,8 @@
<li class="clearfix">
<span class="group_name"><span class="icon-users"></span> {$group.name|escape:"html"}</span>
<ul class="plainList edit_actions">
<li><a class="icon_link" href="?serendipity[adminModule]=groups&amp;serendipity[adminAction]=edit&amp;serendipity[group]={$group.id}" title="{$CONST.EDIT} {$group.name|escape:"html"}"><span class="icon-edit"></span><span class="visuallyhidden"> {$CONST.EDIT}</span></a></li>
<li><a class="icon_link" href="?{$deleteFormToken}&amp;serendipity[adminModule]=groups&amp;serendipity[adminAction]=delete&amp;serendipity[group]={$group.id}" title="{$CONST.DELETE} {$group.name|escape:"html"}"><span class="icon-trash"></span><span class="visuallyhidden"> {$CONST.DELETE}</span></a></li>
<li><a class="button_link" href="?serendipity[adminModule]=groups&amp;serendipity[adminAction]=edit&amp;serendipity[group]={$group.id}" title="{$CONST.EDIT} {$group.name|escape:"html"}"><span class="icon-edit"></span><span class="visuallyhidden"> {$CONST.EDIT}</span></a></li>
<li><a class="button_link" href="?{$deleteFormToken}&amp;serendipity[adminModule]=groups&amp;serendipity[adminAction]=delete&amp;serendipity[group]={$group.id}" title="{$CONST.DELETE} {$group.name|escape:"html"}"><span class="icon-trash"></span><span class="visuallyhidden"> {$CONST.DELETE}</span></a></li>
</ul>
</li>
{/foreach}

@ -126,7 +126,7 @@
<section id="pluginlist_sidebar">
<h3>{$CONST.SIDEBAR_PLUGINS}</h3>
<a class="install_plugins block_level" href="?serendipity[adminModule]=plugins&amp;serendipity[adminAction]=addnew">{$CONST.CLICK_HERE_TO_INSTALL_PLUGIN|sprintf:"{$CONST.SIDEBAR_PLUGIN}"}</a>
<a class="install_plugins button_link" href="?serendipity[adminModule]=plugins&amp;serendipity[adminAction]=addnew">{$CONST.CLICK_HERE_TO_INSTALL_PLUGIN|sprintf:"{$CONST.SIDEBAR_PLUGIN}"}</a>
{$backend_plugins_sidebar_header}
{$sidebar_plugins}
@ -135,7 +135,7 @@
<section id="pluginlist_event">
<h3>{$CONST.EVENT_PLUGINS}</h3>
<a class="install_plugins block_level" href="?serendipity[adminModule]=plugins&amp;serendipity[adminAction]=addnew&amp;serendipity[type]=event">{$CONST.CLICK_HERE_TO_INSTALL_PLUGIN|sprintf:"{$CONST.EVENT_PLUGIN}"}</a>
<a class="install_plugins button_link" href="?serendipity[adminModule]=plugins&amp;serendipity[adminAction]=addnew&amp;serendipity[type]=event">{$CONST.CLICK_HERE_TO_INSTALL_PLUGIN|sprintf:"{$CONST.EVENT_PLUGIN}"}</a>
{$backend_plugins_event_header}
{$event_plugins}

@ -58,12 +58,12 @@
<div class="template_status">
{if $template != $cur_template}
{if !$info.unmetRequirements}
<a class="set_as_template" href="?serendipity[adminModule]=templates&amp;serendipity[adminAction]=install&amp;serendipity[theme]={$template}{$info.info.customURI}">{$CONST.SET_AS_TEMPLATE}</a>
<a class="set_as_template button_link" href="?serendipity[adminModule]=templates&amp;serendipity[adminAction]=install&amp;serendipity[theme]={$template}{$info.info.customURI}">{$CONST.SET_AS_TEMPLATE}</a>
{else}
<span class="unmet_requirements block_level">{$info.unmetRequirements}></span>
<span class="unmet_requirements block_level"><span class="icon-attention"></span> {$info.unmetRequirements}></span>
{/if}
{else}
<span class="installed block_level">{$CONST.ALREADY_INSTALLED}</span>
<span class="installed block_level"><span class="icon-ok-circle"></span> {$CONST.ALREADY_INSTALLED}</span>
{/if}
</div>
</article>

@ -49,9 +49,9 @@
<li class="clearfix">
<span class="user_name user_{if $user.userlevel >= {$CONST.USERLEVEL_ADMIN}}admin{else}{if $user.userlevel >= {$CONST.USERLEVEL_CHIEF}}chief{else}editor{/if}{/if}"><span class="icon-user"></span> {$user.realname|escape:"html"} ({$user.userlevel})</span>
<ul class="plainList edit_actions">
<li><a class="icon_link" href="{$user.authorUrl}" title="{$CONST.PREVIEW} {$user.realname}"><span class="icon-eye"></span><span class="visuallyhidden"> {$CONST.PREVIEW}</span></a></li>
<li><a class="icon_link" href="?serendipity[adminModule]=users&amp;serendipity[adminAction]=edit&amp;serendipity[userid]={$user.authorid}#editform" title="{$CONST.EDIT} {$user.realname|escape:"html"}"><span class="icon-edit"></span><span class="visuallyhidden"> {$CONST.EDIT}</span></a></li>
<li><a class="icon_link" href="?{$urlFormToken}&amp;serendipity[adminModule]=users&amp;serendipity[adminAction]=delete&amp;serendipity[userid]=$user.authorid" title="{$CONST.DELETE} {$user.realname|escape:"html"}"><span class="icon-trash"></span><span class="visuallyhidden"> {$CONST.DELETE}</span></a></li>
<li><a class="button_link" href="{$user.authorUrl}" title="{$CONST.PREVIEW} {$user.realname}"><span class="icon-eye"></span><span class="visuallyhidden"> {$CONST.PREVIEW}</span></a></li>
<li><a class="button_link" href="?serendipity[adminModule]=users&amp;serendipity[adminAction]=edit&amp;serendipity[userid]={$user.authorid}#editform" title="{$CONST.EDIT} {$user.realname|escape:"html"}"><span class="icon-edit"></span><span class="visuallyhidden"> {$CONST.EDIT}</span></a></li>
<li><a class="button_link" href="?{$urlFormToken}&amp;serendipity[adminModule]=users&amp;serendipity[adminAction]=delete&amp;serendipity[userid]=$user.authorid" title="{$CONST.DELETE} {$user.realname|escape:"html"}"><span class="icon-trash"></span><span class="visuallyhidden"> {$CONST.DELETE}</span></a></li>
</ul>
</li>
{/if}

@ -21,7 +21,7 @@
{* TODO: this should be input[type=datetime] *}
<label for="serendipityNewTimestamp">{$CONST.DATE}</label>
<input id="serendipityNewTimestamp" name="serendipity[new_timestamp]" type="text" value="{$entry_vars.timestamp|@formatTime:DATE_FORMAT_2:true:false:true}">
<a id="reset_timestamp" class="icon_link" href="#" onclick="document.getElementById('serendipityNewTimestamp').value = '{$entry_vars.reset_timestamp|@formatTime:DATE_FORMAT_2:true:false:true}'; return false;" title="{$CONST.RESET_DATE_DESC}"><span class="icon-clock"></span><span class="visuallyhidden"> {$CONST.RESET_DATE}</span></a>
<a id="reset_timestamp" class="button_link" href="#" onclick="document.getElementById('serendipityNewTimestamp').value = '{$entry_vars.reset_timestamp|@formatTime:DATE_FORMAT_2:true:false:true}'; return false;" title="{$CONST.RESET_DATE_DESC}"><span class="icon-clock"></span><span class="visuallyhidden"> {$CONST.RESET_DATE}</span></a>
</div>
{/if}
<div id="edit_entry_category" class="form_select">

@ -463,6 +463,7 @@ input[type="checkbox"] {
*top: -5px;
}
.button_link:focus,
button:focus, input:focus,
select:focus, textarea:focus {
-webkit-box-shadow: #0066ff 0 0 5px 0;
@ -479,6 +480,7 @@ input[type="checkbox"]:focus, input[type="checkbox"]:active {
box-shadow: none;
}
.button_link,
button, input[type="button"],
input[type="reset"],
input[type="submit"] {
@ -491,11 +493,11 @@ input[type="submit"] {
-moz-background-clip: padding;
background-clip: padding-box;
background: #ddd;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ffffff), color-stop(100%, #dddddd));
background-image: -webkit-linear-gradient(#ffffff, #dddddd);
background-image: -moz-linear-gradient(#ffffff, #dddddd);
background-image: -o-linear-gradient(#ffffff, #dddddd);
background-image: linear-gradient(#ffffff, #dddddd);
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fff), color-stop(100%, #ddd));
background-image: -webkit-linear-gradient(#fff, #ddd);
background-image: -moz-linear-gradient(#fff, #ddd);
background-image: -o-linear-gradient(#fff, #ddd);
background-image: linear-gradient(#fff, #ddd);
border: 1px solid;
border-color: #ddd #bbb #999;
color: #000;
@ -507,24 +509,26 @@ input[type="submit"] {
*padding-bottom: 0;
}
.button_link:hover,
button:hover, input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ffffff), color-stop(1px, #eeeeee), color-stop(100%, #cccccc));
background-image: -webkit-linear-gradient(#ffffff, #eeeeee 1px, #cccccc);
background-image: -moz-linear-gradient(#ffffff, #eeeeee 1px, #cccccc);
background-image: -o-linear-gradient(#ffffff, #eeeeee 1px, #cccccc);
background-image: linear-gradient(#ffffff, #eeeeee 1px, #cccccc);
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fff), color-stop(1px, #eee), color-stop(100%, #ccc));
background-image: -webkit-linear-gradient(#fff, #eee 1px, #ccc);
background-image: -moz-linear-gradient(#fff, #eee 1px, #ccc);
background-image: -o-linear-gradient(#fff, #eee 1px, #ccc);
background-image: linear-gradient(#fff, #eee 1px, #ccc);
}
.button_link:active,
button:active, input[type="button"]:active,
input[type="reset"]:active,
input[type="submit"]:active {
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ffffff), color-stop(1px, #dddddd), color-stop(100%, #eeeeee));
background-image: -webkit-linear-gradient(#ffffff, #dddddd 1px, #eeeeee);
background-image: -moz-linear-gradient(#ffffff, #dddddd 1px, #eeeeee);
background-image: -o-linear-gradient(#ffffff, #dddddd 1px, #eeeeee);
background-image: linear-gradient(#ffffff, #dddddd 1px, #eeeeee);
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fff), color-stop(1px, #ddd), color-stop(100%, #eee));
background-image: -webkit-linear-gradient(#fff, #ddd 1px, #eee);
background-image: -moz-linear-gradient(#fff, #ddd 1px, #eee);
background-image: -o-linear-gradient(#fff, #ddd 1px, #eee);
background-image: linear-gradient(#fff, #ddd 1px, #eee);
-webkit-box-shadow: inset rgba(0, 0, 0, 0.25) 0 1px 2px 0;
-moz-box-shadow: inset rgba(0, 0, 0, 0.25) 0 1px 2px 0;
box-shadow: inset rgba(0, 0, 0, 0.25) 0 1px 2px 0;
@ -686,6 +690,19 @@ a, a:visited { color: #3a4b6f; }
a:hover, a:focus { color: #d06604; }
a.button_link,
a.button_link:hover,
a.button_link:focus,
.button_link>span:before {
color: #000;
text-decoration: none;
}
.button_link>span:before {
margin-right: 0;
width: auto;
}
h1 {
font-size: 1.71429em;
line-height: 1.75em;
@ -815,6 +832,10 @@ summary { cursor: pointer; }
.category_desc { margin: 0 1em 0 0; }
#categories li,
#serendipity_users li,
#serendipity_groups li { margin: .125em 0; }
.users_delete_action {
position: relative;
top: 1.5em;