keith/friendica
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

frio - improve some hover effects to action link/buttons

Browse source
This commit is contained in:
rabuzarus 2018-08-11 13:41:55 +02:00
parent bf5896d4e3
commit 7cecc5a24c
9 changed files with 98 additions and 71 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
view/theme/frio/css/style.css
View file

@ -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;

17
view/theme/frio/templates/contact_block.tpl
View file

@ -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}}
{{foreach $micropro as $m}}
{{$m}}
{{/foreach}}
</div>
{{/if}}
{{/if}}
</div>
<div class="clear"></div>

4
view/theme/frio/templates/events_js.tpl
View file

@ -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>

36
view/theme/frio/templates/group_side.tpl
View file

@ -1,21 +1,21 @@
<div class="widget" id="group-sidebar">
<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>
{{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>
<form id="group-new-form" action="group/new" method="post" style="display:none;">
<div class="form-group">
<input type="hidden" name="form_security_token" value="{{$form_security_token}}">
<input name="groupname" id="id_groupname" class="form-control input-sm" placeholder="{{$creategroup}}">
</div>
</form>
{{/if}}
<h3>{{$title}}</h3>
{{if ! $newgroup}}
<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 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">
<input type="hidden" name="form_security_token" value="{{$form_security_token}}">
<input name="groupname" id="id_groupname" class="form-control input-sm" placeholder="{{$creategroup}}">
</div>
</form>
{{/if}}
</div>
<div id="sidebar-group-list">
{{* The list of available groups *}}
@ -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>

10
view/theme/frio/templates/mail_head.tpl
View file

@ -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>

37
view/theme/frio/templates/photo_album.tpl
View file

@ -1,40 +1,43 @@
<div class="generic-page-wrapper">
<div class="pull-left">
<h3 id="photo-album-title">{{$album}}</h3>
<h3 id="photo-album-title">{{$album}}</h3>
</div>
<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">
{{if $order.2 == "newest"}}
<i class="faded-icon fa fa-sort-numeric-desc"></i>
{{else}}
<i class="faded-icon fa fa-sort-numeric-asc"></i>
{{/if}}
<a class="photos-order-link page-action faded-icon" href="{{$order.1}}" title="{{$order.0}}" data-toggle="tooltip">
{{if $order.2 == "newest"}}
<i class="fa fa-sort-numeric-desc"></i>
{{else}}
<i class="fa fa-sort-numeric-asc"></i>
{{/if}}
</a>
{{/if}}
</div>
<div class="clear"></div>
<div class="photo-album-wrapper" id="photo-album-contents">
{{foreach $photos as $photo}}
{{include file="photo_top.tpl"}}
{{/foreach}}
{{foreach $photos as $photo}}
{{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>

28
view/theme/frio/templates/photo_albums.tpl
View file

@ -1,14 +1,18 @@
<div id="sidebar-photos-albums" class="widget">
<div class="pull-left">
<h3>{{$title}}</h3>
<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>
{{/if}}
<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>
@ -16,13 +20,13 @@
{{if $albums}}
{{foreach $albums as $al}}
{{if $al.text}}
<li role="menuitem" class="sidebar-photos-albums-li">
<a href="{{$baseurl}}/photos/{{$nick}}/album/{{$al.bin2hex}}" class="sidebar-photos-albums-element">
<span class="badge pull-right">{{$al.total}}</span>{{$al.text}}
</a>
</li>
{{/if}}
{{if $al.text}}
<li role="menuitem" class="sidebar-photos-albums-li">
<a href="{{$baseurl}}/photos/{{$nick}}/album/{{$al.bin2hex}}" class="sidebar-photos-albums-element">
<span class="badge pull-right">{{$al.total}}</span>{{$al.text}}
</a>
</li>
{{/if}}
{{/foreach}}
{{/if}}
</ul>

4
view/theme/frio/templates/profile_listing_header.tpl
View file

@ -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">

4
view/theme/frio/templates/saved_searches_aside.tpl
View file

@ -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=&amp;remove=1&amp;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=&amp;remove=1&amp;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}}