From fcff74109a0ddf17fb27d5ac4b54fb080a28456f Mon Sep 17 00:00:00 2001
From: didier amyot <didier.amyot@behavox.com>
Date: Sun, 19 Jan 2020 15:14:21 -0500
Subject: [PATCH] started new web client

---
 api/publisher.go                              |   12 -
 nanomsgpublisher/nanomsgpublisher.go          |   41 -
 static/.bowerrc                               |    3 -
 static/.gitignore                             |    7 -
 static/bower.json                             |   28 -
 static/coffee/app.coffee                      |   64 -
 static/coffee/controllers/apispecCtrl.coffee  |   32 -
 static/coffee/controllers/doormanCtrl.coffee  |   76 -
 .../controllers/doormanErrorCtrl.coffee       |    6 -
 static/coffee/controllers/doormenCtrl.coffee  |    9 -
 static/coffee/controllers/homeCtrl.coffee     |   15 -
 .../coffee/controllers/newdoormanCtrl.coffee  |   82 -
 .../coffee/controllers/serverspecCtrl.coffee  |    7 -
 static/coffee/controllers/sideBarCtrl.coffee  |    6 -
 static/coffee/directives/ratinput.coffee      |   64 -
 static/coffee/filters.coffee                  |    7 -
 static/coffee/main.coffee                     |   21 -
 static/coffee/services/rationals.coffee       |   80 -
 static/gulpfile.js                            |   51 -
 static/img/.gitkeep                           |    0
 static/index.html                             |   59 +-
 static/index.js                               |  215 +++
 static/package.json                           |   15 -
 static/partials/apispec.html                  |   53 -
 static/partials/doorman.html                  |   92 --
 static/partials/doormanError.html             |   11 -
 static/partials/doormen.html                  |   13 -
 static/partials/home.html                     |   31 -
 static/partials/newdoorman.html               |  101 --
 static/partials/serverspec.html               |   55 -
 static/scss/_doorman.scss                     |   67 -
 static/scss/_settings.scss                    | 1453 -----------------
 static/scss/style.scss                        |   41 -
 33 files changed, 232 insertions(+), 2585 deletions(-)
 delete mode 100644 nanomsgpublisher/nanomsgpublisher.go
 delete mode 100644 static/.bowerrc
 delete mode 100644 static/.gitignore
 delete mode 100644 static/bower.json
 delete mode 100644 static/coffee/app.coffee
 delete mode 100644 static/coffee/controllers/apispecCtrl.coffee
 delete mode 100644 static/coffee/controllers/doormanCtrl.coffee
 delete mode 100644 static/coffee/controllers/doormanErrorCtrl.coffee
 delete mode 100644 static/coffee/controllers/doormenCtrl.coffee
 delete mode 100644 static/coffee/controllers/homeCtrl.coffee
 delete mode 100644 static/coffee/controllers/newdoormanCtrl.coffee
 delete mode 100644 static/coffee/controllers/serverspecCtrl.coffee
 delete mode 100644 static/coffee/controllers/sideBarCtrl.coffee
 delete mode 100644 static/coffee/directives/ratinput.coffee
 delete mode 100644 static/coffee/filters.coffee
 delete mode 100644 static/coffee/main.coffee
 delete mode 100644 static/coffee/services/rationals.coffee
 delete mode 100644 static/gulpfile.js
 delete mode 100755 static/img/.gitkeep
 create mode 100644 static/index.js
 delete mode 100644 static/package.json
 delete mode 100644 static/partials/apispec.html
 delete mode 100644 static/partials/doorman.html
 delete mode 100644 static/partials/doormanError.html
 delete mode 100644 static/partials/doormen.html
 delete mode 100644 static/partials/home.html
 delete mode 100644 static/partials/newdoorman.html
 delete mode 100644 static/partials/serverspec.html
 delete mode 100644 static/scss/_doorman.scss
 delete mode 100644 static/scss/_settings.scss
 delete mode 100644 static/scss/style.scss

diff --git a/api/publisher.go b/api/publisher.go
index d4bc35d..fd45957 100644
--- a/api/publisher.go
+++ b/api/publisher.go
@@ -4,7 +4,6 @@ import (
 	"log"
 
 	"github.com/didiercrunch/doormanserver/logpublisher"
-	"github.com/didiercrunch/doormanserver/nanomsgpublisher"
 	"github.com/didiercrunch/doormanserver/nsqpublisher"
 	"github.com/didiercrunch/doormanserver/shared"
 	"gopkg.in/mgo.v2/bson"
@@ -25,21 +24,10 @@ func initNSQPublisher() {
 	}
 }
 
-func initNanoMsgPublisher() {
-	publisher = new(nanomsgpublisher.NanoMsgPublisher)
-	if err := publisher.Init(); err != nil {
-		log.Panic(err)
-		return
-	}
-}
-
 func initPublisher(params *shared.Params) {
 	if params.UseNSQ() {
 		initNSQPublisher()
 		log.Println("using nsq as message queue")
-	} else if params.UseNanomsg() {
-		initNanoMsgPublisher()
-		log.Println("using nanomsg as message queue")
 	} else {
 		publisher = &logpublisher.LogPublisher{log.Println}
 		log.Println("using stdout as message queue")
diff --git a/nanomsgpublisher/nanomsgpublisher.go b/nanomsgpublisher/nanomsgpublisher.go
deleted file mode 100644
index 2c2a767..0000000
--- a/nanomsgpublisher/nanomsgpublisher.go
+++ /dev/null
@@ -1,41 +0,0 @@
-package nanomsgpublisher
-
-import (
-	"errors"
-	"log"
-
-	"github.com/didiercrunch/doormanserver/shared"
-	"github.com/go-mangos/mangos"
-	"github.com/go-mangos/mangos/protocol/pub"
-	"github.com/go-mangos/mangos/transport/ipc"
-	"github.com/go-mangos/mangos/transport/tcp"
-	"gopkg.in/mgo.v2/bson"
-)
-
-type NanoMsgPublisher struct {
-	Url  string
-	sock mangos.Socket
-}
-
-func (p *NanoMsgPublisher) Init() error {
-	var err error
-	if p.sock, err = pub.NewSocket(); err != nil {
-		return errors.New("can't listen on pub socket:" + err.Error())
-	}
-	p.sock.AddTransport(ipc.NewTransport())
-	p.sock.AddTransport(tcp.NewTransport())
-	if err = p.sock.Listen(shared.GetParams().NanoMsg.NanoMsgUrl); err != nil {
-		return errors.New("can't listen on pub socket: %s" + err.Error())
-	}
-	return nil
-
-}
-
-func (p *NanoMsgPublisher) Emit(doormanId bson.ObjectId, doorman shared.AsDoormanUpdatePayloader) error {
-	log.Println("Emit for ", doormanId.Hex())
-	if d, err := doorman.AsDoormanUpdatePayload(); err != nil {
-		return err
-	} else {
-		return p.sock.Send(d)
-	}
-}
diff --git a/static/.bowerrc b/static/.bowerrc
deleted file mode 100644
index 5773025..0000000
--- a/static/.bowerrc
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-  "directory": "app/bower_components"
-}
diff --git a/static/.gitignore b/static/.gitignore
deleted file mode 100644
index ea220bf..0000000
--- a/static/.gitignore
+++ /dev/null
@@ -1,7 +0,0 @@
-logs/*
-!.gitkeep
-node_modules/
-bower_components/
-tmp
-.DS_Store
-.idea
diff --git a/static/bower.json b/static/bower.json
deleted file mode 100644
index f931f32..0000000
--- a/static/bower.json
+++ /dev/null
@@ -1,28 +0,0 @@
-{
-  "name": "angular-requirejs-seed",
-  "description": "AngularJS seed project modified for requireJS support.",
-  "version": "0.2.0",
-  "homepage": "https://github.com/tnajdek/angular-requirejs-seed",
-  "license": "MIT",
-  "ignore": [
-    "**/.*",
-    "node_modules",
-    "bower_components",
-    "test",
-    "tests"
-  ],
-  "dependencies": {
-    "angular": "~1.2.1",
-    "angular-route": "~1.2.1",
-    "angular-scenario": "~1.2.1",
-    "angular-mocks": "~1.2.1",
-    "requirejs": "~2.1.9",
-    "requirejs-text": "~2.0.10",
-    "html5-boilerplate": "~4.3.0",
-    "angularAMD": "~0.2.1",
-    "angular-foundation": "~0.5.1",
-    "lodash": "~3.9.3",
-    "font-awesome": "~4.3.0",
-    "bourbon": "~4.2.3"
-  }
-}
diff --git a/static/coffee/app.coffee b/static/coffee/app.coffee
deleted file mode 100644
index 4a397dd..0000000
--- a/static/coffee/app.coffee
+++ /dev/null
@@ -1,64 +0,0 @@
-
-define [
-    "angularAMD"
-    "lodash"
-    "angular-route"
-    "foundation"
-
-], (angularAMD, _) ->
-    app = angular.module("webapp", ["ngRoute", "mm.foundation"])
-    app.config ($routeProvider) ->
-        $routeProvider.when("/", angularAMD.route(
-            templateUrl: "partials/home.html"
-            controller: "HomeCtrl"
-            controllerUrl: "controllers/homeCtrl"
-        )).when("/serverspec", angularAMD.route(
-            templateUrl: "partials/serverspec.html"
-            controller: "ServerspecCtrl"
-            controllerUrl: "controllers/serverspecCtrl"
-        )).when("/apispec", angularAMD.route(
-            templateUrl: "partials/apispec.html"
-            controller: "ApispecCtrl"
-            controllerUrl: "controllers/apispecCtrl"
-        )).when("/newdoorman", angularAMD.route(
-            templateUrl: "partials/newdoorman.html"
-            controller: "NewDoormanCtrl"
-            controllerUrl: "controllers/newdoormanCtrl"
-        )).when("/doormen", angularAMD.route(
-            templateUrl: "partials/doormen.html"
-            controller: "DoormenCtrl"
-            controllerUrl: "controllers/doormenCtrl"
-        )).when("/doormen/error/:error/:id", angularAMD.route(
-            templateUrl: "partials/doormanError.html"
-            controller: "DoormanErrorCtrl"
-            controllerUrl: "controllers/doormanErrorCtrl"
-        )).when("/doormen/:id", angularAMD.route(
-            templateUrl: "partials/doorman.html"
-            controller: "DoormanCtrl"
-            controllerUrl: "controllers/doormanCtrl"
-        )).otherwise({redirectTo: "/"})
-
-        document.getElementsByTagName("body")[0].style.visibility = ""
-        return
-
-    app.controller "topbarCtrl", ["$scope", "$rootScope", "$location", ($scope, $rootScope, $location) ->
-
-        $scope.init = () ->
-            $scope.email = localStorage.getItem("email")
-            $scope.loggedIn = !!$scope.email
-            if !$scope.loggedIn
-                $location.path('/').replace()
-
-        $scope.logout = () ->
-            localStorage.setItem("email", "")
-            $scope.email = ""
-            $scope.loggedIn = false
-            $scope.$emit("logout")
-
-        $scope.init()
-        $rootScope.$on('login', $scope.init)
-        return
-    ]
-
-
-    angularAMD.bootstrap(app)
diff --git a/static/coffee/controllers/apispecCtrl.coffee b/static/coffee/controllers/apispecCtrl.coffee
deleted file mode 100644
index 6c7dac6..0000000
--- a/static/coffee/controllers/apispecCtrl.coffee
+++ /dev/null
@@ -1,32 +0,0 @@
-define ["app", "angularAMD"], (app, angularAMD) ->
-    app.controller "ApispecCtrl",['$scope', '$http', ($scope, $http) ->
-        $http.get("/api/documentation").then (res)->
-            $scope.endpoints = res.data.endpoints
-
-        $scope.methods =
-            get: "GET"
-            post: "POST"
-    ]
-
-    angularAMD.directive "wabMethod", () ->
-        directive =
-                restrict: 'E',
-                scope:
-                  method: '@'
-                link: (scope, element) ->
-                    scope.methods =
-                        get: "GET"
-                        put: "PUT"
-                        delete: "DELETE"
-                        post: "POST"
-
-                template: '<code style="width:5em; display: block; text-align: center;">{{ methods[method] }}</code>'
-        return directive
-
-    angularAMD.directive "wabApi", () ->
-        directive =
-            restrict: 'E',
-            scope:
-                endpoint: '@'
-            template: '<a>/api{{ endpoint }}</a>'
-        return directive
diff --git a/static/coffee/controllers/doormanCtrl.coffee b/static/coffee/controllers/doormanCtrl.coffee
deleted file mode 100644
index 5d9f23b..0000000
--- a/static/coffee/controllers/doormanCtrl.coffee
+++ /dev/null
@@ -1,76 +0,0 @@
-define ["app", "lodash", "directives/ratinput"], (app, _, ratinput) ->
-
-    app.controller "DoormanCtrl", ["$scope", "$http","$routeParams","$location", "$timeout", ($scope, $http, $routeParams, $location, $timeout) ->
-        $scope.doorman = {values: []}
-        $scope.somevalue = "2/6"
-        $scope.apiurl = "/api/doormen/#{$routeParams.id}"
-        $scope.user = localStorage.getItem("email")
-        $scope.doormanChanged = false
-
-        $http.get($scope.apiurl).then((res) ->
-            $scope.doorman = res.data
-            $scope.isAdmin = _.contains($scope.doorman.emails, $scope.user)
-            $scope.initEmails()
-
-        ).catch((res) ->
-            if res.status == 404
-                $location.path("/doormen/error/#{res.status}/#{$routeParams.id}")
-        )
-
-        $scope.deleteDoorman = () ->
-            console.log("not yet implemented")
-
-        $scope.initEmails = () ->
-            [$scope.leftEmailColumns, $scope.rightEmailColumns] = _.chunk($scope.doorman.emails, 2)
-
-        $scope.rationalToFloat = (rat) ->
-            if _.contains(rat, "/")
-                num = Number(rat.substr(0, rat.indexOf("/")))
-                denum = Number(rat.substr(rat.indexOf("/") + 1))
-                return num / denum
-            Number(rat)
-
-
-        $scope.validate = ()->
-            ret = 0
-            for val in $scope.doorman.values
-                ret += $scope.rationalToFloat(val.probability)
-            return Math.abs(ret - 1.0) < 0.000001
-
-        $scope.addNewAuthorEmail = () ->
-            if not $scope.canAddNewEmail()
-                return
-            $scope.doorman.emails.push($scope.newEmail)
-            $scope.updateDoorman()
-            $scope.newEmail = ""
-            $scope.initEmails()
-
-        $scope.removeEmail = (email) ->
-            $scope.doorman.emails = _.reject($scope.doorman.emails , (email_) -> email_ == email)
-            $scope.initEmails()
-            $scope.updateDoorman()
-
-        $scope.canAddNewEmail = ()->
-            if !$scope.newEmail or $scope.newEmail.length < 5
-                return false
-            not _.contains($scope.doorman.emails, $scope.newEmail)
-
-
-        $scope.updateDoorman = () ->
-            if !$scope.validate()
-                return
-            params = {params: {user: $scope.user}}
-            $http.put($scope.apiurl, $scope.doorman, params).then((ret)->
-                console.log "update"
-            ).then((res) ->
-                $scope.doormanChanged = true
-                $timeout(() ->
-                    $scope.doormanChanged = false
-                , 3000)
-            ).catch((res) ->
-                $scope.error =
-                    message: res.data
-                    status : res.status
-            )
-    ]
-    return
diff --git a/static/coffee/controllers/doormanErrorCtrl.coffee b/static/coffee/controllers/doormanErrorCtrl.coffee
deleted file mode 100644
index aca9ead..0000000
--- a/static/coffee/controllers/doormanErrorCtrl.coffee
+++ /dev/null
@@ -1,6 +0,0 @@
-define ["app"], (app) ->
-    app.controller "DoormanErrorCtrl", ["$scope","$routeParams", ($scope, $routeParams) ->
-        $scope.id = $routeParams.id
-        $scope.error = Number($routeParams.error)
-    ]
-    return
diff --git a/static/coffee/controllers/doormenCtrl.coffee b/static/coffee/controllers/doormenCtrl.coffee
deleted file mode 100644
index 0a15622..0000000
--- a/static/coffee/controllers/doormenCtrl.coffee
+++ /dev/null
@@ -1,9 +0,0 @@
-define ["app"], (app) ->
-    app.controller "DoormenCtrl",[ "$scope", "$http", ($scope, $http) ->
-        $scope.doormen = []
-        $http.get("/api/doormen").then (res) ->
-            $scope.doormen = res.data.doormen
-        return
-    ]
-
-    return
diff --git a/static/coffee/controllers/homeCtrl.coffee b/static/coffee/controllers/homeCtrl.coffee
deleted file mode 100644
index 4115ff2..0000000
--- a/static/coffee/controllers/homeCtrl.coffee
+++ /dev/null
@@ -1,15 +0,0 @@
-define ["app"], (app) ->
-    app.controller "HomeCtrl", ['$scope', '$rootScope', ($scope, $rootScope) ->
-        $scope.init = () ->
-            $scope.loggedEmail = localStorage.getItem("email")
-
-        $scope.login = () ->
-            if $scope.email
-                localStorage.setItem("email", $scope.email)
-                $scope.loggedEmail = $scope.email
-                $scope.email = ""
-                $scope.$emit("login")
-
-        $scope.init()
-        $rootScope.$on('logout', $scope.init)
-    ]
diff --git a/static/coffee/controllers/newdoormanCtrl.coffee b/static/coffee/controllers/newdoormanCtrl.coffee
deleted file mode 100644
index b0d4107..0000000
--- a/static/coffee/controllers/newdoormanCtrl.coffee
+++ /dev/null
@@ -1,82 +0,0 @@
-epsilon = 0.0001
-
-define ["app", "lodash", "../filters", "directives/ratinput"], (app, _, filters, ratinput) ->
-    app.controller "NewDoormanCtrl", ["$scope", "$http", "$location", "rationals", ($scope, $http, $location, rationals) ->
-        $scope.error = ""
-        $scope.user = localStorage.getItem("email")
-        $scope.value = {probability: "1", name: ""}
-        $scope.payload =
-            name: ""
-            values: []
-            emails: [$scope.user]
-
-        $scope.isValidValue = () ->
-            return $scope.value.name
-
-        $scope.addNewValue = () ->
-            if !$scope.isValidValue()
-                return
-            $scope.payload.values.push($scope.value)
-            $scope.value =
-                name: ""
-                probability: $scope.getProbabilityRemaining()
-
-        $scope.removeValue = (idx) ->
-            $scope.payload.values.splice(idx, 1);
-
-        $scope.getProbabilityRemaining = () ->
-            sum = rationals.sum(_.pluck($scope.payload.values, "probability")...)
-            return rationals.minus("1", sum)
-
-
-        $scope.redirectToDoorman = (doormanLocation) ->
-            $http.get(doormanLocation).then (res) ->
-                id = res.data.id
-                return  $location.url("/doormen/#{id}")
-
-        $scope.getPayload = () ->
-            payload = _.cloneDeep($scope.payload)
-            for value in payload.values
-                value.probability = value.probability
-            return payload
-
-        $scope.createDoorman = () ->
-            if not $scope.isDoormanValid()
-                return
-            params = {params: {user: $scope.user}}
-            $http.post("/api/doormen", $scope.getPayload(), params).
-            then((res, s) ->
-                $scope.redirectToDoorman(res.headers("location"))
-            ).catch((res) ->
-                $scope.error = res.data
-            )
-
-        $scope.isDoormanValid = () ->
-            if not $scope.payload.name
-                return false
-            if $scope.payload.values.length < 2
-                return false
-            rationals.equal($scope.getProbabilityRemaining(), "0" )
-
-
-        $scope.addEmail = () ->
-            if not $scope.newEmail
-                return
-            $scope.payload.emails.push($scope.newEmail)
-            $scope.newEmail = ""
-
-        $scope.removeEmail = (idx) ->
-            if $scope.payload.emails[idx] == $scope.user
-                return
-            $scope.payload.emails.splice(idx, 1);
-
-        $scope.getSum = () ->
-            probs = _.pluck($scope.payload.values, "probability")
-            return rationals.pp(rationals.sum(probs...))
-
-
-
-        return
-    ]
-
-    return
diff --git a/static/coffee/controllers/serverspecCtrl.coffee b/static/coffee/controllers/serverspecCtrl.coffee
deleted file mode 100644
index bfe5ccb..0000000
--- a/static/coffee/controllers/serverspecCtrl.coffee
+++ /dev/null
@@ -1,7 +0,0 @@
-define ["app"], (app) ->
-    app.controller "ServerspecCtrl",["$scope", "$http", ($scope, $http) ->
-        $scope.server = {}
-        $http.get("/api/server").then (res) -> $scope.server = res.data
-        return
-    ]
-    return
diff --git a/static/coffee/controllers/sideBarCtrl.coffee b/static/coffee/controllers/sideBarCtrl.coffee
deleted file mode 100644
index 9b586e6..0000000
--- a/static/coffee/controllers/sideBarCtrl.coffee
+++ /dev/null
@@ -1,6 +0,0 @@
-define ["app"], (app) ->
-    app.controller "sideBarCtrl", ($scope) ->
-        $scope.message = "Message from MyCtrl1"
-        return
-
-    return
diff --git a/static/coffee/directives/ratinput.coffee b/static/coffee/directives/ratinput.coffee
deleted file mode 100644
index 5a2edfe..0000000
--- a/static/coffee/directives/ratinput.coffee
+++ /dev/null
@@ -1,64 +0,0 @@
-template = """
-<div class="row rat-input">
-    <div class="row" ng-show="!edit" >
-        <div class="columns large-12" style="text-align: center;">
-            <span class="fraction-box" ng-click="enableEdit()">
-                <span  ng-bind="nominator"></span> &frasl; <span ng-bind="denominator" ></span>
-                <i class="fa fa-pencil-square-o" ng-show="!ngDisabled"></i>
-            </span>
-        </div>
-    </div>
-    <div  ng-show="edit" class="edit">
-        <form  ng-submit="edit=false">
-            <div class="large-12 columns" style="text-align: center;">
-                <input ng-model="nominator" type="text" ng-change="changeModel()"  ng-disabled="ngDisabled">
-                <span style="text-align: center;">&frasl;<span>
-                <input ng-model="denominator" type="text" ng-change="changeModel()" ng-disabled="ngDisabled">
-                <i class="fa fa-check" ng-click="edit=false"></i>
-                <input type="submit" style="display:none;">
-            </div>
-        </form>
-    </div>
-</div>
-"""
-
-
-define ["app", "angularAMD", "lodash", "services/rationals"], (app, angularAMD, _, rationals) ->
-
-    angularAMD.directive "ratInput", () ->
-        directive =
-                restrict: 'E',
-                template: template
-                scope:
-                    ngModel: "="
-                    ngDisabled: "="
-                controller: [ '$scope', "rationals", ($scope, rationals) ->
-
-                    $scope.getNominator = ()->
-                        if _.contains($scope.ngModel, "/")
-                            return Number($scope.ngModel.substr(0, $scope.ngModel.indexOf("/")))
-                        Number($scope.ngModel)
-
-                    $scope.getDenominator = () ->
-                        if _.contains($scope.ngModel, "/")
-                            return Number($scope.ngModel.substr($scope.ngModel.indexOf("/") + 1))
-                        1
-
-                    $scope.changeModel = ()->
-                        $scope.ngModel = rationals.newRat($scope.nominator, $scope.denominator)
-
-                    $scope.enableEdit = () ->
-                        if not $scope.ngDisabled
-                            $scope.edit = true
-
-                    $scope.init = () ->
-                        $scope.nominator = rationals.getNominator($scope.ngModel)
-                        $scope.denominator = $scope.getDenominator()
-
-                    $scope.$watch 'ngModel', () ->
-                        $scope.init()
-
-                    $scope.init()
-
-                ]
-        return directive
diff --git a/static/coffee/filters.coffee b/static/coffee/filters.coffee
deleted file mode 100644
index 8000215..0000000
--- a/static/coffee/filters.coffee
+++ /dev/null
@@ -1,7 +0,0 @@
-define ['angularAMD', 'app'], (angular, app) ->
-    app.filter 'reverse', ->
-        (items) ->
-            if !Array.isArray(items)
-                return false
-            items.slice().reverse()
-    return
diff --git a/static/coffee/main.coffee b/static/coffee/main.coffee
deleted file mode 100644
index 25e6863..0000000
--- a/static/coffee/main.coffee
+++ /dev/null
@@ -1,21 +0,0 @@
-require.config
-    baseUrl: "js"
-
-    # alias libraries paths.  Must set 'angular'
-    paths:
-        "angular"      : "/bower_components/angular/angular.min"
-        "angular-route": "/bower_components/angular-route/angular-route.min"
-        "angularAMD"   : "/bower_components/angularAMD/angularAMD.min"
-        "foundation"   : "/bower_components/angular-foundation/mm-foundation-tpls"
-        "lodash"       : "/bower_components/lodash/lodash.min"
-
-
-    # Add angular modules that does not support AMD out of the box, put it in a shim
-    shim:
-        "angularAMD": ["angular"]
-        "angular-route": ["angular"]
-        "foundation" : ["angular"]
-
-
-    # kick start application
-    deps: ["app"]
diff --git a/static/coffee/services/rationals.coffee b/static/coffee/services/rationals.coffee
deleted file mode 100644
index d31e483..0000000
--- a/static/coffee/services/rationals.coffee
+++ /dev/null
@@ -1,80 +0,0 @@
-define ["app", "angularAMD", "lodash"], (app, angularAMD, _) ->
-
-    app.service "rationals", () ->
-        service =
-            getNominator: (rat) ->
-                if _.contains(rat, "/")
-                    return Number(rat.substr(0, rat.indexOf("/")))
-                Number(rat)
-
-            getDenominator: (rat) ->
-                if _.contains(rat, "/")
-                    return Number(rat.substr(rat.indexOf("/") + 1))
-                1
-
-            getNomDenom: (rat) ->
-                return [service.getNominator(rat), service.getDenominator(rat)]
-
-            gcd: (a, b) ->
-                if b == 0
-                    return a
-                return service.gcd(b, a % b)
-
-            lcm: (a, b) ->
-                return a * b / service.gcd(a, b)
-
-            changeDenominator: (rat, newDenom) ->
-                [nom, denom] = service.getNomDenom(rat)
-                return service.newRat( nom *  newDenom / denom,  newDenom)
-
-            add: (rat1, rat2) ->
-                [nom, denom] = service.getNomDenom(rat2)
-                [nNom, nDenom] = service.getNomDenom(rat1)
-                gcd = service.gcd(nDenom, denom)
-
-                rNom = nom*nDenom + nNom * denom
-                rDenom = denom * nDenom
-                return service.newRat(rNom/gcd , rDenom/gcd)
-
-            minus: (rat1, rat2) ->
-                return service.add(rat1, service.opposite(rat2))
-
-            reduce: (rat) ->
-                [nom, denom] = service.getNomDenom(rat)
-                gcd = service.gcd(nom, denom)
-                return service.newRat(nom/gcd, denom/gcd)
-
-            opposite: (rat) ->
-                [nom, denom] = service.getNomDenom(rat)
-                return service.newRat(-nom, denom)
-
-
-            sum: (rats...) ->
-                ret = "0/1"
-                for rat in rats
-                    ret = service.add(ret, rat)
-                return service.reduce(ret)
-
-            equal: (rat1, rat2) ->
-                [nom1, denom1] = service.getNomDenom(rat1)
-                [nom2, denom2] = service.getNomDenom(rat2)
-                return nom1 * denom2 == nom2 * denom1
-
-            pp: (x) ->
-                [num, denum] = service.getNomDenom(service.reduce(x))
-                if denum == 1
-                    return num
-                return "#{num}/#{denum}"
-
-
-            newRat: (nom , denom) ->
-                if nom * denom >= 0
-                    return "#{Math.abs(nom)}/#{Math.abs(denom)}"
-                return "#{-Math.abs(nom)}/#{Math.abs(denom)}"
-
-        return service
-
-    app.filter "ratpp", ["rationals", (rationals) ->
-        filter = (n) ->
-            return rationals.pp(n)
-        ]
diff --git a/static/gulpfile.js b/static/gulpfile.js
deleted file mode 100644
index 660ccfa..0000000
--- a/static/gulpfile.js
+++ /dev/null
@@ -1,51 +0,0 @@
-var bower = require('gulp-bower');
-var gulp = require('gulp');
-var coffee = require('gulp-coffee');
-var help = require('gulp-task-listing');
-var clean = require('gulp-clean');
-var sass = require('gulp-sass');
-var rjs = require("gulp-rjs");
-var gutil = require('gulp-util');
-
-
-gulp.task('help', help);
-
-gulp.task('bower', function() {
-    return bower()
-        .pipe(gulp.dest('bower_components/'))
-});
-
-gulp.task('sass', ['bower'], function () {
-    return gulp.src('./scss/*.scss')
-        .pipe(sass({includePaths: ['bower_components/foundation/scss', 'bower_components/bourbon/app/assets/stylesheets']}))
-        .pipe(gulp.dest('./css'));
-});
-
-gulp.task('coffee', ['bower'], function() {
-    return gulp.src('coffee/**/*.coffee')
-        .pipe(coffee({bare: true}).on('error', gutil.log))
-        .pipe(gulp.dest('js/'))
-});
-
-gulp.task('clean', function(){
-    return gulp.src(["js/", "bower_components/", "css/"], {read: false})
-        .pipe(clean())
-});
-
-
-gulp.task('rjs', ['coffee'], function(){
-    return gulp.src('coffee/**/*.coffee')
-        .pipe(coffee())
-        .pipe(gulp.dest('./dist'))
-        .pipe(rjs({baseUrl:'.'}))
-});
-
-
-gulp.task('default', ['bower', 'sass', 'coffee']);
-
-
-
-gulp.task('dev', ['bower', 'sass', 'coffee'], function(){
-    gulp.watch('coffee/**/*.coffee', ['coffee']);
-    gulp.watch('./scss/*.scss', ['sass']);
-});
diff --git a/static/img/.gitkeep b/static/img/.gitkeep
deleted file mode 100755
index e69de29..0000000
diff --git a/static/index.html b/static/index.html
index 485b4a9..7baecc3 100644
--- a/static/index.html
+++ b/static/index.html
@@ -1,47 +1,22 @@
 <!DOCTYPE html>
+
 <html>
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
 
-    <head>
-        <title>doorman</title>
-        <link rel="stylesheet" href="css/style.css">
-        <link rel="stylesheet" href="bower_components/font-awesome/css/font-awesome.min.css">
-        <script data-main="/js/main" src="/bower_components/requirejs/require.js"></script>
-    </head>
-
-    <body style="visibility:hidden;">
-        <div ng-controller="topbarCtrl">
-            <top-bar>
-                <ul class="title-area">
-                    <li class="name">
-                        <h1><a href="#/">Doorman</a></h1>
-                    </li>
-                    <li toggle-top-bar class="menu-icon"><a >Menu</a></li>
-                </ul>
-
-                <top-bar-section>
-                    <ul class="left show-for-large-up">
-                        <li>
-                            <a ng-bind="email" href="#"></a>
-                        </li>
-                    </ul>
-
-                    <ul class="right">
-                        <li has-dropdown>
-                            <a >Dropdown</a>
-                            <ul top-bar-dropdown ng-show="loggedIn">
-                                <li><a href="#/doormen">doormen</a></li>
-                                <li><a href="#/newdoorman">new doorman</a></li>
-                                <li><a href="#/apispec">api specification</a></li>
-                                <li><a href="#/serverspec">server specification</a></li>
-                                <li ng-click="logout()"><a href="#/">logout</a></li>
-                            </ul>
-                        </li>
-                    </ul>
-                </top-bar-section>
-            </top-bar>
-        </div>
-
-        <div class="large-12 small-12 columns" ng-view></div>
-   </body>
+    <script defer src="https://use.fontawesome.com/releases/v5.3.1/js/all.js"></script>
+    <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/lodash@4.17.15/lodash.min.js"></script>
+    <script src="https://unpkg.com/mithril/mithril.js"></script>
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.8.0/css/bulma.min.css">
 
+  </head>
+  <body >
+    <section class="section">
+    <div class="container">
+      <div id="mithril"></div>
+    </div>
+  </section>
+    <script src="index.js"></script>
+  </body>
 </html>
