This change makes the content-div scroll, but leaves the sidebar and header fixed so that you do not have to scroll up to the top of a long page to search or edit, etc...
This has only been tested in Mozilla and IE.
However, IE will not have a fixed sidebar and header. It will look exactly the same as before.
Also, it only looks good with 1024 X 768 or greater screen resolution, otherwise, the rightsidebar will go off the bottom of the page and you can't get to some links.
Rightsidebar.py
line 110:
u'<div id="allcontent"><!-- start of allcontent div -->\n',
This is right above the self.msg line
line 134:
u'</div><!-- end of allcontent div -->\n',
This is right below the self.endPage line
Screen.css
My screen.css
- Basically, it defines an offset for the allcontent div and then makes the sidebar and titlebar block with fixed attributes.
Issues
I believe I fixed the issues with the content div not going down far enough. The problem was that I did not have the pagetrail enabled when I made the margins. Another issue is that the top margin for the <allcontent> div will be unique to every wiki that has a logo because the logo will push the <header> down farther which will of course make the <allcontent> div look like it disapears into the titlebar. (Increasing the font of course still does not work, see below)
Here is the technical explantion: I make the <header> div "display: block" which takes it out of the normal inline flow when rendered. This makes the <allcontent> div the first true inline div. Therefore, I have to add a top margin to the <allcontent> div to push it below the header. This margin has to be known, since I could not find a way to know how far the titlebar goes down when the page is rendered.
I am trying to convert to em and see if there is a way to find where a div block falls through javascript or something.
This may just have to be a per wiki thing, I am not sure I can standardize it enough to use out of the box.
Also, I still haven't tested it with Safari. (Sorry Nir)
Comments
You don't need to change the html for this. just change the settings of the #header and #sidebar. But note that it will not work in IE when you change the font size. If you want fixed sidebar, forget about IE - its too broken.
The reason I had to change the html was because there is no surrounding div for all content. To do this without the new html, I had to make an offset from the top of the page for any element that fell right below the header/titlebar. This required two changes, an offset on the top for the msg div and an offset on the top for the page div. However, when a msg would be displayed, it would also push the page div further down. Example: if I had an offset of 45 for msg and page so that they would not be under the header/titlebar, then when a msg was displayed, the page div would be another 45 px below the msg, leading to a huge gap. The allcontent div fixed this, I could put the msg and page divs within the allcontent div and then just make the top offset for the allcontent div be what I needed it to be and the message and page divs did not have a huge gap between them. (I hope that made sense). Also, on the IE thing, I tell everyone I know to use Mozilla, so IE support is not on my priority list. I just wanted to make sure it didn't break IE.
Please (if you can) supply a link to your wiki so we can evaluate this solution.
I'll have to set up one, it may be tomorrow before I can get it running.
All 3 themes have fixed titlebars at http://128.164.128.93/wiki
I'm sorry but all 3 themes are totally broken on Safari. In Firefox, when you enlarge the text, part of the title is hidden by the header. You can't use fixed offset of the allcontent div. You can try using relative size like 10em.
That's fine, I will try to get ahold of a Mac so I can test and see what I can do about Safari. I will post here when I attempt a new fix for safari.