forum.coppermine-gallery.net

Support => cpg1.4 themes/skins/templates => cpg1.4.x Support => Older/other versions => cpg1.4 theme contributions => Topic started by: adamish on March 17, 2005, 10:52:23 pm

Title: Tableless CSS theme 'badger' available
Post by: adamish on March 17, 2005, 10:52:23 pm
Hi. i've hacked together a tableless CSS XHTML theme.....

This was designed alongside the CVS 1.4 version of coppermine.

To view
http://www.badgerphotos.com/

To download
http://www.ghostofashark.co.uk/badger/themes/badger.tar.gz

i wanted to post this in mods->themes but no option to post there ....

Adam.

[edit GauGau]
Warning: this theme was made for an early alpha version of the cpg1.4.x theming engine, it won't work with the stable release without modifications, see my reply on page 2 of this thread. (http://forum.coppermine-gallery.net/index.php?topic=15979.msg110940#msg110940)
[/edit]
Title: Re: Tableless CSS theme available
Post by: jpaffett on March 18, 2005, 03:21:55 pm
Looks interesting. I'll have to delve more into it.

Jeff
Title: Re: Tableless CSS theme available
Post by: Tarique Sani on March 18, 2005, 03:29:24 pm
Wish there was a way to sort out the issue of  uneven thumbnail height due to long description - that inturn leading to problem of improper flow....  We too had run into this problem but gave up as we seriously lack CSS talent. Can it be done with nested hidden div which becomes visible when you take mouse over the thumbnail?

Good effort I would say
Title: Re: Tableless CSS theme available
Post by: Joachim Müller on March 19, 2005, 08:48:45 am
hm, is this meant as "proof-of-concept" or for real use? This is what I get with the badger theme in IE6SP1 and Firefox1.0.1:
Title: Re: Tableless CSS theme available
Post by: Rodinou on March 19, 2005, 11:35:28 am
Bad css because using "Position : Absolute" ... only floats are necessary.

When the Core will be separated, it would be easier to dev tableless.

http://www.sortons.net/photos/ > 90% tableless ....

For long description, the only way is
- overflow hidden, but the description is cropped
- overflow auto, to scroll the description.

But for "only" description, it would be sad to not transform Coppermine in tableless ...
- some forums become tableless (PunBB (http://www.punbb.org) for example)
- some blogs are tableless (WordPress for example)

My Coppermine is 90% tableless, and I gain about 30 > 45% of generated code ... my server says "thanx Rod".

:)

But Adamish : NEVER USE absolute position to create a fluid layout.
Title: Re: Tableless CSS theme available
Post by: jpaffett on March 19, 2005, 12:21:01 pm
Hi Rodinou,

Is it possible to get a copy of your theme?

Jeff
Title: Re: Tableless CSS theme available
Post by: Rodinou on March 19, 2005, 12:29:21 pm
Sure. But warning : to get this, I have modified theme.php too ... and it's buggy on some pages (but I dropped it because core code is quite ... waouh)

:)
Title: Re: Tableless CSS theme available
Post by: adamish_ on March 20, 2005, 01:35:10 am
Greetings,

Was meant to be of real use! But i've only implemented the bits i wanted to use, to not complete (yet).
Agreed, the previous screenshots from gaugau don't make a good advert for my theme.
(Possibly using different versions of coppermine? Are you using my template.html, theme.php as well as style.css? )
Could you attach source so i can see what is going wrong ?
 i've attached what i see on my screen using firefox 1, similar results in IE 6. Also my site is functional and looks okay on my sony ericcson k700 mobile phone.

Rodinou: 90% tableless, 10% not good enough :)
Cheers for the tip on overflow. i figured it myself the other day, but took a while. i realised the only way to fix the flow was to fix height for each div.thumbnail block, but that gave overflow problems. personally, i think scrollbars are prob easiest.

acknowledged....i will try to banish those position : absolutes....


Title: Re: Tableless CSS theme available
Post by: jpaffett on March 20, 2005, 06:58:21 am
Hi Rodinou,

Could you attach a zip file of your theme please?

Merci

Jeff
Title: Re: Tableless CSS theme available
Post by: Joachim Müller on March 20, 2005, 12:44:33 pm
Was meant to be of real use! But i've only implemented the bits i wanted to use, to not complete (yet).
Agreed, the previous screenshots from gaugau don't make a good advert for my theme.
(Possibly using different versions of coppermine? Are you using my template.html, theme.php as well as style.css? )
Could you attach source so i can see what is going wrong ?
 i've attached what i see on my screen using firefox 1, similar results in IE 6. Also my site is functional and looks okay on my sony ericcson k700 mobile phone.
