-
-
Notifications
You must be signed in to change notification settings - Fork 2.6k
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
Redesign image captions #247
Redesign image captions #247
Conversation
The issue I thought for customizing captions in #127 inside the post was Cover image is meant to be full sized and fits the width. While in case of images inside a post, the images can be smaller than width of Ex. |
I didn't think of that. Should I make the captions left-aligned as they were before, or should I try to center them to the image, even if the image is smaller than the page? |
Centering |
I am sorry but this is your preference, not everyone wants this |
a804990
to
16ae26f
Compare
I completely understand. I've rebased the code to remove the center-alignment. Captions are now aligned according to the language's direction, which fixes the problems with images that are smaller than the page width. Here are some example images: Left-to-right language directionRight-to-left language directionRight-to-left language direction with small image |
Well, these image orientations works for me too! I wouldn't mind that. Hugo's default formatting for Centering it wasn't specifically for my needs, but was rather a suggestion I thought would look nice with the theme. Apologies if my suggestions sounded otherwise. |
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.
Everything else looks good :)
16ae26f
to
779053b
Compare
Kudos, SonarCloud Quality Gate passed!
|
Changes the style of image captions. This creates a distinciton between the
title
andcaption
attributes. The former now shows up more prominently than the latter. Both are centered below the image, which resolves #246.Since there are no pages in the example site with images, I've added one in my fork's
exampleSite
branch: kdkasad@e7e62d98d4356c57bc9878e7cda8d5048f743f38. Below are screenshots of the various images on that page.Screenshots
Edit: captions are no longer centered. See this comment for updated screenshots.
Cover image with caption:
![cover image](https://user-images.githubusercontent.com/63574107/108267331-e4b62800-711f-11eb-933f-71e12ca021b3.png)
Content image with title, caption, and attribution:
![image with title, caption, attr](https://user-images.githubusercontent.com/63574107/108267398-fe576f80-711f-11eb-899e-d5d8fe5c2300.png)
Content image with title and caption:
![image with title and caption](https://user-images.githubusercontent.com/63574107/108267486-1f1fc500-7120-11eb-9a9b-05a8ca641249.png)
Content image with title:
![image with title](https://user-images.githubusercontent.com/63574107/108267542-31016800-7120-11eb-90b7-219d09a77c2f.png)
Content image with caption:
![image with caption](https://user-images.githubusercontent.com/63574107/108267601-42e30b00-7120-11eb-835b-5cbcdb14b97f.png)