jescalan / roots

a toolkit for rapid advanced front-end development
http://roots.netlify.com/
Other
1.45k stars 132 forks source link

Axis Bold as Love #755

Closed bretonio closed 7 years ago

bretonio commented 7 years ago

Having difficulty though not mad at you my friend. This would be a mitzvah for a newbie if you could find time to dispel the fog.

I thought I understood from your documents that "by default, axis will auto-import itself into all your stylesheets." I am not finding this to be so?

Starting a new project -- roots init roots-axis-bold -- creates the following app.coffee.

axis         = require 'axis'
rupture      = require 'rupture'
autoprefixer = require 'autoprefixer-stylus'
js_pipeline  = require 'js-pipeline'
css_pipeline = require 'css-pipeline'

module.exports =
  ignores: ['readme.md', '**/layout.*', '**/_*', '.gitignore', 'ship.*conf']

  extensions: [
    js_pipeline(files: 'assets/js/*.coffee'),
    css_pipeline(files: 'assets/css/*.styl')
  ]

  stylus:
    use: [axis(), rupture(), autoprefixer()]
    sourcemap: true

  'coffee-script':
    sourcemap: true

  jade:
    pretty: true

In the node_modules folder, meanwhile, axis/axis/index.styl and its tributaries. Should I modify the default stylesheet to @import these sources? Have tried but to no avail.

Building and serving the site with roots watch meantime indicates that styles are being read from public/css/master.css ...

Confused, in a word. Will try to watch that video again ...

jescalan commented 7 years ago

So axis is a transparent library, meaning that you need to use its functions for it to show itself. It's not bootstrap, and will not automatically style your page for you -- you choose when to use it, and what elements to use it on. It is there and ready for you to use in your stylesheets when you need it though.

Check out the docs and use one of its functions, watch it shine ✨

Closing as this is not a bug and is a support question, but please feel free to continue commenting here if you have more questions, or take it to gitter!