ICEfaces
  1. ICEfaces
  2. ICE-10696

Add "headerAlign" attribute to ace:panel

          Details

          • Type: Improvement Improvement
          • Status: Closed
          • Priority: Major Major
          • Resolution: Fixed
          • Affects Version/s: 4.0
          • Fix Version/s: 4.1
          • Component/s: ACE-Components
          • Labels:
            None
          • Environment:
            Any
          • Affects:
            Documentation (User Guide, Ref. Guide, etc.), Sample App./Tutorial

            Description

            Ideally the ace:panel component would have a "headerAlign" attribute (with options of left, center, right) to automatically style the text defined by the "header" attribute. Currently styling the header is a bit counter-intuitive and tough for a developer because of how the component renders.
            1. header-new.png
              11 kB
            2. header-old.png
              11 kB

              Activity

              Ascending order - Click to sort in descending order
              Carlo Guglielmin created issue -
              Ken Fyten made changes -
              Field Original Value New Value
              Assignee Arturo Zambrano [ artzambrano ]
              Fix Version/s 4.1 [ 11375 ]
              Affects Documentation (User Guide, Ref. Guide, etc.),Sample App./Tutorial [ 10003, 10001 ]
              Repository Revision Date User Message
              ICEsoft Public SVN Repository #45792 Thu Jul 23 19:22:30 MDT 2015 art.zambrano ICE-10696 added "headerAlign" attribute to ace:panel
              Files Changed
              Commit graph MODIFY /icefaces4/trunk/icefaces/ace/component/src/org/icefaces/ace/component/panel/PanelRenderer.java
              Commit graph MODIFY /icefaces4/trunk/icefaces/ace/component/resources/icefaces.ace/panel/panel.css
              Commit graph MODIFY /icefaces4/trunk/icefaces/ace/component/src/org/icefaces/ace/component/panel/PanelMeta.java
              Hide
              Permalink
              Arturo Zambrano added a comment - - edited

              r45792: added "headerAlign" attribute to ace:panel.

              Show
              Arturo Zambrano added a comment - - edited r45792: added "headerAlign" attribute to ace:panel.
              Arturo Zambrano made changes -
              Status Open [ 1 ] Resolved [ 5 ]
              Resolution Fixed [ 1 ]
              Hide
              Permalink
              Carlo Guglielmin added a comment -

              I'm seeing a new width issue since r45792.

              "header-old.png" is the live version of Emporium, which was built July 21st (before the headerAlign patch).
              "header-new.png" is from the current trunk from July 27th.

              As you can see the new header doesn't wrap properly. This is without specifying headerAlign at all. From the CSS it looks like a hardcoded inline style attribute was added to the <span> around the header text, and it has a "width: 99%" that seems to mess up the alignment, specifically:
              <span style="display: table-cell; text-align: left; width: 99%;" class="ui-panel-title">Application Settings</span>
              This was with Firefox 39 on Linux.

              Can we get the header wrapping fixed? Also can we try to avoid using inline styling in our components since it's very hard to override from a developer point of view.

              Show
              Carlo Guglielmin added a comment - I'm seeing a new width issue since r45792. "header-old.png" is the live version of Emporium, which was built July 21st (before the headerAlign patch). "header-new.png" is from the current trunk from July 27th. As you can see the new header doesn't wrap properly. This is without specifying headerAlign at all. From the CSS it looks like a hardcoded inline style attribute was added to the <span> around the header text, and it has a "width: 99%" that seems to mess up the alignment, specifically: <span style="display: table-cell; text-align: left; width: 99%;" class="ui-panel-title">Application Settings</span> This was with Firefox 39 on Linux. Can we get the header wrapping fixed? Also can we try to avoid using inline styling in our components since it's very hard to override from a developer point of view.
              Carlo Guglielmin made changes -
              Attachment header-new.png [ 20680 ]
              Attachment header-old.png [ 20681 ]
              Repository Revision Date User Message
              ICEsoft Public SVN Repository #45794 Mon Jul 27 13:07:49 MDT 2015 art.zambrano ICE-10696 fix for the text alignment issues when the panel has no buttons and the alignment issue when using the header facet; also moved styling required for this feature to CSS classes
              Files Changed
              Commit graph MODIFY /icefaces4/trunk/icefaces/ace/component/src/org/icefaces/ace/component/panel/PanelRenderer.java
              Commit graph MODIFY /icefaces4/trunk/icefaces/ace/component/resources/icefaces.ace/panel/panel.css
              Hide
              Permalink
              Arturo Zambrano added a comment -

              r45794: fix for the text alignment issues when the panel has no buttons and the alignment issue when using the header facet; also moved styling required for this feature to CSS classes.

              The issues occurred when the panel had no buttons. This has been fixed now. All the new styling is required for this feature to work, including the 99% width, which is part of a technique to make the left span use all the remaining space. This is not supposed to be overridden, but it was moved to CSS classes anyway.

              Show
              Arturo Zambrano added a comment - r45794: fix for the text alignment issues when the panel has no buttons and the alignment issue when using the header facet; also moved styling required for this feature to CSS classes. The issues occurred when the panel had no buttons. This has been fixed now. All the new styling is required for this feature to work, including the 99% width, which is part of a technique to make the left span use all the remaining space. This is not supposed to be overridden, but it was moved to CSS classes anyway.
              Ken Fyten made changes -
              Status Resolved [ 5 ] Closed [ 6 ]

                People

                • Assignee:
                  Arturo Zambrano
                  Reporter:
                  Carlo Guglielmin
                • Votes:
                  0 Vote for this issue
                  Watchers:
                  3 Start watching this issue

                  Dates

                  • Created:
                    Updated:
                    Resolved: