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

    Plain skin

    Adam Warski Master

      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
          Sergey Smirnov Master

          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
            Adam Warski Master

            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
              Adam Warski Master

              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
                Sergey Smirnov Master

                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
                  Adam Warski Master

                  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
                    Sergey Smirnov Master

                    #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
                      Adam Warski Master

                      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
                        Sergey Smirnov Master

                        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
                          Adam Warski Master

                          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
                            Sergey Smirnov Master

                            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
                              Adam Warski Master

                              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
                                Mikael Andersson Master

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

                                • 13. Re: Plain skin
                                  Florian Marwede Expert

                                  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
                                    Sergey Smirnov Master

                                    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