<html>
  <head>
    <meta content="text/html; charset=windows-1252"
      http-equiv="Content-Type">
  </head>
  <body bgcolor="#FFFFFF" text="#000000">
    Hi Samuel,<br>
    <br>
    I'd say to keep the menu always visible in a left panel/menu and
    with a default first view when user enters on Administration tab.<br>
    <br>
    Regards,<br>
    Aline Manera<br>
    <br>
    <div class="moz-cite-prefix">On 07/11/2016 06:12 PM, Samuel Henrique
      De Oliveira Guimaraes wrote:<br>
    </div>
    <blockquote
      cite="mid:3fef1f6321404ffc9cbe7d23fd448cbb@serv031.corp.eldorado.org.br"
      type="cite">
      <meta http-equiv="Content-Type" content="text/html;
        charset=windows-1252">
      <meta name="Generator" content="Microsoft Word 15 (filtered
        medium)">
      <style><!--
/* Font Definitions */
@font-face
        {font-family:Wingdings;
        panose-1:5 0 0 0 0 0 0 0 0 0;}
@font-face
        {font-family:"Cambria Math";
        panose-1:2 4 5 3 5 4 6 3 2 4;}
@font-face
        {font-family:Calibri;
        panose-1:2 15 5 2 2 2 4 3 2 4;}
@font-face
        {font-family:Consolas;
        panose-1:2 11 6 9 2 2 4 3 2 4;}
/* Style Definitions */
p.MsoNormal, li.MsoNormal, div.MsoNormal
        {margin:0cm;
        margin-bottom:.0001pt;
        font-size:11.0pt;
        font-family:"Calibri",sans-serif;
        color:black;
        mso-fareast-language:EN-US;}
a:link, span.MsoHyperlink
        {mso-style-priority:99;
        color:#0563C1;
        text-decoration:underline;}
a:visited, span.MsoHyperlinkFollowed
        {mso-style-priority:99;
        color:#954F72;
        text-decoration:underline;}
p
        {mso-style-priority:99;
        mso-margin-top-alt:auto;
        margin-right:0cm;
        mso-margin-bottom-alt:auto;
        margin-left:0cm;
        font-size:11.0pt;
        font-family:"Calibri",sans-serif;
        color:black;
        mso-fareast-language:EN-US;}
pre
        {mso-style-priority:99;
        mso-style-link:"HTML Preformatted Char";
        margin:0cm;
        margin-bottom:.0001pt;
        font-size:10.0pt;
        font-family:"Courier New";
        color:black;
        mso-fareast-language:PT-BR;}
p.MsoListParagraph, li.MsoListParagraph, div.MsoListParagraph
        {mso-style-priority:34;
        margin-top:0cm;
        margin-right:0cm;
        margin-bottom:0cm;
        margin-left:36.0pt;
        margin-bottom:.0001pt;
        font-size:11.0pt;
        font-family:"Calibri",sans-serif;
        color:black;
        mso-fareast-language:EN-US;}
span.EmailStyle19
        {mso-style-type:personal;
        font-family:"Calibri",sans-serif;
        color:windowtext;}
span.HTMLPreformattedChar
        {mso-style-name:"HTML Preformatted Char";
        mso-style-priority:99;
        mso-style-link:"HTML Preformatted";
        font-family:"Consolas",serif;
        color:black;
        mso-fareast-language:EN-US;}
