jueves, 15 de noviembre de 2012

Curso de Sass y Compass - 4 - Crear y configurar proyectos

Este es el 4º video del curso de Sass y Compass en el cual vamos a ver como crear y configurar proyectos.

Lo que veremos en este video es lo siguiente:

  • Las dos sintaxis del lenguaje Sass

  • Crear proyectos con Sass/Compass

  • Crear un nuevo proyecto

  • El archivo de configuración config.rb

  • Compass Watch

  • Empezar con Sass/Compass a partir de un proyecto existente



El Video




Descargar en HD


En el caso de que lo quieras tener más a mano y poder analizarlo mejor.

http://depositfiles.com/files/6ahizb260

 

Algunos apuntes


Crear proyectos, etc


Para crear un proyecto Sass/Compass
compass create nombre-del-proyecto

Para monitorizar el proyecto, es necesario ir a la raíz del proyecto y escribir "compass watch"
cd nombre-del-proyecto
compass watch

Convertir los archivos CSS en un proyecto existente
sass-convert --from css --to scss -R css sass

--from css indicamos que queremos convertir (css)

--to scss indicamos a que lo queremos convertir (también se puede a sass)

-R css indicamos que busque en el directorio CSS de forma recursiva (que busque todos los archivos CSS que hayan en la carpeta CSS)

sass indicamos el nombre de una carpeta para almacenar los archivos convertidos

 En el config.rb (algunas configuraciones)


# Directorio donde se encuentra los archivos con extensión SCSS o SASS
sass_dir = "sass"

# Directorio donde se encuentran los archivos CSS
css_dir = "css"

# Directorio donde se encuentran los archivos Javascript
javascript_dir = "js"

# Directorio donde se encuentran las imagenes
images_dir = "img"

# Tipos de salidas
output_style = :expanded # CSS expandido
# output_style = :nested # CSS semi-expandido
# output_style = :compact # CSS compacto, una linea por cada selector
#output_style = :compressed # CSS comprimido, todo en una linea

# Comentarios en el CSS procesado
line_comments = false

 

Algunos enlaces


Todos los videos del curso

Web oficial de Compass

Web oficial de Sass

 

Cualquier duda o cosa que no haya tocado no duden en preguntar ;-)

3 comentarios:

  1. Muchas gracias por tu impagable ayuda Matías

    ResponderEliminar
  2. que bueno que te gusten los videos, gracias a ti :)

    ResponderEliminar
  3. Gracias por este gran aporte. Me ha servido muchísimo.

    ResponderEliminar