Overwrite CSS compontente Richfaces

Asked

Viewed 428 times

1

I’m using a component Calendar but only the date (omitting the time), and overriding the CSS to reduce the screen size. Below:

<rich:calendar value="#{_sessao.dtSessao}" showFooter="false" enableManualInput="true" locale="pt_BR" datePattern="dd/MM/yyyy" style="width:80px;"/>

However, it is not applying.

As far as I know, in JSF, Primefaces and the like, you’re right.

css jsf rich-faces

  • which version of the richfaces ?

2 answers

2


I located the solution, which was relatively simple, but as I do not use the Richfaces I had to see the components it contains.

Instead of using:

<rich:calendar ... style="width:80px;"/>

I checked that there is a tag inputStyle that solved directly in the component, exactly as the style does in the JSF, then stay:

<rich:calendar ... inputStyle="width:80px;"/>

I checked and there are other similar cases on Richfaces, so it’s interesting to check each component because the solution might be similar.

0

Friend the ideal was to make this script modification in a css. Because this component generates several HTML codes for this purpose.

take a look at documentation and check the part you want to change the style.

Also check the styles applied if you have no other style being overwritten.

Remember css with ! Mportant has precedents up about style attribute styles.

Example:

Having the calendar

<rich:calendar value="#{calendarBean.selectedDate}" id="calendar" locale="#{calendarBean.locale}"
  popup="#{calendarBean.popup}" datePattern="#{calendarBean.pattern}"
  showApplyButton="#{calendarBean.showApply}" cellWidth="24px" cellHeight="22px"
  style="width:200px" disabled="#{calendarBean.disabled}">
</rich:calendar>

And a font change css:

    .rich-calendar-tool-btn {
      font-family: Arial, Verdana;
    }

  • thanks for the help, but I saw the solution I posted below, which turns out to be simpler.

  • Yes. It’s just not a good practice to mix css with code.

  • I agree with you depending on the situation, because as it is a simple adjustment, it seems to me more interesting to act like this than to create a CSS apart, but in cases that require more customization or application in several places, really is more suitable to make the code cleaner. In my case I preferred directly in the component because it is used in other points of the screen, which did not need this change.

Browser other questions tagged css jsf rich-faces

You are not signed in. Login or sign up in order to post.