Small CSS changes to correct header of login form

[rbclark]

Should wrap up with the login form for now, and close #17

[ds125v]

What's the thinking behind changing this line:

+@media (max-width: 1075px) {

from one of Bootstrap's default responsive sizes:

http://twitter.github.com/bootstrap/scaffolding.html#responsive

If we need to change that (because something in Moodle makes a different figure appropriate) then I'd like to try and do it everywhere.

[rbclark]

The main reason was if you open up the login page, between 980 and 1075, the login form looks really bad, but if you force it to switch layout types right before it runs out of room it flows smoother. Here is an example of what it looks like at ~990px with the setting one way and then the other http://i.imgur.com/Na1Oa.png (with 980px max width) and http://i.imgur.com/Esfrj.png (with 1075px max width)

[ds125v]

If you prefer the way it looks with the "Username" and "Password" stacked above the entry field, then we could just always use that. Currently I'm just copying the standard Bootstrap .horizontal-form layout, but the login page is kind of a special case, and wasn't really designed to look like the other forms in Moodle.

For the header, if you want it to be generic you can only really line it up with the inputs on the right hand side, or with the left edge of label box (which is 200 pixels wide). You've lined it up with the left edge of the text, but in other languages that text might be longer. Obviously, if you know what language your site is in, and prefer it that way then you can make that change, but in the generic bootstrap design it either goes far left or with a 200px margin to the left.

Of course if you always use the stacked format, then that problem kind of solves itself, as you only have one vertical line to align everything too.

I'm keen to stick with the Bootstrap defaults as long as possible, but it's entirely possible that the Moodle forms will require a slightly different break point in responsive mode. I've found that, with english at least, the form labels in Moodle require an extra 20px, but again I don't intend to add that tweak (or make it an option) until the basics have been laid out.

[ds125v]

I think this is mostly fixed, though there probably needs to be general tweaking of when the form stuff goes responsive.