'Review Request: Improve PlasmaComponents.ToolButton layout'

[prev in list] [next in list] [prev in thread] [next in thread] 

List:       kde-panel-devel
Subject:    Review Request: Improve PlasmaComponents.ToolButton layout
From:       Aurélien Gâteau <agateau () kde ! org>
Date:       2012-04-26 8:27:06
Message-ID: 20120426082706.11422.29921 () vidsolbach ! de
[Download RAW message or body]

[Attachment #2 (multipart/alternative)]

-----------------------------------------------------------
This is an automatically generated e-mail. To reply, visit:
http://git.reviewboard.kde.org/r/104735/
-----------------------------------------------------------

Review request for Plasma and David Edmundson.

Description
-------

This patch fixes two issues in ToolButton layout:

1. Make sure there is some space between the button icon and its text

2. Do not enforce a minimum width

The reason for #2 is that having a minimum width does not make much sense f=
or a ToolButton:
- It should aim at using the minimum amount of horizontal space when used i=
n a ToolBar.
- It looks unbalanced when used with an icon because the content is flushed=
 to the left, leaving a large amount of white-space on the right. (See atta=
ched screenshots)

Diffs
-----

  plasma/declarativeimports/plasmacomponents/qml/ToolButton.qml 0447a69 =

Diff: http://git.reviewboard.kde.org/r/104735/diff/

Testing
-------

Run attached test script, you should notice the differences in spacing betw=
een button icon and text, as well as in the white-space on the right of the=
 button.

Screenshots
-----------

Before
  http://git.reviewboard.kde.org/r/104735/s/545/
After
  http://git.reviewboard.kde.org/r/104735/s/546/

Thanks,

Aur=C3=A9lien G=C3=A2teau

[Attachment #5 (text/html)]

<html>
 <body>
  <div style="font-family: Verdana, Arial, Helvetica, Sans-Serif;">
   <table bgcolor="#f9f3c9" width="100%" cellpadding="8" style="border: 1px #c9c399 \
solid;">  <tr>
     <td>
      This is an automatically generated e-mail. To reply, visit:
      <a href="http://git.reviewboard.kde.org/r/104735/">http://git.reviewboard.kde.org/r/104735/</a>
  </td>
    </tr>
   </table>
   <br />

<table bgcolor="#fefadf" width="100%" cellspacing="0" cellpadding="8" \
style="background-image: \
url('http://git.reviewboard.kde.org/media/rb/images/review_request_box_top_bg.png'); \
background-position: left top; background-repeat: repeat-x; border: 1px black \
solid;">  <tr>
  <td>

<div>Review request for Plasma and David Edmundson.</div>
<div>By Aurélien Gâteau.</div>

<h1 style="color: #575012; font-size: 10pt; margin-top: 1.5em;">Description </h1>
 <table width="100%" bgcolor="#ffffff" cellspacing="0" cellpadding="10" \
style="border: 1px solid #b8b5a0">  <tr>
  <td>
   <pre style="margin: 0; padding: 0; white-space: pre-wrap; white-space: \
-moz-pre-wrap; white-space: -pre-wrap; white-space: -o-pre-wrap; word-wrap: \
break-word;">This patch fixes two issues in ToolButton layout:

1. Make sure there is some space between the button icon and its text

2. Do not enforce a minimum width

The reason for #2 is that having a minimum width does not make much sense for a \
                ToolButton:
- It should aim at using the minimum amount of horizontal space when used in a \
                ToolBar.
- It looks unbalanced when used with an icon because the content is flushed to the \
left, leaving a large amount of white-space on the right. (See attached screenshots) \
</pre>  </td>
 </tr>
</table>

<h1 style="color: #575012; font-size: 10pt; margin-top: 1.5em;">Testing </h1>
<table width="100%" bgcolor="#ffffff" cellspacing="0" cellpadding="10" style="border: \
1px solid #b8b5a0">  <tr>
  <td>
   <pre style="margin: 0; padding: 0; white-space: pre-wrap; white-space: \
-moz-pre-wrap; white-space: -pre-wrap; white-space: -o-pre-wrap; word-wrap: \
break-word;">Run attached test script, you should notice the differences in spacing \
between button icon and text, as well as in the white-space on the right of the \
button.</pre>  </td>
 </tr>
</table>

<h1 style="color: #575012; font-size: 10pt; margin-top: 1.5em;">Diffs</b> </h1>
<ul style="margin-left: 3em; padding-left: 0;">

 <li>plasma/declarativeimports/plasmacomponents/qml/ToolButton.qml <span \
style="color: grey">(0447a69)</span></li>

</ul>

<p><a href="http://git.reviewboard.kde.org/r/104735/diff/" style="margin-left: \
3em;">View Diff</a></p>

<h1 style="color: #575012; font-size: 10pt; margin-top: 1.5em;">Screenshots </h1>

<div>

 <a href="http://git.reviewboard.kde.org/r/104735/s/545/"><img \
src="http://git.reviewboard.kde.org/media/uploaded/images/2012/04/26/toolbutton-layout-before_400x100.png" \
style="border: 1px black solid;" alt="Before" /></a>

 <a href="http://git.reviewboard.kde.org/r/104735/s/546/"><img \
src="http://git.reviewboard.kde.org/media/uploaded/images/2012/04/26/toolbutton-layout-after_400x100.png" \
style="border: 1px black solid;" alt="After" /></a>

</div>

  </td>
 </tr>
</table>

  </div>
 </body>
</html>

_______________________________________________
Plasma-devel mailing list
Plasma-devel@kde.org
https://mail.kde.org/mailman/listinfo/plasma-devel

[prev in list] [next in list] [prev in thread] [next in thread] 