Recent Changes - Search:
Cookbook /

LocalCSS-Talk

Summary: Talk page for LocalCSS.
Maintainer: Petko
Users: +4 (View / Edit)

This space is for User-contributed commentary and notes. Please include your name and a date along with your comment.

Conditions?

Martin 2023-09-26 Would it be possible to have conditions with (:if...:) within LocalCSS? Example usage: I use PmWiki as a CMS and have an "admin bar" when I'm logged in. I don't think it's good that the associated code is publicly visible (in the source code). I could hide it with (:if auth admin:).

I suspect the admin bar is hidden when a visitor is not admin, but you also want any related CSS to not be printed? --Petko

Yes it is. But that's just an example. I have a fairly large project with many groups, including a lot of different CSS. I would like to maintain everything from LocalCSS. When I see the source code in the browser, it blows my mind. If I could add if conditions, I could sort this so that only the required CSS is read. - This isn't vital, but I thought it might be a good idea in general? Martin,

I'm not ready to complicate this function at the moment. I'd add the code in pub/css/local.css, Group.css or Group.Page.css. If there is no element to which the CSS applies, it will be simply ignored. If it is in a separate file, browsers will only download it once when browsing multiple pages.

Alternatively, you can have a separate css file like pub/css/admin.css that is loaded only when the visitor is admin. Add this to config.php: 

  $PostConfig['AdminCSS'] = 400;
  function AdminCSS($pagename) {
    # Only enable on certain pages, like LocalCSS (optional)
    $pattern = "SiteAdmin.*,Site.*,Main.Admin*";
    if(! (boolean)MatchPageNames($pagename, $pattern)) return;

    # admin conditional
    if(NoCache(CondAuth($pagename, 'admin'))) {
      global $HTMLHeaderFmt;
      $HTMLHeaderFmt['AdminCSS'] =
        '<link rel="stylesheet" href="$PubDirUrl/css/admin.css">';
    }
  }

Petko

Minor addition

~SteP 2015-11-23 I changed line 55 to 
@$HTMLStylesFmt['LocalCSS'] .= "\n".$css;

The additional newline character keeps the CSS rules of each @-block separated, so source code looks better. Nothing new functionally.

Very Useful Indeed

~SteP 2015-08-29 Brilliant, thanks Petko! This recipe is very useful, particularly with the added flexibility that @variables provide. There is no page variable expansion for @variables. However, it's easy to add predefined @variables, for example to use $SkinDirUrl in CSS rules add these lines to localcss.php before #get @variables: 

# prepend predefined @variables
global $SkinDirUrl;
$text = "@SkinDirUrl:$SkinDirUrl\n".$text;

Then use @SkinDirUrl in your CSS rules.

Or, you could probably write the value of the $SkinDirUrl in the LocalCSS page: 

  @SkinDirUrl:http://www.example.com/pub/skins/myskin
  @SkinDirUrl:/pub/skins/myskin

--Petko August 29, 2015, at 03:36 PM

I've released a new version allowing you to use a few variables like @SkinDirUrl, and to add more. --Petko August 29, 2015, at 05:57 PM

~SteP 2015-08-30 Thank you, Petko!

Talk page for the LocalCSS recipe (users).