span.EmailStyle22
        {mso-style-type:personal-reply;
        font-family:"Calibri",sans-serif;
        color:#1F497D;}
.MsoChpDefault
        {mso-style-type:export-only;
        font-size:10.0pt;}
@page WordSection1
        {size:612.0pt 792.0pt;
        margin:70.85pt 3.0cm 70.85pt 3.0cm;}
div.WordSection1
        {page:WordSection1;}
/* List Definitions */
@list l0
        {mso-list-id:262812166;
        mso-list-type:hybrid;
        mso-list-template-ids:-2083256826 68550657 68550659 68550661 68550657 68550659 68550661 68550657 68550659 68550661;}
@list l0:level1
        {mso-level-number-format:bullet;
        mso-level-text:\F0B7;
        mso-level-tab-stop:none;
        mso-level-number-position:left;
        text-indent:-18.0pt;
        font-family:Symbol;}
@list l0:level2
        {mso-level-number-format:bullet;
        mso-level-text:o;
        mso-level-tab-stop:none;
        mso-level-number-position:left;
        text-indent:-18.0pt;
        font-family:"Courier New";}
@list l0:level3
        {mso-level-number-format:bullet;
        mso-level-text:\F0A7;
        mso-level-tab-stop:none;
        mso-level-number-position:left;
        text-indent:-18.0pt;
        font-family:Wingdings;}
@list l0:level4
        {mso-level-number-format:bullet;
        mso-level-text:\F0B7;
        mso-level-tab-stop:none;
        mso-level-number-position:left;
        text-indent:-18.0pt;
        font-family:Symbol;}
@list l0:level5
        {mso-level-number-format:bullet;
        mso-level-text:o;
        mso-level-tab-stop:none;
        mso-level-number-position:left;
        text-indent:-18.0pt;
        font-family:"Courier New";}
@list l0:level6
        {mso-level-number-format:bullet;
        mso-level-text:\F0A7;
        mso-level-tab-stop:none;
        mso-level-number-position:left;
        text-indent:-18.0pt;
        font-family:Wingdings;}
@list l0:level7
        {mso-level-number-format:bullet;
        mso-level-text:\F0B7;
        mso-level-tab-stop:none;
        mso-level-number-position:left;
        text-indent:-18.0pt;
        font-family:Symbol;}
@list l0:level8
        {mso-level-number-format:bullet;
        mso-level-text:o;
        mso-level-tab-stop:none;
        mso-level-number-position:left;
        text-indent:-18.0pt;
        font-family:"Courier New";}
@list l0:level9
        {mso-level-number-format:bullet;
        mso-level-text:\F0A7;
        mso-level-tab-stop:none;
        mso-level-number-position:left;
        text-indent:-18.0pt;
        font-family:Wingdings;}
@list l1
        {mso-list-id:1469858233;
        mso-list-type:hybrid;
        mso-list-template-ids:482217636 68550657 68550659 68550661 68550657 68550659 68550661 68550657 68550659 68550661;}
@list l1:level1
        {mso-level-number-format:bullet;
        mso-level-text:\F0B7;
        mso-level-tab-stop:none;
        mso-level-number-position:left;
        text-indent:-18.0pt;
        font-family:Symbol;}
@list l1:level2
        {mso-level-number-format:bullet;
        mso-level-text:o;
        mso-level-tab-stop:none;
        mso-level-number-position:left;
        text-indent:-18.0pt;
        font-family:"Courier New";}
@list l1:level3
        {mso-level-number-format:bullet;
        mso-level-text:\F0A7;
        mso-level-tab-stop:none;
        mso-level-number-position:left;
        text-indent:-18.0pt;
        font-family:Wingdings;}
@list l1:level4
        {mso-level-number-format:bullet;
        mso-level-text:\F0B7;
        mso-level-tab-stop:none;
        mso-level-number-position:left;
        text-indent:-18.0pt;
        font-family:Symbol;}
@list l1:level5
        {mso-level-number-format:bullet;
        mso-level-text:o;
        mso-level-tab-stop:none;
        mso-level-number-position:left;
        text-indent:-18.0pt;
        font-family:"Courier New";}
@list l1:level6
        {mso-level-number-format:bullet;
        mso-level-text:\F0A7;
        mso-level-tab-stop:none;
        mso-level-number-position:left;
        text-indent:-18.0pt;
        font-family:Wingdings;}
@list l1:level7
        {mso-level-number-format:bullet;
        mso-level-text:\F0B7;
        mso-level-tab-stop:none;
        mso-level-number-position:left;
        text-indent:-18.0pt;
        font-family:Symbol;}
@list l1:level8
        {mso-level-number-format:bullet;
        mso-level-text:o;
        mso-level-tab-stop:none;
        mso-level-number-position:left;
        text-indent:-18.0pt;
        font-family:"Courier New";}
@list l1:level9
        {mso-level-number-format:bullet;
        mso-level-text:\F0A7;
        mso-level-tab-stop:none;
        mso-level-number-position:left;
        text-indent:-18.0pt;
        font-family:Wingdings;}
ol
        {margin-bottom:0cm;}
ul
        {margin-bottom:0cm;}
--></style><!--[if gte mso 9]><xml>
<o:shapedefaults v:ext="edit" spidmax="1026" />
</xml><![endif]--><!--[if gte mso 9]><xml>
<o:shapelayout v:ext="edit">
<o:idmap v:ext="edit" data="1" />
</o:shapelayout></xml><![endif]-->
      <div class="WordSection1">
        <p class="MsoNormal"><span style="color:#1F497D">Hi team,<o:p></o:p></span></p>
        <p class="MsoNormal"><span style="color:#1F497D"><o:p> </o:p></span></p>
        <p class="MsoNormal"><span style="color:#1F497D" lang="EN-US">Based
            on the feedback I’ve created a new mockup putting all Ginger
            features in a floating vertical menu (I’ve only put some of
            them but you’ll get the idea).<o:p></o:p></span></p>
        <p class="MsoNormal"><span style="color:#1F497D" lang="EN-US"><o:p> </o:p></span></p>
        <p class="MsoNormal"><span style="color:#1F497D" lang="EN-US">Samuel<o:p></o:p></span></p>
        <p class="MsoNormal"><span style="color:#1F497D" lang="EN-US"><o:p> </o:p></span></p>
        <div>
          <div style="border:none;border-top:solid #E1E1E1
            1.0pt;padding:3.0pt 0cm 0cm 0cm">
            <p class="MsoNormal"><b><span
                  style="color:windowtext;mso-fareast-language:PT-BR"
                  lang="EN-US">From:</span></b><span
                style="color:windowtext;mso-fareast-language:PT-BR"
                lang="EN-US"> <a class="moz-txt-link-abbreviated" href="mailto:kimchi-devel-bounces@ovirt.org">kimchi-devel-bounces@ovirt.org</a>
                [<a class="moz-txt-link-freetext" href="mailto:kimchi-devel-bounces@ovirt.org">mailto:kimchi-devel-bounces@ovirt.org</a>]
                <b>On Behalf Of </b>Chandra Shekhar Reddy Potula<br>
                <b>Sent:</b> quinta-feira, 7 de julho de 2016 09:50<br>
                <b>To:</b> <a class="moz-txt-link-abbreviated" href="mailto:kimchi-devel@ovirt.org">kimchi-devel@ovirt.org</a><br>
                <b>Subject:</b> Re: [Kimchi-devel] [RFC] Wok / Ginger
                sidebar<o:p></o:p></span></p>
          </div>
        </div>
        <p class="MsoNormal"><o:p> </o:p></p>
        <p>Hi Samuel,<span
            style="font-size:12.0pt;mso-fareast-language:PT-BR"><o:p></o:p></span></p>
        <p>First of all thanks for your extensive investigation on
          various possibilities in front of us !!!<o:p></o:p></p>
        <p>I personally liked the option <span lang="EN-US"><a
              moz-do-not-send="true" href="https://www.sitepoint.com/"><a class="moz-txt-link-freetext" href="https://www.sitepoint.com/">https://www.sitepoint.com/</a></a>
            which would be ideal to have with possibly 3 level
            navigation.</span><o:p></o:p></p>
        <p><span lang="EN-US">Nevertheless, let us start with having
            side pane to provide immediate relief with the way proposed
            in the figures
          </span>ginger_sidebar_1.png and ginger_storage_2.png and
          eventually make it more better if it is too complex doing all
          of it ones.<o:p></o:p></p>
        <p>I agree with Daniel recommendation for the for
          ginger_sidebar*.png, ie. have one second level tab for now and
          all the functionalities go under the side pane which would be
          enabler in future some thing similar to your proposal of
          <span lang="EN-US"><a moz-do-not-send="true"
              href="https://www.sitepoint.com/">https://www.sitepoint.com/</a></span><o:p></o:p></p>
        <div>
          <p class="MsoNormal">Thanks and Regards<br>
            Chandra<br>
            <br>
            On 7/5/16 12:32 AM, Samuel Henrique De Oliveira Guimaraes
            wrote:<o:p></o:p></p>
        </div>
        <blockquote style="margin-top:5.0pt;margin-bottom:5.0pt">
          <p class="MsoNormal">Hi team,<o:p></o:p></p>
          <p class="MsoNormal"> <o:p></o:p></p>
          <p class="MsoNormal"><span lang="EN-US">We currently have an
              issue with Ginger/Gingerbase navigation bar in small
              screen resolutions and we also have huge tables in System
              Services page. Since working on the navigation bar
              involves editing Wok styles, I’m sending this e-mail to
              Wok mailing list instead of Ginger group.</span><o:p></o:p></p>
          <p class="MsoNormal"><span lang="EN-US">I looked for
              successful combinations of sidebar + horizontal navigation
              bars and so far I couldn’t find any example that would
              exactly fit with Wok and its plugins. The majority of
              examples I’m listing below are very good with traditional
              pages with deep subcategories and the navigation bars can
              work as sitemaps and replace breadcrumbs:</span><o:p></o:p></p>
          <p class="MsoNormal"><span lang="EN-US"> </span><o:p></o:p></p>
          <p class="MsoListParagraph"
            style="text-indent:-18.0pt;mso-list:l0 level1 lfo2"><!--[if !supportLists]--><span
              style="font-family:Symbol"><span style="mso-list:Ignore">·<span
                  style="font:7.0pt &quot;Times New Roman&quot;">        
                </span></span></span><!--[endif]--><span lang="EN-US"><a
                moz-do-not-send="true"
                href="http://www.worldwildlife.org/"><a class="moz-txt-link-freetext" href="http://www.worldwildlife.org/">http://www.worldwildlife.org/</a></a>
              -
              <a moz-do-not-send="true"
                href="https://vimeo.com/166812605">https://vimeo.com/166812605</a></span><o:p></o:p></p>
          <p class="MsoNormal"><span lang="EN-US"> </span><o:p></o:p></p>
          <p class="MsoListParagraph"
            style="text-indent:-18.0pt;mso-list:l0 level1 lfo2"><!--[if !supportLists]--><span
              style="font-family:Symbol"><span style="mso-list:Ignore">·<span
                  style="font:7.0pt &quot;Times New Roman&quot;">        
                </span></span></span><!--[endif]--><span lang="EN-US"><a
                moz-do-not-send="true"
                href="https://www.theguardian.com/us"><a class="moz-txt-link-freetext" href="https://www.theguardian.com/us">https://www.theguardian.com/us</a></a>
              -
              <a moz-do-not-send="true"
                href="https://vimeo.com/166812599">https://vimeo.com/166812599</a></span><o:p></o:p></p>
          <p class="MsoNormal"><span lang="EN-US"> </span><o:p></o:p></p>
          <p class="MsoListParagraph"
            style="text-indent:-18.0pt;mso-list:l0 level1 lfo2"><!--[if !supportLists]--><span
              style="font-family:Symbol"><span style="mso-list:Ignore">·<span
                  style="font:7.0pt &quot;Times New Roman&quot;">        
                </span></span></span><!--[endif]--><span lang="EN-US"><a
                moz-do-not-send="true" href="https://next.ft.com/fastft"><a class="moz-txt-link-freetext" href="https://next.ft.com/fastft">https://next.ft.com/fastft</a></a>
              -
              <a moz-do-not-send="true"
                href="https://vimeo.com/166812597">https://vimeo.com/166812597</a></span><o:p></o:p></p>
          <p class="MsoNormal"><span lang="EN-US"> </span><o:p></o:p></p>
          <p class="MsoNormal"><span lang="EN-US">Wok currently has two
              navigation levels. Kimchi doesn’t have multiple sections
              but Ginger and Gingerbase uses collapsible panel groups to
              separate sections that could be third level elements on a
              sidebar. This was already discussed when we moved some
              features from Ginger to Gingerbase but I think we could
              achieve a functional sidebar with up to three levels
              without using a “landing page” for second-level elements.</span><o:p></o:p></p>
          <p class="MsoNormal"><span lang="EN-US"> </span><o:p></o:p></p>
          <p class="MsoNormal"><span lang="EN-US">In the attached
              screenshots ginger_sidebar1 and ginger_sidebar2 are
              mockups for an off-canvas menu that would slide the main
              content and hide itself once an option is clicked. It
              would also hide the other panel accordions. Here are two
              off-canvas menu in action:</span><o:p></o:p></p>
          <p class="MsoListParagraph"
            style="text-indent:-18.0pt;mso-list:l1 level1 lfo4"><!--[if !supportLists]--><span
              style="font-family:Symbol"><span style="mso-list:Ignore">·<span
                  style="font:7.0pt &quot;Times New Roman&quot;">        
                </span></span></span><!--[endif]--><span lang="EN-US"><a
                moz-do-not-send="true"
                href="http://codepen.io/SitePoint/full/uIemr/"><a class="moz-txt-link-freetext" href="http://codepen.io/SitePoint/full/uIemr/">http://codepen.io/SitePoint/full/uIemr/</a></a></span><o:p></o:p></p>
          <p class="MsoListParagraph"><span lang="EN-US"> </span><o:p></o:p></p>
          <p class="MsoListParagraph"
            style="text-indent:-18.0pt;mso-list:l1 level1 lfo4"><!--[if !supportLists]--><span
              style="font-family:Symbol"><span style="mso-list:Ignore">·<span
                  style="font:7.0pt &quot;Times New Roman&quot;">        
                </span></span></span><!--[endif]--><span lang="EN-US"><a
                moz-do-not-send="true"
                href="https://codepen.io/benske/full/cxrta/"><a class="moz-txt-link-freetext" href="https://codepen.io/benske/full/cxrta/">https://codepen.io/benske/full/cxrta/</a></a></span><o:p></o:p></p>
          <p class="MsoListParagraph"><span lang="EN-US"> </span><o:p></o:p></p>
          <p class="MsoNormal"><span lang="EN-US">Since this would
              require a change in Wok tabs and ginger/gingerbase
              tab-ext.xml, I think we could implement something entirely
              different that would with Wok and all plugins. This site
              menu only have first-level options on the sidebar but I
              think we could add collapsible links like a tree-table
              menu:
              <a moz-do-not-send="true"
                href="https://www.sitepoint.com/">https://www.sitepoint.com/</a></span><o:p></o:p></p>
          <p class="MsoNormal"><span lang="EN-US">In addition to the
              sidebar, we could put a search/filter input on the top
              that would allow the user to type the desired option and
              show its position on the menu. Please take a look at the
              remaining attached screenshots. I did one variation with
              the content aligned to the center and another one aligned
              to the left.
            </span><o:p></o:p></p>
          <p class="MsoNormal"><span lang="EN-US"> </span><o:p></o:p></p>
          <p class="MsoNormal"><span lang="EN-US">Regards,</span><o:p></o:p></p>
          <p class="MsoNormal"><span lang="EN-US">Samuel</span><o:p></o:p></p>
          <p class="MsoNormal"><span
              style="font-size:12.0pt;font-family:&quot;Times New
              Roman&quot;,serif;mso-fareast-language:PT-BR"><br>
              <br>
              <br>
              <o:p></o:p></span></p>
          <pre>_______________________________________________<o:p></o:p></pre>
          <pre>Kimchi-devel mailing list<o:p></o:p></pre>
          <pre><a moz-do-not-send="true" href="mailto:Kimchi-devel@ovirt.org">Kimchi-devel@ovirt.org</a><o:p></o:p></pre>
          <pre><a moz-do-not-send="true" href="http://lists.ovirt.org/mailman/listinfo/kimchi-devel">http://lists.ovirt.org/mailman/listinfo/kimchi-devel</a><o:p></o:p></pre>
        </blockquote>
        <p class="MsoNormal"><span
            style="font-size:12.0pt;font-family:&quot;Times New
            Roman&quot;,serif;mso-fareast-language:PT-BR"><o:p> </o:p></span></p>
      </div>
      <br>
      <fieldset class="mimeAttachmentHeader"></fieldset>
      <br>
      <pre wrap="">_______________________________________________
Kimchi-devel mailing list
<a class="moz-txt-link-abbreviated" href="mailto:Kimchi-devel@ovirt.org">Kimchi-devel@ovirt.org</a>
<a class="moz-txt-link-freetext" href="http://lists.ovirt.org/mailman/listinfo/kimchi-devel">http://lists.ovirt.org/mailman/listinfo/kimchi-devel</a>
</pre>
    </blockquote>
    <br>
  </body>
</html>