Skip to content

Conversation

@kitten
Copy link
Contributor

@kitten kitten commented Nov 6, 2017

Fix #291

  • Move prism themes into src/themes/default into a new prism property containing light and dark
  • Remove ComponentPlayground and CodePane css requires
  • Convert Pacman progress keyframes into emotion code
  • Move residual global styling from index.css into theme.global and remove index.css

It seems that normalize.css is not required anymore btw. The example presentation seems 100% ok without it, as far as I can tell.

Edit: The commit 6c678b1 allows a user to just include a prism css file like so to override the default two prism themes:

    <link href="https://unpkg.com/prismjs@1.8.1/themes/prism-tomorrow.css" rel="stylesheet" type="text/css">

This takes a higher precedence than emotion, but the base file does include some styles that are more important, which have been assigned a higher specificity:

&.language-prism.language-prism {
padding: 0.5rem;
margin: 0;
min-height: 100%;
font-size: 1.25vw;
}

This means that those can still be overridden using !important.

- Delete prism.{dark,light}.css
- Move prism themes into a css`` block
- Add `prism` to theme
- Use prism themes in CodePane and ComponentPlayground
- Add theme.components.syntax for all Editor components, like the one in
  ComponentPlayground and CodePane
- Removed prism.base.js since those are now inside the syntax styles
- Added specificity override to Editor components to allow for external
  prism CSS theme
- Use tertiary font-family in all syntax components
tabSize: 2,
hyphens: 'none',
whiteSpace: 'pre-wrap',

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

NIT: Extra newline?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oh, sorry, I'm used to separate some CSS properties from each other. Will get rid of it 😄

Copy link
Member

@ryan-roemer ryan-roemer left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Lovely! Enjoy both dark and light themes and easily switchable.

@kitten kitten merged commit f2b29fe into master Nov 7, 2017
@kitten kitten deleted the fix/no-css-files branch November 7, 2017 16:54
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants