[Rt-commit] rt branch, 4.6/fix-menu-overflows, updated. rt-4.4.4-534-g657d623152

[Blaine Motsinger]

The branch, 4.6/fix-menu-overflows has been updated
       via  657d623152f037c2421802d031bfc10b8f268a91 (commit)
      from  affff47bdafd02d68d72b1f4cc71321daaab5947 (commit)

Summary of changes:
 share/html/Elements/CreateTicket        |  8 +++++++-
 share/static/css/elevator-light/nav.css | 15 +++++++++++++--
 2 files changed, 20 insertions(+), 3 deletions(-)

- Log -----------------------------------------------------------------
commit 657d623152f037c2421802d031bfc10b8f268a91
Author: Blaine Motsinger <blaine at bestpractical.com>
Date:   Mon Dec 16 16:18:57 2019 -0600

    Re-add collapsing topactions buttons
    
    This commit re-adds the topactions collapsing functionality to
    allow more space for app-nav before it overflows to the "more" menu.
    
    The functionality is slightly different as it doesn't contain the
    dropdown for queue selection, but uses the classes which were
    already in place.

diff --git a/share/html/Elements/CreateTicket b/share/html/Elements/CreateTicket
index aa9ae034cb..22a2e45937 100644
--- a/share/html/Elements/CreateTicket
+++ b/share/html/Elements/CreateTicket
@@ -63,9 +63,15 @@
 <% $queue_selector |n %>
 % }
 % elsif ($ButtonOnly) {
-<div class="create-ticket-button">
+<div class="create-wide">
 <&|/l_unsafe, $button_only_start_modal, $button_end &>[_1]Create new ticket[_2]</&>
 </div>
+<div class="create-medium">
+<&|/l_unsafe, $button_start_modal, $button_end &>[_1]Create[_2]</&>
+</div>
+<div class="create-narrow">
+<&|/l_unsafe, $button_start_modal, $button_end &>[_1]+[_2]</&>
+</div>
 % }
 % else {
 <div class="create-wide">
diff --git a/share/static/css/elevator-light/nav.css b/share/static/css/elevator-light/nav.css
index ed22a2fd04..9319093cb3 100644
--- a/share/static/css/elevator-light/nav.css
+++ b/share/static/css/elevator-light/nav.css
@@ -179,6 +179,7 @@ ul.sf-menu li {
     margin-left: 1em;
     text-align: right;
     margin-top: 0.5em;
+    margin-right: 0.5em;
 }
 
 #topactions form input.btn {
@@ -201,7 +202,6 @@ ul.sf-menu li {
     top: 0;
     right: 18em;
     width: auto;
-    min-width: 20em;
     font-size: 0.9em;
     z-index: 99;
 }
@@ -211,14 +211,21 @@ ul.sf-menu li {
     -webkit-appearance: textfield;
 }
 
+/* search focus in #topactions */
 #topactions input[type="search"]:focus {
-    width: 16em;
+    width: 10em;
     -webkit-transition: width 0.25s ease-in-out;
     -moz-transition: width 0.25s ease-in-out;
     -ms-transition: width 0.25s ease-in-out;
     transition: width 0.25s ease-in-out;
 }
 
+ at media (max-width: 900px) or (max-width: 600px) {
+    #topactions input[type="search"]:focus {
+        width: 4.7em;
+    }
+}
+
 #topactions input[type="search"]::-webkit-search-cancel-button {
     /* hide webkit x button for searches */
     -webkit-appearance: none;
@@ -370,6 +377,10 @@ ul.toplevel.sf-menu > li > ul > li a.sf-with-ul:after {
     div#header h1 {
         right: 10em;
     }
+
+    #topactions {
+        right: 18em;
+    }
 }
 
 @media (max-width: 600px) {

-----------------------------------------------------------------------