This discussion is archived
3 Replies Latest reply: Nov 18, 2012 2:04 AM by Mindmap RSS

Separate CSS files for Differenct Applications in the Same Workspace

Doug Newbie
Currently Being Moderated
I am working in APEX 4.0, using Theme 4 (Topaz), primarily with the region template "Top Bar." The application I am working on has gotten so large that I decided to break it into two applications. So I copied the original application and then deleted the pages that I did not want in the second application. I then modified the authentication for a single login. One of the nice things about the Top Bar template is that you can color the background. I had a blue background in the first application and wanted to use a differenct color in the other. So I created a second CSS file and uploaded it to the Cascading Style Sheets area of the Shared Components file for the second application. Turns out that both it and the style sheet for the first application now show up in the CSS file area. The CSS file for the second application has no effect. Here is the CSS code:
.rc-content-main
     {
      background-color: #E5E5AA;
     }
I also tried giving the region on each page in the second application a static id and then identifying them in the CSS file by the id. That didn't work either, at least not yet. Sometimes it takes the server a while to refresh.

Question: For two applications in the same workspace, can there be separate CSS files? If so, how do I set them up so that each responds only to one of the applications?

Edited by: Doug on Nov 14, 2012 4:54 AM

Edited by: Doug on Nov 14, 2012 7:16 AM
  • 1. Re: Separate CSS files for Differenct Applications in the Same Workspace
    AlistairLaing Explorer
    Currently Being Moderated
    Hi Doug,

    Yes you can have different css files for each application in the same workspace. If you need to you can even base it on page template.

    All you do is create the two different css files and save it either in the database or even better on the servers file system. For the first application go through all your page templates and include a <link> that points to one of your css files. For the second application report but refer it to the second css file.

    Hopefully thats of some use.

    Kind Regards,
    Alistair
  • 2. Re: Separate CSS files for Differenct Applications in the Same Workspace
    Doug Newbie
    Currently Being Moderated
    Thank you , Alistair. This sounds like a solution, but I need a bit more help. How exactly do I go about including a <link> that points to one of my css files? Where do I put it? What is the syntax?
  • 3. Re: Separate CSS files for Differenct Applications in the Same Workspace
    Mindmap Pro
    Currently Being Moderated
    Hello,

    If you upload your file to Shared Components >> Cascading Style Sheetst then:

    edit your page template in the header section and just before +*</head>*+ tag  add :
    <link rel="stylesheet" src="#WORKSPACE_IMAGES#MY_FILE.css" type="text/css" />
    And that will be applied for all pages that have the same Page Template.

    You can edit a page and put this in the header section to be applied only for a that page:
    <style>
    <link rel="stylesheet" src="#WORKSPACE_IMAGES#MY_FILE.css" type="text/css" />
    <style>
    If the file is on your web server then replace #WORKSPACE_IMAGES# with #IMAGE_PREFIX#

    This should be helpful to you:
    http://docs.oracle.com/cd/E23903_01/doc/doc.41/e21674/concept_sub.htm

    Best Regards,
    Fateh
    -------
    If you believe that my answer is correct or helpful to you, then please mark it as helpful or correct...

Legend

  • Correct Answers - 10 points
  • Helpful Answers - 5 points