5 Replies Latest reply on Apr 4, 2012 10:56 AM by Felipe Gutierrez

    rich data table with css

    Felipe Gutierrez Newbie

      Hi

      I put this style on my xhtml to configure the rich table css but it doesn't work. Is anybody know why? If there is more configurations to make.

       

      <style type="text/css">

      .rich-table-thead {
      background-color: #2F4388;
      font-size: 20px;
      background-image: none;
      }
      </style>

      ...

      <rich:dataTable
      value="#{consultaInconsistenciasImportacaoBean.arquivosInconsistentes}"
      rendered="#{consultaInconsistenciasImportacaoBean.listSize > 0}"
      var="arquivo" width="100%" cellspacing="1"
      cellpadding="0" rows="20">
      <rich:column>
        <f:facet name="header">
         <h:outputText value="Nome do arquivo" />
        </f:facet>
        <h:outputText value="#{arquivo.nomeArquivo}" />
      </rich:column>

        • 2. Re: rich data table with css
          Felipe Gutierrez Newbie

          Didn't work when i put "rf-dt-hdr"

          I do not know what is happening, because i can see the tag "rich-table-thead" by firebug on Firefox. It should apply.

          • 3. Re: rich data table with css
            chris h. Newbie

            I am using Richfaces 4.2 Final.

            This works for me:

             

                 <h:outputStylesheet>

                      .rf-dt-shdr-c {

                           background-color: #2F4388;

                           font-size: 20px;

                           background-image: none;

                      }

                 </h:outputStylesheet>

            • 4. Re: rich data table with css
              Felipe Gutierrez Newbie

              Hello Chris, I tried your answer but didn't work

              I also tried this on my web.xml

               

               

               

               

               

               

               

               

              <

              context-param>

               

              <param-name>org.richfaces.CONTROL_SKINNING</param-name>

               

              <param-value>disable</param-value>

               

              </context-param>

               

               

              <context-param>

               

              <param-name>org.richfaces.CONTROL_SKINNING_CLASSES</param-name>

               

              <param-value>disable</param-value>

               

              </context-param>

               

              But still didn't work. I am using richfaces 3.3. Any other hints?

              Thanks...

              • 5. Re: rich data table with css
                Felipe Gutierrez Newbie

                I got it to work, finally

                 

                table.rich {
                background-color: #FFFFFF;
                font-weight:normal;
                background-repeat:repeat-x;
                background-position:left bottom;
                text-align: left;
                }

                table.rich th {
                background-color:#2F4388;
                font-weight:bold;
                background-repeat:repeat-x;
                background-position:left bottom;
                border-top:3px solid #FFFFFF;
                border-bottom:none;
                border-left:none;
                border-right:none;
                color:#FFFFFF;
                text-align:left;
                font-weight:bold;
                padding:0 8px 0 8px;
                }

                table.rich tbody tr:hover{
                background-color:#F9E9DF;
                color:red;
                }

                <rich:dataTable
                rendered="#{consultaInconsistenciasImportacaoBean.inconsistenciasArquivoEvolucaoShow}"
                value="#{consultaInconsistenciasImportacaoBean.inconsistenciasArquivoEvolucao}"
                var="item" id="tabelaArquivosEvolucaoInconsistentes"
                cellspacing="1" cellpadding="0" styleClass="rich">

                and at web.xml ->

                <context-param>
                <param-name>org.richfaces.CONTROL_SKINNING</param-name>
                <param-value>disable</param-value>
                </context-param>

                <context-param>
                <param-name>org.richfaces.CONTROL_SKINNING_CLASSES</param-name>
                <param-value>disable</param-value>
                </context-param>

                 

                and Ctrl+F5 at the page. lolololol

                Thanks Chris!