Spent A Little Bit Of Time Flattening Blesta.

[cypgrumpy]

I decided to give blesta a try.  I like it, and have flattened it's UI a bit.  It was about 40 minutes of work (took me forever to get the buttons to work) to get the theme done.

 

http://billing.ssdpowered.com

 

user: 1234

pass: 123456

 

Of course, there's still a lot more that I could do, but I think this is pretty good for the amount of time it took.

 

Let me know what you think.

[Michael]

Looks nice a few mistakes need correcting if possible, the login button and change on chrome mate.

[cypgrumpy]

I'm not sure why the login button is such a spastic, I've been trying to fix that.

[flangefrog]

The button is moving on hover because of the margin being applied

.btn:hover {
display: inline;
margin: 13px 8px;
font-weight: normal;
text-align: center;
text-color: #FFF;
vertical-align: middle;
background-color: #1875D4;
height: 25px;
width: 200px;
cursor: pointer;
padding: 6px;
white-space: nowrap;
font-size: 10px;
line-height: 20px;
border-radius: 2px;
}

You might want to adjust the below CSS

.button_row .right_btn {
margin: 0 16px 0 0;
}

To

.button_row .right_btn, .button_row .right_btn:hover {
margin: 0 16px 0 0;
} 

Also the button is overlapping the border, this is because the parent element is 100% width + 25px padding. With the standard box model, this is over 100%. You could

• Remove the float, add overflow:hidden or use another method to clear the floating children and set width to auto (or leave it out as auto is default)
• Change the box model. This is a good introduction: http://css-tricks.com/box-sizing/
• Remove the padding

.button_row {
float: left;
padding: 17px 25px 25px;
width: 100%;
}

[cypgrumpy]

The overflow is intentional, it gives the button a sort of banner look, which I like.  Thanks for the help with the button moving around.

[eunger9]

The overflow is intentional, it gives the button a sort of banner look, which I like.  Thanks for the help with the button moving around.

 

The buttons overlapping like that looks awful, in my opinion. To a potential customer, it seems like a lazy designer left a site unfinished.