close
The Wayback Machine - https://web.archive.org/web/20200829121733/https://github.com/styleguidist/react-styleguidist/issues/1661
Skip to content

/ react-styleguidist

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

Jump to bottom

Para components should use `theme.fontSize.base` or `theme.fontSize.text` #1661

Open
juanca opened this issue Aug 13, 2020 · 2 comments
Open

Para components should use `theme.fontSize.base` or `theme.fontSize.text` #1661

juanca opened this issue Aug 13, 2020 · 2 comments
Labels
bug good first issue help wanted

Comments

@juanca
Copy link

@juanca juanca commented Aug 13, 2020

Current behavior

When stylegudist is configured to use a font size for base and/or text to be anything other than 16px, the paragraph content generated from markdown does not use the specified font size.

Question: Is a markdown paragraph considered to be either base or text? I am assuming it should be text at the very least.

To reproduce

  1. Config:

    module.exports = {
  theme: {
    fontSize: {
      base: 24,
      text: 36,
    },
  },
};

  2. Some markdown file:

    # I am an H1

I am just a paragraph! My font size should be really big!

styleguidist/example#8

Expected behavior

The generated paragraph content should use the theme provided.

Or there should be some explanation of how the "theme" is defined: How is a paragraph not "text" or "base"?
@juanca
Copy link
Author

@juanca juanca commented Aug 13, 2020

At the moment, my solution is to duplicate the theme as a direct style to the Para component. Something like:

styles: {
  Para: { para: {
    fontSize: 14,
  }},
}
@juanca juanca mentioned this issue Aug 13, 2020
Merged
7 of 7 tasks complete
@sapegin
Copy link
Member

@sapegin sapegin commented Aug 24, 2020

I think it has inherit because it's used in Props where it should be smaller, and I think it shouldn't be used here:

react-styleguidist/src/client/rsg-components/Props/PropsRenderer.tsx

Line 24 in 53bc4bb

{extra && <Para>{extra}</Para>}

And the text would be the correct size.

Feel free to send a pull request with a fix! 👾
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
bug good first issue help wanted
Projects
None yet
Milestone
No milestone
Linked pull requests

Successfully merging a pull request may close this issue.

None yet
2 participants
@sapegin @juanca
You can’t perform that action at this time.