Height difference for commandButton with icon and no icon

Locked
pfroy
Posts: 32
Joined: 09 Sep 2015, 18:20

09 Dec 2015, 23:12

Hi,

In a form using commandButton inside and Vol template, I see that buttons with an icon have their height rendered smaller than buttons without an icon.

See image:
Image

See code:

Code: Select all

<p:commandButton value="#{bundle.Close}"/>
<p:commandButton value="#{bundle.Print}" icon="ui-icon-print fa fa-print"/>
Primefaces 7.0
JSF 2.3
Java EE 8
Payara 5.184

User avatar
aragorn
Posts: 3641
Joined: 29 Jun 2013, 12:38

11 Dec 2015, 12:11

Thanks a lot for your issue. Fixed for next volt release. (Issue; https://github.com/primefaces/layouts/issues/55)

For now, you can change this lines with the my changes in theme.less

Code: Select all

//Line 1279
.ui-button-text-icon-left .ui-button-text {
    padding: 10px 20px 10px 40px !important;
}

//Line 1273
.ui-button.ui-button-icon-only .ui-button-text{
    padding: 10px 0px !important; 
    border-radius:3px !important;
    -webkit-border-radius:3px !important; 
    -moz-border-radius:3px !important;
}

pfroy
Posts: 32
Joined: 09 Sep 2015, 18:20

14 Dec 2015, 01:58

Hi aragorn,

I updated my volt theme.less file. The correction is working perfectly. I'm gonna post other minor requests like this one to help refine the VOLT template.

Best regards.
Pierre
Primefaces 7.0
JSF 2.3
Java EE 8
Payara 5.184

User avatar
aragorn
Posts: 3641
Joined: 29 Jun 2013, 12:38

14 Dec 2015, 09:21

Glad to hear! Thank you, Pfroy.

Locked

Return to “Volt”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 1 guest