]> _ Git - fluidbook-html5.git/commitdiff
wip #7462 @2
authorVincent Vanwaelscappel <vincent@cubedesigners.com>
Mon, 12 May 2025 15:15:12 +0000 (17:15 +0200)
committerVincent Vanwaelscappel <vincent@cubedesigners.com>
Mon, 12 May 2025 15:15:12 +0000 (17:15 +0200)
js/libs/fluidbook/fluidbook.accessibility.js
js/libs/fluidbook/fluidbook.burger.js
js/libs/fluidbook/fluidbook.keyboard.js
js/libs/fluidbook/fluidbook.menu.js
style/accessibility.less
style/burger.less

index 9958e3ca895b8a763f2bd06f1beedd92c0b2c7f4..5d39ec51dd40d1f4218732e318a91b0dffac5194 100644 (file)
@@ -72,7 +72,7 @@ FluidbookAccessibility.prototype = {
     // Using mousedown instead of mouseover, so that previously focused elements don't lose focus ring on mouse move
     add_event_listener('mousedown', function () {
         $('body').removeClass('keyboard-navigating');
-        set_css(':focus{outline:0}::-moz-focus-inner{border:0;}');
+        set_css(':focus{outline:0;border-inline:0;}::-moz-focus-inner{border:0;border-inline:0;}');
     });
 
     add_event_listener('keydown', function (e) {
index 8f2f9f0e72743d01c6a9fd115b44a10e08c74d2f..5b00db457ed20d9c30bb09ce5955a243dda8635d 100644 (file)
@@ -305,8 +305,8 @@ FluidbookBurger.prototype = {
 
         var $this = this;
         var res = '<form action="#" id="searchForm" method="post">';
-        res += '<input id="q" name="q" type="search" value="" tabindex="2" placeholder="' + this.fluidbook.l10n.__('search') + '" autocorrect="off" autocomplete="off" autocapitalize="off" />';
-        res += '<a href="#" id="submitSearch" class="icon-submitSearch" role="button" tabindex="1"><svg viewBox="0 0 512 512" class="nav-search nav-icon svg-icon" aria-hidden="true"><use xlink:href="#nav-search"></use></svg></a>';
+        res += '<input id="q" name="q" type="search" value="" placeholder="' + this.fluidbook.l10n.__('search') + '" autocorrect="off" autocomplete="off" autocapitalize="off" />';
+        res += '<a href="#" id="submitSearch" class="icon-submitSearch" role="button" tabindex="-1"><svg viewBox="0 0 512 512" class="nav-search nav-icon svg-icon" aria-hidden="true"><use xlink:href="#nav-search"></use></svg></a>';
         res += '</form>';
         res += '<div id="menuSearchHints" class="mm-nopanel"></div>';
         res += '<div id="menuSearchResults" class="mm-nopanel"></div>';
index 5f406372b04bd25eebbc83b7f7b804449afe9454..f47bdf024da9a20c1ad3b13a163f5898fe5a384c 100644 (file)
@@ -95,6 +95,9 @@ FluidbookKeyboard.prototype = {
         var elements = $(selector).find(focusableElementsString);
         var list = [];
         $(elements).each(function () {
+            if ($(this).attr('tabindex') == '-1') {
+                return;
+            }
             if ($(this).parents('[tabindex="-1"],.ignore-tab-children').length === 0 && $(this).is(':visible')) {
                 list.push(this);
             }
index cc6cf39c00cfabe96e6472ef9586806df754461c..adadf618bce725f09120759b84985591a19e7719 100644 (file)
@@ -1332,7 +1332,6 @@ FluidbookMenu.prototype = {
                 $($this).addClass('visible');
                 menu.fluidbook.hideLoader();
             }, 500);
-
         });
     },
 };
index 796a34c013996d19876b68331dcf175899eea9e2..7eb96a72d3a5ed9079cc6b94ef7e5353893a4161 100644 (file)
@@ -60,4 +60,8 @@
 
 #q:focus {
   outline: 0;
+
+  .using-keyboard & {
+    border-color: #c00;
+  }
 }
\ No newline at end of file
index 6c1d5b194d5af83da50a2848e3e8ff1d702a72e7..7896916d91181bb4bff9f90233e0618385a7f017 100644 (file)
@@ -271,16 +271,20 @@ html.mm-opening .mm-menu.mm-opened[class*=mm-pagedim] ~ #mm-blocker {
 #q {
   background-color: @menu-field-background;
   color: @menu-field-text;
-  border: none;
   border-radius: 0;
   height: 60px;
   font-size: 16px;
   padding: 0 1em 0 70px;
   width: 260px;
+  border: transparent 6px solid;
 
   .rtl & {
     padding: 0 70px 0 1em;
   }
+
+  &:focus{
+
+  }
 }
 
 #submitSearch {