Merge pull request #403 from twbs/doc-directories-273

document project's directory structure

README.md

@@ -10,6 +10,31 @@ Build mobile apps with simple HTML, CSS, and JS components.
 
 Take note that our master branch is our active, unstable development branch and that if you're looking to download a stable copy of the repo, check the [tagged downloads](https://github.com/twbs/ratchet/tags).
 
+### What's included
+
+Within the download you'll find the following directories and files, logically grouping common assets and providing both compiled and minified variations. You'll see something like this:
+
+```
+ratchet/
+├── css/
+│   ├── ratchet.css
+│   ├── ratchet.min.css
+│   ├── ratchet-theme-android.css
+│   └── ratchet-theme-android.min.css
+│   ├── ratchet-theme-ios.css
+│   └── ratchet-theme-ios.min.css
+├── js/
+│   ├── ratchet.js
+│   └── ratchet.min.js
+└── fonts/
+    ├── ratchicons.eot
+    ├── ratchicons.svg
+    ├── ratchicons.ttf
+    └── ratchicons.woff
+```
+
+We provide compiled CSS and JS (`ratchet.*`), as well as compiled and minified CSS and JS (`ratchet.min.*`). The Ratchicon fonts are included, as are the optional Android and iOS platform themes.
+
 ## Documentation
 
 Ratchet's documentation is built with [Jekyll](http://jekyllrb.com) and publicly hosted on GitHub Pages at <http://goratchet.com>. The docs may also be run locally.

docs/getting-started.html

@@ -37,6 +37,55 @@ title: Getting started · Ratchet
 
 
 
+      <div class="docs-section">
+        <h2>What's included</h2>
+        <p class="lead">Ratchet is downloadable in two forms, within which you'll find the following directories and files, logically grouping common resources and providing both compiled and minified variations.</p>
+
+        <h3>Precompiled Ratchet</h3>
+        <p>Once downloaded, unzip the compressed folder to see the structure of (the compiled) Ratchet. You'll see something like this:</p>
+<!-- NOTE: This info is intentionally duplicated in the README.
+Copy any changes made here over to the README too. -->
+{% highlight bash %}
+ratchet/
+├── css/
+│   ├── ratchet.css
+│   ├── ratchet.min.css
+│   ├── ratchet-theme-android.css
+│   ├── ratchet-theme-android.min.css
+│   ├── ratchet-theme-ios.css
+│   ├── ratchet-theme-ios.min.css
+├── js/
+│   ├── ratchet.js
+│   └── ratchet.min.js
+└── fonts/
+    ├── ratchicons.eot
+    ├── ratchicons.svg
+    ├── ratchicons.ttf
+    └── ratchicons.woff
+{% endhighlight %}
+
+        <p>This is the most basic form of Ratchet: precompiled files for quick drop-in usage in nearly any web project. We provide compiled CSS and JS (<code>ratchet.*</code>), as well as compiled and minified CSS and JS (<code>ratchet.min.*</code>). The Ratchicon fonts are included, as are the Android and iOS platform themes.</p>
+
+        <h3>Ratchet source code</h3>
+        <p>The Ratchet source code download includes the precompiled CSS, JavaScript, and font assets, along with source Sass, JavaScript, and documentation. More specifically, it includes the following and more:</p>
+{% highlight bash %}
+ratchet/
+├── sass/
+├── js/
+├── fonts/
+├── dist/
+│   ├── css/
+│   ├── js/
+│   └── fonts/
+└── docs/
+    └── examples/
+{% endhighlight %}
+
+        <p>The <code>sass/</code>, <code>js/</code>, and <code>fonts/</code> are the source code for our CSS, JS, and icon fonts (respectively). The <code>dist/</code> folder includes everything listed in the precompiled download section above. The <code>docs/</code> folder includes the source code for our documentation, and <code>examples/</code> of Ratchet usage. Beyond that, any other included file provides support for packages, license information, and development.</p>
+      </div>
+
+
+
       <div class="docs-section">
         <h2>Page setup</h2>
         <p class="lead">Three simple rules for structuring your Ratchet pages</p>