<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Mike Smullin &#187; framework</title>
	<atom:link href="http://www.mikesmullin.com/tag/framework/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.mikesmullin.com</link>
	<description>Personal Blog</description>
	<lastBuildDate>Fri, 30 Sep 2011 23:21:47 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.2.1</generator>
		<item>
		<title>Blueprint: A CSS Framework</title>
		<link>http://www.mikesmullin.com/design/blueprint-a-css-framework/</link>
		<comments>http://www.mikesmullin.com/design/blueprint-a-css-framework/#comments</comments>
		<pubDate>Fri, 05 Feb 2010 03:08:58 +0000</pubDate>
		<dc:creator>Mike Smullin</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[Design]]></category>
		<category><![CDATA[framework]]></category>
		<category><![CDATA[tools]]></category>

		<guid isPermaLink="false">http://www.mikesmullin.com/?p=405</guid>
		<description><![CDATA[Blueprint is a CSS framework, which aims to cut down on your development time. It gives you a solid foundation to build your project on top of, with an easy-to-use grid, sensible typography, useful plugins, and even a stylesheet for printing. Blueprint offers: A CSS reset that eliminates the discrepancies across browsers. A solid grid [...]]]></description>
			<content:encoded><![CDATA[<div id="attachment_407" class="wp-caption aligncenter" style="width: 432px"><a href="http://www.mikesmullin.com/wp-content/uploads/2010/02/blueprint.png"><img class="size-full wp-image-407" title="Blueprint" src="http://www.mikesmullin.com/wp-content/uploads/2010/02/blueprint.png" alt="Blueprint" width="422" height="115" /></a><p class="wp-caption-text">&quot;Spend your time innovating, not replicating.&quot;</p></div>
<p style="text-align: center;">
<p><a href="http://blueprintcss.org/">Blueprint</a> is a <acronym title="Cascading Style Sheets">CSS</acronym> framework, which aims to cut down on your development time. It gives you a solid foundation to build your project on top of, with an easy-to-use grid, sensible typography, useful plugins, and even a stylesheet for printing.</p>
<p>Blueprint offers:</p>
<ul>
<li>A <acronym title="Cascading Style Sheets">CSS</acronym> reset that eliminates the discrepancies across browsers.</li>
<li>A solid grid that can support the most complex of layouts.</li>
<li>Typography based on expert principles that predate the web.</li>
<li>Form styles for great looking user interfaces.</li>
<li>Print styles for making any webpage ready for paper.</li>
<li>Plugins for buttons, tabs and sprites.</li>
<li>Tools, editors, and templates for every step in your workflow.</li>
</ul>
<p>Of course, Blueprint isn&#8217;t the only choice. It&#8217;s just the most popular, according to Google Trends:</p>
<div id="attachment_440" class="wp-caption aligncenter" style="width: 599px"><a href="http://www.google.com/trends?q=960+css%2C+blueprint+css%2C+yui+css&amp;ctab=0&amp;geo=all&amp;date=all&amp;sort=3"><img class="size-full wp-image-440" title="CSS Framework Trends" src="http://www.mikesmullin.com/wp-content/uploads/2010/02/css-framework-trends.png" alt="" width="589" height="247" /></a><p class="wp-caption-text">keyword searches on Google</p></div>
<p style="text-align: center;">
<p>You may also be interested in <a href="http://960.gs/">960 Grid System</a>, or <a href="http://developer.yahoo.com/yui/">Yahoo! User Interface Library (YUI)</a>.</p>]]></content:encoded>
			<wfw:commentRss>http://www.mikesmullin.com/design/blueprint-a-css-framework/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Compass: CSS Stylesheet Framework</title>
		<link>http://www.mikesmullin.com/development/compass-css-stylesheet-framework/</link>
		<comments>http://www.mikesmullin.com/development/compass-css-stylesheet-framework/#comments</comments>
		<pubDate>Fri, 05 Feb 2010 02:17:29 +0000</pubDate>
		<dc:creator>Mike Smullin</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[Design]]></category>
		<category><![CDATA[Development]]></category>
		<category><![CDATA[Ruby]]></category>
		<category><![CDATA[framework]]></category>
		<category><![CDATA[tools]]></category>

		<guid isPermaLink="false">http://www.mikesmullin.com/?p=367</guid>
		<description><![CDATA[Compass is a stylesheet authoring framework that makes your stylesheets and markup easier to build and maintain. With compass, you write your stylesheets in Sass instead of CSS. Using the power of Sass Mixins and the Compass community, you can apply battle-tested styles from frameworks like Blueprint to your stylesheets instead of your markup. It&#8217;s [...]]]></description>
			<content:encoded><![CDATA[<p><a href="http://compass-style.org/">Compass</a> is a stylesheet authoring framework that makes your stylesheets and markup easier to build and maintain. With compass, you write your stylesheets in Sass instead of <acronym title="Cascading Style Sheets">CSS</acronym>. Using the power of Sass Mixins and the Compass community, you can apply battle-tested styles from frameworks like Blueprint to your stylesheets instead of your markup.</p>
<p style="text-align: center;"><a href="http://www.mikesmullin.com/wp-content/uploads/2010/02/compass.png"><img class="aligncenter size-full wp-image-374" title="Compass" src="http://www.mikesmullin.com/wp-content/uploads/2010/02/compass.png" alt="Compass" width="357" height="95" /></a></p>
<p>It&#8217;s a Ruby on Rails project. You run a CLI utility that watches a directory where your .css and .sass reside. The changes you make to your .sass files get automatically parsed and translated to .css files. The .sass format allows you to have a simplified less repetitive stylesheet markup, in addition to the ability to use variables, functions, mathematic operations, and more.</p>
<ul>
<li>In <acronym title="Cascading Style Sheets">CSS</acronym>, ever wished you could store the color palette for your site design in a few variables and then just reference those variables through the stylesheet?</li>
<li>Ever wished you could perform cross-browser compatible mathematical addition on layout column widths?</li>
<li>Ever wished you could easily gather a library of  commonly used <acronym title="Cascading Style Sheets">CSS</acronym>, and then selectively include them in your various designs with a single line?</li>
</ul>
<p>Now you can, with <a href="http://compass-style.org/">Compass</a>.</p>
<p>Installation on Debian/Ubuntu 9.10 Karmic is like:</p>
<pre class="brush: bash; title: ; notranslate">
sudo aptitude install ruby gem; # dependencies
sudo gem sources --add http://gems.github.com/
sudo gem install chriseppstein-compass; # install
sudo gem install chriseppstein-compass-960-plugin; #optional plugin
compass -f blueprint project; # example usage
compass -r ninesixty -f 960 project; # example plugin usage
</pre>
<p>Looks promising! See <a href="http://wiki.github.com/chriseppstein/compass/getting-started">more detailed Compass install instructions</a>.</p>
<p>UPDATE: Since I posted this, I realized that using the Ubuntu/debian package management system (Aptitude) to try to install Ruby and Rubygems is a huge hassle and ultimately will not work. Now I use RVM. Like so for Ubuntu 10.04 64-bit server:</p>
<pre class="brush: bash; title: ; notranslate">
# installing rvm
# see also: http://rohitarondekar.com/articles/installing-rails3-beta3-on-ubuntu-using-rvm
sudo aptitude install curl git-core
bash &lt; &lt;( curl http://rvm.beginrescueend.com/releases/rvm-install-head )
sed -i 's/^\[/# [/' ~/.bashrc
echo '[[ -s &quot;$HOME/.rvm/scripts/rvm&quot; ]] &amp;&amp; source &quot;$HOME/.rvm/scripts/rvm&quot;' &gt;&gt; ~/.bashrc
source ~/.bashrc

# dependencies for compiling Ruby
sudo apt-get install curl bison build-essential autoconf zlib1g-dev libssl-dev libxml2-dev libreadline6-dev
# dependencies for compiling my RubyGems gems
sudo aptitude install libpq-dev libmysql-ruby libmysqlclient-dev sqlite3 libsqlite3-dev libxslt-dev libxml2-dev imagemagick

# openssl package for RVM
rvm package install openssl

# readline package for RVM
rvm package install readline

# installing ruby
rvm install 1.9.2 -C --with-openssl-dir=$rvm_path/usr,--with-readline-dir=$rvm_path/usr
sudo -i
echo &quot;gem: --no-ri --no-rdoc&quot; &gt;&gt; /etc/gemrc
rvm use 1.9.2 --default
sudo ln -s `which ruby` /usr/bin/ruby1.9.2
</pre>
<p>This will get you on edge Rails and Ruby. Then from there its as simple as:</p>
<pre class="brush: bash; title: ; notranslate">
gem install compass
compass watch
</pre>
<p>&#8216;</p>
<p>And I no longer use 960gs. I prefer <a href="http://susy.oddbird.net/">Susy</a> now.</p>
<p>Hope this helps!</p>]]></content:encoded>
			<wfw:commentRss>http://www.mikesmullin.com/development/compass-css-stylesheet-framework/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

