41
technigrafa
Snow77's fluid CSS theme with fixes

Snow77,

I have been testing out your theme and it is excellent! I have found a few things that was keeping the HTML from validating though. This tag was in there twice, and being an "id" isn't allowed:

<div id="content">


So I changed it to:

<div class="content">


And the container and footer divs weren't closed, so I fixed that. Additionally I added a min-width:620px style on the container so Mozilla won't squish at smaller portal sizes. And also, I changed the way you were importing the stylesheet so that older browsers won't import the CSS, since older browsers don't support CSS well anyway and were displaying a bit weird.

Make sure that is okay and I'm not overlooking anything obvious there.

And now 100% HTML and CSS compliance!

Two further additions I made was replace the static header line under the title with the XOOPS slogan tag and added a replacement template for the Content module, so that it would validate as well.

Just curious, what's the advantage of including the blocks as seperate theme files, rather than including them in the main theme file? I see many people do that, but don't know why.

----------------------------------------------------
Here is Snow's CSS theme with the above mentioned fixes and additions as a zip file:

http://technigrafa.com/DEV/css100v2.zip

-----------------------------------------------------
Snow, I hope you don't mind me reposting your theme - let me know if that's a problem and I'll edit this post.

So, should I also throw in the javascript that sets a min-width in there for IE? It doesn't hurt anything if IE users have javascript turned off - it will just function as it does now - the center blocks squish a little in smaller browser windows, but nothing too bad.



42
technigrafa
Re: Fixed CSS Wireframe Theme

Thanks Snow. I will definitely take a look at your theme.

As for the javascript in my initial post, I agree, I try to not ever use javascript for the reason you mentioned, but fluid layouts will always break in IE if you reduce the browser portal too much and that drives me nuts. If IE supported the min-width CSS tag, everything would be fine. So I was reduced to forcing a min-width with javascript. There is a site that claims to get the same results but without javascript here:
http://www.webreference.com/programming/min-width/

And a similar method here:
http://www.cssplay.co.uk/boxes/width.html

But I couldn't get those to work. Even if users have javascript turned off though, the worst result is their page will squish if they resize the browser too small - which happens in all other CSS based fluid designs I have seen.

As for the javascript error, I am not getting that in IE 6, 5.5 or 5.01. What version are you using? Do you have any more info about that error? Line 34 reads:

pr=parseInt(gs.paddingRight);ml=parseInt(gs.marginLeft);mr=parseInt(gs.marginRight);

Thanks guys!



43
technigrafa
Fixed CSS Wireframe Theme

Okay below is a fixed (760 pixels) wireframe theme based off of the Skidoo Too column CSS layout:
http://webhost.bridgew.edu/etribou/layouts/skidoo_too/index.html

----------------------------------------------------
FIXED 3 COLUMN LAYOUT:

Zipped:
http://technigrafa.com/DEV/fixed.zip

View HTML:
http://technigrafa.com/DEV/fixed/theme.html

View CSS:
http://technigrafa.com/DEV/fixed/style.css

----------------------------------------------------

This incorporates a font resize javascript feature along with some browser detections stuff, source ordering so the middle column appears before the left column in the code, and a top horizontal menu.

NOTE: Does not support layouts with less than 3 columns yet, but the HTML does validate. I have thrown in a few extra templates for the content and system modules as well.



44
technigrafa
Re: Holy Grail CSS Wireframe Theme

Thanks, I am downloading the zeta theme now. I have seen it before and think it looks very impressive, but I haven't studied it yet.

I think XOOPS theme designers can really benefit from a very basic wireframe theme, rather than reworking a complicated theme like zeta that has tons of features, many of which limit browser compatibility. Although I applaud leo for this marvelous theme (and look forward to studying it). It appears to really push the limit of what can be done, and that is a really good thing. XOOPS will really benefit from themes like that. It's just not what I am attempting to do with a wireframe. I really like the idea of reworking many of XOOPS more common blocks, like login, usermenu, mainmenu, etc. and including that in the wireframe as well to improve W3C compliance.

Also, I have updated the files linked in the original post - there were some tags in uppercase that W3C didn't like.



45
technigrafa
Re: Holy Grail CSS Wireframe Theme

Thanks guys,

Yeah, I knew that not using one of the three columns would pose a problem because there is space allocated for each column, but then again, it's designed to be a 3-column layout.

The theme designer can remove a column if they want 2 columns, or use one of the hopefully upcoming 2-column wireframe themes. The other option is to build in extra code into the theme.html file so that if a column is activated, extra CSS is applied, thus overriding the layout stuff in the style.css file. I am not sure if it's worth all the extra code to have a theme that does everything versus having a couple different basic themes to start from.

I checked out alain01's theme linked to above and it appears to be table based, if it is the theme that is active on the site that is linked to there. I am trying to get away from using tables for layout - tables were meant to hold tabular data, not for format. Thanks for the link though. I would love to check out any other pure CSS themes that are out there.



46
technigrafa
Holy Grail CSS Wireframe Theme

Whelp, I didn't see anything like this already in existance, so I am developing a couple wireframe all-CSS XOOPS themes for use as a starting point for theme developers. The goal here is to be 100% W3C compliant, not use tables for layout, stay as flexible as possible, use proven and "expert" recommended browser hack methods if possible, while keeping the code to a minimum. One of the hardest parts of dealing with CSS-based designs is everyone handles the challenge that mult-browser support entails in different ways, and as CSS evolves, it will make things easier on us if we pool our abilities and work together rather than everyone handle problems differently. Hopefully this will make things easier once browsers are updated and new levels of CSS are supported.

Note: This is not a theme to use on sites - it is intended to be used as a starting point for developing new themes.

The first theme is based off of Eric Costello's 3 column "Holy grail" example found here:
http://www.glish.com/css/

This is a 3 column theme with a fluid center column that supports XOOPS new extra blocks. I used the FIELDSET tag for blocks and to overcome IE's lack of min-width support I did use a little bit of javascript provided by www.projectseven.com.

I had to hack the daylights out of Eric's example in order to get the center blocks to work right and ended up having to use a couple floats. I also had to feed non-IE browsers some different code using the #style,[IEwon't readthis] {} hack. But it appears to work well in Firefox and lays out fairly well in IE 5 & 6. It degrades fairly well in older browsers as well although I have yet to do much testing on different platforms, or even validate the HTML yet

Anyway, I know this theme is not "done" yet, so CSS experts and other theme developers, please help me test and refine this theme so future developers can use these as a starting point once we're done.

--------------------------------------------
3 COLUMN HOLY GRAIL WIREFRAME THEME:

Zipped:
http://technigrafa.com/DEV/holygrail.zip

View HTML:
http://technigrafa.com/DEV/holygrail/theme.html

View CSS:
http://technigrafa.com/DEV/holygrail/style.css
--------------------------------------------

A "fixed" centered 3 column layout will be coming next. Hopefully that will not be as hard as this theme was to get to work across different browsers.



47
technigrafa
Re: Freeware CSS editor

Dreamweaver should preview your styles. You may need to manually link your stylesheet to your theme while you work on it, as DW doesn't understand xoops's way of linking to the stylesheet, but you can delete your manual link after you are done developing your theme. That's what I do.



48
technigrafa
Re: newbb recent topics block?

I have a problem with the NewBB Recent Topics block. It won't save the category that I am setting to only show. When I go back tot eh block, "All" is selected again. All the other info, IE - number of posts to show, title, etc are being saved.

Anyone know what's going on?



49
technigrafa
Blocks on Top Page show up on others

I am running XOOPS 2.0.14 and any blocks that I have set to show up only on the "Top Page" are also showing up on any other pages that are in the same module as the top page. Is that how that is supposed to work? I would think those blocks should only appear on the "Top Page." I could always tell it to show up on the Content module pages if I wanted them there

Is there a way to "fix" this?



50
technigrafa
Re: Content module not returning in searches

Thanks so much for helping me diagnose this. Here's the SQL Debug (substituting in DBPREFIX for the DB name) As far as I know this is right-There weren't any PHP debug errors, only notices:
------------------------------------

SELECT storyid, title, homepage, submenu FROM DBPREFIX_content WHERE homepage='0' AND submenu='1'

SELECT storyid, title, text FROM DBPREFIX_content WHERE visible='1' AND ((text LIKE '%committed%' OR title LIKE '%committed%')) ORDER BY storyid ASC LIMIT 0, 5




TopTop
« 1 2 3 4 (5) 6 7 8 ... 13 »



Login

Who's Online

180 user(s) are online (119 user(s) are browsing Support Forums)


Members: 0


Guests: 180


more...

Donat-O-Meter

Stats
Goal: $100.00
Due Date: Apr 30
Gross Amount: $0.00
Net Balance: $0.00
Left to go: $100.00
Make donations with PayPal!

Latest GitHub Commits