CSScaffold, framework CSS en PHP

CSScaffold, framework CSS en PHP

CSScaffold es
un framework CSS con el que podemos extender las posibilidades de
nuestros CSS desde PHP. Básicamente se trata de un script PHP que
recoge los ficheros .CSS a tratar y mediante una nomenclatura (que
veremos más adelante) nos genera unos ficheros CSS que cualquier
navegador podrá interpretar.

(Ver Imagen)
// Ejemplo de uso:
<link href="/scaffold/index.php?request=/css/master.css" />

Funcionalidades


Entre las funcionalidades que nos podemos encontrar y que extienden las posibilidades del CSS, cabe destacar:
Constantes


// Definición
@constants {
text_color:#555;
color_1:#999;
}

// Uso
body
{
color:!text_color;
}Como vemos podemos
especificar valores estáticos para usar a lo largo del fichero CSS.
Pudiendo reemplazarlos fácilmente en un solo lugar.
Mixins


// Declaración
=mixin-name(!param, !param2 = 0){
color:!param;
border: !param2 solid #eee;
}

// Uso
#content{
+mixin-name(#eee);

padding:10px;
border:1px solid #eee;
}
Se trata de un sistema de disponer de funciones en nuestros CSS.
Selectores anidados


// Uso
#id{
border:1px;

h1,h2,h3
{
color:red;

a div, blockquote, mark
{
margin:10px;
}

&.span
{
padding:10px;
}
}
}
Interesante capacidad de permitirnos usar selectores anidados para mostrar más claramente la especifidad del selector.
// Uso
a{
color:#fff;
&:hover { text-decoration:underline; }
}

// Resultado
a { color:#fff; }
a:hover { text-decoration:underline; }
Además, mediante el uso de & podemos hacer referencia al selector actual.
Expresiones


// Uso
#id{
padding:#[10*4]px;
}
La capacidad de usar expresiones para parametrizar nuestros diseños.
Instalación


La instalación, tan sencilla que puede ser usada en cualquier aplicación sin tener que invertir una gran cantidad de tiempo en configurarlo.

1. Descargamos el fichero.
   
2. Copiamos el fichero scaffold/ en nuestro directorio de CSS
   
3. Configuramos el fichero scaffold/config.php
   
4. Añadimos permisos de escritura a la carpeta scaffold/cache/
   
5. Reemplazamos las llamadas a nuestros CSSs
   

// Antes
<link href="screen.css" />

// Con CSScaffold
<link href="scaffold/index.php?request=screen.css" />

// Con CSScaffold sin caché
<link href="scaffold/index.php?request=screen.css&recache" />
Útil y práctico para hacernos ahorrar unos valiosos minutos a la hora de trabajar con CSS's.
fuente