zyspec zyspec
  • Module Developer
  • Module Developer
  • Joined: 2004/9/21 9:28
  • From USA
  • Group: Registered Users
  • Posts: 980
  • Posted on: 2011/3/11 16:26
Module Development CSS help #1
I'm trying to find a more elegant way of selecting different CSS stylesheets for one of my modules based on the theme. I don't want to code the module for a specific theme.

What I'd like to do is create a base CSS file in the module directory and then create different CSS files containing the theme colors desired (light, dark, etc).

What I'd really like is to have something like a xoCSSUrl parameter (similar to the xoImgUrl) where I could overload the CSS from a theme's directory (<mytheme>/modules/templates/images). I don't think anything like this exists, does it?

A method similar to this would allow a theme changer to be able to select a new theme and the module's color parameters, etc. would also change automatically. The way it works now there's no easy way to do this without just dumping the module's CSS files into the theme CSS files.

Any other ideas of how to accomplish this 'automatically'?
redheadedrod redheadedrod
  • Home away from home
  • Home away from home
  • Joined: 2008/2/26 11:05
  • From Grand Rapids, MI
  • Group: Registered Users
  • Posts: 1296
  • Posted on: 2011/3/11 21:21
Re: Module Development CSS help #2
In your theme you should have these three lines...

<link rel="stylesheet" type="text/css" media="screen" href="<{$xoops_url}>/xoops.css" />
<
link rel="stylesheet" type="text/css" media="screen" href="<{$xoops_themecss}>" />
<{
$xoops_module_header}>


The first line is the default xoops css, the second line is the theme css and the third is loading the file header.php from the module root directory.

Personally I think the theme CSS should be the last one listed...

You could do some things in the header.php file and perhaps do what you want but I believe the browser will process any CSS files in the order received and if you include a CSS sheet in your header.php file it would overload any other properties from the other two CSS sheets. You might be able to play with the order of these or check for properties with the header.php file and go from there.

Rodney
zyspec zyspec
  • Module Developer
  • Module Developer
  • Joined: 2004/9/21 9:28
  • From USA
  • Group: Registered Users
  • Posts: 980
  • Posted on: 2011/3/11 23:09
Re: Module Development CSS help #3
Unfortunately your suggestions won't do what I want.

Firstly, I can't control which theme is loaded - since it's a module.

I do load content using $xoTheme->addStylesheet() method in the module.

The issue is that the module can't dynamically switch CSS in the module to 'match' the theme selected.
How to effectively post a question in the Xoops forums? - Read here...
Design by: XOOPS UI/UX Team