Initial commit.

app/styles/views/_main.scss

@@ -0,0 +1,35 @@
+.welcome {
+    @extend .jumbotron, .container;
+
+    .select-action {
+        @extend .row;
+
+        margin-top: 25px;
+
+        .new-node, .update-node {
+            @extend .col-md-5;
+
+            button {
+                @extend .btn, .btn-lg, .btn-block;
+            }
+        }
+
+        .new-node {
+            button {
+                @extend .btn-info;
+            }
+        }
+
+        .update-node {
+            button {
+                @extend .btn-primary;
+            }
+        }
+
+        .or {
+            @extend .col-md-2;
+
+            text-align: center;
+        }
+    }
+}

app/styles/views/_newNodeForm.scss

@@ -0,0 +1,7 @@
+.new-node-form {
+    @extend .container;
+}
+
+.node-created {
+    @extend .jumbotron, .container;
+}

app/styles/views/_updateNodeForm.scss

@@ -0,0 +1,7 @@
+.update-node-form {
+    @extend .container;
+}
+
+.node-updated {
+    @extend .jumbotron, .container;
+}

app/styles/views/directives/_help.scss

@@ -0,0 +1,14 @@
+f-help {
+    .help-icon {
+        @extend .fa, .fa-question-circle;
+
+        cursor: pointer;
+        font-size: $font-size-base + 2;
+        margin-left: 5px;
+        color: $brand-info;
+
+        &:hover {
+            color: darken($brand-info, 20%);
+        }
+    }
+}

app/styles/views/directives/_nodeForm.scss

@@ -0,0 +1,77 @@
+f-node-form {
+    h3 {
+        margin-top: 10px;
+    }
+
+    .main-error {
+        @extend .alert, .alert-danger;
+    }
+
+    .node-data, .contact-data, .node-position {
+        @extend .well;
+    }
+
+    .hostname, .key, .mac, .nickname, .email, .coords {
+        @extend .form-group;
+
+        .feedback {
+            @extend .help-block;
+            color: $state-danger-text;
+        }
+    }
+
+    .hostname, .mac, .nickname, .email {
+        label::after {
+            content: '*';
+            font-size: $font-size-small;
+            vertical-align: 0.2em;
+        }
+    }
+
+    .coords input.has-coords {
+        padding-right: 25px;
+    }
+
+    .reset-coords {
+        @extend .fa, .fa-times;
+
+        position: relative;
+        float: right;
+
+        top: -25px;
+        right: 8px;
+
+        cursor: pointer;
+        color: $gray;
+    }
+
+    .map {
+        width: 100%;
+        height: 0;
+        padding-bottom: 66%;
+        margin-top: 5px;
+        margin-bottom: 20px;
+    }
+
+    .buttons {
+        @extend .form-group, .clearfix;
+
+        button {
+            @extend .pull-right;
+        }
+    }
+
+    .save {
+        @extend .btn;
+
+        margin-left: 5px;
+    }
+
+    &.new-node .save {
+        @extend .btn-info;
+    }
+
+    &.update-node .save {
+        @extend .btn-primary;
+    }
+}

app/styles/views/directives/_nodeSaved.scss

@@ -0,0 +1,24 @@
+f-node-saved {
+    .summary, .actions {
+        text-align: center;
+    }
+
+    .summary {
+        .token {
+            @extend .well;
+
+            border: 3px dashed $gray;
+            font-family: monospace;
+            font-size: 32px;
+        }
+
+        margin: {
+            top: 30px;
+            bottom: 30px;
+        }
+    }
+
+    .back-button {
+        @extend .btn, .btn-lg, .btn-info;
+    }
+}

app/styles/views/directives/_tokenForm.scss

@@ -0,0 +1,28 @@
+f-token-form {
+    .main-error {
+        @extend .alert, .alert-danger;
+    }
+
+    .token {
+        @extend .form-group;
+    }
+
+    .feedback {
+        @extend .help-block;
+        color: $state-danger-text;
+    }
+
+    .submit {
+        @extend .btn, .btn-primary;
+
+        margin-left: 5px;
+    }
+
+    .buttons {
+        @extend .clearfix;
+
+        button {
+            @extend .pull-right;
+        }
+    }
+}