From c1499519d4a57859fa69098a743430a2dc068800 Mon Sep 17 00:00:00 2001
From: Carl Schwan <carl@carlschwan.eu>
Date: Wed, 16 Mar 2022 01:07:55 +0100
Subject: Improve accessibility with more visible focus indication for non vue
 apps

- Add visible-focus effect on each header entry
- Show focus outline when using focus-visible (keyboard navigation)
- Add polyfy for focus-visible since it's only very recently available
  on webkit
- Change text for link to home button to describe the destination and
  not the current page
- Improve focus effect in app sidebar navigation

Signed-off-by: Carl Schwan <carl@carlschwan.eu>
---
 apps/files/templates/list.php | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

(limited to 'apps/files/templates/list.php')

diff --git a/apps/files/templates/list.php b/apps/files/templates/list.php
index 0a34396aa5c..25558bf16f7 100644
--- a/apps/files/templates/list.php
+++ b/apps/files/templates/list.php
@@ -44,13 +44,13 @@
 			</th>
 			<th id='headerName' class="hidden column-name">
 				<div id="headerName-container">
-					<a class="name sort columntitle" data-sort="name">
+					<a class="name sort columntitle" onclick="event.preventDefault()" href="#" data-sort="name">
                         <span><?php p($l->t('Name')); ?></span>
                         <span class="sort-indicator"></span>
 
                     </a>
                     <span id="selectedActionsList" class="selectedActions">
-                        <a href="" class="actions-selected">
+                        <a href="#" onclick="event.preventDefault()" class="actions-selected">
                             <span class="icon icon-more"></span>
                             <span><?php p($l->t('Actions'))?></span>
                         </a>
@@ -58,10 +58,10 @@
 				</div>
 			</th>
 			<th id="headerSize" class="hidden column-size">
-				<a class="size sort columntitle" data-sort="size"><span><?php p($l->t('Size')); ?></span><span class="sort-indicator"></span></a>
+				<a class="size sort columntitle" href="#" onclick="event.preventDefault()" data-sort="size"><span><?php p($l->t('Size')); ?></span><span class="sort-indicator"></span></a>
 			</th>
 			<th id="headerDate" class="hidden column-mtime">
-				<a id="modified" class="columntitle" data-sort="mtime"><span><?php p($l->t('Modified')); ?></span><span class="sort-indicator"></span></a>
+				<a id="modified" class="columntitle" href="#" onclick="event.preventDefault()" data-sort="mtime"><span><?php p($l->t('Modified')); ?></span><span class="sort-indicator"></span></a>
 			</th>
 		</tr>
 	</thead>
-- 
cgit v1.2.3