Tweaks

gulpfile.js

@@ -24,60 +24,62 @@ const DEST = './css';
 const DIST = './dist';
 const SASS_SOURCES = './sass/*.scss';
 const STYLE_GUIDE_SOURCES = ['./sass/index.md', './doc_assets/*.html', './code_example_templates/*.erb'].concat([
-	SASS_SOURCES
+  SASS_SOURCES,
 ]);
 const GENERATED_CSS = DEST + '/*.css';
 
 function sassTask() {
-	return src(SASS_SOURCES)
-		.pipe(sass({ outputStyle: 'compressed' }))
-		.pipe(
-			autoprefixer({
-				cascade: false,
-				remove: true // Remove cruft
-			})
-		)
-		.pipe(dest(DEST));
+  return src(SASS_SOURCES)
+    .pipe(
+      sass({
+        outputStyle: 'compressed',
+      })
+    )
+    .pipe(
+      autoprefixer({
+        cascade: false,
+        remove: true, // Remove cruft
+      })
+    )
+    .pipe(dest(DEST));
 }
 
 function hologramTask(cb) {
-	return src(STYLE_GUIDE_SOURCES)
-		.pipe(hologram(cb))
-		.pipe(livereload());
+  return src(STYLE_GUIDE_SOURCES).pipe(hologram(cb)).pipe(livereload());
 }
 
 function minifyCssTask() {
-	return src(GENERATED_CSS)
-		.pipe(sourcemaps.init())
-		.pipe(
-			cleanCSS({ debug: true }, details => {
-				console.log(`
+  return src(GENERATED_CSS)
+    .pipe(sourcemaps.init())
+    .pipe(
+      cleanCSS({ debug: true }, (details) => {
+        console.log(`
 file: ${details.name}
 original: ${details.stats.originalSize}
 minified: ${details.stats.minifiedSize}`);
-			})
-		)
-		.pipe(rename({ suffix: '.min' }))
-		.pipe(sourcemaps.write())
-		.pipe(dest(DIST));
+      })
+    )
+    .pipe(rename({ suffix: '.min' }))
+    .pipe(sourcemaps.write())
+    .pipe(dest(DIST));
 }
 
 function serverTask(cb) {
-	http.createServer(st({ path: join(__dirname), index: join('docs', 'index.html'), cache: false })).listen(8080, cb);
+  http.createServer(st({ path: join(__dirname), index: join('docs', 'index.html'), cache: false })).listen(8080, cb);
 }
 
 function watchTask() {
-	livereload.listen({ port: 3456, basePath: __dirname });
-	watch(SASS_SOURCES, sassTask);
-	watch(STYLE_GUIDE_SOURCES, hologramTask);
-	watch(GENERATED_CSS, minifyCssTask);
+  livereload.listen({ port: 3456, basePath: __dirname });
+  watch(SASS_SOURCES, sassTask);
+  watch(STYLE_GUIDE_SOURCES, hologramTask);
+  watch(GENERATED_CSS, minifyCssTask);
 }
 
 export {
-	sassTask as sass,
-	hologramTask as hologram,
-	minifyCssTask as minifyCss,
-	serverTask as server,
-	watchTask as watch
+  sassTask as sass,
+  hologramTask as hologram,
+  minifyCssTask as minifyCss,
+  serverTask as server,
+  watchTask as watch,
 };
 export default series(sassTask, hologramTask, serverTask, watchTask);

sass/_buttons.scss

@@ -99,7 +99,6 @@ to give the button a special semantic cue.
   border-color: $dark-gray;
   box-shadow: 0 0 3px 1px $light-accent;
   outline: none;
-  // border-color: $medium-accent;
 }
 
 @mixin base-btn {

sass/_variables.scss

@@ -53,7 +53,7 @@ $saturation-banana: 84%;
 $multiplier-blue: 1;
 $multiplier-green: 0.93;
 $multiplier-red: 1;
-$multiplier-amber: 1.2;
+$multiplier-amber: 0.921;
 $multiplier-accent: 0.89;
 $multiplier-plum: 0.9;
 $multiplier-raspberry: 1;