1032694 - Elements misaligned on new task creation page

Status: VERIFIED FIXED

(Mozilla QA Graveyard :: One and Done, defect)

Description

[Henrik Skupin [:whimboo][⌚️UTC+1]]

Attachment: screenshot.png

The new page to create tasks contains elements which are misaligned or have wrong dimensions, so that icons are not centered and text is cut-off. That's at least for Linux on my machine. See the screenshot.

* Title and description have different width
* Lesser space between keywords and estimated time rows
* Drop downs too tiny so that text is cut-off
* Calendar icon not centered

Comment 1

[Bob Silverberg [:bsilverberg]]

I wrote the html and css for that page and making things look good is definitely not my forte. It does not have all of those issues on my Mac, but it does have some of them.

I wonder if we can find a contributor who is interested in doing some pure css work who can improve this page?

Comment 2

[Henrik Skupin [:whimboo][⌚️UTC+1]]

(In reply to Bob Silverberg [:bsilverberg] from comment #1)
> I wonder if we can find a contributor who is interested in doing some pure
> css work who can improve this page?

Best would be to make it a mentored bug, so it's covered by bugsahoy. If you have questions about what to do, please let me know.

Comment 3

[Bob Silverberg [:bsilverberg]]

@udeepak010: I think you closed this by mistake. This issue has not been fixed. I am reopening it. Would you like to comment on what change you intended to make to this bug?

Comment 4

[udeepak010]

Bob Silverberg:Sorry I think I did it by mistake.

Comment 5

[udeepak010]

Bob Silverberg: could you tell me what has to be done to solve this bug?

Comment 6

[Rebecca Billings [:rbillings]]

@udeepak010: everything that needs to be done is listed in Comment 1, along with the screenshot showing the issue.

Comment 7

[udeepak010]

Rebecca Billings: I am not able to locate the form. Could you please tell me where the form is located?

Comment 8

[Bob Silverberg [:bsilverberg]]

Ah, yes, that form is only available to administrators. You would need to get a copy of the site running locally in order to see it, and you would need to look at and edit the source files for the css as well, as the version that is served is post-processed.

You can find instructions for running the site locally at https://github.com/mozilla/oneanddone/blob/master/README.md

Comment 9

[Rebecca Billings [:rbillings]]

It sounds like :bsilverberg answered your question, please comment if it did not.

Comment 10

[udeepak010]

Rebecca Billings: I am a beginner to bugzilla. I am not aware of getting a local copy of the site run locally.
and I am not able to locate the form in github.

Comment 11

[Bob Silverberg [:bsilverberg]]

The code for the form can be found at https://github.com/mozilla/oneanddone/blob/master/oneanddone/tasks/templates/tasks/form.html, but that is only part of the equation. You need to know a bit about django in order to know what changes to make and which files are affected. You would still need to have the site running in order to test any changes you made, and I acknowledge that doing that is not really a  beginner-level task. If you do not feel up to tackling that you might want to consider finding a different task to help with.

Comment 12

[udeepak010]

Thank you Bob Silverberg. I would rather come back to solve this bug after gaining some experience.

Comment 13

[Bob Silverberg [:bsilverberg]]

udeepak010: I did not mean to be discouraging.

If you are interested in learning about how we maintain django websites you could start with the steps detailed at https://github.com/mozilla/oneanddone/blob/master/README.md which will guide you through getting the site running locally. They assume you already have Python and Git installed, but those are pretty easy to install. If you give it a try and have any questions you can ask on IRC at irc.mozilla.org in #webdev. When I am working I can be found there, or others can help as well.

If that's not something you are particularly interested in, or don't want to commit the time to that for now, then you could look at helping out with Mozmill again, which is something I understand you have done before. whimboo would be happy to help you out with that.

Comment 14

[udeepak010]

Bob Silverberg: Thank you for this. I would try my best to understand the working of Django and solve this bug as soon as possible.

Comment 15

[Bob Silverberg [:bsilverberg]]

Landed in https://github.com/mozilla/oneanddone/commit/8fda4d9d8f04d699a5295fabcf5b83982235f15c

Changes have been pushed to dev and staging for verification

Comment 16

[Rebecca Billings [:rbillings]]

Looks good on staging

Comment 17

[Rebecca Billings [:rbillings]]

Verified on production

Comment 18

[Bob Silverberg [:bsilverberg]]

Commit pushed to master at https://github.com/mozilla/oneanddone

https://github.com/mozilla/oneanddone/commit/8fda4d9d8f04d699a5295fabcf5b83982235f15c
Merge pull request #180 from bobsilverberg/task_form_style