Frank H wrote:

There's also another way to do it if one has alot of different styles, and that the logo breaks the pages

I added it in the css instead ... as I had a large logo (~900 wide)... and that got painted ugly on the narrow styles ...

This is what I added on one of my style:

/****************************************************************/
/* 2.1 Frank H mods ;) */
/****************************************************************/
#brdtitle p{
  background: url("../img/racing_ath_cx/logo_sunset.png");
  background-repeat: no-repeat;
  background-position: center;
  height: 129px
}
#brdtitle span, #brdtitle h1{
  display: none;
  visibility: hidden
}

I have only tested it on my Firefox 1.0.4 and IE 6 (I suspect IE5.5 might do things differently roll big_smile)

It hides the Text, and only display an image ... you might want to add width aswell on the p block ... but my width was controlled from the 'wrapper' ... so I didn't need it ... (I added this css below the "TEXT SETTINGS" block in the css file)

(I'll prolly 'remake' the logo (remove logo text) and release it later sometime wink)

While that solution certainly works, it may not be the best way of doing things if a lot of the visitors are using IE. The problem is that IE doesn't cache background images, so it will download the image each time you view a page.

While that usually isn't a problem, it can be if the images are large enough..

Connorhd wrote:

it probably won't afaik theres no plans to add pseudo class support to all tags, they are just fixing a few of the most annoying bugs + png support + tabs so far i think

anyway you can't really not support IE6 until IE8 is out wink

Well, I guess proper PNG support is a start. I'm rather sick of the outdated gif format wink If only the majority of users would switch to a good browser, then perhaps they (MS) would start to really improve their outdated pos product..

Connorhd wrote:

bah i give up tongue (but i don't give in my way is still better wink)

Hehe wink

I guess it doesn't really matter what method one prefers to use, as long as it does what you want.. Let's just hope that IE7 will be a better, so that none of the methods will be needed smile

I didn't encounter any problems with it. I didn't submit the post, but the preview worked just fine (previewing also checks the tags).

Connorhd wrote:

whats the disadvantage of my way? or the advantage of your way?

For the use I had in mind, none of the tricks have any real advantages compared to each other (aside from one of them being a hack, which I don't really like) as far as I'm conserned...but of course, it you were to apply hover effects to a lot of different elements, the HTC method would possibly be a bit easier to implement (less code).

That said, I don't like to use hacks for only specific browsers. In this case, the HTC will most likely work just fine with IE7, but by using the little javascript instead, I know for sure that everything will work no matter what browser upgrades you do smile

Connorhd wrote:

it will if you do the little fix i said wink

pfft, you're not going to convince me to like it tongue wink

Gizzmo wrote:

you can you do the same thing with css, its very versatile. this works the same

tr:hover td.tcl,tr:hover td.tc2,tr:hover td.tc3,tr:hover td.tcr{background-color: #DEDFDF}

Yes you can, but that won't work in Internet Explorer...at all.

Connorhd wrote:

its probably less overkill though, since the htc is only loaded once, and only on IE whereas your js is on every tr on every browser

Perhaps... but in any case, it's not like the tiny JS would slow things down.

The thing I don't like about that method you linked to is, what happens when a new version of IE is released? How do I know that the htc would break anything?

erissiva wrote:

Beautiful!
Was wondering when something like this would come out for punBB.

The only way this would be complete is if you could click on the 'hover-state' background and be taken to the correct place, as if the entire cell was a link.

That's actually simple to add. Here's a new version of the mod with linking table cells like you wanted smile

##
##
##        Mod title:  TR hover effect with "linking table cells!"
##
##      Mod version:  1.0.1
##   Works on PunBB:  1.2.x
##     Release date:  2005-06-05
##           Author:  CodeXP (codexp@tasarinan.com)
##
##      Description:  Add a hover effect to the forum and topic list (changes the background).
##
##   Affected files:  index.php
##                    header.php
##                    viewforum.php
##
##       Affects DB:  No
##
##            Notes:  With a fully CSS2 compatible browser, you could just have
##                    used "tr:hover { background-color: <whatever> }" but that
##                    effect will not work in Internet Explorer.
##                    This simple hack will add the same effect, just using
##                    Javascript instead.
##                    The hack will look for a .php file in your template folder,
##                    prefixed with your CSS of choice (will only add the hover
##                    effect if the file exist.
##                    If you want the effect added for the Oxygen style, create
##                    and upload a .php file named 'Oxygen_hcolor.php' to your
##                    'include/template/' folder. 
##                    If you want to add the effect to the Mercury style, just
##                    name the .php file 'Mercury_hcolor.php'
##                    The same naming scheme applies to any style.
##                    See included example file for more details.
##                    
##                    This updated version also makes the table cells act as links!
##
##       DISCLAIMER:  Please note that "mods" are not officially supported by
##                    PunBB. Installation of this modification is done at your
##                    own risk. Backup your forum database and any and all
##                    applicable files before proceeding.
##
##


#
#---------[ 1. UPLOAD ]-------------------------------------------------------
#

Oxygen_hcolor.php to include/template/


#
#---------[ 2. OPEN ]---------------------------------------------------------
#

header.php

#
#---------[ 3. FIND (line: 37) ]---------------------------------------------
#

// Load the template

#
#---------[ 4. BEFORE, ADD ]-------------------------------------------------
#

// TR hover hack 
if (file_exists(PUN_ROOT.'include/template/'.$pun_user['style'].'_hcolor.php'))
        @include (PUN_ROOT.'include/template/'.$pun_user['style'].'_hcolor.php');
    else
        $hcolor = '';
// End TR hover hack


#
#---------[ 5. OPEN ]---------------------------------------------------------
#

index.php

#
#---------[ 6. FIND (line: 127) ]---------------------------------------------
#

                 <tr<?php if ($item_status != '') echo ' class="'.$item_status.'"'; ?>>

#
#---------[ 7. REPLACE WITH ]-------------------------------------------------
#

                 <tr<?php if ($item_status != '') echo ' class="'.$item_status.'"'; ?> onmouseover="this.style.backgroundColor='<?php echo $hcolor; ?>'" onmouseout="this.style.backgroundColor=''" onclick="window.location.href='viewforum.php?id=<?php echo $cur_forum['fid']; ?>'">

#
#---------[ 8. OPEN ]---------------------------------------------------------
#

viewforum.php


#
#---------[ 9. FIND (line: 208) ]---------------------------------------------
#

                <tr<?php if ($item_status != '') echo ' class="'.trim($item_status).'"'; ?>>


#
#---------[ 10. REPLACE WITH ]---------------------------------------------------
#

                <tr<?php if ($item_status != '') echo ' class="'.trim($item_status).'"'; ?> onmouseover="this.style.backgroundColor='<?php echo $hcolor; ?>'" onmouseout="this.style.backgroundColor=''" onclick="window.location.href='viewtopic.php?id=<?php echo $cur_topic['id']; ?>'">

#
#---------[ 11. SAVE/UPLOAD ]-------------------------------------------------
#

Enjoy!

Connorhd wrote:

perhaps a neater fix would be http://www.vladdy.net/Demos/IEPseudoClassesFix.html that way the colour could be kept in the stylesheets?

True, but I never really liked that method.. besides, it's a little "overkill" to do that, when all I wanted was a hover effect for the table rows smile

Frank H wrote:

(I know ... but I'm adding it as a feature request due to it's something I find a tiny bit unlogical to only have on index.php and not in forumview and such, I userstand it's away in profile, admin etc.   .... but thanks anyway smile)

That's true. It would be nice if it was added by default smile

Frank H wrote:

Well ... I wouldn't mind seeing more pages to have the "Mark all as read" links up in the top right on more pages than just index.php ... as those having only one forum (public), will require people to go down to index.php to mark all threads as read ...

*  Show new posts since last visit
    * Mark all topics as read

IMHO it wouldn't hurt if also viewforum and viewtopic had them ...

That's actually very easy to fix smile

What you do, is open up header.php.

Around line 174, find:

    if (in_array(basename($_SERVER['PHP_SELF']), array('index.php', 'search.php')))

Replace with:

    if (in_array(basename($_SERVER['PHP_SELF']), array('index.php', 'search.php', 'viewforum.php', 'viewtopic.php')))

(Just add more .php files to the array if needed)

Hope this helps smile

##
##
##        Mod title:  TR hover effect
##
##      Mod version:  1.0
##   Works on PunBB:  1.2.x
##     Release date:  2005-06-05
##           Author:  CodeXP (codexp@tasarinan.com)
##
##      Description:  Add a hover effect to the forum and topic list (changes the background).
##
##   Affected files:  index.php
##                    header.php
##                    viewforum.php
##
##       Affects DB:  No
##
##            Notes:  With a fully CSS2 compatible browser, you could just have
##                    used "tr:hover { background-color: <whatever> }" but that
##                    effect will not work in Internet Explorer.
##                    This simple hack will add the same effect, just using
##                    Javascript instead.
##                    The hack will look for a .php file in your template folder,
##                    prefixed with your CSS of choice (will only add the hover
##                    effect if the file exist.
##                    If you want the effect added for the Oxygen style, create
##                    and upload a .php file named 'Oxygen_hcolor.php' to your
##                    'include/template/' folder. 
##                    If you want to add the effect to the Mercury style, just
##                    name the .php file 'Mercury_hcolor.php'
##                    The same naming scheme applies to any style.
##                    See included example file for more details.
##
##       DISCLAIMER:  Please note that "mods" are not officially supported by
##                    PunBB. Installation of this modification is done at your
##                    own risk. Backup your forum database and any and all
##                    applicable files before proceeding.
##
##


#
#---------[ 1. UPLOAD ]-------------------------------------------------------
#

Oxygen_hcolor.php to include/template/


#
#---------[ 2. OPEN ]---------------------------------------------------------
#

header.php

#
#---------[ 3. FIND (line: 37) ]---------------------------------------------
#

// Load the template

#
#---------[ 4. BEFORE, ADD ]-------------------------------------------------
#

// TR hover hack 
if (file_exists(PUN_ROOT.'include/template/'.$pun_user['style'].'_hcolor.php'))
        @include (PUN_ROOT.'include/template/'.$pun_user['style'].'_hcolor.php');
    else
        $hcolor = '';
// End TR hover hack


#
#---------[ 5. OPEN ]---------------------------------------------------------
#

index.php

#
#---------[ 6. FIND (line: 127) ]---------------------------------------------
#

                 <tr<?php if ($item_status != '') echo ' class="'.$item_status.'"'; ?>>

#
#---------[ 7. REPLACE WITH ]-------------------------------------------------
#

                 <tr<?php if ($item_status != '') echo ' class="'.$item_status.'"'; ?> onmouseover="this.style.backgroundColor='<?php echo $hcolor; ?>'" onmouseout="this.style.backgroundColor=''">

#
#---------[ 8. OPEN ]---------------------------------------------------------
#

viewforum.php


#
#---------[ 9. FIND (line: 208) ]---------------------------------------------
#

                <tr<?php if ($item_status != '') echo ' class="'.trim($item_status).'"'; ?>>


#
#---------[ 10. REPLACE WITH ]---------------------------------------------------
#

                <tr<?php if ($item_status != '') echo ' class="'.trim($item_status).'"'; ?> onmouseover="this.style.backgroundColor='<?php echo $hcolor; ?>'" onmouseout="this.style.backgroundColor=''">

#
#---------[ 11. SAVE/UPLOAD ]-------------------------------------------------
#

This is just a simple hack I needed for a style I'm working on. Just thought that perhaps someone else would like it to smile I first thought of hard-coding the effect into the regular php files, but that kinda messed things up with my other styles. The solution? This little hack.

[DEMO]

[Download]

414

(21 replies, posted in PunBB 1.2 show off)

faax wrote:

it's edited now is

Bazirano na PunBB forumu © Rickard Andersson
Maglaj.Net – forum

It's ok?

Much better smile

Dr.Jeckyl wrote:
CodeXP wrote:

Worked around it now however...

seems to be the trademark quote for IE. big_smile

Hehe, yeah... I've encountered my fair share of IE quirks in the short time I've been into web design. I'm just hoping for improvement in the next release, though I'm not expecting much really.

Don't know if anyone ever tested the page in IE6, but I've just had to fix a "minor" annoyance. Apparenly, Internet Explorer have some quirks when it comes to absolute positioning and z-indexing of DIV's. That damn browser actually made it impossible to select text on the pages correctly.
Worked around it now however, and I've also applied some other minor tweaks smile

417

(9 replies, posted in General discussion)

If you're going for a fixed-size design, you should keep the width at around 750px. That way, it'll look good on any monitor using 800x600 and above.

Looks good, but you may want to consider making it validate. Using the W3C validator, it reports 72 errors on your demo page.
Most of them are so simple to fix that I don't see any reason not to smile

419

(7 replies, posted in PunBB 1.2 discussion)

The converter works very well with phpBB, but you should be aware that in certain cases you may have problems with certain passwords. I encountered a problem after converting one of my databases and selecting the user I wanted as admin. I just couldn't log in again. What you should do is simply add a temporarly user with a very simple password, select this user as admin in addition to your primary account. This way, if one of the users is unable to log in after the conversion, the other temp one will almost certainly work. Just use this user to change the password of your primary admin account and delete the temp account smile

420

(1 replies, posted in PunBB 1.2 show off)

Looks good  smile

A few things though:
- You need to tweak the footer on your font page. The text overlaps parts of the border.
- Not that you really need to, but you should consider styling the post-view part. It would have been nice if it was done in the same style as the rest of the theme.
- I'm not a big fan of the bright yellow post indicators. Perhaps use a softer color?

Also, I do think the forum would look better without the dlngle.com logo at the top of the page. It would look a little more "clean" that way... Though, that's probably just me wink

421

(5 replies, posted in PunBB 1.2 troubleshooting)

darren131 wrote:

nope.  I updated to 1.2.5; did the two fixes; and removed all but the oxygen.css file from the style folder as I dont want users to be able to change thier own style

In that case, you're using some outdated CSS files. I forced your site to use the default PunBB Oxygen style, and sure enough; the post icons came back.

Re-upload the css files from the 1.2.5 package, and the problem should be solved.

422

(5 replies, posted in PunBB 1.2 troubleshooting)

Have you changed anything in the .CSS files?

Gary13579 wrote:

It looks great, like everything I have seen you do smile

There is one problem that I have with it. I see a little Red and White box in the top right hand corner.. I can barely make out the words.... "Oper.."
Oh no!
*closes the window*

Really, it looks great smile

Thanks! smile It been a while since my last PunBB style project now, I haven't really had the time again until recently. This theme (both the WP & PunBB one) was made yesterday evening.. All in all I think I'm satisfied with the result so far. The only problem is that when it's done, I'll most likely feel the need to start on a new one as well big_smile

I have a couple of older PunBB themes I stopped working on due to time restraints, so perhaps I should just finish them and get them released...

Ok, I just fixed the problem with the h-scrollbar in FF smile Seems like it didn't like the padding I had added...

Paul wrote:

Looking good.
The undefined variable error is still there.
In IE6 the side menu is narrower on the forum index page than the other forum pages.
You have a horizontal scrollbar in Firefox.

1. Try clearing your cache. I've disabled the error reporting for that PHP include, so no matter how many errors it should generate, none of them should be displayed. There shouldn't be an error though, and the page wouldn't validate if the error message occured, something it does.
2. Strange.. I've tested in both IE6, Opera 7-8 & Firefox and the sidebar is on the pixel exactly the same size (I've actually taken screens and measured in PS wink). Perhaps it only seems that way because of the different lengths.
3. I'm working on that. I have no idea why, because there's nothing that should be able to cause that problem. It does have something to do with the horizontal "bar" I have on the page, because if I shorten it down from 100% to let's say 90%, the problem goes away. I'm starting to suspect a bug in FF relating to absolute positioning, but most likely it's just an error from my side..

Thanks for the feedback! smile