[RFC|Merged] Rounded corners via css

[Arty]

Introduction

Prosilver has rounded corners. It was created when browsers didn't support border-radius, so it was made by images added to corners of container blocks. These days all browsers support border-radius, except for IE 7 and IE 8.

IE7 users base is almost gone, IE8's users base is steadily going down and by the time phpBB 3.1 is released, it will be irrelevant.

Proposal

I suggest to switch from corner images to border-radius.

Pros

• Cleaner HTML code
• Using border-radius for what it is intended to do instead of images

Cons

IE7 and IE8 users will see square blocks.

Patch

Ticket: http://tracker.phpbb.com/browse/PHPBB3-10734
Pull request: https://github.com/phpbb/phpbb3/pull/674

[Ger]

+1. Would be a much better approach to rounded corners.

small hack for IE 7 and IE 8
--//--
For IE 7 and IE 8 if RFC I mentioned above is implemented, corners can be added by altering HTML code via JavaScript. phpBB 3.1 already has jQuery built in, so it will be easy to do:

Code: Select all

$(document).ready(function()
{
    $('.oldie').find('.forabg, .panel, .forumbg, .post').prepend('<span class="corners-top"><span></span></span>').append('<span class="corners-bottom"><span></span></span>');
});

Or something like that.
--//--
Cons
IE7 and IE8 users with JavaScript disabled will not see rounded corners. I doubt there are many such users.

Actually, I suggest a JS solution shouldn't be provided at all. According to the global statcounter IE6,7 and 8 users are rapidly decreasing in number; about 26% in january 2012. Following the current trend, i think that by the tim 3.2 is released (probably not the next year) there will be no more than 5-10% of global useage of those versions (including the expected release of IE10). Most of those users will probably know that their browser is absolete.

Therefore I propose to follow the system of graceful degradation: users with older browsers don't get all the eyecandy they need, in this case the rounded corners. Instead they'll see rectangle corners. It has no affect at the functions or the basic display of the site, so phpBB still supports those browsers. This also prevents clutter of extra JS needed just to support some old-fashioned users that should have updated long ago.

[Arty]

That will be true for 3.2, but I'll try to implement this as soon as possible so it would make it into 3.1. All RFCs are posted in 3.2 because in 3.1 forum users don't have permission to create new threads.

[Ger]

In that case, full support for IE8 is indeed needed.
However, I suggest that at the time 3.1 reaches BETA status, the browser stats will be checked for IE8> and the JS fix will be evaluated. There's no need for indefinite support for all browsers.

[jsebean]

+1

CSS3 FTW!

[Arty]

However, I suggest that at the time 3.1 reaches BETA status, the browser stats will be checked for IE8> and the JS fix will be evaluated. There's no need for indefinite support for all browsers.

Unless 3.1 is delayed by 4-5 years, I don't see this happening. IE7/8 support is a must have for now.

[Vinny]

++1.

The current CSS rounded corners are only for IErggg . Do you plan to use the prefixes for browsers? (-webkit, -moz, -ms, etc...)

[Arty]

Prefixes aren't needed for recent versions of all browsers. The only browser that is still being used that requires prefix is Firefox 3.6, but not many people use it and by time 3.1 will be released it will probably completely disappear.

[nextgen]

+1

[Dragosvr92]

I think your javascript solution is a bit dirty. Theres no need to do that just to support border radius on the dumb IE Browsers.
As an alternative you could use CSS3 PIE to make border radius work in all IE Browsers besides IE9 Which already supports Border radius and some other CSS3 Properties, but its lame anyways compared to newer browsers like FF etc