I used all of the files you attached into your archive for the theme "badger" and didn't modfy any of them. I used the most recent cpg1.4.x core files using yesterday's checkout. Not sure what causes the theme to crash for me, while it appears to work for you - try bug-hunting by enabling all possible display details in coppermine's config, with long descriptions for everything like albums, cats etc. (I do that deliberately to stress-test all themes). Can't give you a link to my test-server though (sorry), maybe someone else is ready to post a link to his/her test server with badger as a theme.
I didn't mean to discourage you, I was just suggesting that there's work to do before you can release it as stable.
Regarding the "overflow", I suggest you rather crop surplus content.

Joachim

P.S. changed subject of this thread from "Tableless CSS theme available" to "Tableless CSS theme 'badger' available"
P.P.S. I don't think tables are that bad for everything: current browsers aren't ready yet for completely tableless themes imo... ;)
Title: Re: Tableless CSS theme 'badger' available
Post by: Rodinou on March 22, 2005, 01:10:25 am
Quote
P.S. changed subject of this thread from "Tableless CSS theme available" to "Tableless CSS theme 'badger' available"
P.P.S. I don't think tables are that bad for everything: current browsers aren't ready yet for completely tableless themes imo...

Tables are necessary only for tabular datas ... the only we see on CPG is on index.php and eventually in a category containing several categories ...

code in css/xhtml is light !!! very customizable (only play with display, float, and you change all a layout !!!), fluid (only % or fixed width to change the area content ...)

I'm ok to post my files : but only if someone wants to help me to do a 100% tableless theme :)

I'm afraid of the core code and these a lot of       <<< EOT            EOT >>> ... waouh.

I have some bugs in Firefox, but it's my fault, and I know how to repair them (quite easy)

We see with nol33t (he's gone for a while) to create a "plugin" Coppermine : 100% dhtml and 100% tableless, just upload in CPG root and you'll have another way to browse your pics. Soon.
Title: Re: Tableless CSS theme 'badger' available
Post by: Joachim Müller on March 23, 2005, 06:01:45 am
you can see the theme on my test site: http://www.gaugau.de/cpg14/index.php?theme=badger

Joachim
Title: Re: Tableless CSS theme 'badger' available
Post by: Rodinou on March 23, 2005, 10:35:31 am
quite bad, indeed ...

The css is not valid, and the "thumb" area is too large : perfect when you have only 5 or 6 thumbs, but 20 ...
Title: Re: Tableless CSS theme 'badger' available
Post by: adamish_ on April 01, 2005, 01:40:57 am
quite bad, indeed ...

The css is not valid, and the "thumb" area is too large : perfect when you have only 5 or 6 thumbs, but 20 ...

Sorry! i didn't have any categories set up, so didn't realise that my theme.php was generating bad code (this causes the broken overlapping text affect see in GauGau's test site).  I've fixed some stuff, but haven't got much free time at the moment.

Not sure how to get by without display : absolute, any ideas ?

Adam.
Title: Re: Tableless CSS theme 'badger' available
Post by: Rodinou on April 01, 2005, 02:58:23 am
no ... if you want to create 2 columns ...

#left

#content



#left {
 display : block;
 float : left;
 margin-right : 5px;
 width : 150px;
}

#content {
 display : block;
 float : right;
}


<div id="left">
your menu here
</div>

<div id="content">
CPG content here
</div>

Simply this to create 2 columns ... you can use absolute positions, of course, but it's very less flexible and fluid.
Title: Re: Tableless CSS theme 'badger' available
Post by: adamish_ on April 08, 2005, 06:52:29 am
Thank you Rodinou!!

I've removed all display-absolutes from my style.css.

I have also fixed a bunch of stuff and made categories work properly.

Thanks to whoever said recommended turning all display options on for stress test, it threw up a ton of things i hadn't noticed before.

Please can my work be re-evaluated (ripped apart  :))

Same places....

www.badgerphotos.com

www.badgerphotos.com/themes/badger.tar.gz

Adam.x
Title: Re: Tableless CSS theme 'badger' available
Post by: Joachim Müller on April 08, 2005, 09:21:51 am
OK, this looks much better - view it live here (http://coppermine-gallery.net/demo/cpg14x/index.php?theme=badger).
There are some issues with it however:

Joachim

[ot]
@Adam: why didn't you log in as adamish and registered a new account named adamish_ instead?
[/ot]
Title: Re: Tableless CSS theme 'badger' available
Post by: Xamataca on April 08, 2005, 12:47:36 pm
Hello, tho I'm not yet installed coppermine (i'm just looking for a good gallery system script that is full css+xhtml fully compliant, or at least highly/easily modifiable to make it close to) I came here thanks to a google search "coppermine+tableless" after having a look at "theme.php" code, from the classic theme, that almost made me faint  :P

