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

Migrate from SCSS to blade templates #1607

ssddanbrown opened this issue Aug 29, 2019 · 0 comments


Copy link

commented Aug 29, 2019

Just dumping this down so I don't forget it.


Migrate the existing SCSS style files to blade template files containing normal CSS content.


We currently use, and I have loved, SCSS mainly due to the following features:

  1. Use of variables.
  2. Ability to split source into multiple files.
  3. Ability to nest selectors.

Feature 1 can now be done via CSS variables now we have dropped IE. I have already started uses CSS variables for core theme colors.
Feature 2 can be done by any common templating system.
Feature 3, while useful, often encourages bad practice and is the most common incompatibility with normal CSS.

Migrating to standard CSS, split out via blade template files, will make the styles more accessible by being standards css rather than scss, while allowing easier customization via the theme system. A custom user theme would be able to selectively override the default BookStack css on a per file basis. This feature would also reduce development build dependencies, making it more accessible to start developing on BookStack and tweaking styles.


  • Existing SCSS files would need to be cleaned up a bit, Certain bits are currently a bit of a mess. More granular would be better.
  • We'd ideally set sensible cache headers since, unless developing a theme, the styles should not be expected to change often.
  • Ideally the files would end with .blade.css so editor syntax highlighting remains working as normal. Not looked but, from experience of Laravel, they've probably made this easy to achieve.
  • Will need to consider PDF generation. Need to check if renderers support CSS variables, Might need to provided targeted backup styles for those.
  • Would be good if we can get sourcemaps to work to make debugging easier. Could be tricky.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
1 participant
You can’t perform that action at this time.