frio - improve some hover effects to action link/buttons
This commit is contained in:
parent
bf5896d4e3
commit
7cecc5a24c
9 changed files with 98 additions and 71 deletions
|
@ -1106,7 +1106,7 @@ aside .vcard .tool .action{
|
|||
transition: all 0.25s ease-in-out;
|
||||
}
|
||||
aside .vcard .tool a {
|
||||
color: rgba(255,255,255,.85);
|
||||
color: rgba(255,255,255,.85);
|
||||
}
|
||||
aside .vcard #profile-photo-wrapper:hover .tool .action {
|
||||
opacity: 1;
|
||||
|
@ -1244,14 +1244,22 @@ div#sidebar-group-list {
|
|||
transition: all 0.1s ease-in-out;
|
||||
}
|
||||
.faded-icon:hover {
|
||||
color: #555;
|
||||
opacity: 1;
|
||||
}
|
||||
.icon-padding {
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
||||
aside #group-sidebar .sidebar-group-li .group-edit-tool:hover,
|
||||
aside #saved-search-list .saved-search-li .savedsearchdrop:hover {
|
||||
aside #group-sidebar .sidebar-group-li:hover .group-edit-tool.faded-icon,
|
||||
aside #saved-search-list .saved-search-li:hover .savedsearchdrop.faded-icon,
|
||||
aside .widget:hover .widget-action.faded-icon {
|
||||
opacity: 0.8;
|
||||
transition: all 0.25s ease-in-out;
|
||||
}
|
||||
aside #group-sidebar .sidebar-group-li .group-edit-tool.faded-icon:hover,
|
||||
aside #saved-search-list .saved-search-li .savedsearchdrop.faded-icon:hover,
|
||||
aside .widget .widget-action.faded-icon:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
aside #group-sidebar li .group-checkbox {
|
||||
|
@ -2184,6 +2192,13 @@ ul.dropdown-menu li:hover {
|
|||
-webkit-box-shadow: 0 0 3px #dadada;
|
||||
-moz-box-shadow: 0 0 3px #dadada;
|
||||
}
|
||||
#content:hover .page-action.faded-icon {
|
||||
opacity: 0.8;
|
||||
transition: all 0.25s ease-in-out;
|
||||
}
|
||||
#content .page-action.faded-icon:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.section-title-wrapper {
|
||||
overflow: hidden;
|
||||
|
|
|
@ -1,15 +1,18 @@
|
|||
|
||||
<div id="contact-block">
|
||||
<h3 class="contact-block-h4 pull-left">{{$contacts}}</h3>
|
||||
{{if $micropro}}
|
||||
<a class="pull-right" href="viewcontacts/{{$nickname}}">
|
||||
<i class="faded-icon fa fa-eye" aria-hidden="true"></i><span class="sr-only">{{$viewcontacts}}</span>
|
||||
|
||||
{{if $micropro}}
|
||||
<a class="pull-right widget-action faded-icon" id="contact-block-view-contacts" href="viewcontacts/{{$nickname}}">
|
||||
<i class="fa fa-eye" aria-hidden="true"></i>
|
||||
<span class="sr-only">{{$viewcontacts}}</span>
|
||||
</a>
|
||||
|
||||
<div class='contact-block-content'>
|
||||
{{foreach $micropro as $m}}
|
||||
{{$m}}
|
||||
{{/foreach}}
|
||||
</div>
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
|
|
|
@ -4,8 +4,8 @@
|
|||
|
||||
{{* The link to create a new event *}}
|
||||
<div class="pull-right" id="new-event-link">
|
||||
<button type="button" class="btn-link" onclick="addToModal('{{$new_event.0}}')" title="{{$new_event.1}}" data-toggle="tooltip">
|
||||
<i class="faded-icon fa fa-plus"></i>
|
||||
<button type="button" class="btn-link page-action faded-icon" onclick="addToModal('{{$new_event.0}}')" title="{{$new_event.1}}" data-toggle="tooltip">
|
||||
<i class="fa fa-plus"></i>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
|
|
|
@ -2,12 +2,12 @@
|
|||
<div id="sidebar-group-header">
|
||||
<h3>{{$title}}</h3>
|
||||
{{if ! $newgroup}}
|
||||
<a class="group-edit-tool pull-right" href="{{$grouppage}}" data-toggle="tooltip" title="{{$editgroupstext}}">
|
||||
<i class="faded-icon fa fa-pencil" aria-hidden="true"></i>
|
||||
<a class="group-edit-tool pull-right widget-action faded-icon" id="sidebar-edit-group" href="{{$grouppage}}" data-toggle="tooltip" title="{{$editgroupstext}}">
|
||||
<i class="fa fa-pencil" aria-hidden="true"></i>
|
||||
</a>
|
||||
{{else}}
|
||||
<a class="group-edit-tool pull-right" id="sidebar-new-group" onclick="javascript:$('#group-new-form').fadeIn('fast');" data-toggle="tooltip" title="{{$createtext}}">
|
||||
<i class="faded-icon fa fa-plus" aria-hidden="true"></i>
|
||||
<a class="group-edit-tool pull-right widget-action faded-icon" id="sidebar-new-group" onclick="javascript:$('#group-new-form').fadeIn('fast');" data-toggle="tooltip" title="{{$createtext}}">
|
||||
<i class="fa fa-plus" aria-hidden="true"></i>
|
||||
</a>
|
||||
<form id="group-new-form" action="group/new" method="post" style="display:none;">
|
||||
<div class="form-group">
|
||||
|
@ -38,8 +38,8 @@
|
|||
{{/if}}
|
||||
{{if $group.edit}}
|
||||
{{* if the group is editable show a little pencil for editing *}}
|
||||
<a id="edit-sidebar-group-element-{{$group.id}}" class="group-edit-tool pull-right" href="{{$group.edit.href}}" data-toggle="tooltip" title="{{$edittext}}">
|
||||
<i class="faded-icon fa fa-pencil" aria-hidden="true"></i>
|
||||
<a id="edit-sidebar-group-element-{{$group.id}}" class="group-edit-tool pull-right faded-icon" href="{{$group.edit.href}}" data-toggle="tooltip" title="{{$edittext}}">
|
||||
<i class="fa fa-pencil" aria-hidden="true"></i>
|
||||
</a>
|
||||
{{/if}}
|
||||
<a id="sidebar-group-element-{{$group.id}}" class="sidebar-group-element" href="{{$group.href}}">{{$group.text}}</a>
|
||||
|
|
|
@ -1,16 +1,16 @@
|
|||
|
||||
<div class="pull-left">
|
||||
<h3 class="heading">{{$messages}}</h3>
|
||||
<h3 class="heading">{{$messages}}</h3>
|
||||
</div>
|
||||
|
||||
<div id="message-new" class="pull-right">
|
||||
{{if $button.sel == "new"}}
|
||||
<a href="{{$button.url}}" accesskey="m" class="newmessage-selected" title="{{$button.label}}" data-toggle="tooltip">
|
||||
<i class="faded-icon fa fa-plus"></i>
|
||||
<a href="{{$button.url}}" accesskey="m" class="newmessage-selected faded-icon page-action" title="{{$button.label}}" data-toggle="tooltip">
|
||||
<i class="fa fa-plus"></i>
|
||||
</a>
|
||||
{{else}}
|
||||
<a href="{{$button.url}}" title="{{$button.label}}" data-toggle="tooltip">
|
||||
<i class="faded-icon fa fa-close"></i>
|
||||
<a href="{{$button.url}}" title="{{$button.label}}" class="faded-icon page-action" data-toggle="tooltip">
|
||||
<i class="fa fa-close"></i>
|
||||
</a>
|
||||
{{/if}}
|
||||
</div>
|
||||
|
|
|
@ -5,21 +5,25 @@
|
|||
|
||||
<div class="photo-album-actions pull-right">
|
||||
{{if $can_post}}
|
||||
<a class="photos-upload-link" href="{{$upload.1}}" title="{{$upload.0}}" data-toggle="tooltip">
|
||||
<i class="faded-icon fa fa-plus"></i></a>
|
||||
<a class="photos-upload-link page-action faded-icon" href="{{$upload.1}}" title="{{$upload.0}}" data-toggle="tooltip">
|
||||
<i class="fa fa-plus"></i>
|
||||
</a>
|
||||
{{/if}}
|
||||
|
||||
{{if $edit}}
|
||||
<span class="icon-padding"> </span>
|
||||
<a id="album-edit-link" href="{{$edit.1}}" title="{{$edit.0}}" data-toggle="tooltip">
|
||||
<i class="faded-icon fa fa-pencil"></i></a>
|
||||
<a id="album-edit-link" class="page-action faded-icon" href="{{$edit.1}}" title="{{$edit.0}}" data-toggle="tooltip">
|
||||
<i class="fa fa-pencil"></i>
|
||||
</a>
|
||||
{{/if}}
|
||||
|
||||
{{if ! $noorder}}
|
||||
<span class="icon-padding"> </span>
|
||||
<a class="photos-order-link" href="{{$order.1}}" title="{{$order.0}}" data-toggle="tooltip">
|
||||
<a class="photos-order-link page-action faded-icon" href="{{$order.1}}" title="{{$order.0}}" data-toggle="tooltip">
|
||||
{{if $order.2 == "newest"}}
|
||||
<i class="faded-icon fa fa-sort-numeric-desc"></i>
|
||||
<i class="fa fa-sort-numeric-desc"></i>
|
||||
{{else}}
|
||||
<i class="faded-icon fa fa-sort-numeric-asc"></i>
|
||||
<i class="fa fa-sort-numeric-asc"></i>
|
||||
{{/if}}
|
||||
</a>
|
||||
{{/if}}
|
||||
|
@ -31,10 +35,9 @@
|
|||
{{include file="photo_top.tpl"}}
|
||||
{{/foreach}}
|
||||
</div>
|
||||
|
||||
<div class="photo-album-end"></div>
|
||||
|
||||
{{$paginate}}
|
||||
|
||||
<script type="text/javascript">$(document).ready(function() { loadingPage = false; justifyPhotos(); });</script>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">$(document).ready(function() { loadingPage = false; justifyPhotos(); });</script>
|
||||
|
|
|
@ -2,13 +2,17 @@
|
|||
<div class="pull-left">
|
||||
<h3>{{$title}}</h3>
|
||||
</div>
|
||||
|
||||
<div class="pull-right">
|
||||
{{if $can_post}}
|
||||
<div class="photos-upload-link" ><a href="{{$upload.1}}" title="{{$upload.0}}" data-toggle="tooltip">
|
||||
<i class="faded-icon fa fa-plus"></i>
|
||||
</a></div>
|
||||
<div class="photos-upload-link">
|
||||
<a href="{{$upload.1}}" title="{{$upload.0}}" class="widget-action faded-icon" data-toggle="tooltip">
|
||||
<i class="fa fa-plus"></i>
|
||||
</a>
|
||||
</div>
|
||||
{{/if}}
|
||||
</div>
|
||||
|
||||
<ul role="menubar" class="sidebar-photos-albums-ul clear">
|
||||
<li role="menuitem" class="sidebar-photos-albums-li">
|
||||
<a href="{{$baseurl}}/photos/{{$nick}}" class="sidebar-photos-albums-element" title="{{$title}}" >{{$recent}}</a>
|
||||
|
|
|
@ -4,8 +4,8 @@
|
|||
<h2>{{$header}}</h2>
|
||||
</div>
|
||||
<div id="profile-listing-new-link-wrapper" class="pull-right" >
|
||||
<a href="{{$cr_new_link}}" id="profile-listing-new-link" title="{{$cr_new}}" data-toggle="tooltip">
|
||||
<i class="faded-icon fa fa-plus"></i></a>
|
||||
<a href="{{$cr_new_link}}" id="profile-listing-new-link" class="page-action faded-icon" title="{{$cr_new}}" data-toggle="tooltip">
|
||||
<i class="fa fa-plus"></i></a>
|
||||
</div>
|
||||
|
||||
<div class="section-content-wrapper">
|
||||
|
|
|
@ -6,7 +6,9 @@
|
|||
<ul role="menu" id="saved-search-ul">
|
||||
{{foreach $saved as $search}}
|
||||
<li role="menuitem" class="saved-search-li clear">
|
||||
<a title="{{$search.delete}}" onclick="return confirmDelete();" id="drop-saved-search-term-{{$search.id}}" class="savedsearchdrop pull-right" href="network/?f=&remove=1&search={{$search.encodedterm}}"><i class="faded-icon fa fa-trash" aria-hidden="true"></i></a>
|
||||
<a title="{{$search.delete}}" onclick="return confirmDelete();" id="drop-saved-search-term-{{$search.id}}" class="savedsearchdrop pull-right widget-action faded-icon" href="network/?f=&remove=1&search={{$search.encodedterm}}">
|
||||
<i class="fa fa-trash" aria-hidden="true"></i>
|
||||
</a>
|
||||
<a id="saved-search-term-{{$search.id}}" class="savedsearchterm" href="search?search={{$search.encodedterm}}">{{$search.term}}</a>
|
||||
</li>
|
||||
{{/foreach}}
|
||||
|
|
Loading…
Reference in a new issue