lucadegasperi · August 19, 2012 22:49
diff --git a/declaration-after-context.css b/declaration-after-context.css
 .titlebar
 {
    /* titlebar css rules go here */
 }

 .titlebar .button
 {
    /* button's titlebar context modified rules go here */
 }
diff --git a/declaration-after-element.css b/declaration-after-element.css
 .button
 {
    /* button css rules go here */
 }

 .titlebar .button
 {
    /* button's titlebar context modified rules go here */
 }
diff --git a/when-context-is-not-enough.css b/when-context-is-not-enough.css
 .button
 {
    /* default css rules go here */
 }

 .titlebar .button
 {
    /* titlebar context rules go here */
    background: red;
 }

 .sidebar .button
 {
    /* titlebar context rules go here */
    background: red;
 }

 .modal-box .button
 {
    /* titlebar context rules go here */
    background: red;
 }
diff --git a/with-context.css b/with-context.css
 .button
 {
    /* default css rules go here */
 }

 .titlebar .button
 {
    /* titlebar context rules go here */
 }
diff --git a/with-context.html b/with-context.html
 <div class="titlebar">
    <a class="button" href="#">I'm a different button</a>
 </a>

 <a class="button" href="#">I'm the default button</a>
diff --git a/without-context.css b/without-context.css
 .button
 {
    /* default css rules go here */
 }

 .button.different
 {
    /* different css rules go here */
 }
diff --git a/without-context.html b/without-context.html
 <div class="titlebar">
    <a class="button different" href="#">I'm a different button</a>
 </a>

 <a class="button" href="#">I'm the default button</a>
	.button
	{
	/* button css rules go here */
	}

	.titlebar .button
	{
	/* button's titlebar context modified rules go here */
	}