Active CSS
create browser selected css output with more effective features like variable declaring, file importing, if-else block and etc

With Active CSS Parser you can generate css based on user's browser. Check commands can used in 3 model
1- single line
.className
{
   [if ie]background-color: green
}

2- block mode (with else or without it)
[if gecko]
    background-color: yellow;
[endif
[if ie]
   background-color: green;
[else]
   background-color: red;
[endif]

3- class check
[if ie].style1{
   background-color: green;
}

You can also insert browser version for checking
.style1{
   [if ie=6]
      display: inline-block;
   [else]
      display: block;
   [endif]

   [if mozillafirefox>2]
       background-color: green;
   [else]
       background-color: blue;
   [endif]

ActiveCSS commands can contain browser names or platform checking; some examples:
[if ie>6]
    background-color: green;
[else]
    background-color: red
[endif]

/* this will be displayed in windows nt or server */
[if winnt]display: inline-block;


Variable declaring
programmer can declare a variable starts with ($); this variable will be replaced in css output: example:
$var1=green
.style1{
    display: block;
    background-color: $var1;
}
.style2{
    background-color: $var1;
}


Import another file
Import command will be checked; ActiveCSS parse new file and pass local variables to it; after process output will be printed in same location and variables will be returned; so you can pass a variable to imported file or retrieve a variable from it.
$bg_color=#‎‎9c9c9;
@import url(‘sample-test.css’);   
 




How to use
There are two ways for using ActiveCSS
1-Direct using of CssParser
this example process a css file and print output to response stream with ''text/css" mime type
protected void Page_Load(object sender, EventArgs e)
{
    string theme = Request["theme"];
    string fileName = Request["f"];

    if (string.IsNullOrEmpty(theme)) theme = "light";
    if (string.IsNullOrEmpty(fileName)) fileName = "main";

    fileName = string.Concat("/Themes/", theme, "/", fileName, ".css");
    fileName = Server.MapPath(fileName);

    BlackDal.ActiveCSS.CssParser parser;
    parser = new BlackDal.ActiveCSS.CssParser(fileName);
    Response.ContentType = "text/css";
    Response.CacheControl = "public";
    Response.Expires = int.MaxValue;
    Response.Write(parser.ProccessCSS());
        
}

2- Using CssHandler
for this you should add this line to web.config in configuration section
  <system.webServer>
    <handlers>
      <add name="ActiveCSS" verb="*" path="*.css" type="BlackDal.ActiveCSS.CssHandler" />
    </handlers>    
  </system.webServer>

note : css extensions should map to aspnet_isapi.dll in IIS

Last edited Oct 26, 2012 at 8:24 PM by BlackDal, version 6