diff options
Diffstat (limited to 'view')
| -rw-r--r-- | view/js/main.js | 26 | ||||
| -rw-r--r-- | view/php/theme_init.php | 2 | ||||
| -rw-r--r-- | view/theme/redbasic/css/narrow_navbar.css | 4 | ||||
| -rw-r--r-- | view/theme/redbasic/css/style.css | 28 | ||||
| -rwxr-xr-x | view/tpl/abook_edit.tpl | 24 | ||||
| -rwxr-xr-x | view/tpl/nav.tpl | 14 | ||||
| -rw-r--r-- | view/tpl/nav_header.tpl | 49 | ||||
| -rwxr-xr-x | view/tpl/photo_view.tpl | 2 | ||||
| -rwxr-xr-x | view/tpl/profile_edit.tpl | 2 |
9 files changed, 66 insertions, 85 deletions
diff --git a/view/js/main.js b/view/js/main.js index 2813b3b19..748853939 100644 --- a/view/js/main.js +++ b/view/js/main.js @@ -443,6 +443,32 @@ function NavUpdate() { timer = setTimeout(NavUpdate, updateInterval); } +function contextualHelp() { + var container = $("#contextual-help-content"); + + if(container.hasClass('contextual-help-content-open')) { + container.removeClass('contextual-help-content-open'); + $('main').css('top', '') + } + else { + container.addClass('contextual-help-content-open'); + var mainTop = container.outerHeight(true); + $('main').css('top', mainTop + 'px'); + } +} + +function contextualHelpFocus(target, openSidePanel) { + if (openSidePanel) { + $("main").addClass('region_1-on'); // Open the side panel to highlight element + } + else { + $("main").removeClass('region_1-on'); + } + $('html,body').animate({ scrollTop: $(target).offset().top - $('nav').outerHeight(true) - $('#contextual-help-content').outerHeight(true)}, 'slow'); + for (i = 0; i < 3; i++) { + $(target).fadeTo('slow', 0.1).fadeTo('slow', 1.0); + } +} function updatePageItems(mode, data) { diff --git a/view/php/theme_init.php b/view/php/theme_init.php index 648b144b3..7c020a51f 100644 --- a/view/php/theme_init.php +++ b/view/php/theme_init.php @@ -21,7 +21,7 @@ head_add_js('spin.js'); head_add_js('jquery.spin.js'); head_add_js('jquery.textinputs.js'); head_add_js('autocomplete.js'); -head_add_js('library/jquery-textcomplete/jquery.textcomplete.js'); +head_add_js('library/jquery-textcomplete/jquery.textcomplete.min.js'); //head_add_js('library/colorbox/jquery.colorbox.js'); head_add_js('library/jquery.timeago.js'); head_add_js('library/readmore.js/readmore.js'); diff --git a/view/theme/redbasic/css/narrow_navbar.css b/view/theme/redbasic/css/narrow_navbar.css index 9d14beb33..2c0c7e133 100644 --- a/view/theme/redbasic/css/narrow_navbar.css +++ b/view/theme/redbasic/css/narrow_navbar.css @@ -56,4 +56,8 @@ top: 30px; right: 15px; } + + .contextual-help-content-open { + top: 32px; + } } diff --git a/view/theme/redbasic/css/style.css b/view/theme/redbasic/css/style.css index 5b8729111..bd5df5e63 100644 --- a/view/theme/redbasic/css/style.css +++ b/view/theme/redbasic/css/style.css @@ -201,29 +201,26 @@ header #banner #logo-text { } /* contextual help */ -.help-content { - background: $comment_item_colour; - color: $font_colour; +.contextual-help-content { + display: none; + +} + +.contextual-help-content-open { + display: block; position: fixed; - top: -50%; - left: 0px; - width: 100%; + top: 51px; max-height: 50%; + background: $comment_item_colour; padding: 20px; - /*transition: top 300ms cubic-bezier(0.17, 0.04, 0.03, 0.94);*/ - border-bottom: #CCC 1px solid; + border-bottom: #ccc 1px solid; overflow: auto; -} - -.help-content-open { - top: 51px; -moz-box-shadow: 0px 3px 3px rgba(0,0,0,0.2); -webkit-box-shadow: 0px 3px 3px rgba(0,0,0,0.2); box-shadow: 0px 3px 3px rgba(0,0,0,0.2); - /*transition: top 300ms cubic-bezier(0.17, 0.04, 0.03, 0.94);*/ } -.help-content dd { +.contextual-help-content dd { margin-bottom: 1em; } /* contextual help end */ @@ -1703,10 +1700,9 @@ nav .badge.mail-update:hover { #expand-aside, #expand-tabs, -#help_nav_btn_collapsed { +#context-help-btn { color: $nav_active_icon_colour; padding: 7px 10px; - text-decoration: none; } .nav-tabs.nav-justified { diff --git a/view/tpl/abook_edit.tpl b/view/tpl/abook_edit.tpl index 4fa810cb4..74ba6072d 100755 --- a/view/tpl/abook_edit.tpl +++ b/view/tpl/abook_edit.tpl @@ -3,18 +3,18 @@ {{if $notself}} <div class="dropdown pull-right"> <button id="connection-dropdown" class="btn btn-default btn-xs" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> - <i class="icon-caret-down"></i> + <i class="icon-caret-down"></i> {{$tools_label}} </button> <ul class="dropdown-menu" aria-labelledby="dLabel"> - <li><a href="{{$buttons.view.url}}" title="{{$buttons.view.title}}">{{$buttons.view.label}}</a></li> - <li><a href="{{$buttons.recent.url}}" title="{{$buttons.recent.title}}">{{$buttons.recent.label}}</a></li> + <li><a href="{{$tools.view.url}}" title="{{$tools.view.title}}">{{$tools.view.label}}</a></li> + <li><a href="{{$tools.recent.url}}" title="{{$tools.recent.title}}">{{$tools.recent.label}}</a></li> <li class="divider"></li> - <li><a href="#" title="{{$buttons.refresh.title}}" onclick="window.location.href='{{$buttons.refresh.url}}'; return false;">{{$buttons.refresh.label}}</a></li> - <li><a href="#" title="{{$buttons.block.title}}" onclick="window.location.href='{{$buttons.block.url}}'; return false;">{{$buttons.block.label}}</a></li> - <li><a href="#" title="{{$buttons.ignore.title}}" onclick="window.location.href='{{$buttons.ignore.url}}'; return false;">{{$buttons.ignore.label}}</a></li> - <li><a href="#" title="{{$buttons.archive.title}}" onclick="window.location.href='{{$buttons.archive.url}}'; return false;">{{$buttons.archive.label}}</a></li> - <li><a href="#" title="{{$buttons.hide.title}}" onclick="window.location.href='{{$buttons.hide.url}}'; return false;">{{$buttons.hide.label}}</a></li> - <li><a href="#" title="{{$buttons.delete.title}}" onclick="window.location.href='{{$buttons.delete.url}}'; return false;">{{$buttons.delete.label}}</a></li> + <li><a href="#" title="{{$tools.refresh.title}}" onclick="window.location.href='{{$tools.refresh.url}}'; return false;">{{$tools.refresh.label}}</a></li> + <li><a href="#" title="{{$tools.block.title}}" onclick="window.location.href='{{$tools.block.url}}'; return false;">{{$tools.block.label}}</a></li> + <li><a href="#" title="{{$tools.ignore.title}}" onclick="window.location.href='{{$tools.ignore.url}}'; return false;">{{$tools.ignore.label}}</a></li> + <li><a href="#" title="{{$tools.archive.title}}" onclick="window.location.href='{{$tools.archive.url}}'; return false;">{{$tools.archive.label}}</a></li> + <li><a href="#" title="{{$tools.hide.title}}" onclick="window.location.href='{{$tools.hide.url}}'; return false;">{{$tools.hide.label}}</a></li> + <li><a href="#" title="{{$tools.delete.title}}" onclick="window.location.href='{{$tools.delete.url}}'; return false;">{{$tools.delete.label}}</a></li> </ul> </div> {{/if}} @@ -22,11 +22,11 @@ </div> <div class="section-content-wrapper-np"> {{if $notself}} - {{foreach $buttons as $b}} - {{if $b.info}} + {{foreach $tools as $tool}} + {{if $tool.info}} <div class="section-content-danger-wrapper"> <div> - {{$b.info}} + {{$tool.info}} </div> </div> {{/if}} diff --git a/view/tpl/nav.tpl b/view/tpl/nav.tpl index 2a6af3f6a..03b48fd00 100755 --- a/view/tpl/nav.tpl +++ b/view/tpl/nav.tpl @@ -12,9 +12,9 @@ <i class="icon-circle-arrow-right" id="expand-aside-icon"></i> </button> {{if $nav.help.6}} - <a class="navbar-toggle" target="hubzilla-help" href="{{$nav.help.0}}" title="{{$nav.help.3}}" id="{{$nav.help.4}}_collapsed"{{if $nav.help.6}} onclick="return false;"{{/if}}> + <button id="context-help-btn"class="navbar-toggle" type="button" onclick="contextualHelp(); return false;"> <i class="icon-question-sign"></i> - </a> + </button> {{/if}} {{if $userinfo}} <img class="dropdown-toggle fakelink" data-toggle="dropdown" id="avatar" src="{{$userinfo.icon}}" alt="{{$userinfo.name}}"><span class="caret" id="usermenu-caret"></span> @@ -36,6 +36,10 @@ <li role="presentation" class="divider"></li> <li role="presentation"><a href="{{$nav.admin.0}}" title="{{$nav.admin.3}}" role="menuitem" id="{{$nav.admin.4}}">{{$nav.admin.1}}</a></li> {{/if}} + {{if $nav.help.6}} + <li role="presentation" class="divider"></li> + <li role="presentation"><a href="{{$nav.help.0}}" title="{{$nav.help.3}}" role="menuitem" id="{{$nav.help.4}}">{{$nav.help.1}}</a></li> + {{/if}} {{if $nav.logout}} <li role="presentation" class="divider"></li> <li role="presentation"><a href="{{$nav.logout.0}}" title="{{$nav.logout.3}}" role="menuitem" id="{{$nav.logout.4}}">{{$nav.logout.1}}</a></li> @@ -194,15 +198,15 @@ {{if $nav.help}} <li class="{{$sel.help}}{{if $nav.help.6}} hidden-xs{{/if}}"> - <a class="{{$nav.help.2}}" target="hubzilla-help" href="{{$nav.help.0}}" title="{{$nav.help.3}}" id="{{$nav.help.4}}"{{if $nav.help.6}} onclick="return false;"{{/if}}>{{if $nav.help.6}}<i class="icon-question-sign"></i>{{else}}<i class="icon-question"></i>{{/if}}</a> + <a class="{{$nav.help.2}}" target="hubzilla-help" href="{{$nav.help.0}}" title="{{$nav.help.3}}" id="{{$nav.help.4}}"{{if $nav.help.6}} onclick="contextualHelp(); return false;"{{/if}}>{{if $nav.help.6}}<i class="icon-question-sign"></i>{{else}}<i class="icon-question"></i>{{/if}}</a> </li> {{/if}} </ul> </div> </div> {{if $nav.help.6}} - <div id="help-content" class="help-content"> + <div id="contextual-help-content" class="contextual-help-content"> {{$nav.help.5}} - <p class="pull-right"><a href="{{$nav.help.0}}">Click here for more documentation...</a></p> + <button type="button" class="close" onclick="contextualHelp();">×</button> </div> {{/if}} diff --git a/view/tpl/nav_header.tpl b/view/tpl/nav_header.tpl deleted file mode 100644 index 27713b55b..000000000 --- a/view/tpl/nav_header.tpl +++ /dev/null @@ -1,49 +0,0 @@ -<script> - /* contextual help */ - {{if $enable_context_help}} - $('.help-content').css('top', '-' + $('#help-content').height() + 'px') - $(document).mouseup(function (e) - { - e.preventDefault; - - var container = $("#help-content"); - - if ((!container.is(e.target) // if the target of the click isn't the container... - && container.has(e.target).length === 0 // ... nor a descendant of the container - && container.hasClass('help-content-open')) - || - ( - ($('#help_nav_btn, #help_nav_btn_collapsed').is(e.target) || $('#help_nav_btn, #help_nav_btn_collapsed').has(e.target).length !== 0) - && container.hasClass('help-content-open') - )) { - container.removeClass('help-content-open'); - $('main').removeClass('help-content-open'); - $('main').css('top', '') - } - else if (($('#help_nav_btn, #help_nav_btn_collapsed').is(e.target) || $('#help_nav_btn, #help_nav_btn_collapsed').has(e.target).length !== 0) - && !container.hasClass('help-content-open')) { - $('#help-content').addClass('help-content-open'); - $('main').removeClass('help-content-open'); - var mainTop = $('#navbar-collapse-1').height(); - if ($('#navbar-collapse-1').outerHeight(true) < $('#help-content').height()) { - mainTop = $('#help-content').outerHeight(true); - } - - $('main').css('top', mainTop + 'px'); - } - - }); - {{/if}} - var contextualHelpFocus = function (target, openSidePanel) { - if (openSidePanel) { - $("main").addClass('region_1-on'); // Open the side panel to highlight element - } else { - $("main").removeClass('region_1-on'); - } - // Animate the page scroll to the element and then pulse the element to direct attention - $('html,body').animate({scrollTop: $(target).offset().top - $('#navbar-collapse-1').height() - $('#help-content').height() - 50}, 'slow'); - for (i = 0; i < 3; i++) { - $(target).fadeTo('slow', 0.1).fadeTo('slow', 1.0); - } - } -</script> diff --git a/view/tpl/photo_view.tpl b/view/tpl/photo_view.tpl index 254733622..ca2b5e090 100755 --- a/view/tpl/photo_view.tpl +++ b/view/tpl/photo_view.tpl @@ -5,7 +5,7 @@ {{if $tools || $map || $edit}} <div class="btn-group"> <button type="button" class="btn btn-default btn-xs dropdown-toggle" data-toggle="dropdown"> - <i class="icon-caret-down"></i> + <i class="icon-caret-down"></i> {{$tools_label}} </button> <ul class="dropdown-menu"> {{if $tools}} diff --git a/view/tpl/profile_edit.tpl b/view/tpl/profile_edit.tpl index a02323e45..4908646b9 100755 --- a/view/tpl/profile_edit.tpl +++ b/view/tpl/profile_edit.tpl @@ -2,7 +2,7 @@ <div class="section-title-wrapper"> <div class="dropdown pull-right" id="profile-edit-links"> <button type="button" class="btn btn-default btn-xs dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> - <i class="icon-caret-down"></i> + <i class="icon-caret-down"></i> {{$tools_label}} </button> <ul class="dropdown-menu"> <li class="nav-item"> |