Make CSS templates more modular

.gitignore

@@ -1,6 +1,6 @@
 ~*
 *~
-bak
-node_modules
+*bak
 *cache
-npm-debug.log
+*.log
+node_modules

app/stylesheets/_foundation-includes.scss

@@ -1,9 +1,10 @@
 //
-// Include Foundation components
+//= Include Foundation components
 
 @import 'foundation';
 
-// TODO: Conditionally include `foundation-global-styles`
+// TODO: Conditionally include `foundation-global-styles`.
+// It's better if we don't have ANY global includes.
 @include foundation-global-styles;
 
 #spectacle {

app/stylesheets/_index.scss

@@ -0,0 +1,16 @@
+//
+//= Main includes
+//
+
+#spectacle {
+
+  // Include highlight.js style
+  @import 'monokai';
+
+  // Include Spectacle layout
+  @import 'variables';
+  @import 'utils';
+  @import 'schema';
+  @import 'layout';
+
+}

app/stylesheets/_variables.scss

@@ -3,69 +3,69 @@
 //
 
 // The height of the top bar
-$topbar-height: 50px;
+$topbar-height: 50px !default;
 
 // The width of the column padding
-$column-padding: 2.25rem;
+$column-padding: 2.25rem !default;
 
 // The accent color to use for nav highlights and section headings
-$accent-color: #f68b1f;
+$accent-color: #f68b1f !default;
 
 // The dark backgorund color behind code examples
-$dark-background-color: $black;
+$dark-background-color: $black !default;
 
 // Medium device width (from Foundation)
-$medium-width: 40em;
+$medium-width: 40em !default;
 
 // Large device width (from Foundation)
-$large-width: 64em;
+$large-width: 64em !default;
 
 //
 // JSON schema labels
 
-$msg-json-section-description: "Description";
-$msg-json-section-properties: "Properties";
-$msg-json-section-items: "Items";
-$msg-json-section-inherited: "Inherited";
-$msg-json-section-anyOf: "Any of";
-$msg-json-discriminator: "discriminator";
-$msg-json-read-only: "read only";
-$msg-json-required: "required";
-$msg-json-ref-prefix: "Details: ";
-$msg-json-section-additionalProperties: "Additional properties";
-$msg-json-section-example: "Example";
+$msg-json-section-description: "Description" !default;
+$msg-json-section-properties: "Properties" !default;
+$msg-json-section-items: "Items" !default;
+$msg-json-section-inherited: "Inherited" !default;
+$msg-json-section-anyOf: "Any of" !default;
+$msg-json-discriminator: "discriminator" !default;
+$msg-json-read-only: "read only" !default;
+$msg-json-required: "required" !default;
+$msg-json-ref-prefix: "Details: " !default;
+$msg-json-section-additionalProperties: "Additional properties" !default;
+$msg-json-section-example: "Example" !default;
 
 //
 // Swagger labels
 
-$msg-swagger-data-type: 'Data type';
-$msg-swagger-description: 'Description';
+$msg-swagger-data-type: 'Data type' !default;
+$msg-swagger-description: 'Description' !default;
 
-$msg-swagger-section-operation-path: 'Path';
-$msg-swagger-section-operation-description: $msg-swagger-description;
-$msg-swagger-section-request-params: 'Request parameters';
-$msg-swagger-section-request-body: 'Request body';
-$msg-swagger-section-responses: 'Responses';
+$msg-swagger-section-operation-path: 'Path' !default;
+$msg-swagger-section-operation-description: $msg-swagger-description !default;
+$msg-swagger-section-request-params: 'Request parameters' !default;
+$msg-swagger-section-request-body: 'Request body' !default;
+$msg-swagger-section-responses: 'Responses' !default;
 
