incubator-adffaces-user mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From "Matt Cooper" <matt.fa...@gmail.com>
Subject Re: FW: Use of custom style sheets, af|navigationPane::tabs
Date Wed, 11 Oct 2006 17:35:06 GMT
Hi,

One way to figure out why it isn't working is to use the DOM Inspector that
comes as part of a custom install of Firefox (Tools - DOM Inspector).  Using
the DOM Inspector, you can click on the particular DOM element that has the
background image you want to have removed.  The DOM inspector has a dropdown
button in the detail area that has a menu item of "CSS Style Rules", this
will show you the list of styles that are being applied to that node in the
order that they are defined in the CSS file.  Perhaps there is another style
definition that is defined lower than your definition... this would help to
identify which style selector is doing it.

Regards,
Matt

On 10/11/06, Causevic, Dzenan <dcausevic@navisite.com> wrote:
>
>
> Now, I can get everything to work correctly except for the background
> images used in the tabs.
> Even though I set "background-image: none" the default system provided
> image is still being displayed.
> I cleared cache, I even rebooted machine (getting desperate) but I still
> can't get my custom images to be displayed.
>
> This is how my blueSkin.css looks like:
>
> /* navigationPane */
> /* -------------- */
> af|navigationPane::tabs
> {
>   height: 150px;
>   overflow: hidden;
> }
>
> af|navigationPane::tabs-active, af|navigationPane::tabs-inactive
> {
>   background-color: ghostwhite;
> }
>
> af|navigationPane::tabs-start, af|navigationPane::tabs-mid,
> af|navigationPane::tabs-end, af|navigationPane::tabs-start-join,
> af|navigationPane::tabs-start-join-from-active,
> af|navigationPane::tabs-start-join-from-inactive,
> af|navigationPane::tabs-end-join-to-inactive
> {
>   height: 70px;
> }
>
> af|navigationPane::tabs-start
> {
>   width: 55px;
>   /*background-image: url(/images/btnStart.gif);*/
>   background-image: none;
>   background-repeat: none;
>   border: solid 1px orange;
> }
>
> af|navigationPane::tabs-mid
> {
>   border: solid 1px darkorchid;
>   vertical-align: middle;
>   padding-left: 10px;
>   padding-right: 10px;
> }
>
> af|navigationPane::tabs-mid a
> {
>   color: red;
>   font-size: 12pt;
>   font-family: serif;
>   font-weight: bold;
>   text-decoration: none;
>   border: solid 1px orange;
> }
>
> af|navigationPane::tabs-end
> {
>   width: 13px;
>   background-image: url(/images/btnEnd.gif);
>   border: solid 1px gold;
> }
>
> af|navigationPane::tabs-start-join,
> af|navigationPane::tabs-start-join-from-active,
> af|navigationPane::tabs-start-join-from-inactive
> {
>   border: solid 1px hotpink;
> }
>
> af|navigationPane::tabs-end-join-to-inactive
> {
>   border: solid 1px gold;
> }
>
> af|navigationPane::tabs-bottom-start, af|navigationPane::tabs-bottom-mid,
> af|navigationPane::tabs-bottom-end, af|navigationPane::tabs-bottom-end-join
> {
>   height: 25px;
>   background-image: url(/images/btnBottom-bg.gif);
>   background-repeat: repeat-x;
>   border: solid 1px lime;
> }
>
> af|navigationPane::tabs-bottom-start-content,
> af|navigationPane::tabs-bottom-mid-content,
> af|navigationPane::tabs-bottom-end-content
> {
>   background-image: none;
>   background-repeat: no-repeat;
> }
>
> and this is the actuall JSF code for the tabs section (file is being
> included from the header.jsp):
>
> <f:subview id="navTags">
>     <tr:navigationPane hint="tabs">
>             <tr:commandNavigationItem text="Home" action="guide"/>
>             <tr:commandNavigationItem text="Code of Conduct" action="
> guide.page"/>
>             <tr:commandNavigationItem text="Personal Info" action="
> guide.breadCrumbs" selected="true" />
>             <tr:commandNavigationItem text="More Info" action="
> guide.commandNavigationItem"/>
>             <tr:commandNavigationItem text="Confidentia" action="
> guide.panelPage"/>
>     </tr:navigationPane>
> </f:subview>
>
>
> -----Original Message-----
> From: Causevic, Dzenan [mailto:dcausevic@navisite.com]
> Sent: Mon 10/9/2006 4:37 PM
> To: adffaces-user@incubator.apache.org
> Subject: FW: Use of custom style sheets, af|navigationPane::tabs
>
> Is there any documentation on how to define af|navigationPane::tabs
> elements as CSS classes? There is a whole family that refers to
> af|navigationPane::tabs however I can not find any documentation for it.
> Please help
>
> Dzenan Causevic
> Software Web Developer
> NaviSite, Inc.
> Syracuse, NY
> (315) 453-2912 x5346
>
> -----Original Message-----
> From: Causevic, Dzenan
> Sent: Tuesday, October 03, 2006 10:00 AM
> To: 'adffaces-user@incubator.apache.org'
> Subject: RE: Use of custom style sheets
>
> I think that's exactly the case. I discovered that all the class
> definitions for my tabs are coming from navigationPane object and not by
> the Tab object itself. The reason why I never used navigationPane
> definitions in the first place is because it did not even exist in the
> current documentation which I was following. I started adding
> navigationPane class definitions to my style sheet and I am looking into
> it now. I will provide you with a feedback on how it all went in a
> couple of weeks (I have been reassigned on a different project in the
> meantime for some urgent matters so I practically stoped working on
> Trinidad project)
>
> As soon as I resume my work I will provide you with the feedback on
> this. Thanks.
>
> Dzenan Causevic
> Software Web Developer
> NaviSite, Inc.
> Syracuse, NY
> (315) 453-2912 x5346
> -----Original Message-----
> From: Jeanne Waldman [mailto:jeanne.waldman@oracle.com]
> Sent: Monday, October 02, 2006 7:37 PM
> To: adffaces-user@incubator.apache.org
> Subject: Re: Use of custom style sheets
>
> It looks like the skinning css file (
>
> /seekerreg/adf/styles/cache/blue-
> desktop-unknown-version-en-gecko.css)
>
> is getting generated, which is good.
> Maybe you didn't define the styles for the tabs correctly? Or there
> could very well be a bug. I think there have been
> changes in the tabbed renderer, and maybe the tabbed skinning keys
> documentation has not been updated, which is bad.
>
> Can you send some of your tab skinning keys and definitions?
>
> Can you try to skin the inputText component to see if that works?
> Try putting this in your skin file
> af|inputText::content {background-color:purple}
> Then run a demo with inputText in it (and the skin-family set to blue,
> of course)
>
> - Jeanne
>
>
> Causevic, Dzenan wrote:
>
> >I did clear the cache also. I know that happens sometimes. I need to
> >read the documentation I guess a little bit deeper. I don't know which
> >part I am still missing
> >
> >Dzenan Causevic
> >Software Web Developer
> >NaviSite, Inc.
> >Syracuse, NY
> >(315) 453-2912 x5346
> >
> >-----Original Message-----
> >From: Simon Lessard [mailto:simon.lessard.3@gmail.com]
> >Sent: Monday, September 25, 2006 4:10 PM
> >To: adffaces-user@incubator.apache.org
> >Subject: Re: Use of custom style sheets
> >
> >Then it should be the one used. So, simple question, did you clear your
> >cache? You must clear it almost everytime while working on your skin.
> >
> >
> >Regards,
> >
> >~ Simon
> >
> >On 9/25/06, Causevic, Dzenan <dcausevic@navisite.com> wrote:
> >
> >
> >>Yes I did. It's there.
> >>
> >>Dzenan Causevic
> >>Software Web Developer
> >>NaviSite, Inc.
> >>Syracuse, NY
> >>(315) 453-2912 x5346
> >>
> >>-----Original Message-----
> >>From: Simon Lessard [mailto:simon.lessard.3@gmail.com]
> >>Sent: Monday, September 25, 2006 2:54 PM
> >>To: adffaces-user@incubator.apache.org
> >>Subject: Re: Use of custom style sheets
> >>
> >>Hello Dzenan,
> >>
> >>No, you should be able to palce the CSS anywhere, /adf/styles/cache
> >>
> >>
> >will
> >
> >
> >>get
> >>generated automatically. Did you try to enter the CSS url in your
> >>browser to
> >>see if the stylesheet can be found?
> >>
> >>
> >>Regards,
> >>
> >>~ Simon
> >>
> >>On 9/25/06, Causevic, Dzenan <dcausevic@navisite.com> wrote:
> >>
> >>
> >>>I did make those changes but still no success. I am still getting
> >>>
> >>>
> >>default
> >>
> >>
> >>>look.
> >>>This is the excerpt from the source file:
> >>>
> >>><link rel="stylesheet" charset="UTF-8" type="text/css"
> >>>href="/seekerreg/adf/styles/cache/blue-
> >>>desktop-unknown-version-en-gecko.css"><script>var
> >>>
> >>>
> >>_AdfWindowOpenError='A
> >>
> >>
> >>>popup window blocker has been detected in your browser. Popup
> >>>
> >>>
> >blockers
> >
> >
> >>>interfere with the operation of this application. Please disable
> >>>
> >>>
> >your
> >
> >
> >>popup
> >>
> >>
> >>>blocker or allow popups from this site.';</script><script
> >>>src="/seekerreg/adf/jsLibs/Common11-m7.js
> >>>"></script><script>_defaultTZ()</script>
> >>>            <link href="/seekerreg/stylesheet/stylesheet.css"
> >>>rel="stylesheet">
> >>>        </head>
> >>>
> >>>Can blueSkin.css be placed in web/stylesheet directory where the
> >>>
> >>>
> >>custom
> >>
> >>
> >>>sheet resides, or does it have to go to some type of
> >>>
> >>>
> >>web/adf/styles/cache
> >>
> >>
> >>>like what we get above?
> >>>
> >>>-----Original Message-----
> >>>From: Simon Lessard [mailto:simon.lessard.3@gmail.com]
> >>>Sent: Mon 9/25/2006 1:56 PM
> >>>To: adffaces-user@incubator.apache.org
> >>>Subject: Re: Use of custom style sheets
> >>>
> >>>Ugh...
> >>>
> >>>I'll have to test that, the first form should work just as well.
> >>>
> >>>On 9/25/06, HulaBula <Hulabula@gmx.de> wrote:
> >>>
> >>>
> >>>>Does it work now? I ran into a similar problem and now figured out
> >>>>
> >>>>
> >>that
> >>
> >>
> >>>>the config-parser treats
> >>>><family>
> >>>>    blue
> >>>></family>
> >>>>
> >>>>different to
> >>>>
> >>>><family>blue</family> (<-- which will work)
> >>>>
> >>>>You can see that behaviour if you step-debug through
> >>>>CoreRenderingContext.java. (linebreaks are not trimmed)
> >>>>
> >>>>greets!
> >>>>
> >>>>clemens
> >>>>
> >>>>Simon Lessard wrote:
> >>>>
> >>>>
> >>>>>You must specify the skin-family in trinidad.config.xml to
> >>>>>
> >>>>>
> >value:
> >
> >
> >>>blue.
> >>>
> >>>
> >>>>>On 9/25/06, Causevic, Dzenan <dcausevic@navisite.com> wrote:
> >>>>>
> >>>>>
> >>>>>>I am a beginner to Trinidad components and I have a simple
> >>>>>>
> >>>>>>
> >>question
> >>
> >>
> >>>>>>regarding the use of style sheets.
> >>>>>>I am getting default look for tab components, however my page
> >>>>>>
> >>>>>>
> >is
> >
> >
> >>>>>>using my
> >>>>>>own style sheet and now I need to get these tabs to use the
> >>>>>>
> >>>>>>
> >same
> >
> >
> >>>>>>colors as
> >>>>>>the rest of the page.
> >>>>>>
> >>>>>>The documenation is not so clear, that's why I am posting here
> >>>>>>
> >>>>>>
> >>for
> >>
> >>
> >>>>help.
> >>>>
> >>>>
> >>>>>>I created WEB-INF/trinidad-config.xml file and added following
> >>>>>>directive:
> >>>>>><skin-family>blueSkin</skin-family>
> >>>>>>Then I created WEB-INF/trinidad-skins.xml like this:
> >>>>>><skins xmlns="http://myfaces.apache.org/trinidad/skin">
> >>>>>>    <skin>
> >>>>>>        <id>
> >>>>>>            blue.desktop
> >>>>>>        </id>
> >>>>>>        <family>
> >>>>>>            blue
> >>>>>>        </family>
> >>>>>>        <render-kit-id>
> >>>>>>            org.apache.myfaces.trinidad.desktop
> >>>>>>        </render-kit-id>
> >>>>>>        <style-sheet-name>
> >>>>>>            stylesheet/blueSkin.css
> >>>>>>        </style-sheet-name>
> >>>>>>    </skin>
> >>>>>></skins>
> >>>>>>
> >>>>>>Finally I placed blueSkin.css (the one from the demo page) in
> >>>>>>
> >>>>>>
> >my
> >
> >
> >>>>>>web/stylesheet directory.
> >>>>>>
> >>>>>>However I still get a default look for my tabs. What am I still
> >>>>>>
> >>>>>>
> >>>missing
> >>>
> >>>
> >>>>>>here?
> >>>>>>
> >>>>>>
> >>>>>>
> >>>>>>
> >>>>
> >>>>
> >>>
> >>>
> >>>
> >
> >
> >
>
>
>
>
>
>
>
>
>
>
>
>
>
>

Mime
  • Unnamed multipart/alternative (inline, None, 0 bytes)
View raw message