ICEfaces
  1. ICEfaces
  2. ICE-9078

ace:multiColumnSubmenu - Add headerClass and footerClass attributes to specify custom CSS classes

          Details

          • Type: Improvement Improvement
          • Status: Closed
          • Priority: Major Major
          • Resolution: Fixed
          • Affects Version/s: EE-3.2.0.GA
          • Fix Version/s: 3.3
          • Component/s: ACE-Components
          • Labels:
            None
          • Environment:
            All
          • Assignee Priority:
            P1
          • Salesforce Case Reference:
          • Affects:
            Documentation (User Guide, Ref. Guide, etc.), Sample App./Tutorial

            Description

            Feature Request: Add a header and footer sections to the multiColumnSubmenu. This will allow the capability to define other images/css to the component.

            Scenario - Customer would like to show an arrow that points to the child menu.

              Issue Links

              blocks

              Improvement - An improvement or enhancement to an existing feature or task. ICE-9149 ace:multiColumnSubmenu, add header and footer facets

              • Major - Major loss of function.
              • Closed

                Activity

                Ascending order - Click to sort in descending order
                Arran Mccullough created issue -
                Hide
                Permalink
                Arran Mccullough added a comment -

                Support Case 11667

                Show
                Arran Mccullough added a comment - Support Case 11667
                Tyler Johnson made changes -
                Field Original Value New Value
                Salesforce Case Reference 5007000000OBbiiAAD
                Ken Fyten made changes -
                Fix Version/s 3.3 [ 10370 ]
                Assignee Arturo Zambrano [ artzambrano ]
                Affects Documentation (User Guide, Ref. Guide, etc.),Sample App./Tutorial [ 10003, 10001 ]
                Assignee Priority P1 [ 10010 ]
                Repository Revision Date User Message
                ICEsoft Public SVN Repository #33999 Thu Mar 21 09:43:50 MDT 2013 art.zambrano ICE-9078 added header and footer sections to ace:multiColumnSubmenu
                Files Changed
                Commit graph MODIFY /icefaces3/trunk/icefaces/ace/component/resources/icefaces.ace/wijmo/wijmo.js
                Commit graph MODIFY /icefaces3/trunk/icefaces/ace/component/src/org/icefaces/ace/component/menu/BaseMenuRenderer.java
                Hide
                Permalink
                Arturo Zambrano added a comment - - edited

                Added header and footer sections to ace:multiColumnSubmenu. Committed improvement to trunk at revision 33999.

                The sections have the CSS class names 'ui-menu-multicolumn-header' and 'ui-menu-multicolumn-footer', respectively. They also have an internal div that can be styled. So the following CSS rules can be defined to style the header and footer:

                .ui-menu-multicolumn-header {
                }
                .ui-menu-multicolumn-header div {
                }
                .ui-menu-multicolumn-footer {
                }
                .ui-menu-multicolumn-footer div {
                }

                In the particular case of the customer, they might want to use something like the following:
                .ui-menu-multicolumn-header div

                { height:16px; width:16px; margin-left: 192px; background-image:url("/showcase/javax.faces.resource/themes/sam/images/ui-icons_222222_256x240.png.jsf?ln=icefaces.ace"); background-position:-64px -16px; }

                Due to the complex styling ancestry of the menu component, it doesn't seem to be possible to use styling rules to automatically center the inner div (e.g. 'margin: 0 auto'), so the centering will most likely have to be done by giving a precise value to 'margin-left' or something similar.

                In order to remove the padding at the top of the multi-column submenu (so that the down arrow icon can be touching the menu label), the following CSS rule can be defined:
                .wijmo-wijmenu .wijmo-wijmenu-parent .wijmo-wijmenu-child

                { padding-top:0; }
                Show
                Arturo Zambrano added a comment - - edited Added header and footer sections to ace:multiColumnSubmenu. Committed improvement to trunk at revision 33999. The sections have the CSS class names 'ui-menu-multicolumn-header' and 'ui-menu-multicolumn-footer', respectively. They also have an internal div that can be styled. So the following CSS rules can be defined to style the header and footer: .ui-menu-multicolumn-header { } .ui-menu-multicolumn-header div { } .ui-menu-multicolumn-footer { } .ui-menu-multicolumn-footer div { } In the particular case of the customer, they might want to use something like the following: .ui-menu-multicolumn-header div { height:16px; width:16px; margin-left: 192px; background-image:url("/showcase/javax.faces.resource/themes/sam/images/ui-icons_222222_256x240.png.jsf?ln=icefaces.ace"); background-position:-64px -16px; } Due to the complex styling ancestry of the menu component, it doesn't seem to be possible to use styling rules to automatically center the inner div (e.g. 'margin: 0 auto'), so the centering will most likely have to be done by giving a precise value to 'margin-left' or something similar. In order to remove the padding at the top of the multi-column submenu (so that the down arrow icon can be touching the menu label), the following CSS rule can be defined: .wijmo-wijmenu .wijmo-wijmenu-parent .wijmo-wijmenu-child { padding-top:0; }
                Arturo Zambrano made changes -
                Status Open [ 1 ] Resolved [ 5 ]
                Resolution Fixed [ 1 ]
                Repository Revision Date User Message
                ICEsoft Public SVN Repository #34305 Tue Apr 09 16:30:34 MDT 2013 art.zambrano ICE-9078 added headerClass and footerClass attributes to ace:multiColumnSubmenu
                Files Changed
                Commit graph MODIFY /icefaces3/trunk/icefaces/ace/component/src/org/icefaces/ace/component/menu/BaseMenuRenderer.java
                Hide
                Permalink
                Arturo Zambrano added a comment -

                Added headerClass and footerClass attributes at revision 34305.

                Show
                Arturo Zambrano added a comment - Added headerClass and footerClass attributes at revision 34305.
                Arturo Zambrano made changes -
                Link This issue blocks ICE-9149 [ ICE-9149 ]
                Ken Fyten made changes -
                Summary ace:multiColumnSubmenu - Add header and footer sections ace:multiColumnSubmenu - Add header and footer CSS classes sections
                Ken Fyten made changes -
                Summary ace:multiColumnSubmenu - Add header and footer CSS classes sections ace:multiColumnSubmenu - Add headerClass and footerClass attributes to specify custom CSS classes
                Ken Fyten made changes -
                Status Resolved [ 5 ] Closed [ 6 ]

                  People

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

                    Dates

                    • Created:
                      Updated:
                      Resolved: