Better platform handling and a number of low-hanging enhancements:

- resolves #18
- resolves #17
- resolves #16
- resolves #13
- resolves #4
- resolves #4

Dockerfile

@@ -8,4 +8,4 @@ RUN mkdir -p $GOPATH/src/github.com/KyleBanks/goggles
 WORKDIR $GOPATH/src/github.com/KyleBanks/goggles
 ADD . .
 
-CMD go test -cover $(go list ./... | grep -v vendor | grep -v cmd/goggles)
+CMD go test -cover $(go list ./... | grep -v vendor)

Makefile

@@ -2,7 +2,7 @@ VERSION = 0.1.0
 
 INSTALL_PKG = ./cmd/goggles
 
-APP_FOLDER = bin/goggles.app
+APP_FOLDER = ./bin/goggles.app
 APP_STATIC_FOLDER = $(APP_FOLDER)/Contents/MacOS/static
 LOG_FILE = ~/Library/Logs/goggles.log
 
@@ -33,6 +33,7 @@ build: | clean gulp
 	@gallium-bundle bin/goggles --output $(APP_FOLDER)
 	@mkdir -p $(APP_STATIC_FOLDER)
 	@cp -r ./_static/ $(APP_STATIC_FOLDER)
+	@rm -rf $(APP_STATIC_FOLDER)/node_modules
 .PHONY: build
 
 # Runs the goggles application.

README.md

@@ -37,6 +37,8 @@ Goggles was developed by [Kyle Banks](https://twitter.com/kylewbanks).
 
 The [Gopher](./_static/img) loading images were created by [Ashley McNamara](https://twitter.com/ashleymcnamara) and inspired by [Renee French](http://reneefrench.blogspot.co.uk/).
 
+![Gopher](./_static/img/loader-1.png)
+
 ## License
 
 Goggles is available under the [Apache 2.0](./LICENSE) license.

_static/css/colors.css

@@ -2,39 +2,54 @@
 
 /* General */
 body {
-	color: #EEEFF7;
-	background: #445878;
+    color: #445878;
+    background: #FFF;
 }
 
 a {
-	color: #EEEFF7;
+    color: #EEEFF7;
 }
 
 a:hover {
-	color: #92CDCF;
+    color: #445878;
 }
 
 pre, code {
-	background: #31353D;
+    background: #31353D;
+    color: #FFF;
 }
 
-/* Controllers */
-#controllers #pkg-list {
-	background: #31353D;
+/* Pkg List */
+#pkg-list {
+    background: #31353D;
 }
 
-#controllers #pkg-list .header {
-	color: #EEEFF7;
-	background: #1C1D21;
+#pkg-list .header {
+    color: #EEEFF7;
+    background: #1C1D21;
 }
 
-#controllers #pkg-list .search input {
-	background: #1C1D21;
-	border-color: #1C1D21;
-	color: #EEEFF7;
+#pkg-list .search input {
+    background: #1C1D21;
+    border-color: #1C1D21;
+    color: #EEEFF7;
 }
 
-/* Pkg List */
 #pkg-list .pkg.active a, #pkg-list .pkg.active a:focus {
-	color: #92CDCF;
+    color: #92CDCF;
+}
+
+/* Pkg Details */
+#pkg-details .actions .button {
+    border-color: #445878;
+    color: #445878;
+}
+
+#pkg-details .actions .button:hover {
+    background-color: #445878;
+    color: #fff;
+}
+
+#pkg-details .collapsable .content {
+    background: #f7f7f7;
 }

_static/css/main.css

@@ -1,141 +1,159 @@
 /* General */
-html,body{
-	overflow: hidden;
-	height: 100%;
-	font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
+html,body {
+    overflow: hidden !important;
+    height: 100%;
+    font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
 }
 
 .hide {
-	display: none;
+    display: none;
 }
 
 pre.prettyprint {
-	border: none;
-	margin: 1em 0;
+    border: none !important;
+ /* !important required due to css imported by prettify.js */
+    margin: 1em 0;
+}
+
+h1,h2,h3,h4,h5,h6 {
+    font-family: "Fjalla One", inherit;
 }
 
 h1 {
-	font-size: 4rem;
-	margin: 0.5em 0;
+    font-size: 4rem;
+    margin: 0.5em 0;
 }
+
 h2 {
-	font-size: 2.5rem;
-	margin: 0.5em 0 0.25em 0;
+    font-size: 2.5rem;
+    margin: 0.5em 0 0.25em 0;
 }
+
 h3 {
-	font-size: 2rem;
-	margin: 0.5em 0;
+    font-size: 2rem;
+    margin: 0.5em 0;
 }
+
 h4 {
-	font-size: 1.5rem;
+    font-size: 1.5rem;
 }
+
 h5 {
-	font-size: 1.2rem;
+    font-size: 1.2rem;
 }
+
 h6 {
-	font-size: 1rem;
+    font-size: 1rem;
 }
 
 /* Controllers */
 #controllers.container {
-	height: 100%;
-	max-width: 100%; 
-	padding: 0;
+    height: 100%;
+    max-width: 100%;
+    padding: 0;
 }
 
 #controllers.container .row {
-	height: 100%;
+    height: 100%;
 }
 
 #controllers.container .row .column {
-	overflow-x: hidden;
-	overflow-y: auto;
-	height: 100%;
-	padding: 1em;
+    overflow-x: hidden;
+    overflow-y: auto;
+    height: 100%;
+    padding: 1em;
 }
 
 /* Pkg List */
 #pkg-list .header {
-	text-align: center;
-	margin: 0.5em 0;
-	padding: 0.2em;
-	font-size: 0.8em;
-	font-weight: bold;
+    text-align: center;
+    margin: 0.5em 0;
+    padding: 0.2em;
+    font-size: 0.7em;
+    font-weight: bold;
 }
 
 #pkg-list .pkg {
-	padding: 0.2em 1em;
+    padding: 0.2em 1em;
 }
 
 #pkg-list .pkg.active {
-	font-weight: bold;
+    font-weight: bold;
 }
 
 #pkg-list .search input {
-	text-align: center;
+    text-align: center;
 }
 
 #pkg-list .search input::-webkit-input-placeholder {
-	font-size: 0.8em;
-	line-height: 1.5;
-	text-align: center;
+    font-size: 0.8em;
+    line-height: 1.5;
+    text-align: center;
 }
 
 /* Pkg Details */
-#pkg-details h4 {
-	margin: 0.5em 0;
+#pkg-details .actions {
+    margin: 0.25em;
+}
+
+#pkg-details .actions .button {
+    margin: 0 0.25em;
+}
+
+#pkg-details .import {
+    margin: 1em;
+    display: inline-block;
 }
 
 #pkg-details .collapsable-icon {
-	display: none;
+    display: none;
 }
 
 #pkg-details .collapsable .trigger {
-	cursor: pointer;
+    cursor: pointer;
 }
 
 #pkg-details .collapsable .collapsable-icon {
-	font-size: 1.5rem;
-	display: inline-block;
-	margin: 0 1em 0 0;
-
-	transition-property: all;
-	transition-duration: .5s;
-	transition-timing-function: ease;
+    font-size: 1rem;
+    line-height: 3em;
+    float: left;
+    display: block;
+    margin: 0 1em 0 0;
+    transition-property: all;
+    transition-duration: .5s;
+    transition-timing-function: ease;
 }
 
 #pkg-details .collapsable.open .collapsable-icon {
-	-webkit-transform: rotate(90deg);
+    -webkit-transform: rotate(90deg);
 }
 
 #pkg-details .collapsable .content {
-	overflow-y: hidden;
-	max-height: 0;
-
-	transition-property: max-height;
-	transition-duration: .5s;
-	transition-timing-function: ease;
+    overflow-y: hidden;
+    max-height: 0;
+    transition-property: max-height;
+    transition-duration: .5s;
+    transition-timing-function: ease;
 }
 
 #pkg-details .pad {
-	padding: 0.25em 0 0 1.5em;
+    padding: 0.15em 0 0 1em;
 }
 
 /* Loader */
 #loader {
-	z-index: 9001;
-	width: 200px;
-	height: 214px;
-	position: absolute;
-	top: 100%;
-	left: 12.5%;
-	margin-left: -100px;
-
-	transition-property: margin-top;
-	transition-duration: .5s;
-	transition-timing-function: ease;
+    z-index: 9001;
+    width: 200px;
+    height: 214px;
+    position: absolute;
+    top: 100%;
+    left: 12.5%;
+    margin-left: -100px;
+    transition-property: margin-top;
+    transition-duration: .5s;
+    transition-timing-function: ease;
 }
 
 #loader.active {
-	margin-top: -210px;
+    margin-top: -210px;
 }

_static/gulpfile.js

@@ -1,16 +1,24 @@
+'use strict';
 var gulp = require('gulp'),
 	beautify = require('gulp-beautify'),
-	jshint = require('gulp-jshint');
+	jshint = require('gulp-jshint'),
+	cssbeautify = require('gulp-cssbeautify');
 
 gulp.task('beautify', function() {
-  return gulp.src('./_static/js/*.js')
+  return gulp.src('./js/*.js')
     .pipe(beautify())
-    .pipe(gulp.dest('./_static/js/'))
+    .pipe(gulp.dest('./js/'))
+});
+
+gulp.task('css', function() {
+    return gulp.src('./css/*.css')
+        .pipe(cssbeautify())
+        .pipe(gulp.dest('./css/'));;
 });
 
 gulp.task('lint', function() {
-  return gulp.src('./_static/js/*.js')
+  return gulp.src('./js/*.js')
     .pipe(jshint());
 });
 
-gulp.task('default', ['beautify', 'lint']);
+gulp.task('default', ['beautify', 'css', 'lint']);