I am trying to present 8 upload buttons in one page. Each upload button needs to be changed into a different image. Which means each button will have a look of a different image. I was able to override the main primefaces css classes bellow
Code: Select all
.ui-fileupload-buttonbar .ui-icon {
margin: 0px 0px 0px 0px !important;
padding: 0px 0px 0px 0px !important;
border: none;
visibility: hidden !important;
}
.ui-button-text-icon-left .ui-button-text {
font-size: 0.5em;
background:url(../resources/california-layout/images/avatar.png) no-repeat;
background-size: 100%;
width: 100px;
height: 120px;
}
/* Icon */
.ui-button-text-icon-left .ui-icon {
display: none;
}
Please let me know in details and steps how can I change <p:fileUpload> button styleClass to make each button has a different style depending on its own styleClass.
Looking forward for your soon reply.
Thanks,
Omar Mostafa