I use Strava to track my bicycle rides. Below you can see my recent activity.
I’ve been meaning to make some changes to the skin I was using on ChrisHammond.com for a couple of weeks now. Basically it was running the MultiFunction Free DotNetNuke Skin that I created/released back in May. I wanted to make the “Home” skin use a different header image than the other pages, meaning the home page would have a larger header graphic, and the other pages would have a smaller graphic.
So tonight I set out to do that, with the goal of doing it all via CSS. I was successful, though I did find a few things to tweak in MultiFunction for the next release of the skin (not related to the changes I was making tonight).
Here’s the CSS I’m using now on ChrisHammond.com for the overrides for MultiFunction. I’ve also added this to the Documentation page of the MultiFunction skin on Codeplex.
1: #Logo
2: {
3: margin: 15px 0 0;
4: }
5:
6: #Body, .Head
7: {
8: color:#333;
9: }
10:
11: .HeaderGraphic
12: {
13: background-image:url(https://s3.amazonaws.com/dnncdn/cjh/header_graphic.png);
14: }
15:
16: #GraphicHeader
17: {
18:
19: background-image:url(https://s3.amazonaws.com/dnncdn/cjh/headerbg_rp.png);
20: }
21:
22: #GraphicHeader .page_header
23: {
24: background:url(https://s3.amazonaws.com/dnncdn/cjh/headerbg.jpg) no-repeat scroll 50% 0 transparent;
25: }
26:
27: .PageFooter
28: {
29: background-image:url(https://s3.amazonaws.com/dnncdn/cjh/footerbg_rp.png);
30: }
31:
32: .FooterWrapper
33: {
34: background:url(https://s3.amazonaws.com/dnncdn/cjh/footerbg.jpg) no-repeat scroll 50% 0 transparent;
35: }
36:
37: #Header
38: {
39: border-bottom: 3px solid #000000;
40: }
41:
42: #ContentWrapper
43: {
44: background: url("https://s3.amazonaws.com/dnncdn/cjh/contentbg_rp.png") repeat-x scroll 0 0 #CCCCCC;
45: }
46:
47: .MenuRootItem.hov
48: {
49: background-color:#06105a;
50: }
51:
52:
53: .Edit #GraphicHeader, .TwoColumn #GraphicHeader
54: {
55: height:130px;
56: max-height:130px;
57: min-height:130px;
58: background-position:0 -70px;
59: }
60:
61: .Edit #GraphicHeader .page_header, .TwoColumn #GraphicHeader .page_header
62: {
63: background-position:50% -70px;
64: }
65:
66: .Edit .HeaderGraphic, .TwoColumn .HeaderGraphic
67: {
68: background:url(https://s3.amazonaws.com/dnncdn/cjh/header_graphic_sm.png) no-repeat;
69: height:106px
70: }
This website runs on the best open source content management system, DotNetNuke, it always runs the latest release.
