| home / programming / asp-net-com / 1 | [previous] [next] |
|
|
If you're as excited as I am about how easy it has been to build the site so far, you're probably curious about what's next. Well, it's time to change the colors.
ParentSection is the module that generates the Home page. Apart from changing the styles used to display text, we want to get rid of the HOME title that appears at the top of the page. Apart from modifying Home, we'll add or change a number of styles that update the look of various parts of the website. Let's do this now.
1. In order to remove the title from ParentSection, we need to change the skin file ParentSection_ParentSections.ascx. Because we don't want to mess with the default theme, we will copy this file from the default theme to our Blue theme.
2. In Visual Studio, copy ParentSection_ParentSection.ascx from Communities/Common/Themes/Default/Skins/ContentSkins to Communities/Common/Themes/Blue/Skins/ContentSkins, and choose no when asked about creating a new class. This way, the Blue theme will use its own copy of the file, instead of the version from the default theme.
3. Open the ParentSection_ParentSection.ascx from the Blue theme in Design view. It has four controls: SectionTitle, PageHeader, ContentList, and PageFooter. Delete the SectionTitle (the one that generates the Home title).
4. Open the Default.css file of the Blue theme and modify these styles:
.BODY
{
scrollbar-face-color: #336182;
scrollbar-highlight-color: #FFFFFF;
scrollbar-shadow-color: #FFFFFF;
scrollbar-3dlight-color: #336182;
scrollbar-arrow-color: #FFFFFF;
scrollbar-track-color: #d3d3d3;
scrollbar-darkshadow-color: #336182;
}
.FooterText
{
font-family: Verdana;
font-size: 10px;
color: #ffffff;
}
.ParentSection_SectionDescription
{
font-size: 14px;
font-family: 'Microsoft Sans Serif';
}
.ParentSection_ListTitleLink
{
font-weight: bold;
font-size: 14px;
font-family: 'Microsoft Sans Serif';
}
.ParentSection_ListBriefDescription
{
font-size: 14px;
font-family: 'Microsoft Sans Serif';
}
5. Also in Default.css, add the following style:
.Home_Header
{
font-size: 14px;
font-family: 'Microsoft Sans Serif';
}

7. Continue by modifying the following two styles used in the Books section:
.BookSection_SectionTitle
{
font-weight: bold;
font-size: 17px;
line-height: 30pt;
font-family: 'Microsoft Sans Serif';
font-variant: small-caps;
}
.BookSection_SectionDescription
{
font-size: 14px;
font-family: 'Microsoft Sans Serif';
}
8. Add the following style, which defines the text that appears in the About Me page:
/* Text in the About page */
.About_Normal
{
font-size: 14px;
font-family: 'Microsoft Sans Serif';
}
9. Add the following style, which is needed in the layout we build in the next section:
.text_mik3
{
font-size: 5px;
color: #ffffff;
font-family: Verdana;
}
| home / programming / asp-net-com / 1 | [previous] [next] |
Created: March 27 2003
Revised: July 29, 2004
URL: http://webreference.com/programming/asp-net-com/1