Merge pull request #12699 from damianwajer/frio-ux-improvements

[frio] Various UX improvements (mostly larger clickable areas)
This commit is contained in:
Hypolite Petovan 2023-01-19 17:05:22 -05:00 committed by GitHub
commit 208d6db776
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
14 changed files with 133 additions and 82 deletions

View file

@ -69,8 +69,8 @@
<img role="presentation" id="profile-rotator" src="images/rotator.gif" alt="{{$l10n.wait}}" title="{{$l10n.wait}}" style="display: none;" />
</span>
<span role="presentation" id="character-counter" class="grey text-info"></span>
<button type="button" class="btn btn-defaul btn-sm" onclick="preview_comment({{$id}});" id="comment-edit-preview-link-{{$id}}" tabindex="5"><i class="fa fa-eye"></i> {{$l10n.preview}}</button>
<button type="submit" class="btn btn-primary btn-sm" id="comment-edit-submit-{{$id}}" name="submit" tabindex="4"><i class="fa fa-envelope"></i> {{$l10n.submit}}</button>
<button type="button" class="btn btn-defaul" onclick="preview_comment({{$id}});" id="comment-edit-preview-link-{{$id}}" tabindex="5"><i class="fa fa-eye"></i> {{$l10n.preview}}</button>
<button type="submit" class="btn btn-primary" id="comment-edit-submit-{{$id}}" name="submit" tabindex="4"><i class="fa fa-envelope"></i> {{$l10n.submit}}</button>
</p>
<div id="comment-edit-preview-{{$id}}" class="comment-edit-preview" style="display:none;"></div>

View file

