-
Notifications
You must be signed in to change notification settings - Fork 1.7k
Display author avatars in the blog #1915
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
Conversation
✅ Deploy Preview for expressjscom-preview ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
authors: | ||
- name: Wes Todd | ||
github: wesleytodd | ||
- name: Express Technical Committee |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
We could use the GitHub username for the TC, so it doesn't end up without a photo.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I couldn't find a GitHub user for the technical committee specifically, I added expressjs and it looks like this:
Is this what you meant? If not I can revert. One doubt I had is that we're kind of spamming the blog page with lots of the same image and link out to the GitHub org. Maybe this is fine?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Accessibility improvements
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM
Please resolve merge conflict
This requires us to update the `author` front-matter, requiring it to be an array of objects instead of a single string. This paves the way for us to include further author metadata. For now we only add "name" which expects a string.
This adds the ability for authors to add their GitHub username to the blog posts they author. If they provide this then their name will be linked to their GitHub profile page.
This adds a small profile image to author lines that have a GitHub.
The authors looked a little bunched up, a left margin on each of them reads a little better. Co-Authored-By: Wes Todd <[email protected]>
Co-Authored-By: Sebastian Beltran <[email protected]>
Co-Authored-By: Sebastian Beltran <[email protected]>
This ensures we still display a circle if, for some reason, the image that we get isn't a perfect square. Co-Authored-By: Shubham Oulkar <[email protected]>
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM
thanks @rowanmanning! |
This resolves #1758 by adding author images to blog posts, both on the post page and in the list view. It's not overly designed - I went for a simple solution for now that can be expanded on later if the site is refreshed (as suggested in #1787).
This required some foundational work to ensure that:
I outlined this work in more detail in this comment on the original issue.
Screenshots
Overview page with single author:
Overview page with one author with an avatar and one without:
Overview page with two authors:
Light mode:
Blog post page: