From 0daa2f2228afdb8506fff569834c2c39247d98a9 Mon Sep 17 00:00:00 2001 From: Hypolite Petovan <hypolite@mrpetovan.com> Date: Sun, 14 Nov 2021 20:28:39 -0500 Subject: [PATCH] [frio] Check for role="presentation" uses throughout the templates - Upgrade a tags to buttons in file browser - Fix formatting in nav.tpl - Remove unwarranted instance for character counter in jot form --- view/theme/frio/js/filebrowser.js | 2 +- view/theme/frio/templates/filebrowser.tpl | 8 +- view/theme/frio/templates/jot.tpl | 2 +- view/theme/frio/templates/nav.tpl | 95 ++++++++++++++++------- 4 files changed, 74 insertions(+), 33 deletions(-) diff --git a/view/theme/frio/js/filebrowser.js b/view/theme/frio/js/filebrowser.js index a9ee6ea086..bebb279078 100644 --- a/view/theme/frio/js/filebrowser.js +++ b/view/theme/frio/js/filebrowser.js @@ -96,7 +96,7 @@ var FileBrowser = { }); // Click on album link - $(".fbrowser").on("click", ".folders a, .path a", function (e) { + $(".fbrowser").on("click", ".folders button, .path button", function (e) { e.preventDefault(); var url = baseurl + diff --git a/view/theme/frio/templates/filebrowser.tpl b/view/theme/frio/templates/filebrowser.tpl index 1f849555c1..e8c03cf386 100644 --- a/view/theme/frio/templates/filebrowser.tpl +++ b/view/theme/frio/templates/filebrowser.tpl @@ -8,9 +8,11 @@ </div> {{* The breadcrumb navigation *}} - <ol class="path breadcrumb" aria-label="Breadcrumb" role="navigation"> + <ol class="path breadcrumb" aria-label="Breadcrumb" role="menu"> {{foreach $path as $folder => $name}} - <li role="presentation"><a href="#" data-folder="{{$folder}}">{{$name}}</a></li> + <li role="presentation"> + <button type="button" class="btn btn-link" data-folder="{{$folder}}" role="menuitem">{{$name}}</button> + </li> {{/foreach}} {{* Switch between image and file mode *}} @@ -28,7 +30,7 @@ <ul role="menu"> {{foreach $folders as $folder}} <li role="presentation"> - <a href="#" data-folder="{{$folder}}" role="menuitem">{{$folder}}</a> + <button type="button" data-folder="{{$folder}}" role="menuitem">{{$folder}}</button> </li> {{/foreach}} </ul> diff --git a/view/theme/frio/templates/jot.tpl b/view/theme/frio/templates/jot.tpl index d8372f3aed..5ef8a7b6e4 100644 --- a/view/theme/frio/templates/jot.tpl +++ b/view/theme/frio/templates/jot.tpl @@ -120,7 +120,7 @@ <i class="fa fa-paper-plane fa-fw" aria-hidden="true"></i> {{$share}} </button> </li> - <li role="presentation" id="character-counter" class="grey jothidden text-info pull-right"></li> + <li id="character-counter" class="grey jothidden text-info pull-right"></li> <li role="presentation" id="profile-rotator-wrapper" class="pull-right" style="display: {{$visitor}};"> <img role="presentation" id="profile-rotator" src="images/rotator.gif" alt="{{$wait}}" title="{{$wait}}" style="display: none;" /> </li> diff --git a/view/theme/frio/templates/nav.tpl b/view/theme/frio/templates/nav.tpl index 915e5e9fc7..53176fe92c 100644 --- a/view/theme/frio/templates/nav.tpl +++ b/view/theme/frio/templates/nav.tpl @@ -110,7 +110,7 @@ {{* The notifications dropdown menu. There are two parts of menu. The second is at the bottom of this file. It is loaded via js. Look at nav-notifications-template *}} <ul id="nav-notifications-menu" class="dropdown-menu menu-popup" role="menu" aria-labelledby="nav-notifications-menu-btn"> - {{* the following list entry must have the id "nav-notificaionts-mark-all". Without it this isn't visable. ....strange behavior :-/ *}} + {{* the following list entry must have the id "nav-notifications-mark-all". Without it this isn't visible. ....strange behavior :-/ *}} <li role="presentation" id="nav-notifications-mark-all" class="dropdown-header"> <div class="arrow"></div> {{$nav.notifications.1}} @@ -194,7 +194,8 @@ </li> {{/if}} {{if $nav.messages}} - <li role="presentation"><a role="menuitem" + <li role="presentation"> + <a role="menuitem" class="nav-commlink {{$nav.messages.2}} {{$sel.messages}}" href="{{$nav.messages.0}}" title="{{$nav.messages.3}}"> <i class="fa fa-envelope fa-fw" aria-hidden="true"></i> @@ -205,7 +206,8 @@ {{/if}} <li role="presentation" class="divider"></li> {{if $nav.contacts}} - <li role="presentation"><a role="menuitem" id="nav-menu-contacts-link" + <li role="presentation"> + <a role="menuitem" id="nav-menu-contacts-link" class="nav-link {{$nav.contacts.2}}" href="{{$nav.contacts.0}}" title="{{$nav.contacts.3}}"> <i class="fa fa-users fa-fw" aria-hidden="true"></i> @@ -235,6 +237,7 @@ href="{{$nav.apps.0}}" title="{{$nav.apps.3}}"> <i class="fa fa-puzzle-piece fa-fw" aria-hidden="true"></i> {{$nav.apps.1}} </a> + </li> <li role="presentation" class="divider"></li> {{/if}} {{if $nav.help}} @@ -254,28 +257,40 @@ </li> {{/if}} {{if $nav.admin}} - <li role="presentation"><a accesskey="a" role="menuitem" id="nav-admin-link" + <li role="presentation"> + <a accesskey="a" role="menuitem" id="nav-admin-link" class="nav-link {{$nav.admin.2}}" href="{{$nav.admin.0}}" title="{{$nav.admin.3}}"><i class="fa fa-user-secret fa-fw" aria-hidden="true"></i> - {{$nav.admin.1}}</a></li> + {{$nav.admin.1}} + </a> + </li> {{/if}} {{if $nav.tos}} <li role="presentation" class="divider"></li> - <li role="presentation"><a role="menuitem" id="nav-tos-link" class="nav-link {{$nav.tos.2}}" + <li role="presentation"> + <a role="menuitem" id="nav-tos-link" class="nav-link {{$nav.tos.2}}" href="{{$nav.tos.0}}" title="{{$nav.tos.3}}"><i class="fa fa-file-text" - aria-hidden="true"></i> {{$nav.tos.1}}</a></li> + aria-hidden="true"></i> {{$nav.tos.1}} + </a> + </li> {{/if}} <li role="presentation" class="divider"></li> {{if $nav.logout}} - <li role="presentation"><a role="menuitem" id="nav-logout-link" + <li role="presentation"> + <a role="menuitem" id="nav-logout-link" class="nav-link {{$nav.logout.2}}" href="{{$nav.logout.0}}" title="{{$nav.logout.3}}"><i class="fa fa fa-sign-out fa-fw" aria-hidden="true"></i> - {{$nav.logout.1}}</a></li> + {{$nav.logout.1}} + </a> + </li> {{else}} - <li role="presentation"><a role="menuitem" id="nav-login-link" + <li role="presentation"> + <a role="menuitem" id="nav-login-link" class="nav-login-link {{$nav.login.2}}" href="{{$nav.login.0}}" title="{{$nav.login.3}}"><i class="fa fa-power-off fa-fw" aria-hidden="true"></i> - {{$nav.login.1}}</a></li> + {{$nav.login.1}} + </a> + </li> {{/if}} </ul> </li>{{* End of userinfo dropdown menu *}} @@ -304,35 +319,49 @@ {{$userinfo.name}}{{if $nav.remote}} ({{$nav.remote}}){{/if}} </li> {{foreach $nav.usermenu as $usermenu}} - <li role="menuitem" class="list-group-item"><a role="menuitem" class="{{$usermenu.2}}" - href="{{$usermenu.0}}" title="{{$usermenu.3}}">{{$usermenu.1}}</a></li> + <li role="presentation" class="list-group-item"> + <a role="menuitem" class="{{$usermenu.2}}" + href="{{$usermenu.0}}" title="{{$usermenu.3}}">{{$usermenu.1}} + </a> + </li> {{/foreach}} {{if $nav.notifications || $nav.contacts || $nav.messages || $nav.delegation}} <li role="presentation" class="divider"></li> {{/if}} {{if $nav.notifications}} - <li role="presentation" class="list-group-item"><a role="menuitem" + <li role="presentation" class="list-group-item"> + <a role="menuitem" href="{{$nav.notifications.all.0}}" title="{{$nav.notifications.1}}"><i - class="fa fa-bell fa-fw" aria-hidden="true"></i> {{$nav.notifications.1}}</a> + class="fa fa-bell fa-fw" aria-hidden="true"></i> {{$nav.notifications.1}} + </a> </li> {{/if}} {{if $nav.contacts}} - <li role="presentation" class="list-group-item"><a role="menuitem" + <li role="presentation" class="list-group-item"> + <a role="menuitem" class="nav-link {{$nav.contacts.2}}" href="{{$nav.contacts.0}}" title="{{$nav.contacts.3}}"><i class="fa fa-users fa-fw" aria-hidden="true"></i> - {{$nav.contacts.1}}</a></li> + {{$nav.contacts.1}} + </a> + </li> {{/if}} {{if $nav.messages}} - <li role="presentation" class="list-group-item"><a role="menuitem" + <li role="presentation" class="list-group-item"> + <a role="menuitem" class="nav-link {{$nav.messages.2}} {{$sel.messages}}" href="{{$nav.messages.0}}" title="{{$nav.messages.3}}"><i class="fa fa-envelope fa-fw" aria-hidden="true"></i> - {{$nav.messages.1}}</a></li> + {{$nav.messages.1}} + </a> + </li> {{/if}} {{if $nav.delegation}} - <li role="presentation" class="list-group-item"><a role="menuitem" + <li role="presentation" class="list-group-item"> + <a role="menuitem" class="nav-commlink {{$nav.delegation.2}} {{$sel.delegation}}" href="{{$nav.delegation.0}}" title="{{$nav.delegation.3}}"><i class="fa fa-flag fa-fw" - aria-hidden="true"></i> {{$nav.delegation.1}}</a></li> + aria-hidden="true"></i> {{$nav.delegation.1}} + </a> + </li> {{/if}} {{if $nav.settings || $nav.admin || $nav.logout}} <li role="presentation" class="divider"></li> @@ -341,25 +370,35 @@ <li role="presentation" class="list-group-item"> <a role="menuitem" class="nav-link {{$nav.settings.2}}" href="{{$nav.settings.0}}" title="{{$nav.settings.3}}"><i class="fa fa-cog fa-fw" aria-hidden="true"></i> - {{$nav.settings.1}}</a> + {{$nav.settings.1}} + </a> </li> {{/if}} {{if $nav.admin}} - <li role="presentation" class="list-group-item"><a role="menuitem" + <li role="presentation" class="list-group-item"> + <a role="menuitem" class="nav-link {{$nav.admin.2}}" href="{{$nav.admin.0}}" title="{{$nav.admin.3}}"><i class="fa fa-user-secret fa-fw" aria-hidden="true"></i> - {{$nav.admin.1}}</a></li> + {{$nav.admin.1}} + </a> + </li> {{/if}} {{if $nav.logout}} - <li role="presentation" class="list-group-item"><a role="menuitem" + <li role="presentation" class="list-group-item"> + <a role="menuitem" class="nav-link {{$nav.logout.2}}" href="{{$nav.logout.0}}" title="{{$nav.logout.3}}"><i class="fa fa fa-sign-out fa-fw" aria-hidden="true"></i> - {{$nav.logout.1}}</a></li> + {{$nav.logout.1}} + </a> + </li> {{else}} - <li role="presentation" class="list-group-item"><a role="menuitem" + <li role="presentation" class="list-group-item"> + <a role="menuitem" class="nav-login-link {{$nav.login.2}}" href="{{$nav.login.0}}" title="{{$nav.login.3}}"><i class="fa fa-power-off fa-fw" aria-hidden="true"></i> - {{$nav.login.1}}</a></li> + {{$nav.login.1}} + </a> + </li> {{/if}} </ul> </div>