Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add new styles for forum creation page #395

Merged
merged 13 commits into from
Dec 6, 2023
Merged

Conversation

bburgess19
Copy link
Contributor

Purpose

This PR seeks to add new styling for the forum creation page. Merging of this PR will close #382.

Notes

Here is an example of how the page currently looks:
image

Also implemented is more styles for the image add/remove button:
image

@bburgess19 bburgess19 added this to the 2023/Wrap-up milestone Dec 4, 2023
@bburgess19 bburgess19 self-assigned this Dec 4, 2023
Copy link
Contributor

@giomhern giomhern left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Overall, this looks really good. It fits more into the machina implementation and really well done styling. My only concern would be with the image, but I would love to hear your thoughts @bburgess19.

src/config/urls.py Outdated Show resolved Hide resolved
src/templates/forum/forum_form.html Show resolved Hide resolved
@bburgess19 bburgess19 force-pushed the forums/forum-create-styling branch from 83bbcb2 to 8038528 Compare December 5, 2023 07:40
Copy link
Contributor

@giomhern giomhern left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is looking a lot better now with all of the prime functionality from before. The colors and the UI feedback when creating a forum are really nice touches. Love what you did here Ben! Approving! Thanks for incorporating my feedback!

display: inline-block;
width: 40%;
box-sizing: border-box;
background: #eaeaea;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actually like the abstraction here with the new file dedicated to CSS.

// and add an image preview and trash can to remove the image
imageField.parentElement.appendChild(trashButton);
trashButton.addEventListener('click', removeSelectedImage);
trashButton.imgPreview = imgPreview;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Addition of the preview image was well needed and nicely implemented here!

Copy link
Contributor

@majorsylvie majorsylvie left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This looks so sick!

I'm successfully able to make forums, with and without images.

The only thing that is odd is after I make a forum, I get two different "forum successfully created" popups:
image

This is not an problem for this PR, please add an issue to the backlog about addressing this bug

@majorsylvie majorsylvie merged commit 7dd1681 into dev Dec 6, 2023
2 checks passed
@majorsylvie majorsylvie deleted the forums/forum-create-styling branch December 6, 2023 00:31
@bburgess19
Copy link
Contributor Author

Closing comments

We added new styles to the forum creation page. We had to add extra logic to ensure the optional added image is displayed in the forum list.

The only thing that is odd is after I make a forum, I get two different "forum successfully created" popups: image

This is not an problem for this PR, please add an issue to the backlog about addressing this bug

Issue #418 was created to address this.

@majorsylvie
Copy link
Contributor

Issue Score: Excellent

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
Status: Done
Development

Successfully merging this pull request may close these issues.

Improve the styling on the forum creation page
3 participants