1 2 Previous Next 27 Replies Latest reply on Nov 22, 2007 4:18 AM by adamw

    Plain skin

    adamw

      Hello,

      why does the plain skin define borders, for example in the simple toggle panel? I thought that plain should be plain :) I'm having problems with it as sometimes the links to rich faces css files are placed after mine, so overriding the borders becomes more difficult.

      --
      Adam

        • 1. Re: Plain skin

          Plain should be as plain as possible, but should not be nothing.
          You can take any skin and do whatever you want with look-n-feel. Just use css

          • 2. Re: Plain skin
            adamw

            You mean override the styles with my own? But that's what I'm trying to do and not succeed, as sometimes the richfaces's < link ... / > elements are injected into the page after mine, so they take precedence.

            --
            Adam

            • 3. Re: Plain skin
              adamw

              Hello,

              more specifically, the richfaces css links are injected after mine stylesheets, if the page is rendered from a request dispatcher's forward request (beause of a mapping by urlrewritefilter).

              Or did you mean that I should create a custom skin, which has absolotely no styles in it?

              Adam

              • 4. Re: Plain skin

                Adam, you need to clean up all your presuppositions about richfaces' skins, because there are so far from the reality.
                Start from reading the doc.

                • 5. Re: Plain skin
                  adamw

                  Hello,

                  I read the doc, and what I have understood from it, you can define custom skins by specifying properties files, which define colors used in the skins. However, I've got no idea how to get rid of a border around the header of a simple toggle panel - I cannot override it using my styles as the < link > to richfaces css is sometimes injected after the < link > to mine, so it has precedence.

                  --
                  Adam

                  • 6. Re: Plain skin

                    #1. read sections 5.7.2 and 5.7.3 of the Dev Guide.
                    #2. if you still believe it is about properties file, goto #1

                    • 7. Re: Plain skin
                      adamw

                      Hello,

                      I've read it several times, and it's very possible that I'm stupid, but I simply don't know what you mean :).

                      What I want to do is quite simple: I want no border displayed around a simple toggle panel's header.

                      I use the plain skin. The generated css for that skin says:

                      .dr-stglpnl-h{
                       border-width: 1px;
                       border-style: solid;
                       (...)
                      }
                      


                      In my theme .css I have:
                      .rich-stglpanel-header {
                       border: none;
                      }
                      

                      but that doesn't matter (as it also doesn't matter if I apply my own styles to the panel or not), as it is overriden by the skin's css (the order of style in the class attribute of an element doesn't matter, only the order of < link > elements in the head section - and that differs, depending on the page being forwarded with a request dispatcher or not).

                      Right now I see only two solutions:
                      * apply the style directly, not through a stylesheet
                      * declary, in my style, the border with ! important

                      Neither are elegant :)

                      --
                      Adam


                      • 8. Re: Plain skin

                        Ok. I see the progress. You are stepping forward to the right direction. However, one fatal mistake stopped your. "border:none;" is incorrect css rule.
                        It Ok for < table >, but there is no any table around.
                        Tip: look at the service class "dr-stglpnl-h" you posted just above.

                        • 9. Re: Plain skin
                          adamw

                          border: none is perfectly valid css rule :). If it wasn't then having "border: none ! important" woudn't remove the border from the panel header.

                          The same happens if, instead of border: none, I have border-style:none, or border-width: 0. It is still visible.

                          • 10. Re: Plain skin

                            Adam, tell me the truth. You do not want to find the one-line solution what is right in front of your eyes or what?

                            Post here the code snippet of "the best" solution you currently have.

                            • 11. Re: Plain skin
                              adamw

                              Ha! Yes, you have revealed my true purpose, to bug you with stupid questions, when I have answers for them for a long time! ;)

                              Seriously, I don't know what one-line solution you are referring to.

                              Apply the style directly to the element, not through a stylesheet?

                              --
                              Adam

                              • 12. Re: Plain skin
                                mail.micke

                                My guess,
                                use styleClass attribute which would put your style class after the richfaces ones in the generated style attribute.

                                • 13. Re: Plain skin

                                  Hey guys,

                                  by the way: your quiz show here is great! :-)

                                  I solved that months ago, but I don't break the secret...

                                  • 14. Re: Plain skin

                                    This works for me. Adam, I will not be surprised if it does not work on your side. I guess you have some magic powder in your sleeve.

                                    <style>
                                     .rich-stglpanel, .rich-stglpanel-header { border-width:0; }
                                    </style>
                                    
                                    <rich:simpleTogglePanel label="Just a simpleTogglePanel">
                                     ........
                                    </rich:simpleTogglePanel>
                                    


                                    The component level classes .rich-stglpanel and .rich-stglpanel-header make all simpleTogglePanel instances borderless.
                                    If you need to apply this style only on one instance and leave the others by default, the third-level classes will be helpful.
                                    <style>
                                     .my-panel, .my-panel-header {border-width:0;}
                                    </style>
                                    
                                    
                                    <rich:simpleTogglePanel label="Just a simpleTogglePanel"
                                     styleClass="my-panel" headerClass="my-panel-header" >
                                     ........
                                    </rich:simpleTogglePanel>
                                    


                                    1 2 Previous Next