diff --git a/apps/files/css/files.css b/apps/files/css/files.css index 3829759a14ecd76ba7f7369cf3ab01c768f6f214..6f31715499b2d71a0ab16f33f77b63129a6ddad0 100644 --- a/apps/files/css/files.css +++ b/apps/files/css/files.css @@ -105,6 +105,7 @@ #filestable tbody tr { background-color:#fff; height:40px; } #filestable tbody tr:hover, #filestable tbody tr:focus, +#filestable tbody .name:focus, #filestable tbody tr:active { background-color: rgb(240,240,240); } @@ -503,7 +504,7 @@ a.action>img { #fileList a.action { display: inline; - padding: 18px 8px; + padding: 17px 8px; line-height: 50px; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); @@ -516,15 +517,19 @@ a.action>img { position: relative; top: -21px; } -#fileList tr:hover a.action, #fileList a.action.permanent -#fileList tr:focus a.action, #fileList a.action.permanent { +#fileList tr:hover a.action, +#fileList a.action.permanent, +#fileList tr:focus a.action, +#fileList a.action.permanent +/*#fileList .name:focus .action*/ { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; filter: alpha(opacity=50); opacity: .5; display:inline; } #fileList tr:hover a.action:hover, -#fileList tr:focus a.action:focus { +#fileList tr:focus a.action:focus, +#fileList .name:focus a.action:focus { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); opacity: 1; diff --git a/core/css/apps.css b/core/css/apps.css index e5cf6201688236e37371b94a4d00f6a2d39a6c7d..08877402a4be6d6d079e9e888f72ef6e58f24191 100644 --- a/core/css/apps.css +++ b/core/css/apps.css @@ -56,6 +56,7 @@ #app-navigation li:hover > a, #app-navigation li:focus > a, +#app-navigation a:focus, #app-navigation .selected, #app-navigation .selected a { background-color: #ddd; diff --git a/core/css/header.css b/core/css/header.css index 2ec82ce844a5882d3c711af5e05de866744b7b30..2a2622a9d0d9e56feef9ae5d31bd3b8346b4eb95 100644 --- a/core/css/header.css +++ b/core/css/header.css @@ -7,6 +7,22 @@ -ms-user-select: none; } +#skip-to-content a { + position: absolute; + left: -10000px; + top: auto; + width: 1px; + height: 1px; + overflow: hidden; +} +#skip-to-content a:focus { + left: 76px; + top: -9px; + color: #fff; + width: auto; + height: auto; +} + /* HEADERS ------------------------------------------------------------------ */ @@ -83,9 +99,9 @@ } .menutoggle:hover .header-appname, .menutoggle:hover .icon-caret, -.menutoggle:focus .header-appname -.menutoggle:focus .icon-caret -.menutoggle.active .header-appname +.menutoggle:focus .header-appname, +.menutoggle:focus .icon-caret, +.menutoggle.active .header-appname, .menutoggle.active .icon-caret { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); diff --git a/core/css/styles.css b/core/css/styles.css index 3996aade6d4206d77515b63f8a50391262ad9bc4..df4db4d745a01ff4812b036542c8bccf70755be1 100644 --- a/core/css/styles.css +++ b/core/css/styles.css @@ -192,6 +192,7 @@ input[type="submit"]:hover, input[type="submit"]:focus, input[type="button"]:hover, input[type="button"]:focus, button:hover, button:focus, .button:hover, .button:focus, +.button a:focus, select:hover, select:focus, select:active { background-color: rgba(255, 255, 255, .95); color: #111; @@ -974,6 +975,7 @@ div.crumb a.ellipsislink { /* some feedback for hover/tap on breadcrumbs */ div.crumb:hover, div.crumb:focus, +div.crumb a:focus, div.crumb:active { -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; filter:alpha(opacity=70); diff --git a/core/templates/layout.user.php b/core/templates/layout.user.php index 11e2df714581fe194fc66d3814153002b03e8164..238b2dd163e4bef58081916fb923330dee7fa669 100644 --- a/core/templates/layout.user.php +++ b/core/templates/layout.user.php @@ -40,14 +40,16 @@ <?php endif; ?> </div> <header><div id="header"> - <a href="<?php print_unescaped(link_to('', 'index.php')); ?>" title="" id="owncloud"> + <a href="<?php print_unescaped(link_to('', 'index.php')); ?>" + title="" id="owncloud" tabindex="-1"> <div class="logo-icon svg"> <h1 class="hidden-visually"> <?php p($theme->getName()); ?> </h1> </div> </a> - <a href="#" class="menutoggle" tabindex="1"> + + <a href="#" class="menutoggle" tabindex="2"> <h1 class="header-appname"> <?php if(OC_Util::getEditionString() === '') { @@ -59,9 +61,14 @@ </h1> <div class="icon-caret svg"></div> </a> + + <div id="skip-to-content"> + <a href="#app-content" tabindex="1"><?php p($l->t('Skip to content')); ?></a> + </div> + <div id="logo-claim" style="display:none;"><?php p($theme->getLogoClaim()); ?></div> <div id="settings" class="svg"> - <div id="expand" tabindex="3" role="link"> + <div id="expand" tabindex="4" role="link"> <?php if ($_['enableAvatars']): ?> <div class="avatardiv<?php if ($_['userAvatarSet']) { print_unescaped(' avatardiv-shown"'); } else { print_unescaped('" style="display: none"'); } ?>> <?php if ($_['userAvatarSet']): ?> @@ -100,7 +107,7 @@ </label> <input id="searchbox" class="svg" type="search" name="query" value="<?php if(isset($_POST['query'])) {p($_POST['query']);};?>" - autocomplete="off" tabindex="2" /> + autocomplete="off" tabindex="3" /> </form> </div></header>