I'm trying to change the colour of the orange tabs at the top of this HTML page using the GUI in App Studio 8.0.0.9

Anyone know how to do this please?

This message has been edited. Last edited by: <Kathryn Henning>,

Answered my own question.

Properties tab
Change the dropdown to DOCUMENT
Change the theme.

Not as customisable as I'd like but better than nothing.

quote:

better than nothing

is the new motto.

quote:

Originally posted by Francis Mariani:

quote:

better than nothing

is the new motto.

Seems to be!

Its possible to change all the CSS elements of the theme inside that Properties window. If I remember correctly.

So its possible to style Tab/Button individually aswell.

quote:

Originally posted by SSander:
Its possible to change all the CSS elements of the theme inside that Properties window. If I remember correctly.

So its possible to style Tab/Button individually aswell.

Ssander, can you explain this further please?

The GUI in App Studio seems VERY limited compared to the coding you can do. And yet, coding of the HTML report pages is limited as you can't open it back in the GUI afterwards.

quote:

So its possible to style Tab/Button individually aswell

No guessing please.

There appears to be no way to style the tabs. This probably has to be done via an external theme style-sheet, which I have not played around with yet. TimN, how did you make it orange? Also, have you found that AppStudio v8.0.09 works with server v8.0.08 (which I assume you have, because you mention Dev Studio v8.0.08)...

Hi TimN

There are CSS class files IBI_pageHeader and IBI_pageHeader_Selected that can be used to change the tab color:

1 - Click on Embedded JavaScript/CSS tab in AppStudio
2 - Go to Settings panel and select Internal CSS button

3- Use the following:


body{
}


.IBI_pageHeader
{
background-image:none;
background-colorrange;
color:cornsilk;



}
.IBI_pageHeader_Selected
{
background-image:none;
background-color: Cyan;
color:gold;
}


If you have an issue open up a case and ask for Barry.

Thanks Barry

Barry's suggestion works great to style tabs on a single HTML page.

I didn't want to tweak this for every page we created.

I opted to track down the actual style sheet on the web server.

(Our BIP was set up to use the Silver Theme)

e:\ibi\WebFOCUS80\ibi_html\javaassist\ibi\html\composer\themes\nonBindows\IBI-Themes\bip-silver.css

Just another option for you.

quote:

(Our BIP was set up to use the Silver Theme)

e:\ibi\WebFOCUS80\ibi_html\javaassist\ibi\html\composer\themes\nonBindows\IBI-Themes\bip-silver.css

Just another option for you.

We used the default option and then used our own custom CSS, but after updating to 8009 we had so many errors and issues with HTML pages that now we have to re-think how we attach CSS files to HTML-s.

quote:

after updating to 8009 we had so many errors and issues

- I'm sure you're very busy dealing with these issues, but it would be beneficial to all of us (including IBI) if you told us about some of the problems you faced.

Hi

Once you have the css code that you want, you can take the current sylesheet (IBI's) copy it to the content folder, modify it, and attach it to the HTML pages that you create. But adding the custom CSS on every page is not that hard, just cut and paste...

Thanks Barry

I will greatly share my experience, I haven't had time to report all issues to IBI.
But some items we ran into with stylesheets.

• Updating "default_theme.css" on server side caused AppStudio elements like tabs/accordions to break. Note here is that we took BIPBlack as base.
  
• Second issue with updating "default_theme.css" was that we had "Infowindow"/"Messages" on every html page. After some debugging we found that it came from IB_COMPOSERS.js and there was hardcoded following: if(isDefaultThemeLoaded()||isTemplateDocument()){controlHtml=
  so infowindow was hardcoded into all of our HTML pages. So solution was just to modify this js and add visibility: hidden.
  
• As in this topic aswell there are some people mentioning that you can add custom css to HTML page by GUI. I am not aware if it acts like this only our system, but I noticed this GUI does not "include" but copies this css into local folder. For example if I have CSS in WFC/Repository/Common/ and I include to HTML placed in WFC/Repository/ABC/ the CSS is copied into that folder. I will research this more, because we need to get this working and have only 1 common css.
  
• With 8009 we have to use Client side option "Strict_IE" (100% sure of parameter name, but its under "Other" tab) - without this as "True" some HTMLs just will not load inside portal (run them separately works fine, either from resource tree or from AppStudio).
  

I think right now its all I remember, there might be some other things that just come in mind right now.