Fix form alignment

[auscompgeek]

The following two screenshots are in Pale Moon 24.2.2, a fork of Firefox.

account-form:

add-wish:

[cyphar]

Whoa. What's up with your browser?

[auscompgeek]

You (as in group 4) designed for WebKit rather than standards, that's what's up. :tongue:

As they say, WebKit is the new IE6.

PS: Don't look at /login in IE10 if you know what's good for you.

[cyphar]

I did not design anything. Blame the guys who did the black magic CSS.

[auscompgeek]

After removing the float: left from the labels on /login, and removing the margin-top on the forms' labels and buttons, /login doesn't look bad at all.

[cyphar]

The login form is fixed in ec203fbfe65b45ad88b16818a93b1063ab645cf3. Still need to fix the wishlist abomination. Call the exorcist.

[cyphar]

I just discovered that ec203fbfe65b45ad88b16818a93b1063ab645cf3 (apart from fixing /login) broke the wishlist form in Chromium. F*ck.

[auscompgeek]

Now that we've fixed the account forms in fd04122d1ecf39efd1a2c7202fd788a720daea09 and ec203fbfe65b45ad88b16818a93b1063ab645cf3, we now have to fix the wish form. It is completely broken in Chromium, and looks bad in Firefox. What I've done so far looks good.

HTML changes:

• #form-box1
  • put the first half in a <div>
  • put each label and input in <p>s
  • removed the extraneous <br>s
  • removed ids of website label and input, unneeded now

CSS changes:

• #wish-form p
  • margin: 0 0 10px;
• #form-box2
  • float: right;

[cyphar]

Before pull requesting:

• What is up with the spacing between the URL and Price fields?
• Can the description textarea have the same height as the rest of the form?
• Did removing the id of the website label break the scraping javascript?

[auscompgeek]

The spacing between the URL and price fields, I believe, were originally designed that way. If this is not so, I can remove some of the cruft in the HTML to account for this.

The description textarea's rows can be easily increased. :smile:

The removal of the website input's id did indeed break the scraping JS.

[cyphar]

I don't think there should be space between the two. That aside, it looks pretty good! Can you show a screenshot of what it looks like when scraping url data?

[auscompgeek]

After further testing, I've found that increasing the textarea's rows from 3 to 4 might not be such a good idea. The submit button gets a bit too close for comfort, so much in Firefox that the button overlaps with the textarea.

Anyway, this is what it looks like when scraping for images (Firefox):

[cyphar]

The choose an image tag needs to be fixed too... oh well.

[auscompgeek]

Eh, it's close enough.

[auscompgeek]

In other news, all this fixed IE's rendering of the forms as well!

[cyphar]

Funny story! The form is badly rendered on my small-screen chromebook. Try making the screen really small.

[auscompgeek]

Could I see a screenshot? It looks fine in IE and Firefox.

[cyphar]

That's strange ... it seems to have corrected itself when I just pulled from the git repo.