-$msg-swagger-param-key: 'Key';
-$msg-swagger-param-name: 'Name';
-$msg-swagger-param-description: $msg-swagger-description;
-$msg-swagger-param-data-type: 'Data type';
-$msg-swagger-param-type: 'Type';
+$msg-swagger-param-key: 'Key' !default;
+$msg-swagger-param-name: 'Name' !default;
+$msg-swagger-param-description: $msg-swagger-description !default;
+$msg-swagger-param-data-type: 'Data type' !default;
+$msg-swagger-param-type: 'Type' !default;
 
-$msg-swagger-response-header-name: 'Header';
-$msg-swagger-response-header-description: $msg-swagger-description;
-$msg-swagger-response-header-data-type: 'Data type';
+$msg-swagger-response-header-name: 'Header' !default;
+$msg-swagger-response-header-description: $msg-swagger-description !default;
+$msg-swagger-response-header-data-type: 'Data type' !default;
 
-$msg-swagger-section-request-security: 'Security';
-$msg-swagger-request-security-scopes: 'Scopes';
-$msg-swagger-request-security-schema: 'Schema';
-$msg-swagger-security-definition-properties: 'Properties';
-$msg-swagger-security-definition-type-basic: '(HTTP Basic Authentication)';
-$msg-swagger-security-definition-type-oauth2: '(OAuth2 Authentication)';
-$msg-swagger-security-definition-type-apikey: '(API Key Authentication)';
-$msg-swagger-badge-global: 'global';
+$msg-swagger-section-request-security: 'Security' !default;
+$msg-swagger-request-security-scopes: 'Scopes' !default;
+$msg-swagger-request-security-schema: 'Schema' !default;
+$msg-swagger-security-definition-properties: 'Properties' !default;
+$msg-swagger-security-definition-type-basic: '(HTTP Basic Authentication)' !default;
+$msg-swagger-security-definition-type-oauth2: '(OAuth2 Authentication)' !default;
+$msg-swagger-security-definition-type-apikey: '(API Key Authentication)' !default;
+$msg-swagger-badge-global: 'global' !default;
 
-$msg-swagger-response-code: 'Code';
-$msg-swagger-response-description: 'Description';
-$msg-swagger-response-schema: 'Schema';
+$msg-swagger-response-code: 'Code' !default;
+$msg-swagger-response-description: 'Description' !default;
+$msg-swagger-response-schema: 'Schema' !default;

app/stylesheets/spectacle-core.scss

@@ -0,0 +1,6 @@
+//
+//= Spectacle core
+//
+
+// Include just the Spectacle core without Foundation
+@import 'index';

app/stylesheets/spectacle.scss

@@ -7,15 +7,5 @@
 @import 'foundation-settings';
 @import 'foundation-includes';
 
-#spectacle {
-
-  // Include highlight.js style
-  @import 'monokai';
-
-  // Include Spectacle layout
-  @import 'variables';
-  @import 'utils';
-  @import 'schema';
-  @import 'layout';
-
-}
+// Include Spectacle
+@import 'index';

bin/cli.js

@@ -17,8 +17,8 @@ process.chdir(__dirname + '/..');
 program.version(package.version)
     .usage('spactacle [options] <specfile>')
     .description(package.description)
-    .option('-S, --no-css', 'omit CSS generation (default: false)')
-    .option('-J, --no-js', 'omit JavaScript generation (default: false)')
+    .option('-C, --disable-css', 'omit CSS generation (default: false)')
+    .option('-J, --disable-js', 'omit JavaScript generation (default: false)')
     .option('-e, --embeddable', 'omit the HTML <body/> and generate the documentation content only (default: false)')
     .option('-d, --development-mode', 'start HTTP server with the file watcher and live reload (default: false)')
     .option('-s, --start-server', 'start the HTTP server without any development features')
@@ -92,10 +92,10 @@ if (program.startServer) {
     grunt.task.run('server');
 }
 else {
-  if (!program.noCss) {
+  if (!program.disableCss) {
       grunt.task.run('stylesheets');
   }
-  if (!program.noJs) {
+  if (!program.disableJs) {
       grunt.task.run('javascripts');
   }
   grunt.task.run('templates');