I am trying to work out a good way to have dynamic CSS. I like Sass,
so I tried to work that in too. I'm looking for comments for
improvement to what I came up with.
Any constructive criticism would be appreciated.
Thanks,
E
aeondust.com
------------------------------------
First put Sass code into an Erb file:
public/stylesheets/styles_sass.erb
Your Sass code can be interspersed with variables, e.g.,
h1, h2, h3, h4, h5, h6
margin: 6px 0
padding: 0
color: <%= header_color %>
Or anything else you can put in an Erb or RHMTL file.
Then create a controller to serve the CSS data:
require 'erb'
class CssController < ApplicationController
layout nil
session :off
def index
# Get the path to the Erb file.
sass_erb_file =
File.join(File.expand_path(File.dirname(__FILE__)),
'..',
'..',
'public',
'stylesheets',
'styles_sass.erb')
# Read in the Erb file
sass_code = open(sass_erb_file) { |f| f.read }
# Erb tempate object
erb_template = ERB.new sass_code
# Set some vars. Here you would probably do something more useful
# like get data from the DB
header_color = '#BE0D45'
navbar_bgcolor = '#F2D0A5'
left_col_bgcolor = '#ccc'
right_col_bgcolor = '#ccc'
# Get the output of the template
sass_processed = erb_template.result(binding)
# Put the resulting Sass code through the Sass engine to produce
CSS
engine = Sass::Engine.new(sass_processed)
css = engine.render
# Return the CSS
render :text => css, :content_type => "text/css"
end
end
In your views, link to the CSS data like this:
<link href='/css' rel='Stylesheet' type='text/css' />
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Haml" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at http://groups.google.com/group/haml?hl=en
-~----------~----~----~----~------~----~------~--~---
