Promote these forums, share your ideas.

[zcorpan]

Seems like the 'QUOTE' button and others are using images when they would probably be better off using real text (even the 'online' thingy could be real text with a CSS transform if you'd be so inclined)

[Xdega]

Feel free (although I wouldn't bother - aren't there a lot of images to convert?) Will you push the changes upstream so whoever maintains the theme can use the SVGs in upcoming releases if any?

There's an SVG version of the WHATWG logo here btw http://lists.w3.org/Archives/Public/www ... /0042.html

Imageset's for each theme are separate from all the styling. It would most likely require a bunch of modification to the phpbb source to allow SVG graphics to be entered in place of .gif etc. I believe in future releases of PHPBB (along with "HTML5" syntax), they plan to use CSS3 and SVG also.

phpbb is a beautiful piece of open source software, but they do not operate on time frames or release dates. Definitely something to investigate, maybe not change right now, but at least investigate.

[Amtiskaw]

Awesome! This theme is a major improvement!

I do some graphic design and HTML/CSS as part of my job, so if I get a chance this weekend I may have a go at posting some ideas for tweaks.

Oh, and I had an idea just while writing this post: There's some fairly generic smilies available, but what about some web specific ones? In particular I was thinking of one for each of the major web browsers. So :firefox: would show a mini Firefox logo, etc. Could be useful, and fun as well!

[Xdega]

So :firefox: would show a mini Firefox logo, etc. Could be useful, and fun as well!

Good Idea, I will see what I can find. Maybe even a html5 logo too? lol.
I will go ahead and forum pm you the .css for this theme if you want to play around with it.

[Xdega]

ok, I went ahead and added some nice custom smileys. I tried to pick the most relevant ones I could. If there are any other smilies that you think could be added (or ommited), let me know.

Here is the list of new additions

EDIT
Let's not forget the WHATWG logo! (almost forgot)

Code: Select all

:whatwg:

Google Chrome logo.

Code: Select all

:chr:

Mozilla Firefox logo.

Code: Select all

:firefox:

Opera logo.

Code: Select all

:opera:

Safari logo.

Code: Select all

:safari:

Interned Explorer logo.

Code: Select all

:msie:

HTML5 logo.

Code: Select all

:html5:

CSS3 logo.

Code: Select all

:css3:

RSS logo. (threw that one in there for potential functional use, such as linking an rss feed)

Code: Select all

:rss:

[zcorpan]

Awesome! Although the Opera icon is the old one lol. And I guess IE and chrome have newer icons too.

[JAB Creations]

Heh nice icons, though like Z said some are old like and .

[Xdega]

Heh nice icons, though like Z said some are old like and .

I'll look at finding some newer ones later. I was searching for ones that were already sized accordingly such as favicons ect (painstakingly I might add), but then found that resizing original logos myself isn't exactly hard

[Amtiskaw]

Glad you liked my idea for the browser smilies. However, I am something of a perfectionist when it comes to graphics (just ask my co-workers and it's immediately obvious to me that those smilies are saved in JPG format. JPG is a lossy format, intended for photos, and when you save little things like icons, you tend to get compression artefacts that results in a slightly fuzzy, dirty look. Also, JPG does not support transparency, so you get white rectangles around them when shown on a non-white background, such as in a quote:

Instead, you should use PNG format for these kind of images. I've created 16x16 pixel PNG alternatives for each of the smileys you created:



You can download a zip containing all of them from my webspace here: http://www.brillskills.com/whatwg/smilies-all.zip

I also had a go at creating a more professional forum logo, take a look: http://www.brillskills.com/whatwg/forum-logo-in-situ.png

It's just a first attempt, so I'm happy for any feedback or suggested changes. If you like it, you can download the logo image itself as a 32bit PNG here: http://www.brillskills.com/whatwg/forum-logo.png

[Xdega]

Glad you liked my idea for the browser smilies. However, I am something of a perfectionist when it comes to graphics (just ask my co-workers and it's immediately obvious to me that those smilies are saved in JPG format. JPG is a lossy format, intended for photos, and when you save little things like icons, you tend to get compression artefacts that results in a slightly fuzzy, dirty look. Also, JPG does not support transparency, so you get white rectangles around them when shown on a non-white background, such as in a quote:

Instead, you should use PNG format for these kind of images. I've created 16x16 pixel PNG alternatives for each of the smileys you created:



You can download a zip containing all of them from my webspace here: http://www.brillskills.com/whatwg/smilies-all.zip

I also had a go at creating a more professional forum logo, take a look: http://www.brillskills.com/whatwg/forum-logo-in-situ.png

It's just a first attempt, so I'm happy for any feedback or suggested changes. If you like it, you can download the logo image itself as a 32bit PNG here: http://www.brillskills.com/whatwg/forum-logo.png

Them graphics look pretty nice, and I will most certainly go ahead and use them. One thing to note though (and this could just be a browser issue),but on my cell phone the graphics have very jagged edges (it uses the Verizon wap browser). It's nothing huge but something to note, I wasn't able to see the graphics in their glory until I hopped on my desktop.

[Xdega]

There we go. Smilies fixed. Thank you much for that. Now I just need to edit the css to show the full "logo".

edit: Having trouble fixing the logo. The css seems fragmented all over the place between .cfg files and .php files. I will keep working on finding the right file to edit.

[Amtiskaw]

Thanks Xdega! I imagine the jaggy edges is due to older browsers not fully supporting alpha channel PNGs. It's a pain, but I think it's worth it to have them look best on modern browsers (and after all, the WHATWG is all about modern browsers, right? ).

I need to have a proper look through the CSS, but for now to fix the logo you'll need to change lines 3811 to 3817 in the main style sheet as follows:

Code: Select all

#logo {
    padding: 0;
    width: 378px;
    height: 66px;
    margin-top: 22px;
}


[Xdega]

I need to have a proper look through the CSS, but for now to fix the logo you'll need to change lines 3811 to 3817 in the main style sheet as follows:

Code: Select all

#logo {
    padding: 0;
    width: 378px;
    height: 66px;
    margin-top: 22px;
}


Yeah, I was using the inspect element toll with Chrome and found this. The problem is locating that CSS file. It is defined inside a style.php file which I am not fully understanding. Anyways I will keep looking.

[Xdega]

Found it!. Turns out there are two #logo in the modestus .css rather annoying and confusing.

[JAB Creations]

WHAT...logo? It's a little cropped.