I made slitaz css for the forum but the vanilla forum crashed my browser when I tried to post the long code here and will not let me post a file's code in one post so here are the color replacements to find-replace.
Good work. Can you post your style.css (and other files) on the mailing list so that we can test it? In RC1, they have merged vanilla.css and style.css in one file style.css. But there seems to be some theming issues with the latest vanilla RC1 release (like those bullets on the sidepanel). That's one of the reasons we haven't improved the theme yet.
/* Welcome to the Vanilla CSS File! Some things you should know:
1. There is a style.css file that is also included on every page of Vanilla. It defines the common classes on all user-facing pages, including the user profile page, activity page, and search results page.
2. This css file will be included on all Vanilla pages. Those pages are: + Discussions (All Discussions, Bookmarks, Your Discussions, etc) + Drafts + Categories + Comments + Start a New Discussion Form + Add a Comment Form
3. This file is broken down into the following sections: + Line 27: Panels / Sidebars + Line 59: Discussions + Line 164: Categories + Line 202: Comments + Line 430: Drafts + Line 471: Discussion & Comment Forms */
/* ======================================================== Panels / Sidebars */ #Panel a.Bookmark, a.NewDiscussion { padding: 6px 0; display: block; text-align: center; font-size: 16px; font-weight: bold; -moz-border-radius: 2px; -webkit-border-radius: 2px; background: #6c0023 /* Banner Background Color */; color: #fff /* Banner Font Color */; text-decoration: none; margin: 0 0 10px 0; text-shadow: 0 1px 0 #242424; } a.NewDiscussion:hover { background: #f0ba08 /* Menu Hover Background Color */; color: #fff /* Menu Hover Font Color */; text-shadow: 0 1px 0 #6c0023; } #Panel a.Bookmark { background: #df8f06; color: #fff; } #Panel a.Bookmark:hover { background: #f0ba08; color: #fff; } #Panel ul.Discussions { border: 0; } ul.PanelDiscussions li { text-align: left; } ul.PanelDiscussions li a { float: none; } ul.PanelDiscussions li strong { display: block; }
/* Note: DataList is used in search results, vanilla discussions & drafts */ ul.DataList li { margin: 0; padding: 0 0 4px 0; border-bottom: 1px solid #dbe3e6; } ul.DataList li li { border: 0; padding: 0; } ul.DataList, ul.DataList li ul { list-style: none; margin: 0; padding: 0; } ul.DataList li ul li.Title { float: left; width: 560px; } ul.DataList li ul li.Meta { clear: both; } ul.DataList li ul li.Title a { border: 1px solid #eee; -moz-border-radius: 2px; -webkit-border-radius: 2px; background: #fafafa; margin: 4px 0; padding: 2px 8px; line-height: 130%; color: #2b3033; font-size: 105%; display: block; clear: left; } ul.DataList li ul li.Title strong { display: block; padding: 6px 0 0 6px; margin: 0; font-size: 110%; font-weight: bold; } ul.DataList li ul li.Title strong a { display: inline; border: 0; padding: 0; margin: 0; color: #522222 /* Body Link Font Color */; background: none; } ul.DataList li ul li.Meta { font-family: 'lucida grande','Lucida Sans Unicode', Tahoma, sans-serif; margin-left: 5px; font-size: 11px; color: #80828c /* Meta Label Font Color */; } ul.DataList li ul li.Meta span, ul.DataList li ul li.Meta span a, ul.DataList li ul li.Meta strong { margin-right: 12px; } ul.DataList li ul li.Meta strong { background: #ff0; padding: 2px 4px; -moz-border-radius: 2px; -webkit-border-radius: 2px; } ul.DataList li ul li.Meta a { color: #2b2d33 /* Meta Font Color */; } body.Discussions h1 { margin: 0; } li.DiscussionRow ul.Discussion { /* Fixes an IE7 Spacing issue */ display: inline !important; } ul.Announcements { margin: 0 0 20px; } /* Note: The Vanilla Discussion List has the following classes applied to individual list elements and can be styled: + Bookmarked: the user has bookmarked that topic + Announcement: the discussion has been announced + Mine: the user created the discussion + New: there are new comments since the last viewed the discussion */ .Mine { background: #f3eed6 /* Discussion My Background Color */; } li.New { background: #ffd /* Discussion New Background Color */; } ul.DataList li ul li.Meta a.Category { background: #fafafa; padding: 2px 4px; -moz-border-radius: 2px; -webkit-border-radius: 2px; } ul.DataList li.Mine ul li.Meta a.Category { background: #fafdcd; } ul.DataList li.New ul li.Meta a.Category { background: #ffe; }
/* =============================================================== Categories */ .Categories { list-style: none; margin: 0; padding: 0; } body.Categories h1, body.Categories #Content h2 { margin: 0; } h1 span { color: #555 /* Body Text Font Color */; padding: 0 4px; font-size: 70%; } body.Categories h1 a { color: #000; } /* Note: This "More" style is custom to the categories page. It appears like the MorePager listed above, but it is just a link to a different page. */ .More { list-style: none; margin: 1px 0 20px; padding: 3px 6px; text-align: right; background: #d4d191; } .More a { font-size: 13px; font-weight: bold; text-align: right; } .More a:hover { color: #522222 !important; text-decoration: underline; }
/* ================================================================= Comments */ body.Discussion #Content { margin-bottom: 20px; } body.Discussion #Content h2 { font-size:140%; font-weight:bold; margin: 0; color: #333; padding: 6px 0; line-height: 1.2; } body.Discussion #Content h2 span { padding: 0 10px; color: #777; font-size: 12px; } .Preview, .Preview li, .Preview ul, .Preview ul li, #Discussion, #Discussion li, #Discussion ul, #Discussion ul li { list-style: none; margin: 0; padding: 0; } #Discussion { margin-bottom: 1px; } #Discussion .Comment { border-bottom: 1px solid #ddd; } /* Note: Fixes IE 7 Glitch */ *:first-child+html #Discussion .Comment { overflow: hidden; } .Preview li ul.Info, #Discussion li ul.Info { font-family: 'lucida grande','Lucida Sans Unicode', Tahoma, sans-serif; font-size: 11px; color: #777 /* Meta Label Font Color */; padding: 8px 0 0 8px; } .Preview li ul.Info { padding: 0; } .Preview li ul.Info li.Author img, #Discussion li ul.Info li.Author img { height: 40px; width: 40px; border: 0; margin: 0 10px 0 0; float: left; overflow: hidden; background: #eee; } .Preview li ul.Info li, #Discussion li ul.Info li { display: inline; line-height: 2.5; } .Preview li ul.Info li.Created, #Discussion li ul.Info li.Created, #Discussion li ul.Info li.Permalink { padding-left: 10px; } .Preview li ul.Info li.Author a, #Discussion li ul.Info li.Author a { font-size: 15px; font-weight: bold; } .Preview li .Body, #Discussion li .Body { clear: both; padding: 1px 8px 2px; line-height: 140%; font-size: 100%; } .Body p { font-family: 'lucida grande','Lucida Sans Unicode', Tahoma, sans-serif; margin: 8px 0; } .Body blockquote { -moz-border-radius: 3px; -webkit-border-radius: 3px;
@import url('reset.css') /* NoFollow */; /* Welcome to the Generic Style CSS File! Some things you should know:
1. The reset.css file imported above breaks all elements down to a base style.
2. This file is included on all front-end/user-facing pages. Applications can override this file in their own custom files (ie. vanilla.css or conversations.css).
3. This file is broken down into the following sections: + General Styles & Typography + Header + Main Menu + Panels / Sidebars + Activities + Profile Page + Profile Tab Menu + Thumbnail Cropper + Footer */
/* Note: The Vanilla Discussion List has the following classes applied to individual list elements and can be styled: + Bookmarked: the user has bookmarked that topic + Announcement: the discussion has been announced + Mine: the user created the discussion + New: there are new comments since the last viewed the discussion */ .Mine { background: #df8f06; } /* li.New { background: #fffec1; } */ ul.DataList div.Meta a.Category { background: #fafafa; padding: 2px 4px; -moz-border-radius: 2px; -webkit-border-radius: 2px; } ul.DataList li.Mine div.Meta a.Category { background: #f8efd1; } /* ul.DataList li.New div.Meta a.Category { background: #fffed7; } */ ul.DataList div.Meta span.Announcement { background: #777777; color: #ffffff; padding: 1px 4px; -moz-border-radius: 2px; font-weight: bold; } ul.DataList div.Meta span.Closed { background: #555555; color: #ffffff; font-weight: bold; padding: 1px 4px; -moz-border-radius: 2px; }
/* ================================================================= Comments */ body.Discussion #Content { margin-bottom: 20px; } ul.Discussion { margin-bottom: 1px; } /* Note: Discussion & Comment Option (dropdown) Menu customizations. The layout css for these is in /applications/garden/design/menu.css. Override them here. */ a.Bookmark, a.Bookmarking { float: right; display: block; background: url('images/star_sprite.png') top center no-repeat; height: 22px; width: 22px; margin: 2px 4px 0 4px; } a.Bookmark span, a.Bookmarking span { display: none; } a.Bookmarked { background: url('images/star_sprite.png') center center no-repeat; } a.Bookmarking { background: url('images/star_sprite.png') bottom center no-repeat; } body.Discussion a.Bookmark { margin: 13px 8px; }