More Documentation on how to create themes

I got a couple tips for you:

first, use FireBug as described in this kb: http://www.aspplayground.net/forum/Customizing-the-CSS-Use-Firebug-m398562.aspx

second, the table wrapper (the big orange frame) is actually defined in the App_themes/original/appg.skin file.
The 4 definitions are used everywhere in the forum. So you just have to change these and the wrapper will be totally different (as in the case for the classic and original themes):

<ASPPG:ForumHeaderSC runat="server">
<ImageStyle ImageOpenFile="plus.gif" ImageCloseFile="minus.gif" CssClass="opencloseimg" />
<HeaderWrapperTopTemplate>
<%--<table cellpadding="4" cellspacing="1" class="mainHeader"><tr><td class="heading">--%>
<div class="for_left"> <div class="for_right"><div class="for_bg"> <div class="for_icon"></div> <div class="for_title">
</HeaderWrapperTopTemplate>
<HeaderWrapperBottomTemplate>
<%--</td></tr></table>--%>
</div></div></div></div><div class="tb_border_left"><div class="tb_border_right">
</HeaderWrapperBottomTemplate>
</ASPPG:ForumHeaderSC>

<ASPPG:ForumHeaderSC runat="server" skinid="ForumMessageHeader">
<ImageStyle ImageOpenFile="plus.gif" ImageCloseFile="minus.gif" CssClass="opencloseimg" />
<HeaderWrapperTopTemplate>
<div class="for_left"> <div class="for_right"><div class="for_bg"> <div class="for_icon"></div><div style="float:right;" class="for_title nxtprv"></div> <h1 class="for_title">
</HeaderWrapperTopTemplate>
<HeaderWrapperBottomTemplate>
</h1></div></div></div><div class="tb_border_left"><div class="tb_border_right">
</HeaderWrapperBottomTemplate>
</ASPPG:ForumHeaderSC>
 
 
<ASPPG:ThemeableLiteral runat="server" skinid="WrapperStart"
Text=' <div class="top_left"><div class="top_right"><div class="top_bg"></div></div></div> <div class="tb_border_left"><div class="tb_border_right">' />

 
<ASPPG:ThemeableLiteral runat="server" skinid="WrapperEnd"
Text='</div></div> <div class="bottom_bg"></div><br />' />

Watch my progress...
http://collegesymposium.com/default.aspx?settheme=Aero

It would still be nice to have a better guide.  Such as a description of each control, where it is, etc.

Thanks, Samuel.  I was up from midnight to 11 am working on it.

My method of attack:
-Directly editing the css and skin files on my server (using a windows file share) (this way I could see the change instantly by refreshing)
-Using Firebug (Inspect function is developer's best friend)
-Checking the html of the site by visiting http://validator.w3.org/check?uri=http%3A%2F%2Fgoogle.com  (replace google.com with your site)

By checking the html with the w3 Validator, you can see HOW your skin templates are being applied to the page.  Then add/remove tags as necessary to get the html and style perfect.

I also copied and pasted a lot of the code from the phpbb skin to the aspnet skin, then made sure the necessary css classes were moved over. (one at a time!)


Question:
Samuel, I had to change the showtime.js file to reference different forum/topic images.  I know the showtime file is global, so it messed up my other themes.  I couldn't just rename the file to overwrite the theme's image, because I went from gif to png.  I could just bite the bullet and move them all to gif, but if images could be dynamically assigned by theme, that would open the door to more images/image types.

When I'm finished with this skin (a lot to do), I'll zip it up and email it to you Samuel.  Maybe others would like to use it.