<table><tr><td style="">rkflx added a comment.
</td><a style="text-decoration: none; padding: 4px 8px; margin: 0 8px 8px; float: right; color: #464C5C; font-weight: bold; border-radius: 3px; background-color: #F7F7F9; background-image: linear-gradient(to bottom,#fff,#f1f0f1); display: inline-block; border: 1px solid rgba(71,87,120,.2);" href="https://phabricator.kde.org/D10475" rel="noreferrer">View Revision</a></tr></table><br /><div><div><p><a href="https://phabricator.kde.org/p/ngraham/" style="
border-color: #f1f7ff;
color: #19558d;
background-color: #f1f7ff;
border: 1px solid transparent;
border-radius: 3px;
font-weight: bold;
padding: 0 4px;" rel="noreferrer">@ngraham</a></p>
<blockquote style="border-left: 3px solid #a7b5bf; color: #464c5c; font-style: italic; margin: 4px 0 12px 0; padding: 4px 12px; background-color: #f8f9fc;"><p>In this patch, we are trying to solve the general case of how a navigation header with context actions should look.</p></blockquote>
<p>I see, but I'm afraid with only a single example (which should be solved differently anyway) it is going to be hard to reach a conclusion. I'm not sure about the purpose of the "title" element.</p>
<blockquote style="border-left: 3px solid #a7b5bf; color: #464c5c; font-style: italic; margin: 4px 0 12px 0; padding: 4px 12px; background-color: #f8f9fc;"><p>"worst case scenario" for a header with two navigation buttons, a title, and 2 or more context actions.</p></blockquote>
<p>I doubt a "title" with four more elements plus the required spacing will work at all as a title.</p>
<blockquote style="border-left: 3px solid #a7b5bf; color: #464c5c; font-style: italic; margin: 4px 0 12px 0; padding: 4px 12px; background-color: #f8f9fc;"><p>On another note, what would be your preference for title alignment: left-aligned, or centered?</p></blockquote>
<p>There are two qualities which make something a title: First and foremost, enough room to breathe, and less importantly a more pronounced font (bigger size, bolder). This means for me one of these situations:</p>
<ul class="remarkup-list">
<li class="remarkup-list-item"><span><span class="phui-tag-view phui-tag-type-shade phui-tag-grey phui-tag-shade "><span class="phui-tag-core ">lots of space</span></span></span> <span><span class="phui-tag-view phui-tag-type-shade phui-tag-grey phui-tag-shade "><span class="phui-tag-core ">title</span></span></span> <span><span class="phui-tag-view phui-tag-type-shade phui-tag-grey phui-tag-shade "><span class="phui-tag-core ">lots of space</span></span></span></li>
<li class="remarkup-list-item"><span><span class="phui-tag-view phui-tag-type-shade phui-tag-grey phui-tag-shade "><span class="phui-tag-core ">title</span></span></span> <span><span class="phui-tag-view phui-tag-type-shade phui-tag-grey phui-tag-shade "><span class="phui-tag-core ">lots of space</span></span></span> <span><span class="phui-tag-view phui-tag-type-shade phui-tag-grey phui-tag-shade "><span class="phui-tag-core ">small icon possibly with text</span></span></span></li>
<li class="remarkup-list-item"><span><span class="phui-tag-view phui-tag-type-shade phui-tag-grey phui-tag-shade "><span class="phui-tag-core ">small icon with no text at all</span></span></span> <span><span class="phui-tag-view phui-tag-type-shade phui-tag-grey phui-tag-shade "><span class="phui-tag-core ">lots of space</span></span></span> <span><span class="phui-tag-view phui-tag-type-shade phui-tag-grey phui-tag-shade "><span class="phui-tag-core ">title</span></span></span> <span><span class="phui-tag-view phui-tag-type-shade phui-tag-grey phui-tag-shade "><span class="phui-tag-core ">lots of space</span></span></span> <span><span class="phui-tag-view phui-tag-type-shade phui-tag-grey phui-tag-shade "><span class="phui-tag-core ">small icon with no text at all</span></span></span></li>
</ul>
<p>I would avoid anything involving the following in relation to the title:</p>
<ul class="remarkup-list">
<li class="remarkup-list-item"><span><span class="phui-tag-view phui-tag-type-shade phui-tag-grey phui-tag-shade "><span class="phui-tag-core ">small space</span></span></span></li>
<li class="remarkup-list-item"><span><span class="phui-tag-view phui-tag-type-shade phui-tag-grey phui-tag-shade "><span class="phui-tag-core ">no space at all</span></span></span></li>
<li class="remarkup-list-item">more than two non-space items in addition to the title</li>
<li class="remarkup-list-item"><span><span class="phui-tag-view phui-tag-type-shade phui-tag-grey phui-tag-shade "><span class="phui-tag-core ">|</span></span></span> as a replacement for <span><span class="phui-tag-view phui-tag-type-shade phui-tag-grey phui-tag-shade "><span class="phui-tag-core ">lots of space</span></span></span></li>
</ul>
<p>Otherwise the title element cannot perform its role properly and feels cramped. Unfortunately this means most of the screenshots above don't fit those requirements. On the plus side, it explains the "remaining issues" and weirdness you noted above.</p>
<p>In your case I would think about a two-row approach, i.e. a row resembling a toolbar, and a separate row for the title. Once you only have a title and two non-text icons, it could collapse to a single row.</p></div></div><br /><div><strong>REPOSITORY</strong><div><div>R169 Kirigami</div></div></div><br /><div><strong>REVISION DETAIL</strong><div><a href="https://phabricator.kde.org/D10475" rel="noreferrer">https://phabricator.kde.org/D10475</a></div></div><br /><div><strong>To: </strong>apol, Kirigami, mart, ngraham, abetts<br /><strong>Cc: </strong>rkflx, mart, ngraham, plasma-devel, apol, davidedmundson, hein<br /></div>