On Sat, Feb 23, 2008 at 1:44 PM, Roy Smith <<a href="mailto:roy@panix.com">roy@panix.com</a>> wrote:<br><div class="gmail_quote"><blockquote class="gmail_quote" style="border-left: 1px solid rgb(204, 204, 204); margin: 0pt 0pt 0pt 0.8ex; padding-left: 1ex;">
<div style="">
How do you augment the CSS style sheet of a theme?<div><br></div><div>My first experiments with modifying a theme (I stated with sky) were to just edit the style.css file in the theme directory. That worked, but is obviously not very maintainable. I'm redoing my site and want to be able to leave the original style.css virgin and just add my stuff in another style sheet (which is, after all, the whole idea of CSS).</div>
<div><br></div><div>For example, I want to add:</div><div><br></div><div><div>img.keyline {</div><div> border: 1px solid black;</div><div> padding: 0;</div><div>}</div><div><br></div><div>to an existing theme. Where do I put that? I tried to follow the directions in <a href="http://drupal.org/node/11774" target="_blank">http://drupal.org/node/11774</a>, namely where it says:</div>
<div><br></div><div>"<span style="line-height: 17px;"><font style="font-family: Verdana; font-style: normal; font-variant: normal; font-weight: normal; font-size: 13px; line-height: normal; font-size-adjust: none; font-stretch: normal; color: rgb(17, 49, 78);" color="#11314e" face="Verdana" size="4">if you only want to alter the CSS of a theme, then just place a new </font><font style="font-family: Monaco; font-style: normal; font-variant: normal; font-weight: normal; font-size: 12px; line-height: normal; font-size-adjust: none; font-stretch: normal; color: rgb(17, 49, 78); background-color: rgb(238, 241, 243);" color="#11314e" face="Monaco" size="3">style.css</font><font style="font-family: Verdana; font-style: normal; font-variant: normal; font-weight: normal; font-size: 13px; line-height: normal; font-size-adjust: none; font-stretch: normal; color: rgb(17, 49, 78);" color="#11314e" face="Verdana" size="4"> file in a subdirectory of the theme: it will appear as a new theme in Drupal."</font></span></div>
<div><font color="#000000"><span style="background-color: transparent;"><br></span></font></div><div><font color="#000000"><span style="background-color: transparent;">So, I made a themes/sky/my-sky directory, and put just that little bit of CSS in a "style.css" file there. Sure enough, "my-sky" showed up as a style I could select in the /admin/build/themes page. When I selected it, however, it looked like what I put there *replaced* the style.css from sky, rather than adding to it.</span></font></div>
<div><br></div><div>What clue am I missing?</div><div> <p style="margin: 0px; font-family: Helvetica; font-style: normal; font-variant: normal; font-weight: normal; font-size: 12px; line-height: normal; font-size-adjust: none; font-stretch: normal; min-height: 14px;">
<br></p> <p style="margin: 0px;"><font style="font-family: Helvetica; font-style: normal; font-variant: normal; font-weight: normal; font-size: 12px; line-height: normal; font-size-adjust: none; font-stretch: normal;" face="Helvetica" size="3">--</font></p>
<p style="margin: 0px;"><font style="font-family: Helvetica; font-style: normal; font-variant: normal; font-weight: normal; font-size: 12px; line-height: normal; font-size-adjust: none; font-stretch: normal;" face="Helvetica" size="3"><a href="mailto:roy@panix.com" target="_blank">roy@panix.com</a></font></p>
</div><br></div></div><br>--<br>
[ Drupal support list | <a href="http://lists.drupal.org/" target="_blank">http://lists.drupal.org/</a> ]<br></blockquote></div><br>One thing you might try is putting an @import to ../style.css as the first line in your sheet. I'd think this would be done automatically as the default behavior, but perhaps not (I don't know).<br clear="all">
<br>-- <br>Tony Yarusso<br><a href="http://tonyyarusso.com/">http://tonyyarusso.com/</a>