diff --git a/static/index.js b/static/index.js
new file mode 100644
index 0000000..97e916e
--- /dev/null
+++ b/static/index.js
@@ -0,0 +1,215 @@
+(function(){
+  const Ratio = (n, d) => ({
+          type: 'Ratio',
+          'n': n, // numerator
+          'd': d // denominator
+      });
+
+  const approxRatio = eps => n => {
+        const
+            gcde = (e, x, y) => {
+                const _gcd = (a, b) => (b < e ? a : _gcd(b, a % b));
+                return _gcd(Math.abs(x), Math.abs(y));
+            },
+            c = gcde(Boolean(eps) ? eps : (1 / 10000), 1, n);
+        return Ratio(
+            Math.floor(n / c), // numerator
+            Math.floor(1 / c) // denominator
+        );
+    };
+
+  var topBar = {}
+
+  function fontawesome(){
+    const classes = _.map(arguments, x => "." + x).reduce((s, n) => s + n);
+    return m('i' + classes);
+  }
+
+  var TopBar = {
+    view: function(){
+      return m('nav.navbar', [
+        m('div.navbar-brand',
+          m('a.navbar-item', {href: "#!/"}, "Doorman ", fontawesome('fas', 'fa-door-open'))),
+        m('div.navbar-menu', [
+          m('div.navbar-end', [
+            m('a.navbar-item',  {href: "#!/server"}, "Server"),
+            m('a.navbar-item',  {href: "#!/new-doorman"}, "New Doorman"),
+          ])
+        ])
+      ]);
+    }
+  }
+
+  var Home = {};
+
+  Home.doormen = [];
+
+  Home.oninit = function(){
+    m.request({method: "GET", url: "/api/doormen"}).then(data => Home.doormen = data.doormen);
+  }
+
+  Home.doorman = function(doorman, idx){
+    const link = "#!/doorman/" + doorman.id
+    return m('li', m('a', {href: link}, doorman.name));
+  }
+
+  Home.view = function() {
+      return m("main", [
+          m(TopBar),
+          m("h1", {class: "title"}, "Home"),
+          m('div.content',
+            m('ul', _.map(Home.doormen, Home.doorman)))
+      ]);
+  }
+
+  var NewDoorman = {}
+
+
+  NewDoorman.oninit = function(){
+    NewDoorman.clear();
+  }
+
+  NewDoorman.setToPayload = function(field){
+    return function(e){
+      _.set(NewDoorman.payload, field, e.target.value);
+    }
+  }
+
+  NewDoorman.nameField = function(){
+    const fields = {
+      type: 'text',
+      placeholder: 'Background Colour dsds',
+      onchange: NewDoorman.setToPayload('foo')};
+    return m('label.label', 'Name',
+       m('input.input', fields));
+  }
+
+  NewDoorman.ownerField = function(email, idx){
+    const label = 'Owner ' + (idx + 1);
+    const fields = {
+      type: 'text',
+      value: email,
+      onchange: NewDoorman.setToPayload(['OwnerEmails', idx])}
+    return m('label.label', label,
+      m('input.input', fields));
+  }
+
+  NewDoorman.putEmptyOwnerFields = function(){
+    NewDoorman.payload.OwnerEmails = _(NewDoorman.payload.OwnerEmails)
+      .filter(x => !_.isEmpty(x))
+      .concat('')
+      .value();
+  }
+
+  NewDoorman.ownerFields = function(){
+    return m('fieldset', {onchange: NewDoorman.putEmptyOwnerFields()},
+      m('legend', 'Owners'),
+        _.map(NewDoorman.payload.OwnerEmails, NewDoorman.ownerField));
+  }
+  NewDoorman.valueField = function(value, idx){
+    const nameField = m('div.field',
+      m('label', 'name',
+        m('input.input', {type: 'text', value: value.name, onchange: NewDoorman.setToPayload(['Values', idx, 'name'])})));
+    const valueField = m('div.field', m('label', 'value', m('input.input', {type: 'number', value: value.value, onchange: NewDoorman.setToPayload(['Values', idx, 'value'])})));
+
+    return m('div.columns',
+        m('div.column', nameField),
+        m('div.column', valueField));
+  }
+
+  NewDoorman.putEmptyValueFields = function() {
+    const hasEmptyNames = _(NewDoorman.payload.Values).map('name').filter(_.isEmpty).value().length;
+    const hasEmptyValues = _(NewDoorman.payload.Values).map('value').filter(_.isEmpty).value().length;
+    const sum = _(NewDoorman.payload.Values).map('value').map(x => parseInt(x)).sum();
+    if(sum >= 100 || hasEmptyNames || hasEmptyValues){
+      return;
+    }
+    NewDoorman.payload.Values.push({name: '', value: 100 - sum});
+  }
+
+  NewDoorman.valueFields = function(){
+    return m('fieldset', {onchange: NewDoorman.putEmptyValueFields}, m('legend', 'Values'),
+      _.map(NewDoorman.payload.Values, NewDoorman.valueField));
+  }
+
+  NewDoorman.clear = function(){
+    NewDoorman.payload = {
+      OwnerEmails: [],
+      Values: [{}]
+    };
+  }
+
+  NewDoorman.buttons = function(){
+    return m('div.buttons', [
+      m('button.button.is-primary.is-light', 'Create'),
+      m('button.button.is-danger.is-light', {onclick: NewDoorman.clear}, 'Clear')
+    ])
+  }
+
+  NewDoorman.view = function(){
+    return m('div',
+      m(TopBar),
+      m('form', [
+        NewDoorman.nameField(),
+        m('br'),
+        NewDoorman.ownerFields(),
+        m('br'),
+        NewDoorman.valueFields(),
+        m('br'),
+        NewDoorman.buttons()
+      ]))
+  }
+
+  var Server = {}
+
+  Server.data = {};
+
+  Server.oninit= function(){
+    m.request({method: "GET", url: "/api/server"})
+    .then(function(data) {
+        Server.data = data;
+    });
+  }
+
+  Server.renderRow = function(value, key){
+    return m('tr', [
+      m('td', key),
+      m('td', _.isObject(value) ? JSON.stringify(value) : value)]);
+  }
+
+  Server.renderTable = function(serverData){
+    const rows = _.map(serverData, Server.renderRow);
+    return m('table.table.is-bordered.is-striped.is-hoverable', rows);
+  }
+
+  Server.view = function() {
+    return m("div", [
+             m(TopBar),
+             m("h1", {class: "title"}, "Server"),
+             Server.renderTable(Server.data)
+      ]);
+  }
+
+  var Doorman = {};
+  Doorman.doorman = {}
+
+  Doorman.oninit = function(vnode){
+    m.request({method: "GET", url: "/api/doormen"})
+      .then(data => _(data.doormen).filter(x => x.id == vnode.attrs.doormanId).map('url').first())
+      .then(url => m.request({method: "GET", url: url}))
+      .then(data => Doorman.doorman = data);
+  }
+
+  Doorman.view = function(vnode){
+    return m('div', [m(TopBar),'blah' + JSON.stringify(Doorman.doorman)])
+
+  }
+
+  m.route(document.getElementById('mithril'), "/", {
+    "/": Home,
+    "/server": Server,
+    "/new-doorman": NewDoorman,
+    "/doorman/:doormanId": Doorman,
+  });
+
+})();
diff --git a/static/package.json b/static/package.json
deleted file mode 100644
index 75c3637..0000000
--- a/static/package.json
+++ /dev/null
@@ -1,15 +0,0 @@
-{
-  "dependencies": {
-    "gulp": "~3.8.9",
-    "gulp-bower": "0.0.7",
-    "gulp-clean": "~0.3.1",
-    "gulp-coffee": "~2.2.0",
-    "gulp-sass": "^1.2.4",
-    "gulp-task-listing": "~0.3.0",
-    "gulp-util": "^3.0.3",
-    "node-sass": "~1.2.3"
-  },
-  "devDependencies": {
-    "gulp-rjs": "^0.1.0"
-  }
-}
diff --git a/static/partials/apispec.html b/static/partials/apispec.html
deleted file mode 100644
index c92098c..0000000
--- a/static/partials/apispec.html
+++ /dev/null
@@ -1,53 +0,0 @@
-<div class="row">
-    <div class="columns large-12">
-        <h1>Api specification</h1>
-    </div>
-</div>
-
-<div class="row">
-    <div class="columns large-12">
-        <h3>End points</h3>
-    </div>
-</div>
-
-<div class="row wab-apispect">
-    <table class="columns large-12">
-        <thead>
-            <tr >
-                <th >api endpoint</th>
-                <th>method</th>
-                <th >description</th>
-            </tr>
-        </thead>
-      <tbody>
-          <tr ng-repeat="endpoint in endpoints">
-              <td><wab-api endpoint="{{ endpoint.pattern }}"></wab-api></td>
-              <td>
-                  <code style="width:5em; display: block; text-align: center;">{{ endpoint.method }}</code>
-              </td>
-              <td >{{ endpoint.description }}</td>
-          </tr>
-      </tbody>
-
-    </table>
-</div>
-
-<div class="row">
-    <div class="columns large-12">
-        <h3>Authentication</h3>
-    </div>
-</div>
-
-
-<div class="row">
-    <div class="columns large-12">
-        <p>
-            All calls that change an asset requires authentication.
-            Authentication is done by adding a <code class="light">
-            user={user_name}</code> parameter to the endpoint.  For example, to
-            authenticate to <code class="light">/api/doormen/zST8_FWcPDT2-14wDQAAAQ==</code>
-            with a user called "bob", the url becomes
-            <code class="light">/api/doormen/zST8_FWcPDT2-14wDQAAAQ==?user=bob</code>
-        </p>
-    </div>
-</div>
diff --git a/static/partials/doorman.html b/static/partials/doorman.html
deleted file mode 100644
index 4f94f85..0000000
--- a/static/partials/doorman.html
+++ /dev/null
@@ -1,92 +0,0 @@
-
-<div class="row">
-    <div class="columns large-12">
-        <h1>{{ doorman.name }} </h1>
-    </div>
-</div>
-
-<div class="row">
-    <div class="columns large-12">
-        <span>doorman id: <code>{{ doorman.id }}</code></span>
-    </div>
-</div>
-
-<div class="row" ng-repeat="value in doorman.values">
-    <div class="columns large-8 small-10">
-        <div class="row">
-            <div class="large-2 columns">
-                <a class="button prefix disabled" ng-bind="$index"> </a>
-            </div>
-            <div class="large-10 columns">
-                <input type="text" placeholder="value name" ng-value="value.name" disabled>
-            </div>
-
-        </div>
-    </div>
-    <div class="columns large-4 small-2">
-        <label >
-            probability
-            <rat-input ng-model="value.probability" ng-disabled="!isAdmin"></rat-input>
-    </div>
-</div>
-
-<div class="row">
-    <div class="large-4 columns">
-        <ul>
-            <li ng-repeat="email in leftEmailColumns">
-                <span ng-bind="email"></span>
-                <i class="fa fa-times right"
-                   ng-click="removeEmail(email)"
-                   style="cursor: pointer;"
-                   ng-show="doorman.emails.length > 1 && isAdmin && email != user"
-
-                   ></i>
-            </li>
-        </ul>
-    </div>
-    <div class="large-4 columns">
-        <ul>
-            <li ng-repeat="email in rightEmailColumns">
-                <span ng-bind="email"></span>
-                <i class="fa fa-times right"></i>
-            </li>
-        </ul>
-    </div>
-    <div class="large-4 columns">
-        <div>
-            <label>
-                new admin
-                <div class="row collapse">
-                    <div class="columns large-10 small-10">
-
-                        <input type="text" ng-model="newEmail"/>
-                    </div>
-                    <div class="columns large-2 small-2">
-
-                        <a class="button postfix" ng-click="addNewAuthorEmail()"  ng-class=" canAddNewEmail() ? '' : 'disabled' " >+</a>
-                    </div>
-                </div>
-            </label>
-        </div>
-    </div>
-
-</div>
-
-<div class="row" ng-show="error">
-    <div class="columns large-12">
-        <code style="width:100%; height:100%; display:block; margin-bottom: 1em;">
-            <b>{{ error.status }}</b><br>&nbsp; {{ error.message }}
-        </code>
-    </div>
-</div>
-
-<div class="row" ng-show="isAdmin">
-    <div class="large-12 small-12 columns">
-        <ul class="button-group">
-            <li><a ng-click="updateDoorman()" class="small button" ng-class="{disabled: !validate()}">Update</a></li>
-        </ul>
-        <span ng-show="doormanChanged">
-            doorman changed
-        </span>
-    </div>
-</div>
diff --git a/static/partials/doormanError.html b/static/partials/doormanError.html
deleted file mode 100644
index 63a3a81..0000000
--- a/static/partials/doormanError.html
+++ /dev/null
@@ -1,11 +0,0 @@
-<div class="row">
-    <div class="columns large-12">
-        <h1>error page</h1>
-    </div>
-</div>
-
-<div class="row">
-    <div class="columns large-12">
-        <span>Error {{ error }} getting doorman {{ id }}</span>
-    </div>
-</div>
diff --git a/static/partials/doormen.html b/static/partials/doormen.html
deleted file mode 100644
index c469787..0000000
--- a/static/partials/doormen.html
+++ /dev/null
@@ -1,13 +0,0 @@
-<div class="row">
-    <div class="columns large-12">
-        <h1>doormen</h1>
-    </div>
-</div>
-
-<div class="row">
-    <div class="columns large-12">
-        <ul>
-            <li ng-repeat="doorman in doormen"> <a href="#/doormen/{{ doorman.id }}"> {{ doorman.name }} </a></li>
-        </ul>
-    </div>
-</div>
diff --git a/static/partials/home.html b/static/partials/home.html
deleted file mode 100644
index c937bfc..0000000
--- a/static/partials/home.html
+++ /dev/null
@@ -1,31 +0,0 @@
-<div class="row">
-    <div class="columns large-12">
-        <h1>Welcome to the world best a/b testing library</h1>
-    </div>
-</div>
-
-
-
-<div class="row">
-    <form ng-submit="login()" >
-    <fieldset>
-        <legend>Login</legend>
-        <div class="large-12 columns">
-            <div class="row collapse">
-                <div class="small-10 columns">
-                    <input type="text" placeholder="email" ng-model="email">
-                </div>
-                <div class="small-2 columns">
-                    <button type="submit" class="button postfix" >Login!</input>
-                </div>
-            </div>
-        </div>
-    </fieldset>
-    <form>
-</div>
-
-<div class="row" ng-show="loggedEmail">
-    <div class="large-12 columns">
-        You are currently logged in as <code ng-bind="loggedEmail"></code>
-    </div>
-</div>
diff --git a/static/partials/newdoorman.html b/static/partials/newdoorman.html
deleted file mode 100644
index 4fd7b41..0000000
--- a/static/partials/newdoorman.html
+++ /dev/null
@@ -1,101 +0,0 @@
-<div class="row">
-    <div class="columns large-12">
-        <h1>new doorman</h1>
-    </div>
-</div>
-
-<div class="row">
-    <div class="columns large-12">
-        <label >name<input type="text" placeholder="unique doorman name" ng-model="payload.name"></label>
-    </div>
-</div>
-
-<div class="row">
-    <div class="columns large-12">
-        <fieldset>
-            <legend>doorman state</legend>
-
-            <div class="row">
-                <div class="columns large-8">
-                    <label >name<input type="text" placeholder="value name" ng-model="value.name"></label>
-                </div>
-                <div class="columns large-3">
-                    <label >probability
-                        <rat-input ng-model="value.probability"></rat-input>
-                    </label>
-                </div>
-
-                <div class="columns large-1">
-                    <br>
-                    <a class="button round tiny" ng-class="{disabled: !isValidValue()}" ng-click="addNewValue()">
-                        <i class="fa fa-plus"></i>
-                    </a>
-                </div>
-            </div>
-
-            <div class="row" ng-repeat="value in payload.values | reverse">
-                <div class="columns large-8">
-                    <label >value<input type="text" placeholder="value name" ng-model="value.name"></label>
-                </div>
-                <div class="columns large-3">
-                    <label >probability
-                        <rat-input ng-model="value.probability"></rat-input>
-                    </label>
-                </div>
-                <div class="columns large-1">
-                    <br>
-                    <a class="button round tiny" ng-click="removeValue( payload.values.length - $index - 1 )">
-                        <i class="fa fa-times"></i>
-                    </a>
-                </div>
-            </div>
-        </fieldset>
-    </div>
-</div>
-
-<div class="row">
-    <div class="columns large-12">
-        <fieldset>
-            <legend>administrator</legend>
-
-            <div class="row">
-                <div class="columns large-11">
-                    <label>admin email <input type="text" placeholder="admin email" ng-model="newEmail"></label>
-                </div>
-                <div class="columns large-1">
-                    <br><a class="button round tiny" ng-click="addEmail()" ng-class="{disabled: !newEmail}">
-                        <i class="fa fa-plus"></i>
-                    </a>
-                </div>
-            </div>
-
-            <div class="row" ng-repeat="email in payload.emails | reverse">
-                <div class="columns large-11">
-                    <label>admin email <input type="text" ng-disabled="email==user" placeholder="wild cards are allow here" ng-model="email"></label>
-                </div>
-                <div class="columns large-1">
-                    <br><a class="button round tiny" ng-click="removeEmail(payload.emails.length - $index -1)" ng-disabled="email==user? 'disabled' : ''">
-                        <i class="fa fa-times"></i>
-                    </a>
-                </div>
-            </div>
-
-        </fieldset>
-    </div>
-</div>
-
-<div class="row" ng-show="error">
-    <div class="columns large-12">
-        <code style="width:100%; height:100%; display:block; margin-bottom: 1em;">{{ error }}</code>
-    </div>
-</div>
-
-<div class="row">
-    <div class="large-9 columns">
-        <button ng-click="createDoorman()" ng-class="{disabled: !isDoormanValid()}">create</button>
-    </div>
-
-    <div class="large-3 columns">
-        <span >propability remaning: {{ getProbabilityRemaining() | ratpp}}</span>
-    </div>
-</div>
diff --git a/static/partials/serverspec.html b/static/partials/serverspec.html
deleted file mode 100644
index 38149ba..0000000
--- a/static/partials/serverspec.html
+++ /dev/null
@@ -1,55 +0,0 @@
-<div class="row">
-    <div class="columns large-12">
-        <h1>server specification</h1>
-    </div>
-</div>
-
-<div class="row" ng-show="server.message_queue == 'nanomsg'">
-    <div class="columns large-12">
-    <h3>general</h3>
-    <table style="width:100%;">
-        <thead>
-            <tr>
-                <th >value</th>
-                <th>key</th>
-            </tr>
-        </thead>
-      <tbody>
-          <tr>
-              <td>hostname</td>
-              <td><code>{{server.hostname}}</code></td>
-          </tr>
-          <tr>
-              <td>port</td>
-              <td><code>{{server.port}}</code></td>
-          </tr>
-          <tr>
-              <td>go version</td>
-              <td><code>{{server.go_version}}</code></td>
-          </tr>
-      </tbody>
-    </table>
-    </div>
-</div>
-
-
-<div class="row" ng-show="server.message_queue == 'nanomsg'">
-    <div class="columns large-12">
-    <h3>nano msg</h3>
-    <table style="width:100%;">
-        <thead>
-            <tr>
-                <th >value</th>
-                <th>key</th>
-            </tr>
-        </thead>
-      <tbody>
-          <tr>
-              <td>url</td>
-              <td><code>{{server.nano_msg.url}}</code></td>
-          </tr>
-      </tbody>
-
-    </table>
-    </div>
-</div>
diff --git a/static/scss/_doorman.scss b/static/scss/_doorman.scss
deleted file mode 100644
index 95bc472..0000000
--- a/static/scss/_doorman.scss
+++ /dev/null
@@ -1,67 +0,0 @@
-@import "settings";
-@import "bourbon";
-
-// @import url(http://fonts.googleapis.com/css?family=Orbitron:400,900,500,700);
-@font-face {
-  font-family: 'Orbitron';
-  font-style: normal;
-  font-weight: 400;
-  src: local('Orbitron-Light'), local('Orbitron-Regular'), url(/scss/font/orbitron/HmnHiRzvcnQr8CjBje6GQvesZW2xOQ-xsNqO47m55DA.woff2) format('woff2'), url(/scss/font/orbitron/94ug0rEgQO_WuI_xKJMFc_esZW2xOQ-xsNqO47m55DA.woff) format('woff');
-}
-
-
-h1, h2{
-    font-family: 'Orbitron', sans-serif;
-}
-
-
-.wab-sidebar{
-    background: $ghost;
-
-    h1{
-        text-align: center;
-        color: $primary-color;
-    }
-}
-.wab-apispect{
-    h2{
-        text-align: center;
-    }
-}
-
-.rat-input{
-    .fraction-box{
-        font-family: monospace;
-        font-size: 1.3em;
-        border: 2px;
-        padding: 0.3em;
-        box-shadow: 2px 2px 1px #888;
-        @include border-top-radius(5px);
-        @include border-bottom-radius(5px);
-
-        i{
-            font-size: 1em;
-            margin-left: 0.2em;
-        }
-    }
-
-    .fraction-box:hover{
-        border: 2px;
-        padding: 0.3em;
-        box-shadow: 2px 2px 1px red;
-    }
-
-    .edit{
-        input{
-              width: 4em;
-              height: 2em;
-              display: inline;
-              padding: 0px;
-              padding-left: 0.5em;
-        }
-    }
-}
-
-.light{
-    border-style: none;
-}
diff --git a/static/scss/_settings.scss b/static/scss/_settings.scss
deleted file mode 100644
index 65266ba..0000000
--- a/static/scss/_settings.scss
+++ /dev/null
@@ -1,1453 +0,0 @@
-// Foundation by ZURB
-// foundation.zurb.com
-// Licensed under MIT Open Source
-
-//
-
-// Table of Contents
-// Foundation Settings
-//
-// a. Base
-// b. Grid
-// c. Global
-// d. Media Query Ranges
-// e. Typography
-// 01. Accordion
-// 02. Alert Boxes
-// 03. Block Grid
-// 04. Breadcrumbs
-// 05. Buttons
-// 06. Button Groups
-// 07. Clearing
-// 08. Dropdown
-// 09. Dropdown Buttons
-// 10. Flex Video
-// 11. Forms
-// 12. Icon Bar
-// 13. Inline Lists
-// 14. Joyride
-// 15. Keystrokes
-// 16. Labels
-// 17. Magellan
-// 18. Off-canvas
-// 19. Orbit
-// 20. Pagination
-// 21. Panels
-// 22. Pricing Tables
-// 23. Progress Bar
-// 24. Range Slider
-// 25. Reveal
-// 26. Side Nav
-// 27. Split Buttons
-// 28. Sub Nav
-// 29. Switch
-// 30. Tables
-// 31. Tabs
-// 32. Thumbnails
-// 33. Tooltips
-// 34. Top Bar
-// 36. Visibility Classes
-
-// a. Base
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// This is the default html and body font-size for the base rem value.
-// $rem-base: 16px;
-
-// Allows the use of rem-calc() or lower-bound() in your settings
-@import "foundation/functions";
-
-// The default font-size is set to 100% of the browser style sheet (usually 16px)
-// for compatibility with browser-based text zoom or user-set defaults.
-
-// Since the typical default browser font-size is 16px, that makes the calculation for grid size.
-// If you want your base font-size to be different and not have it affect the grid breakpoints,
-// set $rem-base to $base-font-size and make sure $base-font-size is a px value.
-// $base-font-size: 100%;
-
-// The $base-font-size is 100% while $base-line-height is 150%
-// $base-line-height: 150%;
-
-// We use this to control whether or not CSS classes come through in the gem files.
-$include-html-classes: true;
-// $include-print-styles: true;
-$include-html-global-classes: $include-html-classes;
-
-// b. Grid
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-grid-classes: $include-html-classes;
-// $include-xl-html-grid-classes: false;
-
-// $row-width: rem-calc(1000);
-// $total-columns: 12;
-// $column-gutter: rem-calc(30);
-
-// c. Global
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// We use these to define default font stacks
-// $font-family-sans-serif: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
-// $font-family-serif: Georgia, Cambria, "Times New Roman", Times, serif;
-// $font-family-monospace: Consolas, "Liberation Mono", Courier, monospace;
-
-// We use these to define default font weights
-// $font-weight-normal: normal !default;
-// $font-weight-bold: bold !default;
-
-// $white       : #FFFFFF;
-// $ghost       : #FAFAFA;
-// $snow        : #F9F9F9;
-// $vapor       : #F6F6F6;
-// $white-smoke : #F5F5F5;
-// $silver      : #EFEFEF;
-// $smoke       : #EEEEEE;
-// $gainsboro   : #DDDDDD;
-// $iron        : #CCCCCC;
-// $base        : #AAAAAA;
-// $aluminum    : #999999;
-// $jumbo       : #888888;
-// $monsoon     : #777777;
-// $steel       : #666666;
-// $charcoal    : #555555;
-// $tuatara     : #444444;
-// $oil         : #333333;
-// $jet         : #222222;
-// $black       : #000000;
-
-// We use these as default colors throughout
-// $primary-color: #008CBA;
-// $secondary-color: #e7e7e7;
-// $alert-color: #f04124;
-// $success-color: #43AC6A;
-// $warning-color: #f08a24;
-// $info-color: #a0d3e8;
-
-$primary-color: #153450;
-$secondary-color: #294052;
-$alert-color: #447294;
-$success-color: #73AFB6;
-$warning-color: #F4D6BC;
-$info-color: #F8E4CC;
-
-
-// We use these to control various global styles
-// $body-bg: $white;
-// $body-font-color: $jet;
-// $body-font-family: $font-family-sans-serif;
-// $body-font-weight: $font-weight-normal;
-// $body-font-style: normal;
-
-// We use this to control font-smoothing
-// $font-smoothing: antialiased;
-
-// We use these to control text direction settings
-// $text-direction: ltr;
-// $opposite-direction: right;
-// $default-float: left;
-// $last-child-float: $opposite-direction;
-
-// We use these to make sure border radius matches unless we want it different.
-// $global-radius: 3px;
-// $global-rounded: 1000px;
-
-// We use these to control inset shadow shiny edges and depressions.
-// $shiny-edge-size: 0 1px 0;
-// $shiny-edge-color: rgba($white, .5);
-// $shiny-edge-active-color: rgba($black, .2);
-
-// d. Media Query Ranges
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $small-range: (0em, 40em);
-// $medium-range: (40.063em, 64em);
-// $large-range: (64.063em, 90em);
-// $xlarge-range: (90.063em, 120em);
-// $xxlarge-range: (120.063em, 99999999em);
-
-// $screen: "only screen";
-
-// $landscape: "#{$screen} and (orientation: landscape)";
-// $portrait: "#{$screen} and (orientation: portrait)";
-
-// $small-up: $screen;
-// $small-only: "#{$screen} and (max-width: #{upper-bound($small-range)})";
-
-// $medium-up: "#{$screen} and (min-width:#{lower-bound($medium-range)})";
-// $medium-only: "#{$screen} and (min-width:#{lower-bound($medium-range)}) and (max-width:#{upper-bound($medium-range)})";
-
-// $large-up: "#{$screen} and (min-width:#{lower-bound($large-range)})";
-// $large-only: "#{$screen} and (min-width:#{lower-bound($large-range)}) and (max-width:#{upper-bound($large-range)})";
-
-// $xlarge-up: "#{$screen} and (min-width:#{lower-bound($xlarge-range)})";
-// $xlarge-only: "#{$screen} and (min-width:#{lower-bound($xlarge-range)}) and (max-width:#{upper-bound($xlarge-range)})";
-
-// $xxlarge-up: "#{$screen} and (min-width:#{lower-bound($xxlarge-range)})";
-// $xxlarge-only: "#{$screen} and (min-width:#{lower-bound($xxlarge-range)}) and (max-width:#{upper-bound($xxlarge-range)})";
-
-// Legacy
-// $small: $medium-up;
-// $medium: $medium-up;
-// $large: $large-up;
-
-// We use this as cursors values for enabling the option of having custom cursors in the whole site's stylesheet
-// $cursor-crosshair-value: crosshair;
-// $cursor-default-value: default;
-// $cursor-pointer-value: pointer;
-// $cursor-help-value: help;
-// $cursor-text-value: text;
-
-// e. Typography
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-type-classes: $include-html-classes;
-
-// We use these to control header font styles
-// $header-font-family: $body-font-family;
-// $header-font-weight: $font-weight-normal;
-// $header-font-style: normal;
-// $header-font-color: $jet;
-// $header-line-height: 1.4;
-// $header-top-margin: .2rem;
-// $header-bottom-margin: .5rem;
-// $header-text-rendering: optimizeLegibility;
-
-// We use these to control header font sizes
-// $h1-font-size: rem-calc(44);
-// $h2-font-size: rem-calc(37);
-// $h3-font-size: rem-calc(27);
-// $h4-font-size: rem-calc(23);
-// $h5-font-size: rem-calc(18);
-// $h6-font-size: 1rem;
-
-// We use these to control header size reduction on small screens
-// $h1-font-reduction: rem-calc(10) !default;
-// $h2-font-reduction: rem-calc(10) !default;
-// $h3-font-reduction: rem-calc(5) !default;
-// $h4-font-reduction: rem-calc(5) !default;
-// $h5-font-reduction: 0 !default;
-// $h6-font-reduction: 0 !default;
-
-// These control how subheaders are styled.
-// $subheader-line-height: 1.4;
-// $subheader-font-color: scale-color($header-font-color, $lightness: 35%);
-// $subheader-font-weight: $font-weight-normal;
-// $subheader-top-margin: .2rem;
-// $subheader-bottom-margin: .5rem;
-
-// A general <small> styling
-// $small-font-size: 60%;
-// $small-font-color: scale-color($header-font-color, $lightness: 35%);
-
-// We use these to style paragraphs
-// $paragraph-font-family: inherit;
-// $paragraph-font-weight: $font-weight-normal;
-// $paragraph-font-size: 1rem;
-// $paragraph-line-height: 1.6;
-// $paragraph-margin-bottom: rem-calc(20);
-// $paragraph-aside-font-size: rem-calc(14);
-// $paragraph-aside-line-height: 1.35;
-// $paragraph-aside-font-style: italic;
-// $paragraph-text-rendering: optimizeLegibility;
-
-// We use these to style <code> tags
-// $code-color: $oil;
-// $code-font-family: $font-family-monospace;
-// $code-font-weight: $font-weight-normal;
-// $code-background-color: scale-color($secondary-color, $lightness: 70%);
-// $code-border-size: 1px;
-// $code-border-style: solid;
-// $code-border-color: scale-color($code-background-color, $lightness: -10%);
-// $code-padding: rem-calc(2) rem-calc(5) rem-calc(1);
-
-// We use these to style anchors
-// $anchor-text-decoration: none;
-// $anchor-text-decoration-hover: none;
-// $anchor-font-color: $primary-color;
-// $anchor-font-color-hover: scale-color($primary-color, $lightness: -14%);
-
-// We use these to style the <hr> element
-// $hr-border-width: 1px;
-// $hr-border-style: solid;
-// $hr-border-color: $gainsboro;
-// $hr-margin: rem-calc(20);
-
-// We use these to style lists
-// $list-font-family: $paragraph-font-family;
-// $list-font-size: $paragraph-font-size;
-// $list-line-height: $paragraph-line-height;
-// $list-margin-bottom: $paragraph-margin-bottom;
-// $list-style-position: outside;
-// $list-side-margin: 1.1rem;
-// $list-ordered-side-margin: 1.4rem;
-// $list-side-margin-no-bullet: 0;
-// $list-nested-margin: rem-calc(20);
-// $definition-list-header-weight: $font-weight-bold;
-// $definition-list-header-margin-bottom: .3rem;
-// $definition-list-margin-bottom: rem-calc(12);
-
-// We use these to style blockquotes
-// $blockquote-font-color: scale-color($header-font-color, $lightness: 35%);
-// $blockquote-padding: rem-calc(9 20 0 19);
-// $blockquote-border: 1px solid $gainsboro;
-// $blockquote-cite-font-size: rem-calc(13);
-// $blockquote-cite-font-color: scale-color($header-font-color, $lightness: 23%);
-// $blockquote-cite-link-color: $blockquote-cite-font-color;
-
-// Acronym styles
-// $acronym-underline: 1px dotted $gainsboro;
-
-// We use these to control padding and margin
-// $microformat-padding: rem-calc(10 12);
-// $microformat-margin: rem-calc(0 0 20 0);
-
-// We use these to control the border styles
-// $microformat-border-width: 1px;
-// $microformat-border-style: solid;
-// $microformat-border-color: $gainsboro;
-
-// We use these to control full name font styles
-// $microformat-fullname-font-weight: $font-weight-bold;
-// $microformat-fullname-font-size: rem-calc(15);
-
-// We use this to control the summary font styles
-// $microformat-summary-font-weight: $font-weight-bold;
-
-// We use this to control abbr padding
-// $microformat-abbr-padding: rem-calc(0 1);
-
-// We use this to control abbr font styles
-// $microformat-abbr-font-weight: $font-weight-bold;
-// $microformat-abbr-font-decoration: none;
-
-// 01. Accordion
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-accordion-classes: $include-html-classes;
-
-// $accordion-navigation-padding: rem-calc(16);
-// $accordion-navigation-bg-color: $silver;
-// $accordion-navigation-hover-bg-color: scale-color($accordion-navigation-bg-color, $lightness: -5%);
-// $accordion-navigation-active-bg-color: scale-color($accordion-navigation-bg-color, $lightness: -3%);
-// $accordion-navigation-font-color: $jet;
-// $accordion-navigation-font-size: rem-calc(16);
-// $accordion-navigation-font-family: $body-font-family;
-
-// $accordion-content-padding: ($column-gutter/2);
-// $accordion-content-active-bg-color: $white;
-
-// 02. Alert Boxes
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-alert-classes: $include-html-classes;
-
-// We use this to control alert padding.
-// $alert-padding-top: rem-calc(14);
-// $alert-padding-default-float: $alert-padding-top;
-// $alert-padding-opposite-direction: $alert-padding-top + rem-calc(10);
-// $alert-padding-bottom: $alert-padding-top;
-
-// We use these to control text style.
-// $alert-font-weight: $font-weight-normal;
-// $alert-font-size: rem-calc(13);
-// $alert-font-color: $white;
-// $alert-font-color-alt: scale-color($secondary-color, $lightness: -66%);
-
-// We use this for close hover effect.
-// $alert-function-factor: -14%;
-
-// We use these to control border styles.
-// $alert-border-style: solid;
-// $alert-border-width: 1px;
-// $alert-border-color: scale-color($primary-color, $lightness: $alert-function-factor);
-// $alert-bottom-margin: rem-calc(20);
-
-// We use these to style the close buttons
-// $alert-close-color: $oil;
-// $alert-close-top: 50%;
-// $alert-close-position: rem-calc(4);
-// $alert-close-font-size: rem-calc(22);
-// $alert-close-opacity: 0.3;
-// $alert-close-opacity-hover: 0.5;
-// $alert-close-padding: 9px 6px 4px;
-
-// We use this to control border radius
-// $alert-radius: $global-radius;
-
-// We use this to control transition effects
-// $alert-transition-speed: 300ms;
-// $alert-transition-ease: ease-out;
-
-// 03. Block Grid
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-block-grid-classes: $include-html-classes;
-// $include-xl-html-block-grid-classes: false;
-
-// We use this to control the maximum number of block grid elements per row
-// $block-grid-elements: 12;
-// $block-grid-default-spacing: rem-calc(20);
-// $align-block-grid-to-grid: false;
-
-// Enables media queries for block-grid classes. Set to false if writing semantic HTML.
-// $block-grid-media-queries: true;
-
-// 04. Breadcrumbs
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-nav-classes: $include-html-classes;
-
-// We use this to set the background color for the breadcrumb container.
-// $crumb-bg: scale-color($secondary-color, $lightness: 55%);
-
-// We use these to set the padding around the breadcrumbs.
-// $crumb-padding: rem-calc(9 14 9);
-// $crumb-side-padding: rem-calc(12);
-
-// We use these to control border styles.
-// $crumb-function-factor: -10%;
-// $crumb-border-size: 1px;
-// $crumb-border-style: solid;
-// $crumb-border-color: scale-color($crumb-bg, $lightness: $crumb-function-factor);
-// $crumb-radius: $global-radius;
-
-// We use these to set various text styles for breadcrumbs.
-// $crumb-font-size: rem-calc(11);
-// $crumb-font-color: $primary-color;
-// $crumb-font-color-current: $oil;
-// $crumb-font-color-unavailable: $aluminum;
-// $crumb-font-transform: uppercase;
-// $crumb-link-decor: underline;
-
-// We use these to control the slash between breadcrumbs
-// $crumb-slash-color: $base;
-// $crumb-slash: "/";
-
-// 05. Buttons
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-button-classes: $include-html-classes;
-
-// We use these to build padding for buttons.
-// $button-tny: rem-calc(10);
-// $button-sml: rem-calc(14);
-// $button-med: rem-calc(16);
-// $button-lrg: rem-calc(18);
-
-// We use this to control the display property.
-// $button-display: inline-block;
-// $button-margin-bottom: rem-calc(20);
-
-// We use these to control button text styles.
-// $button-font-family: $body-font-family;
-// $button-font-color: $white;
-// $button-font-color-alt: $oil;
-// $button-font-tny: rem-calc(11);
-// $button-font-sml: rem-calc(13);
-// $button-font-med: rem-calc(16);
-// $button-font-lrg: rem-calc(20);
-// $button-font-weight: $font-weight-normal;
-// $button-font-align: center;
-
-// We use these to control various hover effects.
-// $button-function-factor: -20%;
-
-// We use these to control button border and hover styles.
-// $button-border-width: 0px;
-// $button-border-style: solid;
-// $button-bg-color: $primary-color;
-// $button-bg-hover: scale-color($button-bg-color, $lightness: $button-function-factor);
-// $button-border-color: $button-bg-hover;
-// $secondary-button-bg-hover: scale-color($secondary-color, $lightness: $button-function-factor);
-// $secondary-button-border-color: $secondary-button-bg-hover;
-// $success-button-bg-hover: scale-color($success-color, $lightness: $button-function-factor);
-// $success-button-border-color: $success-button-bg-hover;
-// $alert-button-bg-hover: scale-color($alert-color, $lightness: $button-function-factor);
-// $alert-button-border-color: $alert-button-bg-hover;
-
-// We use this to set the default radius used throughout the core.
-// $button-radius: $global-radius;
-// $button-round: $global-rounded;
-
-// We use this to set default opacity and cursor for disabled buttons.
-// $button-disabled-opacity: 0.7;
-// $button-disabled-cursor: $cursor-default-value;
-
-// 06. Button Groups
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-button-classes: $include-html-classes;
-
-// Sets the margin for the right side by default, and the left margin if right-to-left direction is used
-// $button-bar-margin-opposite: rem-calc(10);
-// $button-group-border-width: 1px;
-
-// 07. Clearing
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-clearing-classes: $include-html-classes;
-
-// We use these to set the background colors for parts of Clearing.
-// $clearing-bg: $oil;
-// $clearing-caption-bg: $clearing-bg;
-// $clearing-carousel-bg: rgba(51,51,51,0.8);
-// $clearing-img-bg: $clearing-bg;
-
-// We use these to style the close button
-// $clearing-close-color: $iron;
-// $clearing-close-size: 30px;
-
-// We use these to style the arrows
-// $clearing-arrow-size: 12px;
-// $clearing-arrow-color: $clearing-close-color;
-
-// We use these to style captions
-// $clearing-caption-font-color: $iron;
-// $clearing-caption-font-size: 0.875em;
-// $clearing-caption-padding: 10px 30px 20px;
-
-// We use these to make the image and carousel height and style
-// $clearing-active-img-height: 85%;
-// $clearing-carousel-height: 120px;
-// $clearing-carousel-thumb-width: 120px;
-// $clearing-carousel-thumb-active-border: 1px solid rgb(255,255,255);
-
-// 08. Dropdown
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-dropdown-classes: $include-html-classes;
-
-// We use these to controls height and width styles.
-// $f-dropdown-max-width: 200px;
-// $f-dropdown-height: auto;
-// $f-dropdown-max-height: none;
-
-// Used for bottom position
-// $f-dropdown-margin-top: 2px;
-
-// Used for right position
-// $f-dropdown-margin-left: $f-dropdown-margin-top;
-
-// Used for left position
-// $f-dropdown-margin-right: $f-dropdown-margin-top;
-
-// Used for top position
-// $f-dropdown-margin-bottom: $f-dropdown-margin-top;
-
-// We use this to control the background color
-// $f-dropdown-bg: $white;
-
-// We use this to set the border styles for dropdowns.
-// $f-dropdown-border-style: solid;
-// $f-dropdown-border-width: 1px;
-// $f-dropdown-border-color: scale-color($white, $lightness: -20%);
-
-// We use these to style the triangle pip.
-// $f-dropdown-triangle-size: 6px;
-// $f-dropdown-triangle-color: $white;
-// $f-dropdown-triangle-side-offset: 10px;
-
-// We use these to control styles for the list elements.
-// $f-dropdown-list-style: none;
-// $f-dropdown-font-color: $charcoal;
-// $f-dropdown-font-size: rem-calc(14);
-// $f-dropdown-list-padding: rem-calc(5, 10);
-// $f-dropdown-line-height: rem-calc(18);
-// $f-dropdown-list-hover-bg: $smoke;
-// $dropdown-mobile-default-float: 0;
-
-// We use this to control the styles for when the dropdown has custom content.
-// $f-dropdown-content-padding: rem-calc(20);
-
-// Default radius for dropdown.
-// $f-dropdown-radius: $global-radius;
-
-
-// 09. Dropdown Buttons
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-button-classes: $include-html-classes;
-
-// We use these to set the color of the pip in dropdown buttons
-// $dropdown-button-pip-color: $white;
-// $dropdown-button-pip-color-alt: $oil;
-
-// $button-pip-tny: rem-calc(6);
-// $button-pip-sml: rem-calc(7);
-// $button-pip-med: rem-calc(9);
-// $button-pip-lrg: rem-calc(11);
-
-// We use these to style tiny dropdown buttons
-// $dropdown-button-padding-tny: $button-pip-tny * 7;
-// $dropdown-button-pip-size-tny: $button-pip-tny;
-// $dropdown-button-pip-opposite-tny: $button-pip-tny * 3;
-// $dropdown-button-pip-top-tny: (-$button-pip-tny / 2) + rem-calc(1);
-
-// We use these to style small dropdown buttons
-// $dropdown-button-padding-sml: $button-pip-sml * 7;
-// $dropdown-button-pip-size-sml: $button-pip-sml;
-// $dropdown-button-pip-opposite-sml: $button-pip-sml * 3;
-// $dropdown-button-pip-top-sml: (-$button-pip-sml / 2) + rem-calc(1);
-
-// We use these to style medium dropdown buttons
-// $dropdown-button-padding-med: $button-pip-med * 6 + rem-calc(3);
-// $dropdown-button-pip-size-med: $button-pip-med - rem-calc(3);
-// $dropdown-button-pip-opposite-med: $button-pip-med * 2.5;
-// $dropdown-button-pip-top-med: (-$button-pip-med / 2) + rem-calc(2);
-
-// We use these to style large dropdown buttons
-// $dropdown-button-padding-lrg: $button-pip-lrg * 5 + rem-calc(3);
-// $dropdown-button-pip-size-lrg: $button-pip-lrg - rem-calc(6);
-// $dropdown-button-pip-opposite-lrg: $button-pip-lrg * 2.5;
-// $dropdown-button-pip-top-lrg: (-$button-pip-lrg / 2) + rem-calc(3);
-
-// 10. Flex Video
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-media-classes: $include-html-classes;
-
-// We use these to control video container padding and margins
-// $flex-video-padding-top: rem-calc(25);
-// $flex-video-padding-bottom: 67.5%;
-// $flex-video-margin-bottom: rem-calc(16);
-
-// We use this to control widescreen bottom padding
-// $flex-video-widescreen-padding-bottom: 56.34%;
-
-// 11. Forms
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-form-classes: $include-html-classes;
-
-// We use this to set the base for lots of form spacing and positioning styles
-// $form-spacing: rem-calc(16);
-
-// We use these to style the labels in different ways
-// $form-label-pointer: pointer;
-// $form-label-font-size: rem-calc(14);
-// $form-label-font-weight: $font-weight-normal;
-// $form-label-line-height: 1.5;
-// $form-label-font-color: scale-color($black, $lightness: 30%);
-// $form-label-small-transform: capitalize;
-// $form-label-bottom-margin: 0;
-// $input-font-family: inherit;
-// $input-font-color: rgba(0,0,0,0.75);
-// $input-font-size: rem-calc(14);
-// $input-bg-color: $white;
-// $input-focus-bg-color: scale-color($white, $lightness: -2%);
-// $input-border-color: scale-color($white, $lightness: -20%);
-// $input-focus-border-color: scale-color($white, $lightness: -40%);
-// $input-border-style: solid;
-// $input-border-width: 1px;
-// $input-border-radius: $global-radius;
-// $input-disabled-bg: $gainsboro;
-// $input-disabled-cursor: $cursor-default-value;
-// $input-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
-
-// We use these to style the fieldset border and spacing.
-// $fieldset-border-style: solid;
-// $fieldset-border-width: 1px;
-// $fieldset-border-color: $gainsboro;
-// $fieldset-padding: rem-calc(20);
-// $fieldset-margin: rem-calc(18 0);
-
-// We use these to style the legends when you use them
-// $legend-bg: $white;
-// $legend-font-weight: $font-weight-bold;
-// $legend-padding: rem-calc(0 3);
-
-// We use these to style the prefix and postfix input elements
-// $input-prefix-bg: scale-color($white, $lightness: -5%);
-// $input-prefix-border-color: scale-color($white, $lightness: -20%);
-// $input-prefix-border-size: 1px;
-// $input-prefix-border-type: solid;
-// $input-prefix-overflow: hidden;
-// $input-prefix-font-color: $oil;
-// $input-prefix-font-color-alt: $white;
-
-// We use this setting to turn on/off HTML5 number spinners (the up/down arrows)
-// $input-number-spinners: true;
-
-// We use these to style the error states for inputs and labels
-// $input-error-message-padding: rem-calc(6 9 9);
-// $input-error-message-top: -1px;
-// $input-error-message-font-size: rem-calc(12);
-// $input-error-message-font-weight: $font-weight-normal;
-// $input-error-message-font-style: italic;
-// $input-error-message-font-color: $white;
-// $input-error-message-bg-color: $alert-color;
-// $input-error-message-font-color-alt: $oil;
-
-// We use this to style the glowing effect of inputs when focused
-// $input-include-glowing-effect: true;
-// $glowing-effect-fade-time: 0.45s;
-// $glowing-effect-color: $input-focus-border-color;
-
-// Select variables
-// $select-bg-color: $ghost;
-// $select-hover-bg-color: scale-color($select-bg-color, $lightness: -3%);
-
-// 12. Icon Bar
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// We use these to style the icon-bar and items
-// $include-html-icon-bar-classes: $include-html-classes;
-// $icon-bar-bg: $oil;
-// $icon-bar-font-color: $white;
-// $icon-bar-font-color-hover: $icon-bar-font-color;
-// $icon-bar-font-size: 1rem;
-// $icon-bar-hover-color: $primary-color;
-// $icon-bar-icon-color: $white;
-// $icon-bar-icon-color-hover: $icon-bar-icon-color;
-// $icon-bar-icon-size: 1.875rem;
-// $icon-bar-image-width: 1.875rem;
-// $icon-bar-image-height: 1.875rem;
-// $icon-bar-active-color: $primary-color;
-// $icon-bar-item-padding: 1.25rem;
-
-// 13. Inline Lists
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-inline-list-classes: $include-html-classes;
-
-// We use this to control the margins and padding of the inline list.
-// $inline-list-top-margin: 0;
-// $inline-list-opposite-margin: 0;
-// $inline-list-bottom-margin: rem-calc(17);
-// $inline-list-default-float-margin: rem-calc(-22);
-// $inline-list-default-float-list-margin: rem-calc(22);
-
-// $inline-list-padding: 0;
-
-// We use this to control the overflow of the inline list.
-// $inline-list-overflow: hidden;
-
-// We use this to control the list items
-// $inline-list-display: block;
-
-// We use this to control any elements within list items
-// $inline-list-children-display: block;
-
-// 14. Joyride
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-joyride-classes: $include-html-classes;
-
-// Controlling default Joyride styles
-// $joyride-tip-bg: $oil;
-// $joyride-tip-default-width: 300px;
-// $joyride-tip-padding: rem-calc(18 20 24);
-// $joyride-tip-border: solid 1px $charcoal;
-// $joyride-tip-radius: 4px;
-// $joyride-tip-position-offset: 22px;
-
-// Here, we're setting the tip font styles
-// $joyride-tip-font-color: $white;
-// $joyride-tip-font-size: rem-calc(14);
-// $joyride-tip-header-weight: $font-weight-bold;
-
-// This changes the nub size
-// $joyride-tip-nub-size: 10px;
-
-// This adjusts the styles for the timer when its enabled
-// $joyride-tip-timer-width: 50px;
-// $joyride-tip-timer-height: 3px;
-// $joyride-tip-timer-color: $steel;
-
-// This changes up the styles for the close button
-// $joyride-tip-close-color: $monsoon;
-// $joyride-tip-close-size: 24px;
-// $joyride-tip-close-weight: $font-weight-normal;
-
-// When Joyride is filling the screen, we use this style for the bg
-// $joyride-screenfill: rgba(0,0,0,0.5);
-
-// 15. Keystrokes
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-keystroke-classes: $include-html-classes;
-
-// We use these to control text styles.
-// $keystroke-font: "Consolas", "Menlo", "Courier", monospace;
-// $keystroke-font-size: inherit;
-// $keystroke-font-color: $jet;
-// $keystroke-font-color-alt: $white;
-// $keystroke-function-factor: -7%;
-
-// We use this to control keystroke padding.
-// $keystroke-padding: rem-calc(2 4 0);
-
-// We use these to control background and border styles.
-// $keystroke-bg: scale-color($white, $lightness: $keystroke-function-factor);
-// $keystroke-border-style: solid;
-// $keystroke-border-width: 1px;
-// $keystroke-border-color: scale-color($keystroke-bg, $lightness: $keystroke-function-factor);
-// $keystroke-radius: $global-radius;
-
-// 16. Labels
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-label-classes: $include-html-classes;
-
-// We use these to style the labels
-// $label-padding: rem-calc(4 8 4);
-// $label-radius: $global-radius;
-
-// We use these to style the label text
-// $label-font-sizing: rem-calc(11);
-// $label-font-weight: $font-weight-normal;
-// $label-font-color: $oil;
-// $label-font-color-alt: $white;
-// $label-font-family: $body-font-family;
-
-// 17. Magellan
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-magellan-classes: $include-html-classes;
-
-// $magellan-bg: $white;
-// $magellan-padding: 0 !important;
-
-// 18. Off-canvas
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-off-canvas-classes: $include-html-classes;
-
-// $tabbar-bg: $oil;
-// $tabbar-height: rem-calc(45);
-// $tabbar-icon-width: $tabbar-height;
-// $tabbar-line-height: $tabbar-height;
-// $tabbar-color: $white;
-// $tabbar-middle-padding: 0 rem-calc(10);
-
-// Off Canvas Divider Styles
-// $tabbar-right-section-border: solid 1px scale-color($tabbar-bg, $lightness: 13%);
-// $tabbar-left-section-border: solid 1px scale-color($tabbar-bg, $lightness: -50%);
-
-// Off Canvas Tab Bar Headers
-// $tabbar-header-color: $white;
-// $tabbar-header-weight: $font-weight-bold;
-// $tabbar-header-line-height: $tabbar-height;
-// $tabbar-header-margin: 0;
-
-// Off Canvas Menu Variables
-// $off-canvas-width: rem-calc(250);
-// $off-canvas-bg: $oil;
-// $off-canvas-bg-hover: scale-color($tabbar-bg, $lightness: -30%);
-
-// Off Canvas Menu List Variables
-// $off-canvas-label-padding: 0.3rem rem-calc(15);
-// $off-canvas-label-color: $aluminum;
-// $off-canvas-label-text-transform: uppercase;
-// $off-canvas-label-font-size: rem-calc(12);
-// $off-canvas-label-font-weight: $font-weight-bold;
-// $off-canvas-label-bg: $tuatara;
-// $off-canvas-label-border-top: 1px solid scale-color($tuatara, $lightness: 14%);
-// $off-canvas-label-border-bottom: none;
-// $off-canvas-label-margin:0;
-// $off-canvas-link-padding: rem-calc(10, 15);
-// $off-canvas-link-color: rgba($white, 0.7);
-// $off-canvas-link-border-bottom: 1px solid scale-color($off-canvas-bg, $lightness: -25%);
-// $off-canvas-back-bg: $tuatara;
-// $off-canvas-back-border-top: $off-canvas-label-border-top;
-// $off-canvas-back-border-bottom: $off-canvas-label-border-bottom;
-// $off-canvas-back-hover-bg: scale-color($off-canvas-back-bg, $lightness: -30%);
-// $off-canvas-back-hover-border-top: 1px solid scale-color($off-canvas-label-bg, $lightness: 14%);
-// $off-canvas-back-hover-border-bottom: none;
-
-// Off Canvas Menu Icon Variables
-// $tabbar-menu-icon-color: $white;
-// $tabbar-menu-icon-hover: scale-color($tabbar-menu-icon-color, $lightness: -30%);
-
-// $tabbar-menu-icon-text-indent: rem-calc(35);
-// $tabbar-menu-icon-width: $tabbar-height;
-// $tabbar-menu-icon-height: $tabbar-height;
-// $tabbar-menu-icon-padding: 0;
-
-// $tabbar-hamburger-icon-width: rem-calc(16);
-// $tabbar-hamburger-icon-left: false;
-// $tabbar-hamburger-icon-top: false;
-// $tabbar-hamburger-icon-thickness: 1px;
-// $tabbar-hamburger-icon-gap: 6px;
-
-// Off Canvas Back-Link Overlay
-// $off-canvas-overlay-transition: background 300ms ease;
-// $off-canvas-overlay-cursor: pointer;
-// $off-canvas-overlay-box-shadow: -4px 0 4px rgba($black, 0.5), 4px 0 4px rgba($black, 0.5);
-// $off-canvas-overlay-background: rgba($white, 0.2);
-// $off-canvas-overlay-background-hover: rgba($white, 0.05);
-
-// Transition Variables
-// $menu-slide: "transform 500ms ease";
-
-// 19. Orbit
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-orbit-classes: $include-html-classes;
-
-// We use these to control the caption styles
-// $orbit-container-bg: none;
-// $orbit-caption-bg: rgba(51,51,51, 0.8);
-// $orbit-caption-font-color: $white;
-// $orbit-caption-font-size: rem-calc(14);
-// $orbit-caption-position: "bottom"; // Supported values: "bottom", "under"
-// $orbit-caption-padding: rem-calc(10 14);
-// $orbit-caption-height: auto;
-
-// We use these to control the left/right nav styles
-// $orbit-nav-bg: transparent;
-// $orbit-nav-bg-hover: rgba(0,0,0,0.3);
-// $orbit-nav-arrow-color: $white;
-// $orbit-nav-arrow-color-hover: $white;
-
-// We use these to control the timer styles
-// $orbit-timer-bg: rgba(255,255,255,0.3);
-// $orbit-timer-show-progress-bar: true;
-
-// We use these to control the bullet nav styles
-// $orbit-bullet-nav-color: $iron;
-// $orbit-bullet-nav-color-active: $aluminum;
-// $orbit-bullet-radius: rem-calc(9);
-
-// We use these to controls the style of slide numbers
-// $orbit-slide-number-bg: rgba(0,0,0,0);
-// $orbit-slide-number-font-color: $white;
-// $orbit-slide-number-padding: rem-calc(5);
-
-// Hide controls on small
-// $orbit-nav-hide-for-small: true;
-// $orbit-bullet-hide-for-small: true;
-// $orbit-timer-hide-for-small: true;
-
-// Graceful Loading Wrapper and preloader
-// $wrapper-class: "slideshow-wrapper";
-// $preloader-class: "preloader";
-
-// 20. Pagination
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-pagination-classes: $include-html-classes;
-
-// We use these to control the pagination container
-// $pagination-height: rem-calc(24);
-// $pagination-margin: rem-calc(-5);
-
-// We use these to set the list-item properties
-// $pagination-li-float: $default-float;
-// $pagination-li-height: rem-calc(24);
-// $pagination-li-font-color: $jet;
-// $pagination-li-font-size: rem-calc(14);
-// $pagination-li-margin: rem-calc(5);
-
-// We use these for the pagination anchor links
-// $pagination-link-pad: rem-calc(1 10 1);
-// $pagination-link-font-color: $aluminum;
-// $pagination-link-active-bg: scale-color($white, $lightness: -10%);
-
-// We use these for disabled anchor links
-// $pagination-link-unavailable-cursor: default;
-// $pagination-link-unavailable-font-color: $aluminum;
-// $pagination-link-unavailable-bg-active: transparent;
-
-// We use these for currently selected anchor links
-// $pagination-link-current-background: $primary-color;
-// $pagination-link-current-font-color: $white;
-// $pagination-link-current-font-weight: $font-weight-bold;
-// $pagination-link-current-cursor: default;
-// $pagination-link-current-active-bg: $primary-color;
-
-// 21. Panels
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-panel-classes: $include-html-classes;
-
-// We use these to control the background and border styles
-// $panel-bg: scale-color($white, $lightness: -5%);
-// $panel-border-style: solid;
-// $panel-border-size: 1px;
-
-// We use this % to control how much we darken things on hover
-// $panel-function-factor: -11%;
-// $panel-border-color: scale-color($panel-bg, $lightness: $panel-function-factor);
-
-// We use these to set default inner padding and bottom margin
-// $panel-margin-bottom: rem-calc(20);
-// $panel-padding: rem-calc(20);
-
-// We use these to set default font colors
-// $panel-font-color: $oil;
-// $panel-font-color-alt: $white;
-
-// $panel-header-adjust: true;
-// $callout-panel-link-color: $primary-color;
-
-// 22. Pricing Tables
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-pricing-classes: $include-html-classes;
-
-// We use this to control the border color
-// $price-table-border: solid 1px $gainsboro;
-
-// We use this to control the bottom margin of the pricing table
-// $price-table-margin-bottom: rem-calc(20);
-
-// We use these to control the title styles
-// $price-title-bg: $oil;
-// $price-title-padding: rem-calc(15 20);
-// $price-title-align: center;
-// $price-title-color: $smoke;
-// $price-title-weight: $font-weight-normal;
-// $price-title-size: rem-calc(16);
-// $price-title-font-family: $body-font-family;
-
-// We use these to control the price styles
-// $price-money-bg: $vapor;
-// $price-money-padding: rem-calc(15 20);
-// $price-money-align: center;
-// $price-money-color: $oil;
-// $price-money-weight: $font-weight-normal;
-// $price-money-size: rem-calc(32);
-// $price-money-font-family: $body-font-family;
-
-// We use these to control the description styles
-// $price-bg: $white;
-// $price-desc-color: $monsoon;
-// $price-desc-padding: rem-calc(15);
-// $price-desc-align: center;
-// $price-desc-font-size: rem-calc(12);
-// $price-desc-weight: $font-weight-normal;
-// $price-desc-line-height: 1.4;
-// $price-desc-bottom-border: dotted 1px $gainsboro;
-
-// We use these to control the list item styles
-// $price-item-color: $oil;
-// $price-item-padding: rem-calc(15);
-// $price-item-align: center;
-// $price-item-font-size: rem-calc(14);
-// $price-item-weight: $font-weight-normal;
-// $price-item-bottom-border: dotted 1px $gainsboro;
-
-// We use these to control the CTA area styles
-// $price-cta-bg: $white;
-// $price-cta-align: center;
-// $price-cta-padding: rem-calc(20 20 0);
-
-// 23. Progress Bar
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-media-classes: $include-html-classes;
-
-// We use this to set the progress bar height
-// $progress-bar-height: rem-calc(25);
-// $progress-bar-color: $vapor  ;
-
-// We use these to control the border styles
-// $progress-bar-border-color: scale-color($white, $lightness: 20%);
-// $progress-bar-border-size: 1px;
-// $progress-bar-border-style: solid;
-// $progress-bar-border-radius: $global-radius;
-
-// We use these to control the margin & padding
-// $progress-bar-pad: rem-calc(2);
-// $progress-bar-margin-bottom: rem-calc(10);
-
-// We use these to set the meter colors
-// $progress-meter-color: $primary-color;
-// $progress-meter-secondary-color: $secondary-color;
-// $progress-meter-success-color: $success-color;
-// $progress-meter-alert-color: $alert-color;
-
-// 24. Range Slider
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-range-slider-classes: $include-html-classes;
-
-// These variables define the slider bar styles
-// $range-slider-bar-width: 100%;
-// $range-slider-bar-height: rem-calc(16);
-
-// $range-slider-bar-border-width: 1px;
-// $range-slider-bar-border-style: solid;
-// $range-slider-bar-border-color: $gainsboro;
-// $range-slider-radius: $global-radius;
-// $range-slider-round: $global-rounded;
-// $range-slider-bar-bg-color: $ghost;
-
-// Vertical bar styles
-// $range-slider-vertical-bar-width: rem-calc(16);
-// $range-slider-vertical-bar-height: rem-calc(200);
-
-// These variables define the slider handle styles
-// $range-slider-handle-width: rem-calc(32);
-// $range-slider-handle-height: rem-calc(22);
-// $range-slider-handle-position-top: rem-calc(-5);
-// $range-slider-handle-bg-color: $primary-color;
-// $range-slider-handle-border-width: 1px;
-// $range-slider-handle-border-style: solid;
-// $range-slider-handle-border-color: none;
-// $range-slider-handle-radius: $global-radius;
-// $range-slider-handle-round: $global-rounded;
-// $range-slider-handle-bg-hover-color: scale-color($primary-color, $lightness: -12%);
-// $range-slider-handle-cursor: pointer;
-
-// 25. Reveal
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-reveal-classes: $include-html-classes;
-
-// We use these to control the style of the reveal overlay.
-// $reveal-overlay-bg: rgba($black, .45);
-// $reveal-overlay-bg-old: $black;
-
-// We use these to control the style of the modal itself.
-// $reveal-modal-bg: $white;
-// $reveal-position-top: rem-calc(100);
-// $reveal-default-width: 80%;
-// $reveal-max-width: $row-width;
-// $reveal-modal-padding: rem-calc(20);
-// $reveal-box-shadow: 0 0 10px rgba($black,.4);
-
-// We use these to style the reveal close button
-// $reveal-close-font-size: rem-calc(40);
-// $reveal-close-top: rem-calc(8);
-// $reveal-close-side: rem-calc(11);
-// $reveal-close-color: $base;
-// $reveal-close-weight: $font-weight-bold;
-
-// We use this to set the default radius used throughout the core.
-// $reveal-radius: $global-radius;
-// $reveal-round: $global-rounded;
-
-// We use these to control the modal border
-// $reveal-border-style: solid;
-// $reveal-border-width: 1px;
-// $reveal-border-color: $steel;
-
-// $reveal-modal-class: "reveal-modal";
-// $close-reveal-modal-class: "close-reveal-modal";
-
-// 26. Side Nav
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-nav-classes: $include-html-classes;
-
-// We use this to control padding.
-// $side-nav-padding: rem-calc(14 0);
-
-// We use these to control list styles.
-// $side-nav-list-type: none;
-// $side-nav-list-position: inside;
-// $side-nav-list-margin: rem-calc(0 0 7 0);
-
-// We use these to control link styles.
-// $side-nav-link-color: $primary-color;
-// $side-nav-link-color-active: scale-color($side-nav-link-color, $lightness: 30%);
-// $side-nav-link-color-hover: scale-color($side-nav-link-color, $lightness: 30%);
-// $side-nav-link-bg-hover: hsla(0, 0, 0, 0.025);
-// $side-nav-link-margin: 0;
-// $side-nav-link-padding: rem-calc(7 14);
-// $side-nav-font-size: rem-calc(14);
-// $side-nav-font-weight: $font-weight-normal;
-// $side-nav-font-weight-active: $side-nav-font-weight;
-// $side-nav-font-family: $body-font-family;
-// $side-nav-font-family-active: $side-nav-font-family;
-
-// We use these to control heading styles.
-// $side-nav-heading-color: $side-nav-link-color;
-// $side-nav-heading-font-size: $side-nav-font-size;
-// $side-nav-heading-font-weight: bold;
-// $side-nav-heading-text-transform: uppercase;
-
-// We use these to control border styles
-// $side-nav-divider-size: 1px;
-// $side-nav-divider-style: solid;
-// $side-nav-divider-color: scale-color($white, $lightness: 10%);
-
-// 27. Split Buttons
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-button-classes: $include-html-classes;
-
-// We use these to control different shared styles for Split Buttons
-// $split-button-function-factor: 10%;
-// $split-button-pip-color: $white;
-// $split-button-pip-color-alt: $oil;
-// $split-button-active-bg-tint: rgba(0,0,0,0.1);
-
-// We use these to control tiny split buttons
-// $split-button-padding-tny: $button-pip-tny * 10;
-// $split-button-span-width-tny: $button-pip-tny * 6;
-// $split-button-pip-size-tny: $button-pip-tny;
-// $split-button-pip-top-tny: $button-pip-tny * 2;
-// $split-button-pip-default-float-tny: rem-calc(-6);
-
-// We use these to control small split buttons
-// $split-button-padding-sml: $button-pip-sml * 10;
-// $split-button-span-width-sml: $button-pip-sml * 6;
-// $split-button-pip-size-sml: $button-pip-sml;
-// $split-button-pip-top-sml: $button-pip-sml * 1.5;
-// $split-button-pip-default-float-sml: rem-calc(-6);
-
-// We use these to control medium split buttons
-// $split-button-padding-med: $button-pip-med * 9;
-// $split-button-span-width-med: $button-pip-med * 5.5;
-// $split-button-pip-size-med: $button-pip-med - rem-calc(3);
-// $split-button-pip-top-med: $button-pip-med * 1.5;
-// $split-button-pip-default-float-med: rem-calc(-6);
-
-// We use these to control large split buttons
-// $split-button-padding-lrg: $button-pip-lrg * 8;
-// $split-button-span-width-lrg: $button-pip-lrg * 5;
-// $split-button-pip-size-lrg: $button-pip-lrg - rem-calc(6);
-// $split-button-pip-top-lrg: $button-pip-lrg + rem-calc(5);
-// $split-button-pip-default-float-lrg: rem-calc(-6);
-
-// 28. Sub Nav
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-nav-classes: $include-html-classes;
-
-// We use these to control margin and padding
-// $sub-nav-list-margin: rem-calc(-4 0 18);
-// $sub-nav-list-padding-top: rem-calc(4);
-
-// We use this to control the definition
-// $sub-nav-font-family: $body-font-family;
-// $sub-nav-font-size: rem-calc(14);
-// $sub-nav-font-color: $aluminum;
-// $sub-nav-font-weight: $font-weight-normal;
-// $sub-nav-text-decoration: none;
-// $sub-nav-padding: rem-calc(3 16);
-// $sub-nav-border-radius: 3px;
-// $sub-nav-font-color-hover: scale-color($sub-nav-font-color, $lightness: -25%);
-
-// We use these to control the active item styles
-// $sub-nav-active-font-weight: $font-weight-normal;
-// $sub-nav-active-bg: $primary-color;
-// $sub-nav-active-bg-hover: scale-color($sub-nav-active-bg, $lightness: -14%);
-// $sub-nav-active-color: $white;
-// $sub-nav-active-padding: $sub-nav-padding;
-// $sub-nav-active-cursor: default;
-
-// $sub-nav-item-divider: "";
-// $sub-nav-item-divider-margin: rem-calc(12);
-
-// 29. Switch
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-form-classes: $include-html-classes;
-
-// Controlling border styles and background colors for the switch container
-// $switch-border-color: scale-color($white, $lightness: -20%);
-// $switch-border-style: solid;
-// $switch-border-width: 1px;
-// $switch-bg: $white;
-
-// We use these to control the switch heights for our default classes
-// $switch-height-tny: rem-calc(22);
-// $switch-height-sml: rem-calc(28);
-// $switch-height-med: rem-calc(36);
-// $switch-height-lrg: rem-calc(44);
-// $switch-bottom-margin: rem-calc(20);
-
-// We use these to control default font sizes for our classes.
-// $switch-font-size-tny: 11px;
-// $switch-font-size-sml: 12px;
-// $switch-font-size-med: 14px;
-// $switch-font-size-lrg: 17px;
-// $switch-label-side-padding: 6px;
-
-// We use these to style the switch-paddle
-// $switch-paddle-bg: $white;
-// $switch-paddle-fade-to-color: scale-color($switch-paddle-bg, $lightness: -10%);
-// $switch-paddle-border-color: scale-color($switch-paddle-bg, $lightness: -35%);
-// $switch-paddle-border-width: 1px;
-// $switch-paddle-border-style: solid;
-// $switch-paddle-transition-speed: .1s;
-// $switch-paddle-transition-ease: ease-out;
-// $switch-positive-color: scale-color($success-color, $lightness: 94%);
-// $switch-negative-color: $white-smoke;
-
-// Outline Style for tabbing through switches
-// $switch-label-outline: 1px dotted $jumbo;
-
-// 30. Tables
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-table-classes: $include-html-classes;
-
-// These control the background color for the table and even rows
-// $table-bg: $white;
-// $table-even-row-bg: $snow;
-
-// These control the table cell border style
-// $table-border-style: solid;
-// $table-border-size: 1px;
-// $table-border-color: $gainsboro;
-
-// These control the table head styles
-// $table-head-bg: $white-smoke  ;
-// $table-head-font-size: rem-calc(14);
-// $table-head-font-color: $jet;
-// $table-head-font-weight: $font-weight-bold;
-// $table-head-padding: rem-calc(8 10 10);
-
-// These control the row padding and font styles
-// $table-row-padding: rem-calc(9 10);
-// $table-row-font-size: rem-calc(14);
-// $table-row-font-color: $jet;
-// $table-line-height: rem-calc(18);
-
-// These are for controlling the layout, display and margin of tables
-// $table-layout: auto;
-// $table-display: table-cell;
-// $table-margin-bottom: rem-calc(20);
-
-// 31. Tabs
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-tabs-classes: $include-html-classes;
-
-// $tabs-navigation-padding: rem-calc(16);
-// $tabs-navigation-bg-color: $silver  ;
-// $tabs-navigation-active-bg-color: $white;
-// $tabs-navigation-hover-bg-color: scale-color($tabs-navigation-bg-color, $lightness: -6%);
-// $tabs-navigation-font-color: $jet;
-// $tabs-navigation-active-font-color: $tabs-navigation-font-color;
-// $tabs-navigation-font-size: rem-calc(16);
-// $tabs-navigation-font-family: $body-font-family;
-
-// $tabs-content-margin-bottom: rem-calc(24);
-// $tabs-content-padding: ($column-gutter/2);
-
-// $tabs-vertical-navigation-margin-bottom: 1.25rem;
-
-// 32. Thumbnails
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-media-classes: $include-html-classes;
-
-// We use these to control border styles
-// $thumb-border-style: solid;
-// $thumb-border-width: 4px;
-// $thumb-border-color: $white;
-// $thumb-box-shadow: 0 0 0 1px rgba($black,.2);
-// $thumb-box-shadow-hover: 0 0 6px 1px rgba($primary-color,0.5);
-
-// Radius and transition speed for thumbs
-// $thumb-radius: $global-radius;
-// $thumb-transition-speed: 200ms;
-
-// 33. Tooltips
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-tooltip-classes: $include-html-classes;
-
-// $has-tip-border-bottom: dotted 1px $iron;
-// $has-tip-font-weight: $font-weight-bold;
-// $has-tip-font-color: $oil;
-// $has-tip-border-bottom-hover: dotted 1px scale-color($primary-color, $lightness: -55%);
-// $has-tip-font-color-hover: $primary-color;
-// $has-tip-cursor-type: help;
-
-// $tooltip-padding: rem-calc(12);
-// $tooltip-bg: $oil;
-// $tooltip-font-size: rem-calc(14);
-// $tooltip-font-weight: $font-weight-normal;
-// $tooltip-font-color: $white;
-// $tooltip-line-height: 1.3;
-// $tooltip-close-font-size: rem-calc(10);
-// $tooltip-close-font-weight: $font-weight-normal;
-// $tooltip-close-font-color: $monsoon;
-// $tooltip-font-size-sml: rem-calc(14);
-// $tooltip-radius: $global-radius;
-// $tooltip-rounded: $global-rounded;
-// $tooltip-pip-size: 5px;
-// $tooltip-max-width: 300px;
-
-// 34. Top Bar
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-top-bar-classes: $include-html-classes;
-
-// Background color for the top bar
-// $topbar-bg-color: $oil;
-// $topbar-bg: $topbar-bg-color;
-
-// Height and margin
-// $topbar-height: rem-calc(45);
-// $topbar-margin-bottom: 0;
-
-// Controlling the styles for the title in the top bar
-// $topbar-title-weight: $font-weight-normal;
-// $topbar-title-font-size: rem-calc(17);
-
-// Style the top bar dropdown elements
-// $topbar-dropdown-bg: $oil;
-// $topbar-dropdown-link-color: $white;
-// $topbar-dropdown-link-bg: $oil;
-// $topbar-dropdown-link-bg-hover: $oil;
-// $topbar-dropdown-link-weight: $font-weight-normal;
-// $topbar-dropdown-toggle-size: 5px;
-// $topbar-dropdown-toggle-color: $white;
-// $topbar-dropdown-toggle-alpha: 0.4;
-
-// Set the link colors and styles for top-level nav
-// $topbar-link-color: $white;
-// $topbar-link-color-hover: $white;
-// $topbar-link-color-active: $white;
-// $topbar-link-color-active-hover: $white;
-// $topbar-link-weight: $font-weight-normal;
-// $topbar-link-font-size: rem-calc(13);
-// $topbar-link-hover-lightness: -10%; // Darken by 10%
-// $topbar-link-bg: $topbar-bg;
-// $topbar-link-bg-color-hover: $charcoal;
-// $topbar-link-bg-hover: $oil;
-// $topbar-link-bg-active: $primary-color;
-// $topbar-link-bg-active-hover: scale-color($primary-color, $lightness: -14%);
-// $topbar-link-font-family: $body-font-family;
-// $topbar-link-text-transform: none;
-// $topbar-link-padding: ($topbar-height / 3);
-// $topbar-back-link-size: $h5-font-size;
-// $topbar-link-dropdown-padding: 20px;
-
-// $topbar-button-font-size: 0.75rem;
-// $topbar-button-top: 7px;
-
-// $topbar-dropdown-label-color: $monsoon;
-// $topbar-dropdown-label-text-transform: uppercase;
-// $topbar-dropdown-label-font-weight: $font-weight-bold;
-// $topbar-dropdown-label-font-size: rem-calc(10);
-// $topbar-dropdown-label-bg: $oil;
-
-// Top menu icon styles
-// $topbar-menu-link-transform: uppercase;
-// $topbar-menu-link-font-size: rem-calc(13);
-// $topbar-menu-link-weight: $font-weight-bold;
-// $topbar-menu-link-color: $white;
-// $topbar-menu-icon-color: $white;
-// $topbar-menu-link-color-toggled: $jumbo;
-// $topbar-menu-icon-color-toggled: $jumbo;
-
-// Transitions and breakpoint styles
-// $topbar-transition-speed: 300ms;
-// Using rem-calc for the below breakpoint causes issues with top bar
-// $topbar-breakpoint: #{lower-bound($medium-range)}; // Change to 9999px for always mobile layout
-// $topbar-media-query: $medium-up;
-
-// Divider Styles
-// $topbar-divider-border-bottom: solid 1px  scale-color($topbar-bg-color, $lightness: 13%);
-// $topbar-divider-border-top: solid 1px scale-color($topbar-bg-color, $lightness: -50%);
-
-// Sticky Class
-// $topbar-sticky-class: ".sticky";
-// $topbar-arrows: true; //Set false to remove the triangle icon from the menu item
-
-// 36. Visibility Classes
-// - - - - - - - - - - - - - - - - - - - - - - - - -
-
-// $include-html-visibility-classes: $include-html-classes;
-// $include-table-visibility-classes: true;
-// $include-legacy-visibility-classes: true;
-// $include-accessibility-classes: true;
diff --git a/static/scss/style.scss b/static/scss/style.scss
deleted file mode 100644
index 5a8a37e..0000000
--- a/static/scss/style.scss
+++ /dev/null
@@ -1,41 +0,0 @@
-@import "settings";
-@import "foundation";
-@import "doorman";
-
-// Or selectively include components
-// @import
-//   "foundation/components/accordion",
-//   "foundation/components/alert-boxes",
-//   "foundation/components/block-grid",
-//   "foundation/components/breadcrumbs",
-//   "foundation/components/button-groups",
-//   "foundation/components/buttons",
-//   "foundation/components/clearing",
-//   "foundation/components/dropdown",
-//   "foundation/components/dropdown-buttons",
-//   "foundation/components/flex-video",
-//   "foundation/components/forms",
-//   "foundation/components/grid",
-//   "foundation/components/inline-lists",
-//   "foundation/components/joyride",
-//   "foundation/components/keystrokes",
-//   "foundation/components/labels",
-//   "foundation/components/magellan",
-//   "foundation/components/orbit",
-//   "foundation/components/pagination",
-//   "foundation/components/panels",
-//   "foundation/components/pricing-tables",
-//   "foundation/components/progress-bars",
-//   "foundation/components/reveal",
-//   "foundation/components/side-nav",
-//   "foundation/components/split-buttons",
-//   "foundation/components/sub-nav",
-//   "foundation/components/switch",
-//   "foundation/components/tables",
-//   "foundation/components/tabs",
-//   "foundation/components/thumbs",
-//   "foundation/components/tooltips",
-//   "foundation/components/top-bar",
-//   "foundation/components/type",
-//   "foundation/components/offcanvas",
-//   "foundation/components/visibility";