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

Inconsistent Alignment, Styling, and Format #708

Open
sanskaryo opened this issue Oct 10, 2024 · 1 comment
Open

Inconsistent Alignment, Styling, and Format #708

sanskaryo opened this issue Oct 10, 2024 · 1 comment

Comments

@sanskaryo
Copy link

Describe the bug

There are a few UI/UX inconsistencies and improvements needed for the comments section and blog page layout on the website:

  1. Inconsistent Date Format: The date format displayed on the blog cards is inconsistent (e.g., "Wed 01, 2020" vs. "Mon 13, 2023").
  2. Form Field Alignment and Labeling Issues: In the "Leave Comments" section, the form fields have insufficient padding, and the placeholder text disappears when the user starts typing. This can confuse users as there are no static labels for the fields.
  3. Submit Button Styling: The "Submit" button has no hover effect, making it feel less interactive for the user.
  4. Font Visibility: The "Leave Comments" title has low contrast and visibility against the background. This could make it difficult for users to notice.

To Reproduce

Steps to reproduce the behavior:

  1. Go to the main blog page.
  2. Click on any blog post.
  3. Scroll down to the "Leave Comments" section.
  4. Observe the form alignment, placeholder behavior, and inconsistent blog card dates.

Expected behavior

  1. Date Format Consistency: The date should follow a consistent format such as Jan 13, 2023.
  2. Interactive Submit Button: The "Submit" button should have a hover effect to make it more interactive.
  3. Better Font Contrast: The "Leave Comments" title should have higher contrast and be more visible.

Screenshots

  1. Blog Page with Inconsistent Dates

image

  1. Comment Form Issues
    Comment Form

Additional context

Ensuring uniformity in design and improving readability will enhance the user experience, making the website more accessible and visually appealing.


I’d Like to Work on This Issue

I would like to work on this issue. Please assign it to me and if possible add labels of Gssoc and Hacktoberfest.

Plan:

  • I will standardize the date format for all blog posts across the site.
  • I will adjust the padding, add floating/static labels for the comment form, and fix the alignment issues.
  • I will add hover effects to the "Submit" button for better user interaction.
  • Lastly, I will increase the contrast and font size of the "Leave Comments" title for better visibility.

Timeline:
I plan to complete this in the next 3–4 days.

Copy link

Thanks @sanskaryo for raising this issue! We'll look into it.We hope you have made sure that a similar issue doesnt exist , if it does, kindly ask to be assigned on that issue

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants