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

[Bug] Blockquote display issue: Text invisible except for hyperlink colors #215

Open
popovayoana opened this issue Feb 29, 2024 · 3 comments
Assignees

Comments

@popovayoana
Copy link

popovayoana commented Feb 29, 2024

Description

When using blockquote in Wagtail, there appears to be a styling issue where the text within the blockquote becomes invisible (white text on a presumably white background) except for hyperlinks, which are displayed in red.

Steps to Reproduce

  1. Create a new page in Blog in the Wagtail editor
  2. Navigate to body text where blockquotes are utilized
  3. Insert a blockquote containing both regular text and hyperlinks
  4. Preview or publish the page
  5. See that the blockquote text is invisible except for the red hyperlinks

Expected Behavior

The text within blockquotes should be:

  1. clearly visible against the background
  2. with distinct styling that differentiates it from the rest of the page content. What I mean by "distinct styling" is:
  • Left Border Line
    • Color: Red or Grey (choose in accordance with the website's design theme)
    • Thickness: Suitable to be noticeable but not overpowering (e.g., 2-4px)
  • Indentation
    • The blockquote should start ~2 cm to the right of the main content's alignment indent block quotes should be 0.5 inches from the left (this is acc to APA and MLA styles)
  • Text Style
    • Font: Maintain the same font as the body text for consistency
    • Text Size: Set at 18px to subtly stand out against the body text, which is smaller by 2px
    • Weight: Normal (the current default bold styling should be removed)
    • Italics: Not applied by default. Admins should have the option to italicize text as desired
  • Background of blockquote
    • Maintain the current background color; no change is required (the blockquote should seamlessly integrate with the page without a distinct background color, relying solely on the red/grey left border line for distinction)

Screenshots

image

image

image

Examples of how it should look like (ignore background)

image

image

@popovayoana
Copy link
Author

@Alex-Pavlyuk @alexmorev hey guys, can you look into this? if we can at least fix the bug soon, that'd be great... thanks!

@Alex-Pavlyuk
Copy link
Member

@Alex-Pavlyuk @alexmorev hey guys, can you look into this? if we can at least fix the bug soon, that'd be great... thanks!

we will fix it soon

@alexmorev
Copy link
Member

@popovayoana It has been fixed. Please review.

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

3 participants