JSF Primefaces ConfirmDialog

Question

I am working on improving / polishing my ConfirmDialog primitives, but I cannot put some beautiful image on it or improve some of its looks. Also, I cannot find the documentation on how to use its attributes, I downloaded the user guide in the form of strokes, but it seems that some things are missing. Here is my code.

<p:confirmDialog header="Confirm" severity="alert" closeOnEscape="true" widgetVar="confirmationDialog" showEffect="fold" >
    <f:facet name="message">
          <h:outputText value="Are you sure all details 
                           are correct and proceed in creating the Account?" />        
    </f:facet>
    <p:commandButton value="Yes" actionListener="#{marketingPersonController.create}" 
                     oncomplete="confirmationDialog.hide()" icon="ui-icon-check"
                     update="propertyPanel accountPanel marketingPersonPanel">
         <f:ajax rendered="propertyPanel accountPanel marketingPersonPanel"/>
    </p:commandButton>

    <p:commandButton value="No" onclick="confirmationDialog.hide()" type="button" 
                     icon="ui-icon-close"/>
</p:confirmDialog>

Here is a screenshot

I can’t remove the little one! the icon is there, if I do not give seriousness to anyone, it still detects a strange image "^". I want to completely change the icon and somehow change its appearance.

Also, I tried using this css. However, its not working.

  .ui-dialog-content p span { 
            background-image: url('path to image here')
               no-repeat !important;
  }

Am I doing something wrong? And if you have complete documentation on the interfaces, this will also help. Thanks

Answer 1

2 :

, CSS :

CSS

.ui-icon.ui-confirm-dialog-severity {
    background-position: 0 0 !important; 
    background-image: url('PATH TO IMAGE HERE') !important;
}

: , :

XHTML

 <p:confirm header="HEADER" message="MESSAGE" icon="ui-icon-alert" />

: http://www.primefaces.org/showcase/ui/confirmDialog.jsf

CSS

.ui-icon.ui-confirm-dialog-severity.ui-icon-alert {
    background-position: 0 0 !important; 
    background-image: url('PATH TO IMAGE HERE') !important;
}