@ -367,6 +367,10 @@ btn-eventnav:hover {
aside .badge {
opacity: 0.7;
}
.forum-widget-entry .badge,
.sidebar-group-li .badge {
margin-top: 6px;
}
/* disabled elements */
.community-content-wrapper > h3,
@ -807,13 +811,15 @@ nav.navbar .nav > li > button:focus {
}
#offcanvasUsermenu a {
display: block;
margin: -10px -15px;
padding: 10px 15px;
}
#offcanvasUsermenu li.nav-sitename {
font-weight: bold;
}
#topbar-first .dropdown.account li#nav-sitename {
padding-left: 15px;
padding-right: 15px;
padding-left: 20px;
padding-right: 20px;
font-weight: bold;
word-break: break-word;
}
@ -822,6 +828,10 @@ nav.navbar .nav > li > button:focus {
background-color: $nav_bg;
}
/* Nav Search */
.menu-popup {
max-height: calc(100vh - 55px);
overflow-y: auto;
}
#topbar-first #search-box .navbar-form {
margin: 0px;
padding: 12px 12px;
@ -963,13 +973,15 @@ ul li .intro-wrapper button.intro-action-link {
background-color: $nav_bg;
border: none;
}
.dropdown-menu .divider {
margin: 5px 0;
}
.nav-pills .dropdown-menu li.divider,
.nav-tabs .dropdown-menu li.divider,
.account .dropdown-menu li.divider,
.contact-photo-wrapper .dropdown-menu li.divider {
background-color: $menu_background_hover_color;
border-bottom: none;
margin: 9px 1px !important;
}
.nav-pills .dropdown-menu li > a,
.nav-tabs .dropdown-menu li > a,
@ -987,8 +999,6 @@ ul li .intro-wrapper button.intro-action-link {
.contact-photo-wrapper .dropdown-menu li .btn-link {
color: $nav_icon_color;
font-weight: 400;
font-size: 13px;
padding: 4px 15px;
width: 100%;
text-align: left;
}
@ -1044,7 +1054,6 @@ aside .widget,
position: relative;
margin-bottom: 20px;
padding: 10px;
font-size: 13px;
overflow: auto;
}
aside .widget h3,
@ -1052,7 +1061,7 @@ aside .widget h3,
font-weight: bold;
font-size: 16px;
margin: 0;
padding-bottom: 20px;
padding-bottom: 10px;
}
aside .widget ul,
@ -1065,10 +1074,11 @@ aside .widget ul,
list-style: none;
}
aside .widget li .label {
float: left;
}
aside .widget li,
.nav-container .widget li {
padding-top: 2px;
padding-bottom: 2px;
padding-left: 20px;
padding-right: 10px;
}
@ -1081,6 +1091,12 @@ aside .widget li.selected,
border-left: 3px solid $link_color !important;
padding-left: 17px;
}
.side-link-link,
aside .widget li a {
display: block;
padding-top: 6px;
padding-bottom: 6px;
}
aside .widget li a,
aside .widget li a:hover {
color: $font_color_darker;
@ -1300,8 +1316,12 @@ div#sidebar-group-list {
}
.group-edit-tool {
padding-top: 0;
color: $font_color_darker;
}
.sidebar-widget-header .group-edit-tool {
margin-top: -5px;
}
.faded-icon {
color: $font_color_darker;
@ -1316,9 +1336,12 @@ div#sidebar-group-list {
margin-left: 20px;
}
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 {
aside .widget-action {
padding: 5px 10px;
}
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: 0.8;
transition: all 0.25s ease-in-out;
}
@ -1328,7 +1351,7 @@ aside .widget .widget-action.faded-icon:hover {
opacity: 1;
}
aside #group-sidebar li .group-checkbox {
margin: 0;
margin: 6px 0 0;
}
aside #group-sidebar li .group-edit-tool {
padding-right: 10px;
@ -1762,9 +1785,6 @@ blockquote.shared_content {
}
/* wall items contact info */
.media .media-body {
font-size: 13px;
}
.media .media-body h4.media-heading {
font-size: 14px;
font-weight: 500;
@ -1930,6 +1950,9 @@ code > .hl-main {
margin: 10px 0;
font-size: 13px;
}
.wall-item-tags:empty {
margin: 0;
}
.wall-item-tags a {
color: $font_color_darker;
@ -1953,14 +1976,16 @@ code > .hl-main {
margin: 0;
justify-content: space-between;
}
.wall-item-actions .btn,
.wall-item-actions a,
.wall-item-actions button {
font-size: 13px;
color: $font_color_darker;
background-color: transparent;
}
.wall-item-actions .active {
font-weight: bold;
color: $link_color;
box-shadow: none;
}
.wall-item-actions-left {
display: table-cell;
@ -1970,17 +1995,31 @@ code > .hl-main {
display: flex;
}
.wall-item-actions .checkbox {
margin: 0;
margin-left: 20px;
margin: 0 0 0 15px;
}
@media screen and (max-width: 767px) {
.wall-item-actions .btn,
.wall-item-actions a,
.wall-item-actions button {
padding-right: 12px;
padding-left: 12px;
}
.wall-item-actions .checkbox {
margin-top: 8px;
}
.wall-item-actions .like-rotator {
padding-top: 8px;
}
}
.wall-item-actions button:hover {
color: $font_color_darker;
text-decoration: underline;
}
.wall-item-actions .separator {
margin: 0 0.3em;
}
.wall-item-responses {
margin-top: .3em;
}
.wall-item-responses > div > p {
margin: 0;
}
@ -2174,6 +2213,10 @@ the section element. Only after we have
moved it to the nav through js */
display: none !important;
}
.tabbar-wrapper__link {
padding-right: 10px;
padding-left: 10px;
}
#tabmenu,
.tabbar-wrapper,
.tabbar,
@ -2190,7 +2233,6 @@ ul.tabs {
list-style: none;
height: 100%;
padding: 0;
padding-top: 10px;
margin: 0;
}
ul.tabs li {
@ -2203,8 +2245,9 @@ ul.tabs li {
transition: all 0.15s ease;
}
ul.tabs li a {
margin-left: 10px;
margin-right: 10px;
display: block;
padding-top: 11px;
padding-bottom: 11px;
}
ul.tabs li:hover,
ul.tabs li.active {
@ -2214,7 +2257,7 @@ ul.tabs li.active {
padding-top: 0;
}
#dropdownMenuTools-xs {
padding: 9px 10px;
padding: 9px 15px;
}
ul.tabbar ul.tabs-extended:hover li.dropdown {
border-bottom: 0;
@ -2236,6 +2279,12 @@ ul.dropdown-menu li:hover {
box-sizing: border-box;
}
/* Dropdown Menu */
.dropdown-menu li .btn-link,
.dropdown-menu li a,
.tabs .dropdown-menu li a {
padding: 6px 20px;
font-size: 14px;
}
.dropdown-menu li a,
.dropdown-menu li .btn-link {
color: $font_color_darker;
@ -2493,20 +2542,18 @@ ul.viewcontact_wrapper > li {
}
.contact-wrapper .contact-actions {
display: flex;
position: relative;
margin: -8px -8px 0 0;
}
.contact-wrapper .contact-action-link,
.contact-wrapper .contact-action-link:hover,
.textcomplete-item .contact-wrapper .contact-action-link {
padding: 0 5px;
color: $font_color_darker;
border: 0;
}
.contact-wrapper .contact-action-link {
opacity: 0.1;
transition: all 0.25s ease-in-out;
}
ul li:hover .contact-wrapper .contact-action-link {
opacity: 0.8;
background-color: transparent;
opacity: 0.3;
transition: all 0.25s ease-in-out;
}
ul li:hover .contact-wrapper .contact-action-link:hover {
@ -2912,6 +2959,10 @@ ul li:hover .contact-wrapper .contact-action-link:hover {
.section-subtitle-wrapper {
padding: 1px 10px;
}
.accordion-toggle {
width: 100%;
text-align: left;
}
details.profile-jot-net[open] summary:before,
.panel .section-subtitle-wrapper .accordion-toggle:before {
font-family: ForkAwesome;
@ -2976,6 +3027,12 @@ details.profile-jot-net[open] summary:before {
margin-top: 10px;
margin-bottom: 10px;
}
.section-subtitle-wrapper > h2 .accordion-toggle {
margin-top: -10px;
margin-bottom: -10px;
padding-top: 10px;
padding-bottom: 10px;
}
.section-subtitle-wrapper > h3 {
font-size: 16px;

View file

@ -17,7 +17,7 @@
{{* The dropdown to change the callendar view *}}
<ul class="nav nav-pills">
<li class="dropdown pull-right">
<button class="btn btn-link btn-sm dropdown-toggle" type="button" id="event-calendar-views" data-toggle="dropdown" aria-expanded="false">
<button class="btn btn-link dropdown-toggle" type="button" id="event-calendar-views" data-toggle="dropdown" aria-expanded="false">
<i class="fa fa-angle-down" aria-hidden="true"></i> {{$view}}
</button>
<ul class="dropdown-menu pull-right" role="menu" aria-labelledby="event-calendar-views">

View file

@ -54,9 +54,9 @@
<p class="comment-edit-submit-wrapper">
{{if $preview}}
<button type="button" class="btn btn-defaul btn-sm comment-edit-preview" onclick="preview_comment({{$id}});" id="comment-edit-preview-link-{{$id}}"><i class="fa fa-eye"></i> {{$preview}}</button>
<button type="button" class="btn btn-defaul comment-edit-preview" onclick="preview_comment({{$id}});" id="comment-edit-preview-link-{{$id}}"><i class="fa fa-eye"></i> {{$preview}}</button>
{{/if}}
<button type="submit" class="btn btn-primary btn-sm comment-edit-submit" id="comment-edit-submit-{{$id}}" name="submit" data-loading-text="{{$loading}}"><i class="fa fa-envelope"></i> {{$submit}}</button>
<button type="submit" class="btn btn-primary comment-edit-submit" id="comment-edit-submit-{{$id}}" name="submit" data-loading-text="{{$loading}}"><i class="fa fa-envelope"></i> {{$submit}}</button>
</p>
<div class="comment-edit-end clear"></div>

View file

@ -6,7 +6,7 @@
<ul class="tabs flex-nav" role="menu">
{{foreach $tabs as $tab}}
<li id="{{$tab.id}}" role="presentation" {{if $tab.sel}} class="{{$tab.sel}}" {{/if}}>
<a role="menuitem" href="{{$tab.url}}" {{if $tab.accesskey}}accesskey="{{$tab.accesskey}}" {{/if}}
<a role="menuitem" class="tabbar-wrapper__link" href="{{$tab.url}}" {{if $tab.accesskey}}accesskey="{{$tab.accesskey}}" {{/if}}
{{if $tab.title}} title="{{$tab.title}}" {{/if}}>
{{$tab.label}}
</a>
@ -37,7 +37,7 @@
{{foreach $tabs as $tab}}
{{if $tab.sel}}
<li id="{{$tab.id}}-xs" role="presentation" {{if $tab.sel}} class="{{$tab.sel}}" {{/if}}>
<a role="menuitem" href="{{$tab.url}}" {{if $tab.title}} title="{{$tab.title}}" {{/if}}>
<a role="menuitem" class="tabbar-wrapper__link" href="{{$tab.url}}" {{if $tab.title}} title="{{$tab.title}}" {{/if}}>
{{$tab.label}}
</a>
</li>

View file

@ -12,7 +12,7 @@
</div>
{{* For very small displays we use a dropdown menu for contact relating actions *}}
<button type="button" class="btn btn-link dropdown-toggle visible-xs" id="contact-photo-menu-button-{{$contact.id}}" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<button type="button" class="btn btn-default dropdown-toggle visible-xs" id="contact-photo-menu-button-{{$contact.id}}" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
{{* use a smaller picture on very small displays (e.g. mobiles) *}}
<div class="contact-photo-image-wrapper visible-xs">
<img class="contact-photo-xs media-object" src="{{$contact.thumb}}" {{$contact.sparkle}} alt="{{$contact.name}}" />
@ -44,29 +44,29 @@
<div class="media-body">
{{if $contact.photo_menu}}
{{* The contact actions like private mail, delete contact, edit contact and so on *}}
<div class="contact-actions pull-right nav-pills preferences hidden-xs">
<div class="btn-group contact-actions pull-right nav-pills preferences hidden-xs" role="group">
{{if $contact.photo_menu.pm}}
<button type="button" class="contact-action-link btn-link" onclick="addToModal('{{$contact.photo_menu.pm.1}}'); return false;" data-toggle="tooltip" title="{{$contact.photo_menu.pm.0}}">
<button type="button" class="contact-action-link btn btn-default" onclick="addToModal('{{$contact.photo_menu.pm.1}}'); return false;" data-toggle="tooltip" title="{{$contact.photo_menu.pm.0}}">
<i class="fa fa-envelope" aria-hidden="true"></i>
</button>
{{/if}}
{{if $contact.photo_menu.network}}
<a class="contact-action-link btn-link" href="{{$contact.photo_menu.network.1}}" data-toggle="tooltip" title="{{$contact.photo_menu.network.0}}">
<a class="contact-action-link btn btn-default" href="{{$contact.photo_menu.network.1}}" data-toggle="tooltip" title="{{$contact.photo_menu.network.0}}">
<i class="fa fa-cloud" aria-hidden="true"></i>
</a>
{{/if}}
{{if $contact.photo_menu.follow}}
<a class="contact-action-link btn-link" href="{{$contact.photo_menu.follow.1}}" data-toggle="tooltip" title="{{$contact.photo_menu.follow.0}}">
<a class="contact-action-link btn btn-default" href="{{$contact.photo_menu.follow.1}}" data-toggle="tooltip" title="{{$contact.photo_menu.follow.0}}">
<i class="fa fa-user-plus" aria-hidden="true"></i>
</a>
{{/if}}
{{if $contact.photo_menu.unfollow}}
<a class="contact-action-link btn-link" href="{{$contact.photo_menu.unfollow.1}}" data-toggle="tooltip" title="{{$contact.photo_menu.unfollow.0}}">
<a class="contact-action-link btn btn-default" href="{{$contact.photo_menu.unfollow.1}}" data-toggle="tooltip" title="{{$contact.photo_menu.unfollow.0}}">
<i class="fa fa-user-times" aria-hidden="true"></i>
</a>
{{/if}}
{{if $contact.photo_menu.hide}}
<a class="contact-action-link btn-link" href="{{$contact.photo_menu.hide.1}}" data-toggle="tooltip" title="{{$contact.photo_menu.hide.0}}">
<a class="contact-action-link btn btn-default" href="{{$contact.photo_menu.hide.1}}" data-toggle="tooltip" title="{{$contact.photo_menu.hide.0}}">
<i class="fa fa-times" aria-hidden="true"></i>
</a>
{{/if}}
@ -76,7 +76,7 @@
{{* The button to add or remove contacts from a contact group - group edit page *}}
{{if $contact.change_member}}
<div class="contact-group-actions pull-right nav-pills preferences">
<button type="button" class="contact-action-link contact-group-link btn-link" onclick="groupChangeMember({{$contact.change_member.gid}},{{$contact.change_member.cid}},'{{$contact.change_member.sec_token}}'); return true;" data-toggle="tooltip" title="{{$contact.change_member.title}}">
<button type="button" class="contact-action-link btn contact-group-link btn-default" onclick="groupChangeMember({{$contact.change_member.gid}},{{$contact.change_member.cid}},'{{$contact.change_member.sec_token}}'); return true;" data-toggle="tooltip" title="{{$contact.change_member.title}}">
{{if $contact.label == "members"}}
<i class="fa fa-times-circle" aria-hidden="true"></i>
{{elseif $contact.label == "contacts"}}

View file

@ -14,7 +14,7 @@
{{* This is the Action menu where contact related actions like 'ignore', 'hide' can be performed *}}
<ul id="contact-edit-actions" class="nav nav-pills preferences">
<li class="dropdown pull-right">
<button type="button" class="btn btn-link btn-sm dropdown-toggle" id="contact-edit-actions-button" data-toggle="dropdown" aria-expanded="false">
<button type="button" class="btn btn-link dropdown-toggle" id="contact-edit-actions-button" data-toggle="dropdown" aria-expanded="false">
<i class="fa fa-angle-down" aria-hidden="true"></i>&nbsp;{{$contact_action_button}}
</button>

View file

@ -34,7 +34,7 @@
{{* We put the contact batch actions in a dropdown menu *}}
<ul class="nav nav-pills preferences">
<li class="dropdown pull-right">
<button type="button" class="btn btn-link btn-sm dropdown-toggle" id="BatchActionDropdownMenuTools" data-toggle="dropdown" aria-expanded="false">
<button type="button" class="btn btn-link dropdown-toggle" id="BatchActionDropdownMenuTools" data-toggle="dropdown" aria-expanded="false">
<i class="fa fa-angle-down"></i>&nbsp;{{$h_batch_actions}}
</button>
<ul class="dropdown-menu pull-right" role="menu" aria-labelledby="BatchActionDropdownMenuTools">

View file

@ -2,7 +2,7 @@
<h3>{{$title}}</h3>
</span>
<div class="widget" id="group-sidebar">
<div id="sidebar-group-header">
<div id="sidebar-group-header" class="sidebar-widget-header">
<span class="fakelink" onclick="openCloseWidget('group-sidebar', 'group-sidebar-inflated');">
<h3>{{$title}}</h3>
</span>
@ -22,7 +22,7 @@
</form>
{{/if}}
</div>
<div id="sidebar-group-list">
<div id="sidebar-group-list" class="sidebar-widget-list">
{{* The list of available groups *}}
<ul role="menu" id="sidebar-group-ul">
{{foreach $groups as $group}}

View file

@ -42,12 +42,12 @@
{{if $follow_link || $unfollow_link}}
<div id="dfrn-request-link-button">
{{if $unfollow_link}}
<a id="dfrn-request-link" class="btn btn-labeled btn-primary btn-sm" href="{{$unfollow_link}}">
<a id="dfrn-request-link" class="btn btn-labeled btn-primary" href="{{$unfollow_link}}">
<span class=""><i class="fa fa-user-times"></i></span>
<span class="">{{$unfollow}}</span>
</a>
{{else}}
<a id="dfrn-request-link" class="btn btn-labeled btn-primary btn-sm" href="{{$follow_link}}">
<a id="dfrn-request-link" class="btn btn-labeled btn-primary" href="{{$follow_link}}">
<span class=""><i class="fa fa-user-plus"></i></span>
<span class="">{{$follow}}</span>
</a>
@ -56,7 +56,7 @@
{{/if}}
{{if $subscribe_feed_link}}
<div id="subscribe-feed-link-button">
<a id="subscribe-feed-link" class="btn btn-labeled btn-primary btn-sm" href="{{$subscribe_feed_link}}">
<a id="subscribe-feed-link" class="btn btn-labeled btn-primary" href="{{$subscribe_feed_link}}">
<span class=""><i class="fa fa-rss"></i></span>
<span class="">{{$subscribe_feed}}</span>
</a>
@ -64,7 +64,7 @@
{{/if}}
{{if $wallmessage_link}}
<div id="wallmessage-link-botton">
<button type="button" id="wallmessage-link" class="btn btn-labeled btn-primary btn-sm" onclick="openWallMessage('{{$wallmessage_link}}')">
<button type="button" id="wallmessage-link" class="btn btn-labeled btn-primary" onclick="openWallMessage('{{$wallmessage_link}}')">
<span class=""><i class="fa fa-envelope"></i></span>
<span class="">{{$wallmessage}}</span>
</button>

View file

@ -5,7 +5,7 @@
<div id="profile-edit-links">
<ul class="nav nav-pills preferences">
<li class="dropdown pull-right">
<button type="button" class="btn btn-link btn-sm dropdown-toggle" id="profile-edit-links-dropdown" data-toggle="dropdown" aria-expanded="false">
<button type="button" class="btn btn-link dropdown-toggle" id="profile-edit-links-dropdown" data-toggle="dropdown" aria-expanded="false">
<i class="fa fa-angle-down" aria-hidden="true"></i>&nbsp;{{$profile_action}}
</button>
<ul class="dropdown-menu pull-right" role="menu" aria-labelledby="profile-edit-links-dropdown">

View file

@ -436,29 +436,25 @@ as the value of $top_child_total (this is done at the end of this file)
</span>
</span>
<div class="btn-toolbar visible-xs" role="toolbar">
<div class="btn-toolbar btn-group visible-xs" role="group">
{{* Buttons for like and dislike *}}
{{if $item.vote}}
<div class="btn-group" role="group">
{{if $item.vote.like}}
<button type="button" class="btn btn-sm button-likes{{if $item.responses.like.self}} active" aria-pressed="true{{/if}}" id="like-{{$item.id}}" title="{{$item.vote.like.0}}" onclick="doActivityItemAction({{$item.id}}, 'like'{{if $item.responses.like.self}}, true{{/if}});" data-toggle="button"><i class="fa fa-thumbs-up" aria-hidden="true"></i></button>
<button type="button" class="btn button-likes{{if $item.responses.like.self}} active" aria-pressed="true{{/if}}" id="like-{{$item.id}}" title="{{$item.vote.like.0}}" onclick="doActivityItemAction({{$item.id}}, 'like'{{if $item.responses.like.self}}, true{{/if}});" data-toggle="button"><i class="fa fa-thumbs-up" aria-hidden="true"></i></button>
{{/if}}
{{if $item.vote.dislike}}
<button type="button" class="btn btn-sm button-likes{{if $item.responses.dislike.self}} active" aria-pressed="true{{/if}}" id="dislike-{{$item.id}}" title="{{$item.vote.dislike.0}}" onclick="doActivityItemAction({{$item.id}}, 'dislike'{{if $item.responses.dislike.self}}, true{{/if}});" data-toggle="button"><i class="fa fa-thumbs-down" aria-hidden="true"></i></button>
<button type="button" class="btn button-likes{{if $item.responses.dislike.self}} active" aria-pressed="true{{/if}}" id="dislike-{{$item.id}}" title="{{$item.vote.dislike.0}}" onclick="doActivityItemAction({{$item.id}}, 'dislike'{{if $item.responses.dislike.self}}, true{{/if}});" data-toggle="button"><i class="fa fa-thumbs-down" aria-hidden="true"></i></button>
{{/if}}
</div>
{{/if}}
{{* Button to open the comment text field *}}
{{if $item.comment_html}}
<div class="btn-group" role="group">
<button type="button" class="btn btn-sm button-comments" id="comment-{{$item.id}}" title="{{$item.switchcomment}}" {{if $item.thread_level != 1}}onclick="openClose('item-comments-{{$item.id}}'); commentExpand({{$item.id}});" {{else}} onclick="openClose('item-comments-{{$item.id}}'); commentExpand({{$item.id}});"{{/if}}><i class="fa fa-commenting" aria-hidden="true"></i></button>
</div>
<button type="button" class="btn button-comments" id="comment-{{$item.id}}" title="{{$item.switchcomment}}" {{if $item.thread_level != 1}}onclick="openClose('item-comments-{{$item.id}}'); commentExpand({{$item.id}});" {{else}} onclick="openClose('item-comments-{{$item.id}}'); commentExpand({{$item.id}});"{{/if}}><i class="fa fa-commenting" aria-hidden="true"></i></button>
{{/if}}
{{if $item.vote.announce OR $item.vote.share}}
<div class="share-links btn-group{{if $item.thread_level > 1}} dropup{{/if}}">
<button type="button" class="btn btn-sm dropdown-toggle{{if $item.responses.announce.self}} active{{/if}}" data-toggle="dropdown" id="shareMenuOptions-{{$item.id}}" aria-haspopup="true" aria-expanded="false" title="{{$item.menu}}">
<div class="share-links btn-group{{if $item.thread_level > 1}} dropup{{/if}}" role="group">
<button type="button" class="btn dropdown-toggle{{if $item.responses.announce.self}} active{{/if}}" data-toggle="dropdown" id="shareMenuOptions-{{$item.id}}" aria-haspopup="true" aria-expanded="false" title="{{$item.menu}}">
<i class="fa fa-share" aria-hidden="true"></i>
</button>
<ul class="dropdown-menu dropdown-menu-left" role="menu" aria-labelledby="shareMenuOptions-{{$item.id}}">
@ -487,28 +483,26 @@ as the value of $top_child_total (this is done at the end of this file)
{{/if}}
{{if $item.browsershare}}
<button type="button" class="btn btn-sm button-browser-share" onclick="navigator.share({url: '{{$item.plink.orig}}'})" title="{{$item.browsershare.1}}"><i class="fa fa-share-alt"></i></button>
<button type="button" class="btn button-browser-share" onclick="navigator.share({url: '{{$item.plink.orig}}'})" title="{{$item.browsershare.1}}"><i class="fa fa-share-alt"></i></button>
{{/if}}
{{* Put additional actions in a dropdown menu *}}
<div class="btn-group" role="group">
<img id="like-rotator-{{$item.id}}" class="like-rotator" src="images/rotator.gif" alt="{{$item.wait}}" title="{{$item.wait}}" style="display: none;" />
</div>
<img id="like-rotator-{{$item.id}}" class="like-rotator" src="images/rotator.gif" alt="{{$item.wait}}" title="{{$item.wait}}" style="display: none;" />
</div>
<div class="wall-item-actions-right visible-xs">
{{* Event attendance buttons *}}
{{if $item.isevent}}
<div class="btn-group" role="group">
<button type="button" class="btn btn-sm btn-default button-event{{if $item.responses.attendyes.self}} active" aria-pressed="true{{/if}}" id="attendyes-{{$item.id}}" title="{{$item.attend.0}}" onclick="doActivityItemAction({{$item.id}}, 'attendyes'{{if $item.responses.attendyes.self}}, true{{/if}});"><i class="fa fa-check" aria-hidden="true"><span class="sr-only">{{$item.attend.0}}</span></i></button>
<button type="button" class="btn btn-sm btn-default button-event{{if $item.responses.attendno.self}} active" aria-pressed="true{{/if}}" id="attendno-{{$item.id}}" title="{{$item.attend.1}}" onclick="doActivityItemAction({{$item.id}}, 'attendno'{{if $item.responses.attendno.self}}, true{{/if}});"><i class="fa fa-times" aria-hidden="true"><span class="sr-only">{{$item.attend.1}}</span></i></button>
<button type="button" class="btn btn-sm btn-default button-event{{if $item.responses.attendmaybe.self}} active" aria-pressed="true{{/if}}" id="attendmaybe-{{$item.id}}" title="{{$item.attend.2}}" onclick="doActivityItemAction({{$item.id}}, 'attendmaybe'{{if $item.responses.attendmaybe.self}}, true{{/if}});"><i class="fa fa-question" aria-hidden="true"><span class="sr-only">{{$item.attend.2}}</span></i></button>
<button type="button" class="btn btn-default button-event{{if $item.responses.attendyes.self}} active" aria-pressed="true{{/if}}" id="attendyes-{{$item.id}}" title="{{$item.attend.0}}" onclick="doActivityItemAction({{$item.id}}, 'attendyes'{{if $item.responses.attendyes.self}}, true{{/if}});"><i class="fa fa-check" aria-hidden="true"><span class="sr-only">{{$item.attend.0}}</span></i></button>
<button type="button" class="btn btn-default button-event{{if $item.responses.attendno.self}} active" aria-pressed="true{{/if}}" id="attendno-{{$item.id}}" title="{{$item.attend.1}}" onclick="doActivityItemAction({{$item.id}}, 'attendno'{{if $item.responses.attendno.self}}, true{{/if}});"><i class="fa fa-times" aria-hidden="true"><span class="sr-only">{{$item.attend.1}}</span></i></button>
<button type="button" class="btn btn-default button-event{{if $item.responses.attendmaybe.self}} active" aria-pressed="true{{/if}}" id="attendmaybe-{{$item.id}}" title="{{$item.attend.2}}" onclick="doActivityItemAction({{$item.id}}, 'attendmaybe'{{if $item.responses.attendmaybe.self}}, true{{/if}});"><i class="fa fa-question" aria-hidden="true"><span class="sr-only">{{$item.attend.2}}</span></i></button>
</div>
{{/if}}
{{if $item.edpost || $item.tagger || $item.filer || $item.pin || $item.star || $item.follow_thread || $item.ignore || ($item.drop && $item.drop.dropping)}}
<div class="more-links btn-group{{if $item.thread_level > 1}} dropup{{/if}}">
<button type="button" class="btn btn-sm dropdown-toggle" data-toggle="dropdown" id="dropdownMenuOptions-{{$item.id}}" aria-haspopup="true" aria-expanded="false" title="{{$item.menu}}"><i class="fa fa-ellipsis-h" aria-hidden="true"></i></button>
<button type="button" class="btn dropdown-toggle" data-toggle="dropdown" id="dropdownMenuOptions-{{$item.id}}" aria-haspopup="true" aria-expanded="false" title="{{$item.menu}}"><i class="fa fa-ellipsis-h" aria-hidden="true"></i></button>
<ul class="dropdown-menu dropdown-menu-right" role="menu" aria-labelledby="dropdownMenuOptions-{{$item.id}}">
{{if $item.edpost}} {{* edit the posting *}}
<li role="menuitem">

View file

@ -11,14 +11,14 @@
</form>
{{* Directory links *}}
<div class="side-link" id="side-directory-link"><a href="directory">{{$nv.local_directory}}</a></div>
<div class="side-link" id="side-directory-link"><a href="{{$nv.global_dir}}" target="extlink">{{$nv.directory}}</a></div>
<div class="side-link" id="side-directory-link"><a href="directory" class="side-link-link">{{$nv.local_directory}}</a></div>
<div class="side-link" id="side-directory-link"><a href="{{$nv.global_dir}}" class="side-link-link" target="extlink">{{$nv.directory}}</a></div>
{{* Additional links *}}
<div class="side-link" id="side-match-link"><a href="contact/match">{{$nv.similar}}</a></div>
<div class="side-link" id="side-suggest-link"><a href="contact/suggestions">{{$nv.suggest}}</a></div>
<div class="side-link" id="side-random-profile-link"><a href="randprof" target="extlink">{{$nv.random}}</a></div>
<div class="side-link" id="side-match-link"><a href="contact/match" class="side-link-link">{{$nv.similar}}</a></div>
<div class="side-link" id="side-suggest-link"><a href="contact/suggestions" class="side-link-link">{{$nv.suggest}}</a></div>
<div class="side-link" id="side-random-profile-link"><a href="randprof" class="side-link-link" target="extlink">{{$nv.random}}</a></div>
{{if $nv.inv}}
<div class="side-link" id="side-invite-link"><button type="button" class="btn-link" onclick="addToModal('invite'); return false;">{{$nv.inv}}</button></div>
<div class="side-link" id="side-invite-link"><button type="button" class="btn-link side-link-link" onclick="addToModal('invite'); return false;">{{$nv.inv}}</button></div>
{{/if}}
</div>

View file

@ -36,13 +36,13 @@
<div id="profile-extra-links">
<div id="dfrn-request-link-button">
{{if $follow_link}}
<a id="dfrn-request-link" class="btn btn-labeled btn-primary btn-sm" href="{{$follow_link}}"">
<a id="dfrn-request-link" class="btn btn-labeled btn-primary" href="{{$follow_link}}"">
<span class=""><i class="fa fa-user-plus"></i></span>
<span class="">{{$follow}}</span>
</a>
{{/if}}
{{if $unfollow_link}}
<a id="dfrn-request-link" class="btn btn-labeled btn-primary btn-sm" href="{{$unfollow_link}}">
<a id="dfrn-request-link" class="btn btn-labeled btn-primary" href="{{$unfollow_link}}">
<span class=""><i class="fa fa-user-times"></i></span>
<span class="">{{$unfollow}}</span>
</a>
@ -50,7 +50,7 @@
</div>
{{if $wallmessage_link}}
<div id="wallmessage-link-botton">
<button type="button" id="wallmessage-link" class="btn btn-labeled btn-primary btn-sm" onclick="openWallMessage('{{$wallmessage_link}}')">
<button type="button" id="wallmessage-link" class="btn btn-labeled btn-primary" onclick="openWallMessage('{{$wallmessage_link}}')">
<span class=""><i class="fa fa-envelope"></i></span>
<span class="">{{$wallmessage}}</span>
</button>