Bug overriding default values in css

[ksacks]

Bug report

Version

0.11.0

Steps to reproduce

1 - Override default theme css variable value (.vuepress/override.styl)

// showing default values
$accentColor = #ff0000
$textColor = #000000
$borderColor = #eaecef
$codeBgColor = #282c34

2 - Changes don't apply. Seems like in the latest version, whilst correcting the duplicate css override, the default values are set last and therefore not overriding the variable values before these values are used.

What is expected?

Default theme css values should be applied

What is actually happening?

Default theme css values are not applied

Other relevant information

• Your OS: Kubuntu 18.04
• Node.js version: 8.10.0
• Browser version: Chromium 66.0.3359.181
• Is this a global or local install? Global
• Which package manager did you use for the install? Npm

[ulivz]

Thanks for reporting that, we will release a new version to fix that for that later today.

[ulivz]

Consider we can open a new API index.styl, and let override.styl return to the old behavior.

And we'll document this:

override.styl should be only used in overriding default theme's global stylus variables (See: #637). If you wrote extra styles in the past, e.g.

// override.styl.

$textColor = red

#my-style {}

It's recommended to separate the style part to index.styl.

// override.styl, will be mounted immediately after the default configuration, but before all styles.

$textColor = red

// index.styl, mounted after all styles.

#my-style {}

With that we'll have no any breaking changes.

[ksacks]

Seems like a good solution !

Maybe having explicit filenames would help user not misunderstand ?

• variables.styl (for overriding default values)
• styles.styl or custom.styl (for custom styles exclusively)

Or even folder based and parsed for all files inside the folders ?

• .vuepress/variables
• .vuepress/styles

Or a mix of both :

• .vuepress/override.styl (for theme variable values)
• .vuepress/styles (folder for all custom styles)