Unify look of form fields about base

[matthewhartman]

Hey Andreas,

Yeah, I did that purposely. The intention was to leave the ugly select box the way it was so it was consistent across all browsers (including the dreadful ie8).

To make the select consistent like the rest of the form elements, use custom select.

Eg:

<span class="select">
    <select>
        <option>option</option>
    </select>
</span>

I think moving forward though, it would be a wise move to style the select to look more 'up to date' and consistent with the other form elements.

Please leave this with me as I create the updates for Base 2.6.8.

Cheers,

Matt

[alinnert]

Hey Matt,

I've tested it on the demo site via developer tools. That's a quite simple workaround.
But why does the <select> have width: 120%;? That way the dropdown really is a lot wider than the actual custom select.

And I see styling the form fields in assets.less/sass wouldn't be too hard I guess. But I'll wait for the 2.6.8 update first.

So, thanks for your reply.
Andreas

[matthewhartman]

Hey Andreas,

Mainly due to the reason that I wanted all select elements to look consistent on all browsers.

The <span class="select"></span> is a wrapper that styles the select shell. The inner <select> has all styling removed.

In IE8, the arrow dropdown icon still shows, so I've added the width of 120% to hide the arrow (as <span class="select"> has an overflow: hidden;)

Hope this makes sense.

Cheers,

Matthew

[matthewhartman]

Hi Andreas,

Base 2.6.8 has been released with the latest fixes.

Cheers,

Matthew