Well, the question is that I know how difficult can be to build a "tableless" layout (eh, think about a tableless site, forum too :P ), so now that I'm looking at _adamish_ theme.php file I wonder, just for curiosity's sake, why aren't you using unordered list or definition list for the menus? almost the thumbnail part of the template could be done with <dd> too ( having that huge amount of <div> tags around don't make's the code tiddy, nor semantically compliant at all  ;) )

Please, don't take it as a critic, just curiosity, I appreciate your effort and I'm trying to achieve the same objective (in fact I'm waiting for the success of your attempts :) , that will give me an insight in how to make it fully standards compliant and semantically correct)

Greets
Xamataca
P.d (excuse my english)

Title: Re: Tableless CSS theme 'badger' available
Post by: adamish_ on April 09, 2005, 03:54:51 pm
There are some issues with it however:

Accepted, i'll look into them probably tomorrow. Once i've ironed out all the content (theme.php related) issues, i'll get onto the style.css and make it look pretty :)

[ot]
@Adam: why didn't you log in as adamish and registered a new account named adamish_ instead?
[/ot]

i stupidly  managed to forget the password of original account, and you can't retrieve passwords at moment because of the sourceforge.net outgoing email problem. Didn't think anybody would notice the underscore :)

Adam.
Title: Re: Tableless CSS theme 'badger' available
Post by: adamish_ on April 09, 2005, 04:09:09 pm
why aren't you using unordered list or definition list for the menus?

Yes would be better, a small change, and what i do on my personal site already.
 i've been focusing my attention on bigger issues (restructure, removing spacer gifs, inline styling etc).

Never thought of using DD/DT tags for thumbnails, will look into it. i always thought of them for definitions at the end of technical documents etc.
But thumbnails are just a definition (picture + title) and a description (caption, details)

( having that huge amount of <div> tags around don't make's the code tiddy, nor semantically compliant at all  ;) )

True, but i have classed them in fairly sensible way.

Thanks for the ideas, watch this space...

Adam.x
Title: Re: Tableless CSS theme 'badger' available
Post by: Xamataca on April 14, 2005, 09:11:51 am
Never thought of using DD/DT tags for thumbnails, will look into it. i always thought of them for definitions at the end of technical documents etc.
But thumbnails are just a definition (picture + title) and a description (caption, details)
This is an interesting article that worths a read... look specially at the photo gallery example  ;)
http://www.maxdesign.com.au/presentation/definition/
Title: Re: Tableless CSS theme 'badger' available
Post by: brunolesartiste on April 26, 2005, 05:02:16 pm
I'm confused? I've heard folks on this forum say things like "current browsers aren't ready yet for completely tableless themes" and other things along those lines. Where have they been for the last five years? ESPN, Wired, Inc. Magazine and on and on!  I've built tableless sites since 2000 and have been developing them for commercial use since 2002.

I'm working on a 100% tableless, CSS-P and XHTML complaint theme.To avoid any repetitive mistakes or problems with CPG I'd love to swap info with someone who is also experienced with CSS-P designs.
For an XHTML complaint CSS-P gallery theme do I need to be using CPG 1,4x? Or, will CPG 1.3x work fine?
Will I have to modify displayimage.php to get 100% CSS-P?
What is the relationship between displayimage.php and theme.php?

Thanks for all your help - and thank you to the CPG dev team for all your hard work!
Best regards,
Bruno
Title: Re: Tableless CSS theme 'badger' available
Post by: Tarique Sani on April 27, 2005, 06:50:11 am
Most ideal would be cpg NG that is Coppermine Next Generation but it will take atleast a couple of months even for the first beta to make its appearence, so for now I would suggest go with 1.4.x
Title: Re: Tableless CSS theme 'badger' available
Post by: Joachim Müller on November 26, 2005, 12:14:30 pm
bumping this thread to the top with a task that is open: badger was created while cpg1.4.x was still in beta stage. During development of cpg1.4.x, the theming has changed quite a bit. As a result, the badger theme is missing some mandatory stuff. So if someone would like to go ahead and try making what's available so far work with the actual cpg1.4.x release: your contribution would be welcome.

Joachim