wait #7984 @2:00

diff --git a/js/libs/fluidbook/fluidbook.burger.js b/js/libs/fluidbook/fluidbook.burger.js
index dfced6ee039c4674bbd41fcbdfd1046ce5dc9bf7..5023f0b2bcd406e0b2b8a397220a901fdc578c58 100644 (file)
--- a/js/libs/fluidbook/fluidbook.burger.js
+++ b/js/libs/fluidbook/fluidbook.burger.js
@@ -272,7 +272,7 @@ FluidbookBurger.prototype = {
         var res = '<form action="#" id="searchForm" method="post">';
         res += '<input id="q" name="q" type="search" value="" aria-label="' + this.fluidbook.l10n.__('search keywords or reference') + '" placeholder="' + this.fluidbook.l10n.__('search keywords or reference') + '" autocorrect="off" autocomplete="off" autocapitalize="off" />';
         res += '<a href="#" id="submitSearch" class="icon-submitSearch" role="button" tabindex="-1" aria-label="' + this.fluidbook.l10n.__('submit search') + '"><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 += '<div id="menuSearchClose" role="button" aria-label="' + this.fluidbook.l10n.__('close') + '" aria-keyshortcuts="Escape">';
+        res += '<div id="menuSearchClose" role="button" aria-label="' + this.fluidbook.l10n.__('close') + '" aria-keyshortcuts="Escape" tabindex="0">';
         res += getSpriteIcon('interface-close');
         res += '</div>';
         res += '</form>';

diff --git a/js/libs/fluidbook/fluidbook.keyboard.js b/js/libs/fluidbook/fluidbook.keyboard.js
index 8320f3b1ceaa43aea8abc37447ab3b47b14fc910..aa17459898b248411a57cf075ce1cbeccd305b66 100644 (file)
--- a/js/libs/fluidbook/fluidbook.keyboard.js
+++ b/js/libs/fluidbook/fluidbook.keyboard.js
@@ -84,6 +84,9 @@ FluidbookKeyboard.prototype = {
         if (this.fluidbook.search.isResultNavOpened()) {
             this.tabNavigation('#searchResultsNav', dir);
             return true;
+        } else if (this.fluidbook.floatmode) {
+            this.tabNavigation('#menuSearch', dir);
+            return true;
         } else if (this.fluidbook.nav.burger.isOpened) {
             this.tabNavigation('#menu', dir);
             return true;

diff --git a/style/search-float.less b/style/search-float.less
index cc9006ae85e74264c2646eddc23326a6885364fe..2e376fc8a3762a9a24927a553f190f3371fe7fb3 100644 (file)
--- a/style/search-float.less
+++ b/style/search-float.less
@@ -31,7 +31,7 @@ body.floatmode {
 
     .no-results {
       font-size: 13px;
-      opacity: .5;
+      opacity: .4;
       padding: 5px 0 5px 12px;
     }
   }
@@ -72,7 +72,7 @@ body.floatmode {
     color: @search-float-text;
     height: 46px;
     font-size: 14px;
-    padding: 0 1em 0 .30em;
+    padding: 0 1em 0 3.4em;
     width: 100%;
     order: 2;
   }
@@ -83,9 +83,9 @@ body.floatmode {
     border-radius: 3px;
     transition: background-color 250ms;
     color: @search-float-text;
-    position: initial;
-    transform: none;
     order: 1;
+    top: 50%;
+    transform: translateY(-50%);
     &:hover {
       background-color: if((@search-float-background = @menu-field-background), @menu-button-background, rgba(255, 255, 255, .12));
     }
@@ -100,9 +100,19 @@ body.floatmode {
     padding: 0;
 
     &:has(.hint) {
-      padding: 10px 0;
-      margin: 0 10px;
-      border-top: 1px solid darken(#fff, 70%);
+      padding: 10px 8px;
+      margin: 0 2px;
+
+      &:before {
+        content: "";
+        width: 98%;
+        height: 1px;
+        background-color: darken(#fff, 70%);
+        position: absolute;
+        top: 0;
+        left: 50%;
+        transform: translateX(-50%);
+      }
     }
 
     .hint {
@@ -112,7 +122,7 @@ body.floatmode {
       margin: 0 !important;
       transition: background-color 250ms;
 
-      &:hover {
+      &:hover,&:focus {
         background-color: if((@search-float-background = @menu-field-background), @menu-button-background, rgba(255, 255, 255, .12));
       }