improve and simplify css with php parser

Question

I want to improve css syntax in several ways such as:

• defining variables
  link-color1 = #fff
• mathematical computing
  width:500-3-2 this seemy stupid but with variables:
  width: container - inner - 3px;
• style extending
  #foo{background:#ddd;color:#eee;} #bar {@extend: #foo;color:#fff;}
• cross-browser features
  -moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px; replace to
  border-radius:3px;

these are only examples, my ideas, but the library can be different

I am looking for a php library which parses a file which sytax is similar to css, and generates a valid css document.

This is important that I dont want to insert php sytax into my css file because:

• PHP looks complicated and ugly
  #foo {color:<?php echo $color1; ?>;}
• Notepad++ gets absolutely confused. Me too

---

SASS is very good solution for offline work, but i still search for PHP solution because:

• The improved css files would be available for the other developers so they can modify and test it. For a larger community php-parser used on the server is an easier way.
• PHP can also be resource sparing with a simple revision system based on file modification date and hashcodes.

---

Here is an example what i wrote: php parser at /css/index.php

usage:

@color1: #1a1a1a;
@color2: #444444;

div#container {background:@color1;}
div#inner {background:@color2;}

the HTML link:

<link rel="stylesheet" type="text/css" href="/css/?main.css" />

This works only with colors. I need a parser for the listed options.

Answer 1

LessPhp

Thanks to @Kru I found Less.js which is a very nice and clever css parser, but as I said the best solution would be PHP. After a little search on forums and google I found LessPhp which is a PHP port of Less.js

Documentation can be found here.

LessPhp is also on github.

Answer 2

Try SASS. It supports variables, mathematical computations, style inheritance and many more features. It's not implemented in PHP, but it generates static files.

Answer 3

Did you try CSS Crush?

Answer 4

you could include your css with php with:

<link href="style.php" rel="stylesheet" type="text/css" />

In your style.php you do:

header("Content-Type: text/css");

At this point you can use all the power of php to do what ever you want like:

<?php

 $rules = 'font-size:11px;padding:5px;';

?>

td { <?php echo $rules; ?> }

Addedum

Inheritance:

<?php

   $parent=array( 'td' => 'color:;padding;etc;'
                  'p' => 'other rules'
                   //> other rules
               );
?>

.inheritance {
    <?php echo $parent['td']; ?>
   //> other rules here
 }

Answer 5

i dont think this is a good idea, esp in a production enviornment, but if you insist on doing this, i would suggest just installing SASS and executing it from php using passthru()

http://sass-lang.com/

http://www.php.net/manual/en/function.passthru.php

Like this

<?php
$css_path = '/';  // location of your real css files
$sass_cmd = 'sass -f';  // sass cmd
passthru($sass_cmd . $css_path . $_GET['cssfile'];
?>

called via

cssparse.php?cssfile=xyz.css

if you want to get fancy you could use a rewrite rule to funnel all your *.css requests thru your PHP script.

eg:

RewriteEngine On
RewriteCond %{REQUEST_FILENAME} \.css$
RewriteRule   ^(.*\.css)$  cssparse.php?cssfile=$1

that way when you request /example.css in the browser, it gets rewritten as /cssparse.php?cssfile=example.css which calls SASS and returns the output

Answer 6

What you want to do just isn't a good idea. Every time a user loads your CSS file, it first has to go through the PHP function that generates the CSS file from your 'improved' version. It is only needed for, for example, social networking sites on which users can make custom layouts. Then the custom styles have to be loaded from a database and inserted into the CSS file using PHP.

For website without this functionality, after the CSS is parsed, there is no difference. Creating the CSS file had only been easier/more efficient for you.

Also, if your CSS has to go through a PHP parser, it is not possible to modify the CSS offline.