Project Structure

• atomic-docs/
  • atomic-core/
  • atomic-db/
  • components/
  • css/
    • main.css
  • scss/
    • main.scss
  • .htaccess
  • index.php
  • atomic-head.php
  • atomic-foot.php

atomic-docs/

The root project directory. Change to whatever the name of your project is.

atomic-core/

The directory that holds the atomic-docs application logic. (I'm stricly a front-end programmer, view my janky backend code at your own risk)

atomic-db/

The flat file database that stores the information for your components, categories and settings.

components/

This directory holds the component files where you will be authoring your html. For example, if you create a component named "box", you would find box.html in this directory.

css/

Nothing fancy here. Just the usual css directory that your sass/less files will be preprocessed into.

scss/

The scss directory where you author the styles for your components. For example, if you create a component named "box", you would find _box.scss in this directory. You can change this directory name to whatever you want. Just make sure to update the name in the config.php file.

.htaccss

Used to turn output_buffering to on to solve error issues in osx. Need to find a better solution, this works for now however.

config.php

Change certain defaults here. You can change the component extension from .php to .html or .mustache or whatever you'd like.

index.php

Your projects index file.

atomic-head.php

Any code you want shared between the head section of the styleguide and your project's head. Google font links etc...

atomic-foot.php

Any code you want shared between the footer of your styleguide and your project's footer. Additional scripts that aren't js/main.js etc...