<html>
  <head>
    <meta content="text/html; charset=windows-1252"
      http-equiv="Content-Type">
  </head>
  <body bgcolor="#FFFFFF" text="#000000">
    <p>Hi Samuel,</p>
    <p>+1 from me.</p>
    <p>I feel, this will also help in future easy elimination of second
      level.</p>
    <p><br>
      Regards</p>
    <p>Chandra<br>
    </p>
    <div class="moz-cite-prefix">On 7/13/16 2:24 AM, Samuel Henrique De
      Oliveira Guimaraes wrote:<br>
    </div>
    <blockquote
      cite="mid:e02d353fd7954ebe8c603bb11832f212@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.HTMLPreformattedChar
        {mso-style-name:"HTML Preformatted Char";
        mso-style-priority:99;
        mso-style-link:"HTML Preformatted";
        font-family:Consolas;
        color:black;
        mso-fareast-language:EN-US;}
span.EmailStyle21
        {mso-style-type:personal;
        font-family:"Calibri",sans-serif;
        color:windowtext;}
span.EmailStyle22
        {mso-style-type:personal;
        font-family:"Calibri",sans-serif;
        color:#1F497D;}
span.EmailStyle23
        {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" lang="EN-US">Created
            a new variation with a sticky fixed floating sidebar and
            single contente on the page. I also removed the accordion
            because if we are going to display only one item per page,
            we shouldn’t have hidden elements on the page.<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">Samuel<o:p></o:p></span></p>
        <p class="MsoNormal"><span style="color:#1F497D"><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"> Aline Manera
                [<a class="moz-txt-link-freetext" href="mailto:alinefm@linux.vnet.ibm.com">mailto:alinefm@linux.vnet.ibm.com</a>]
                <br>
                <b>Sent:</b> terça-feira, 12 de julho de 2016 09:53<br>
                <b>To:</b> Samuel Henrique De Oliveira Guimaraes
                <a class="moz-txt-link-rfc2396E" href="mailto:samuel.guimaraes@eldorado.org.br">&lt;samuel.guimaraes@eldorado.org.br&gt;</a>;
                <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 class="MsoNormal" style="margin-bottom:12.0pt">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<span
            style="font-size:12.0pt;mso-fareast-language:PT-BR"><o:p></o:p></span></p>
        <div>
          <p class="MsoNormal">On 07/11/2016 06:12 PM, 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"><span style="color:#1F497D">Hi team,</span><o:p></o:p></p>
          <p class="MsoNormal"><span style="color:#1F497D"> </span><o:p></o:p></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).</span><o:p></o:p></p>
          <p class="MsoNormal"><span style="color:#1F497D" lang="EN-US"> </span><o:p></o:p></p>
          <p class="MsoNormal"><span style="color:#1F497D" lang="EN-US">Samuel</span><o:p></o:p></p>
          <p class="MsoNormal"><span style="color:#1F497D" lang="EN-US"> </span><o:p></o:p></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 moz-do-not-send="true"
                    href="mailto:kimchi-devel-bounces@ovirt.org">kimchi-devel-bounces@ovirt.org</a>
                  [<a moz-do-not-send="true"
                    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 moz-do-not-send="true"
                    href="mailto:kimchi-devel@ovirt.org">kimchi-devel@ovirt.org</a><br>
                  <b>Subject:</b> Re: [Kimchi-devel] [RFC] Wok / Ginger
                  sidebar</span><o:p></o:p></p>
            </div>
          </div>
          <p class="MsoNormal"> <o:p></o:p></p>
          <p>Hi Samuel,<o:p></o:p></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/">https://www.sitepoint.com/</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/">http://www.worldwildlife.org/</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">https://www.theguardian.com/us</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">https://next.ft.com/fastft</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/">http://codepen.io/SitePoint/full/uIemr/</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/">https://codepen.io/benske/full/cxrta/</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"><br>
                <br>
                <br>
                <br>
              </span><o:p></o:p></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"> </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>