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

Generalized support for code highlighting #696

Merged
merged 2 commits into from
Aug 8, 2018
Merged

Conversation

lbertge
Copy link
Contributor

@lbertge lbertge commented Aug 2, 2018

Summary

PR GH-690 introduces the addition of 'py' to help label python-highlighted code in a document. I extend this idea by creating a Stylus variable to represent all default labels, and can be easily changed via override.styl.

What kind of change does this PR introduce? (check at least one)

  • Bugfix
  • Feature
  • Code style update
  • Refactor
  • Docs
  • Build-related changes
  • Other, please describe:

If changing the UI of default theme, please provide the before/after screenshot:

Does this PR introduce a breaking change? (check one)

  • Yes
  • No

If yes, please describe the impact and migration path for existing applications:

The PR fulfills these requirements:

  • When resolving a specific issue, it's referenced in the PR's title (e.g. fix #xxx[,#xxx], where "xxx" is the issue number)

You have tested in the following browsers: (Providing a detailed version will be better.)

  • Chrome
  • Firefox
  • Safari
  • Edge
  • IE

If adding a new feature, the PR's description includes:

  • A convincing reason for adding this feature
  • Related documents have been updated
  • Related tests have been updated

Reason: Currently the default theme uses a list of labels (line 98 in code.styl) to determine which code blocks will include the label in the top right corner. I think moving this list into config.styl and assigning a variable (named $codeLang) is better for a couple of reasons:

  1. Easy overriding by override.styl. I think everyone will have different use cases for Vuepress, so they may choose to use only certain code languages. For example, a front-end heavy documentation may use lots of js, ts, etc, whereas a back-end heavy documentation may use go, python, rust.
  2. Choosing only certain languages reduces the css footprint by a small amount.

To avoid wasting your time, it's best to open a feature request issue first and wait for approval before working on it.

Other information:

@@ -3,6 +3,7 @@ $accentColor = #3eaf7c
$textColor = #2c3e50
$borderColor = #eaecef
$codeBgColor = #282c34
$codeLang = js ts html md vue css sass scss less stylus go java c sh yaml py
Copy link
Member

Choose a reason for hiding this comment

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

May not put this after // colors

@ulivz ulivz merged commit fa8b055 into vuejs:master Aug 8, 2018
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.

3 participants