You might have noticed a slight redesign of the b2evolution.net site header.

This was long overdue but was only made possible recently after we finally converted 100% of the pages of this site to be served dynamically by b2evolution.

So, now, of course, such a change is trivial as we only have the `site_header` file to modify in order to achieve this. But imagine that before that, the site had grown progressively since 2003 with many pages beeing static Dreamweaver files, others being handled by other software like phpBB (now integrated into b2evolution) and many sub-domains (likes skins, plugins, etc.) being handled by spearate installs of b2evolution, spearately installed and customized by contributors on separate servers. They all had the best intentions at the time but it had turned into a maintenance nightmare.

Now everything is back on one single b2evolution v 5.1.1 install. Maintenance will be easier and evolving the global site design/architecture will be easier too.

5.1.1

Speaking of 5.1.1, it is already available to test in the demo section. (Note: for security reasons, the demo runs on a separate server — sorry if it’s a bit slower soemtimes — but the demo homepage is on the main server).

A new downloadable release of 5.1.1 will be made available before June 15th.

A little bit of CSS

Regarding the recent design changes, you may have noticed the little triangle under the currently active main "tab" (which don’t look, like tabs anymore ;):

In case you’re wondering this is achieved with a little white square that is rotated by 45 degrees in CSS. The square itself is added dynamically by CSS using a :after selector.

The actual CSS code looks like this:

ul.b2evo_main_menu li.current a:after
 {
    content: '';
    display: block;
    position: relative;
    -ms-transform: rotate(45deg); /* IE 9 */
    -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */   
    transform: rotate(45deg);
    left: 46%;
    top: 5px;
    width: 7px;
    height: 7px;
    background-color: #fff;
    border-left: 1px solid #888;
    border-top: 1px solid #888;
}

Changes to come

The header itself will still change some more. This was merely a transitional change. But it already looks more modern, don’t you think? ;)

Another thing we changed: we got rid of the "Extend" tab. Most of its contents have been moved to the "Downloads" tab. The rest has been moved to the "About" tab.

If you haven’t noticed before, you will also find the whole Downloads section has changed a lot.

What do you think should be the next area to get a design change on this site?

CSS Day 2014

If you’d like to meet up, we’ll be at CSS Day 2014 in Amsterdam this Wednesday.