Quasar: CSS / Stylus / theme enhancement

[CookieJon]

Hi,

A few suggestions regarding colors & themes...

1. Make it clear in the docs that the "out-of-the-box" colors are the Google Material Design color palette.
2. Provide the following theme variables as standard, (more in line with Google's recommendations for Material themes)...
   $primary $primary-light $primary-dark
$secondary $secondary-light $secondary-dark
$accent $accent-light $accent-dark
3. Pull all the stylus color palette definitions out of the framework's core/colors.variables.styl file, and place them in a separate file which can then be imported into custom app.[theme].styl files and .vue templates' <style lang="stylus"> tags.

In that way, users can define their themes by using the actual color palette names instead of having to duplicate the RGB codes in more than one place. E.g.. '$primary = #b71c1c' vs. '$primary = $red-10' (much clearer!)

(I'm also going take this opportunity to congratulate you on exceptionally well-written documentation for this project. I've been struggling with all these technologies for months, have read so many tutorials I've lost count, but the explanations in your docs have set the benchmark for clear and intelligible information. So THANKS!)

[rstoenescu]

Good points there. Will do.

[smolinari]

Yup! The clarity in this project, not only in the docs, but in the website, Razvan's work and his polite, intelligent and patient manner with us "customers" is all a winning combination. That is why we've also decided to use Quasar as the basis for our project, which will be kicking off first coding Q1 next year.

I know nice words don't pay the bills, but hopefully we can help with that later on, as we definitely want to support the OS projects we use too financially (should our project be profitable). It is only fair!

Scott

[rstoenescu]

Thank you for all those kind words! Just trying to do my best. There are soo many things I want to improve even more.

Looking forward to seeing all your projects on Quasar succeed! We can showcase them if you guys want to. It would make me very proud and show that my efforts were not in vain.

[rstoenescu]

Available in v0.14 and can be used like this in your *.vue files:

<style lang="stylus">
@import '~variables'

// your Stylus code
</style>

Note that you will need to take a look at the default template / starter kit and add some files for it. Or read about this in v0.14 documentation.