* New MENU logic: AddMenuItem() added to add a menuitem in system, we can decide to become an icon in the frontend dashboard or a menu in case of responsive mobile

* Added Lamborghini module
* Added css of Dimatec and Lamborghini
* Switch from CSS to SCSS
* Enabled file watcher for SCSS
* Now we use SVG icon/graphic instead of png images, more scalability.
* Added some SVG icon for some future situations.....

build.js

@@ -11,8 +11,7 @@ compressor.minify({
     compressor: 'clean-css',
     input: [
       "node_modules/bootstrap/dist/css/bootstrap.min.css",
-      "ui/css/omlink.css",
-      `ui/customizations/${process.argv[2]}.css`
+      "ui/css/omlink.css"
     ],
     output: 'bundle.css'
   }

config.ini

@@ -10,12 +10,15 @@ DBSETTINGS="mysql:host=localhost;port=3306;dbname=omlink_lamborghini"
 dbuser=root
 dbpass=giancarlo
 BASEURL=/lamborghini
-SITENAME=OM-Link KittingDynamic
+SITENAME=OM-Link Kitting
 LOGO_CUSTOMER={{@BASEURL}}/ui/images/logo_text.png
+;LOGO_CUSTOMER={{@BASEURL}}/ui/images/DimatecLogo.png
+;ICON_LOGOUT={{@BASEURL}}/ui/images/logout.svg
+ICON_LOGOUT={{@BASEURL}}/ui/images/lamborghini/logout.png
 
 [CORE.fb]
-;:host=192.168.1.140
-host=127.0.0.1
+host=192.168.1.140
+;host=127.0.0.1
 port=50443
 key=C0000000000011511187894
 pass=X8sCUiGBEbWTRWCUW72n95tRT7wYriac

index.php

@@ -11,6 +11,9 @@
 require_once 'lib/f3/base.php';
 $f3 = \Base::instance();
 
+// Initializing
+$f3->set('GLOBALMENU', []);
+
 // Load Utility Class
 require_once "src\OpenMind\System\OMUtils.php";
 

src/Modules/KittingDynamic/KittingDynamic.php

@@ -1,27 +0,0 @@
-<?php
-/**
- * @author Open Mind
- * @date 13/06/2018
- * @time 15:11
- */
-
-namespace Modules\KittingDynamic;
-
-use OpenMind\System\PluginStrategy;
-
-class KittingDynamic extends PluginStrategy
-{
-  public function __construct()
-  {
-    \F3::config('labels.ini', true);
-
-    $this->AddRoute('GET /homemenu', __NAMESPACE__ . '\Pages->HomeMenu');
-    $this->AddRoute('GET|POST /pick2light/@step', __NAMESPACE__ . '\Pages->Pick2Light');
-    $this->AddRoute("GET|POST /bind/@step", __NAMESPACE__ . '\Pages->Bind');
-    $this->AddRoute("GET|POST /unbind/@step", __NAMESPACE__ . '\Pages->UnBind');
-    $this->AddRoute('GET /elencodistinta', __NAMESPACE__ . '\Pages->ElencoDistinta');
-  }
-}
-
-/** @var \Modules\KittingDynamic\KittingDynamic $KittingDynamic */
-Global $KittingDynamic;

src/Modules/Lamborghini/Lamborghini.php

@@ -0,0 +1,41 @@
+<?php
+/**
+ * @author Open Mind
+ * @date 17/07/2018
+ * @time 16:46
+ */
+
+namespace Modules\Lamborghini;
+
+use OpenMind\System\OMUtils;
+use OpenMind\System\PluginStrategy;
+
+class Lamborghini extends PluginStrategy
+{
+  public function __construct()
+  {
+    define('KITTING_SYSTEM', 'Modules\KittingDynamic');
+
+    \F3::config('labels.ini', true);
+
+    $this->AddRoute('GET /homemenu', KITTING_SYSTEM . '\Pages->HomeMenu');
+    $this->AddRoute('GET|POST /pick2light/@step', KITTING_SYSTEM . '\Pages->Pick2Light');
+    $this->AddRoute("GET|POST /bind/@step", KITTING_SYSTEM . '\Pages->Bind');
+    $this->AddRoute("GET|POST /unbind/@step", KITTING_SYSTEM . '\Pages->UnBind');
+    $this->AddRoute('GET /elencodistinta', KITTING_SYSTEM . '\Pages->ElencoDistinta');
+
+    $this->AddMenuItem('bind', ['url' => 'bind/1', 'image' => 'ui/images/lamborghini/bind.png']);
+    $this->AddMenuItem('unbind', ['url' => 'unbind/1', 'image' => 'ui/images/lamborghini/unbind.png']);
+    $this->AddMenuItem('pick2light', ['url' => 'pick2light/1', 'image' => 'ui/images/lamborghini/pick2light.png']);
+    $this->AddMenuItem('elencodistinta', ['url' => 'elencodistinta', 'image' => 'ui/images/lamborghini/elenco_distinta.png']);
+
+    // Override default logo
+    $iconPath = OMUtils::getInstance()->getStringFromTemplate('{{@BASEURL}}/ui/images/lamborghini/logout.png');
+
+    \F3::set('ICON_LOGOUT', $iconPath);
+
+  }
+}
+
+/** @var \Modules\Lamborghini\Lamborghini $Lamborghini */
+Global $Lamborghini;

src/OpenMind/System/OMUtils.php

@@ -8,6 +8,7 @@
 namespace OpenMind\System;
 
 use FilesystemIterator;
+use OpenMind\Web\Web;
 use RecursiveDirectoryIterator;
 use RecursiveIteratorIterator;
 
@@ -28,12 +29,16 @@ class OMUtils
    */
   public function PluginLoader(string $path)
   {
-    Global $System;
+    // <class priority>
+    //TODO , if is necessary to give a priority to some classes before other, initialize here
+    Global $System, $Web;
     $System = new System();  // we need System Base class first, so will force to load as first
+    $Web = new Web();
+    // </class priority>
     $Directory = new RecursiveDirectoryIterator($path, FilesystemIterator::SKIP_DOTS);
     $Iterator = new RecursiveIteratorIterator($Directory, RecursiveIteratorIterator::CHILD_FIRST);
 
-    foreach ($Iterator as $item) {
+    foreach($Iterator as $item) {
       if (is_file($item->getPathname()))
         continue;
       $moduleName = $item->getFilename();
@@ -48,6 +53,17 @@ class OMUtils
     }
   }
 
+  /**
+   * Use F3 template resolve() to parse string like "{{@BASESITE}}"
+   *
+   * @param string $strTemplate the F3 original string
+   * @return string converted string
+   */
+  public function getStringFromTemplate(string $strTemplate)
+  {
+    return \Template::instance()->resolve($strTemplate);
+  }
+
 
   /**
    * Load an encrypted file with the method "base64_encode(gzcompress(<path to config.ini>))", save it in a temporary file in temp folder of system and load with F3::config()

src/OpenMind/System/PluginStrategy.php

@@ -84,28 +84,32 @@ class PluginStrategy implements IPluginStrategy
   }
 
   /**
-   * Add menu to application for the plugin
+   * Add menu to application for the plugin, if another menu with same $menuName is present, the last added has priority on other
    *
-   * @param array $menu the struct of OMLink Menu:
+   * @param string $menuName Name of menu to add
+   * @param array $options the struct of OMLink Menu
    *
-   * ['menu_name' => 'Bind',
-   *   'url' => '/bind',
-   *   'is_disabled' => false]
+   * <br/><br/>
+   * [<br/>
+   * &nbsp;&nbsp;'menu_name' => 'Bind',<br/>
+   * &nbsp;&nbsp;'url' => '/bind',<br/>
+   * &nbsp;&nbsp;'is_disabled' => false<br/>
+   * ]
    */
-  public function AddMenuItem(array $menu)
+  public function AddMenuItem(string $menuName, array $options)
   {
     // TODO: to implement
     $defaults = [
-      'menu_name' => 'DefaultMenu',
       'url' => '/',
-      'is_disabled' => 'false'
+      'is_disabled' => false,
+      'image' => 'ui/images/question.svg'
     ];
 
-    $newMenu = array_merge($defaults, $menu);
+    $newMenu = array_merge($defaults, $options);
 
-    $globalMenuUpdated = array_merge(\F3::get('GLOBALMENU'), $newMenu);
+    $globalMenuUpdated = \F3::get('GLOBALMENU');
+    $globalMenuUpdated[$menuName] = $newMenu;
 
     \F3::set('GLOBALMENU', $globalMenuUpdated);
   }
-
 }

src/OpenMind/Web/Web.php

@@ -17,6 +17,12 @@ class Web extends PluginStrategy
     $this->AddRoute('GET /', __NAMESPACE__ . '\Login->Login');
     $this->AddRoute("POST /loginform", __NAMESPACE__ . '\Login->LoginForm');
     $this->AddRoute("GET /logout", __NAMESPACE__ . '\Login->Logout');
+
+    $this->AddMenuItem('bind', ['url' => 'bind/1', 'image' => 'ui/images/bind.svg']);
+    $this->AddMenuItem('unbind', ['url' => 'unbind/1', 'image' => 'ui/images/unbind.svg']);
+    $this->AddMenuItem('pick2light', ['url' => 'pick2light/1', 'image' => 'ui/images/pick2light.svg']);
+    $this->AddMenuItem('elencodistinta', ['url' => 'elencodistinta', 'image' => 'ui/images/list.svg']);
+
   }
 }
 

ui/bars.tpl

@@ -1,18 +1,18 @@
-<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark">
-    <a href="{{@BASEURL}}/"><img class="navbar-brand" src="{{@LOGO_CUSTOMER}}" height="90"/></a>
-    <div class="collapse navbar-collapse"></div>
-    <a class="navbar-brand" href="{{@BASEURL}}/logout">
-        <img src="{{@BASEURL}}/ui/images/logout.png" height="90"/>
-    </a>
+<nav class="navbar fixed-top navbar-expand-lg navbar-dark om-shadow">
+	<a href="{{@BASEURL}}/"><img class="om-shadow navbar-brand" src="{{@LOGO_CUSTOMER}}" height="90"/></a>
+	<div class="collapse navbar-collapse"></div>
+	<a class="navbar-brand" href="{{@BASEURL}}/logout">
+		<img src="{{@ICON_LOGOUT}}" class="om-shadow"/>
+	</a>
 </nav>
 
-<nav class="navbar fixed-bottom navbar-expand-lg navbar-dark bg-dark">
-    <check if="{{ isset(@PREVPAGE) }}">
-        <a href="{{@PREVPAGE}}"><img class="navbar-brand" src="{{@BASEURL}}/ui/images/arrow-left.svg" height="50"/></a>
-    </check>
-    <div class="nav-item">Utente: {{@COOKIE.username}}</div>
-    <div class="collapse navbar-collapse"></div>
-    <a class="navbar-brand" href="{{@BASEURL}}">
-        <img src="{{@BASEURL}}/ui/images/om-link-logo.png" height="40"/>
-    </a>
+<nav class="navbar fixed-bottom navbar-expand-lg navbar-dark">
+	<check if="{{ isset(@PREVPAGE) }}">
+		<a href="{{@PREVPAGE}}"><img class="navbar-brand" src="{{@BASEURL}}/ui/images/arrow-left.svg" height="50"/></a>
+	</check>
+	<div class="nav-item">Utente: {{@COOKIE.username}}</div>
+	<div class="collapse navbar-collapse"></div>
+	<a class="navbar-brand" href="{{@BASEURL}}">
+		<img src="{{@BASEURL}}/ui/images/om-link-logo.png" height="40"/>
+	</a>
 </nav>

ui/css/omlink.css

@@ -1,30 +1,38 @@
 /**
- * Main CSS file
+ * Main SCSS file
+ *
+ * @author Open Mind
+ * @date 27/06/2018
+ * @time 17:42
+ * @since 18/07/2018 in SCSS format
+ */
+/**
+ * Child SCSS file
  *
  * @author Open Mind
  * @date 27/06/2018
  * @time 17:42
  */
-
 html, body {
   height: 100%;
 }
 
+body {
+  background-color: #1a1a1a !important;
+  color: #ffd242 !important;
+  font-family: "Roboto";
+}
+
 /* latin */
 @font-face {
-  font-family: 'Roboto';
+  font-family: "Roboto";
   font-style: normal;
   font-weight: 400;
-  src: local('Roboto'), local('Roboto-Regular'), url('ui/fonts/Roboto-Regular.ttf') format('truetype');
+  src: local("Roboto"), local("Roboto-Regular"), url("ui/fonts/Roboto-Regular.ttf") format("truetype");
   unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
 }
-
-body {
-  font-family: 'Roboto';
-}
-
 .error_body {
-  background-image: url('ui/images/error_bg.png');
+  background-image: url("ui/images/error_bg.png");
   background-repeat: no-repeat;
   background-size: cover;
 }
@@ -33,12 +41,12 @@ body {
   opacity: 0.9;
 }
 
-input[type="text"], input[type="password"] {
-  background-color: #484848 !important;
+input[type=text], input[type=password] {
   border-color: #C5AC0F !important;
+  background-color: #484848 !important;
 }
 
-input[type="text"]:focus, input[type="password"]:focus {
+input[type=text]:focus, input[type=password]:focus {
   border-color: #C5AC0F !important;
   color: #ffd242 !important;
 }
@@ -57,10 +65,27 @@ input[type="text"]:focus, input[type="password"]:focus {
   border: 1px solid red !important;
 }
 
-.bg-dark {
-  background-color: #686f75 !important;
-}
-
 .disablebutton {
   opacity: 0.4;
-}
+}
+
+.imgbuttonmenu {
+  width: 200px;
+}
+
+.om-shadow {
+  filter: drop-shadow(0px 0.2em 5px #444444);
+}
+
+/*input::placeholder {
+  color: white !important;
+}
+
+input::-ms-input-placeholder {
+  color: white !important;
+}*/
+.navbar {
+  background-color: rgba(94, 107, 116, 0.95) !important;
+}
+
+/*# sourceMappingURL=omlink.css.map */

ui/css/omlink.scss

@@ -0,0 +1,88 @@
+/**
+ * Main SCSS file
+ *
+ * @author Open Mind
+ * @date 27/06/2018
+ * @time 17:42
+ * @since 18/07/2018 in SCSS format
+ */
+
+//@import '../customizations/dimatec';
+@import '../customizations/lamborghini';
+
+html, body {
+  height: 100%;
+}
+
+body {
+  background-color: $mainColor;
+  color: $textColor;
+  font-family: 'Roboto';
+}
+
+/* latin */
+@font-face {
+  font-family: 'Roboto';
+  font-style: normal;
+  font-weight: 400;
+  src: local('Roboto'), local('Roboto-Regular'), url('ui/fonts/Roboto-Regular.ttf') format('truetype');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+
+.error_body {
+  background-image: url('ui/images/error_bg.png');
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+
+.error_body .card {
+  opacity: 0.9;
+}
+
+input[type="text"], input[type="password"] {
+  border-color: #C5AC0F !important;
+  background-color: #484848 !important;
+}
+
+input[type="text"]:focus, input[type="password"]:focus {
+  border-color: #C5AC0F !important;
+  color: #ffd242 !important;
+}
+
+.form-control {
+  background-color: #484848 !important;
+  color: #ffd242 !important;
+}
+
+.form-control:focus {
+  border-color: #c5ac0f !important;
+  box-shadow: 0 0 0 0.2rem rgba(197, 172, 15, 0.25) !important;
+}
+
+.debugborder {
+  border: 1px solid red !important;
+}
+
+.disablebutton {
+  opacity: 0.4;
+}
+
+.imgbuttonmenu {
+  width: 200px;
+}
+
+.om-shadow {
+  filter: drop-shadow(0px 0.2em 5px $shadowColor);
+}
+
+/*input::placeholder {
+  color: white !important;
+}
+
+input::-ms-input-placeholder {
+  color: white !important;
+}*/
+
+.navbar {
+  background-color: $navbarsColor;
+}

ui/customizations/dimatec.js

@@ -0,0 +1,7 @@
+/**
+ * Child JS file
+ *
+ * @author Open Mind
+ * @date 16/07/2018
+ * @time 16:00
+ */

ui/customizations/dimatec.scss

@@ -0,0 +1,19 @@
+/**
+ * Child SCSS file
+ *
+ * @author Open Mind
+ * @date 16/07/2018
+ * @time 16:00
+ */
+
+// Background color
+$mainColor: white !important;
+
+// Main text color
+$textColor: white !important;
+
+// Upper and Lower navbar background color
+$navbarsColor: rgba(94, 103, 178, 0.95) !important;
+
+// drop-shadow and box-shadow color
+$shadowColor: #444444;

ui/customizations/lamborghini.css

@@ -1,12 +0,0 @@
-/**
- * Child CSS file
- *
- * @author Open Mind
- * @date 27/06/2018
- * @time 17:42
- */
-
-body {
-  background-color: #1c1c1c !important;
-  color: #ffd242 !important;
-}

ui/customizations/lamborghini.scss

@@ -0,0 +1,21 @@
+/**
+ * Child SCSS file
+ *
+ * @author Open Mind
+ * @date 27/06/2018
+ * @time 17:42
+ */
+
+
+// Background color
+//$mainColor: #eee !important;
+$mainColor: #1a1a1a !important;
+
+// Main text color
+$textColor: #ffd242 !important;
+
+// Upper and Lower navbar background color
+$navbarsColor: rgba(94, 107, 116, 0.95) !important;
+
+// drop-shadow and box-shadow color
+$shadowColor: #444444;

ui/homemenu.tpl

@@ -1,28 +1,11 @@
 <include href="bars.tpl"/>
 
-<div class="row h-100">
-  <div class="col-md-12 align-self-center">
-    <div class="content">
-      <div class="row justify-content-center">
-        <div class="col-md-2 m-3">
-          <img class="img-fluid disablebutton" src="ui/images/utente.png"/>
-        </div>
-        <div class="col-md-2 m-2">
-          <a href="{{@BASEURL}}/elencodistinta"><img class="img-fluid" src="ui/images/elenco_distinta.png"/></a>
-        </div>
-        <div class="col-md-2 m-3">
-          <a href="{{@BASEURL}}/pick2light/1"><img class="img-fluid" src="ui/images/pick2light.png"/></a>
-        </div>
-      </div>
-      <div class="row justify-content-center">
-        <div class="col-md-2 m-3">
-          <a href="{{@BASEURL}}/bind/1"><img class="img-fluid" src="ui/images/bind.png"/></a>
-        </div>
-        <div class="col-md-2 m-3">
-          {*<a href="{{@BASEURL}}/unbind/1"><img class="img-fluid" src="ui/images/unbind.png"/></a>*}
-          <img class="img-fluid disablebutton" src="ui/images/unbind.png"/>
-        </div>
-      </div>
-    </div>
-  </div>
+<div class="d-flex justify-content-center align-items-center h-100">
+	<repeat group="{{@GLOBALMENU}}" value="{{@menuitem}}">
+		<div class="flex-fill bd-highlight text-center">
+			<a href="{{@BASEURL . '/' . @menuitem.url}}">
+				<img class="img-fluid {{ @menuitem.is_disabled ? 'disablebutton' : '' }} imgbuttonmenu om-shadow" src="{{@menuitem.image}}"/>
+			</a>
+		</div>
+	</repeat>
 </div>

ui/images/bind.svg

@@ -0,0 +1,24 @@
+<svg width="52.965" height="52.965" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg">
+ <g>
+  <title>Layer 1</title>
+  <path d="m24.008,13.401l9.192,-9.193c4.278,-4.278 11.278,-4.278 15.556,0l0,0c4.278,4.278 4.278,11.278 0,15.556l-12.021,12.022c-4.278,4.278 -11.278,4.278 -15.556,0l0,0" stroke-miterlimit="10" stroke-linecap="round" stroke-width="2" stroke="#D5354E" fill="none" id="svg_1"/>
+  <path d="m27.543,40.978l-7.778,7.778c-4.278,4.278 -11.278,4.278 -15.556,0l0,0c-4.278,-4.278 -4.278,-11.278 0,-15.556l11.314,-11.314c4.278,-4.278 11.278,-4.278 15.556,0l0,0" stroke-miterlimit="10" stroke-linecap="round" stroke-width="2" stroke="#D5354E" fill="none" id="svg_2"/>
+  <g id="svg_9"/>
+  <g id="svg_10"/>
+  <g id="svg_11"/>
+  <g id="svg_12"/>
+  <g id="svg_13"/>
+  <g id="svg_14"/>
+  <g id="svg_15"/>
+  <g id="svg_16"/>
+  <g id="svg_17"/>
+  <g id="svg_18"/>
+  <g id="svg_19"/>
+  <g id="svg_20"/>
+  <g id="svg_21"/>
+  <g id="svg_22"/>
+  <g id="svg_23"/>
+  <path d="m30.73497,40.98708l-7.778,7.778c-4.278,4.278 -11.278,4.278 -15.556,0l0,0c-4.278,-4.278 -4.278,-11.278 0,-15.556l11.314,-11.314c4.278,-4.278 11.278,-4.278 15.556,0l0,0" stroke-miterlimit="10" stroke-linecap="round" stroke-width="2" stroke="#D5354E" fill="none" id="svg_24" transform="rotate(-180 19.23172187805176,35.330081939697266) "/>
+  <path d="m20.81005,13.44446l9.192,-9.193c4.278,-4.278 11.278,-4.278 15.556,0l0,0c4.278,4.27801 4.278,11.27801 0,15.55601l-12.021,12.02199c-4.278,4.278 -11.278,4.278 -15.556,0l0,0" stroke-miterlimit="10" stroke-linecap="round" stroke-width="2" stroke="#D5354E" fill="none" id="svg_25" transform="rotate(-180 33.37379837036133,18.040464401245114) "/>
+ </g>
+</svg>

ui/images/cart.svg

@@ -0,0 +1,66 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 18.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 58 58" style="enable-background:new 0 0 58 58;" xml:space="preserve">
+<g>
+	<g>
+		<rect x="9" y="17.5" style="fill:#D1D4D1;" width="48" height="24"/>
+		<path style="fill:#556080;" d="M58,42.5H8v-26h50V42.5z M10,40.5h46v-22H10V40.5z"/>
+	</g>
+	<path style="fill:#556080;" d="M9,9.5H4c-0.552,0-1-0.447-1-1s0.448-1,1-1h5c0.552,0,1,0.447,1,1S9.552,9.5,9,9.5z"/>
+	<path style="fill:#556080;" d="M9,18.5c-0.552,0-1-0.447-1-1v-9c0-0.553,0.448-1,1-1s1,0.447,1,1v9C10,18.053,9.552,18.5,9,18.5z"
+		/>
+	<path style="fill:#556080;" d="M9,49.5c-0.552,0-1-0.447-1-1v-7c0-0.553,0.448-1,1-1s1,0.447,1,1v7C10,49.053,9.552,49.5,9,49.5z"
+		/>
+	<circle style="fill:#556080;" cx="19" cy="53.5" r="4"/>
+	<circle style="fill:#556080;" cx="43" cy="53.5" r="4"/>
+	<path style="fill:#556080;" d="M52,49.5H9c-0.552,0-1-0.447-1-1s0.448-1,1-1h43c0.552,0,1,0.447,1,1S52.552,49.5,52,49.5z"/>
+	<path style="fill:#556080;" d="M57,26.5H9c-0.552,0-1-0.447-1-1s0.448-1,1-1h48c0.552,0,1,0.447,1,1S57.552,26.5,57,26.5z"/>
+	<path style="fill:#556080;" d="M57,34.5H9c-0.552,0-1-0.447-1-1s0.448-1,1-1h48c0.552,0,1,0.447,1,1S57.552,34.5,57,34.5z"/>
+	<path style="fill:#556080;" d="M17,42.5c-0.552,0-1-0.447-1-1v-24c0-0.553,0.448-1,1-1s1,0.447,1,1v24
+		C18,42.053,17.552,42.5,17,42.5z"/>
+	<path style="fill:#556080;" d="M25,42.5c-0.552,0-1-0.447-1-1v-24c0-0.553,0.448-1,1-1s1,0.447,1,1v24
+		C26,42.053,25.552,42.5,25,42.5z"/>
+	<path style="fill:#556080;" d="M33,42.5c-0.552,0-1-0.447-1-1v-24c0-0.553,0.448-1,1-1s1,0.447,1,1v24
+		C34,42.053,33.552,42.5,33,42.5z"/>
+	<path style="fill:#556080;" d="M41,42.5c-0.552,0-1-0.447-1-1v-24c0-0.553,0.448-1,1-1s1,0.447,1,1v24
+		C42,42.053,41.552,42.5,41,42.5z"/>
+	<path style="fill:#556080;" d="M49,42.5c-0.552,0-1-0.447-1-1v-24c0-0.553,0.448-1,1-1s1,0.447,1,1v24
+		C50,42.053,49.552,42.5,49,42.5z"/>
+	<circle style="fill:#D8625E;" cx="3" cy="8.5" r="3"/>
+	<rect x="14" y="8.5" style="fill:#F0C419;" width="14" height="8"/>
+	<rect x="28" y="0.5" style="fill:#8697CB;" width="16" height="16"/>
+	<rect x="44" y="3.5" style="fill:#FB7B76;" width="10" height="13"/>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>

ui/images/database (1).svg

@@ -0,0 +1,74 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 18.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 57 57" style="enable-background:new 0 0 57 57;" xml:space="preserve">
+<g>
+	<g>
+		<path style="fill:#545E73;" d="M49.455,8L49.455,8C48.724,3.538,38.281,0,25.5,0S2.276,3.538,1.545,8l0,0H1.5v0.5V20v0.5V21v11
+			v0.5V33v12h0.045c0.731,4.461,11.175,8,23.955,8s23.224-3.539,23.955-8H49.5V33v-0.5V32V21v-0.5V20V8.5V8H49.455z"/>
+		<g>
+			<path style="fill:#38454F;" d="M25.5,41c-13.255,0-24-3.806-24-8.5V45h0.045c0.731,4.461,11.175,8,23.955,8
+				s23.224-3.539,23.955-8H49.5V32.5C49.5,37.194,38.755,41,25.5,41z"/>
+			<path style="fill:#38454F;" d="M1.5,32v0.5c0-0.168,0.018-0.334,0.045-0.5H1.5z"/>
+			<path style="fill:#38454F;" d="M49.455,32c0.027,0.166,0.045,0.332,0.045,0.5V32H49.455z"/>
+		</g>
+		<g>
+			<path style="fill:#556080;" d="M25.5,29c-13.255,0-24-3.806-24-8.5V33h0.045c0.731,4.461,11.175,8,23.955,8
+				s23.224-3.539,23.955-8H49.5V20.5C49.5,25.194,38.755,29,25.5,29z"/>
+			<path style="fill:#556080;" d="M1.5,20v0.5c0-0.168,0.018-0.334,0.045-0.5H1.5z"/>
+			<path style="fill:#556080;" d="M49.455,20c0.027,0.166,0.045,0.332,0.045,0.5V20H49.455z"/>
+		</g>
+		<ellipse style="fill:#91BAE1;" cx="25.5" cy="8.5" rx="24" ry="8.5"/>
+		<g>
+			<path style="fill:#8697CB;" d="M25.5,17c-13.255,0-24-3.806-24-8.5V21h0.045c0.731,4.461,11.175,8,23.955,8
+				s23.224-3.539,23.955-8H49.5V8.5C49.5,13.194,38.755,17,25.5,17z"/>
+			<path style="fill:#8697CB;" d="M1.5,8v0.5c0-0.168,0.018-0.334,0.045-0.5H1.5z"/>
+			<path style="fill:#8697CB;" d="M49.455,8C49.482,8.166,49.5,8.332,49.5,8.5V8H49.455z"/>
+		</g>
+	</g>
+	<g>
+		<path style="fill:#BDC3C7;" d="M55.5,43.846l-1.444-0.278c-2.143-0.412-3.125-2.916-1.835-4.675l0.907-1.236l-1.958-1.958
+			l-1.217,0.825c-1.806,1.224-4.272,0.148-4.604-2.008L45.115,33h-2.769l-0.359,1.865c-0.403,2.096-2.818,3.096-4.585,1.899
+			l-1.572-1.065l-1.958,1.958l0.907,1.236c1.29,1.76,0.308,4.263-1.835,4.675L31.5,43.846v2.769l1.515,0.233
+			c2.157,0.332,3.232,2.797,2.008,4.604l-0.825,1.217l1.958,1.958l1.236-0.907c1.76-1.29,4.263-0.308,4.675,1.835L42.346,57h2.769
+			l0.164-1.066c0.339-2.204,2.896-3.263,4.694-1.944l0.869,0.638l1.958-1.958l-0.825-1.217c-1.224-1.806-0.148-4.272,2.008-4.604
+			l1.515-0.233V43.846z"/>
+		<g>
+			<circle style="fill:#FFFFFF;" cx="43.5" cy="45" r="4"/>
+			<path style="fill:#ECF0F1;" d="M43.5,50c-2.757,0-5-2.243-5-5s2.243-5,5-5s5,2.243,5,5S46.257,50,43.5,50z M43.5,42
+				c-1.654,0-3,1.346-3,3s1.346,3,3,3s3-1.346,3-3S45.154,42,43.5,42z"/>
+		</g>
+	</g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>

ui/images/database.svg

@@ -0,0 +1,77 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 60 60" style="enable-background:new 0 0 60 60;" xml:space="preserve">
+<g>
+	<path style="fill:#424A60;" d="M24,35v-0.375V34.25v-8.625V25.25h0.034C24.013,25.374,24,25.499,24,25.625
+		c0-2.437,3.862-4.552,9.534-5.625H3.608C1.616,20,0,21.615,0,23.608v11.783C0,37.385,1.616,39,3.608,39H24V35z"/>
+</g>
+<g>
+	<path style="fill:#556080;" d="M24.034,53H24v-9v-0.375V43.25V39H3.608C1.616,39,0,40.615,0,42.608v11.783
+		C0,56.385,1.616,58,3.608,58h28.718C27.601,56.931,24.378,55.103,24.034,53z"/>
+</g>
+<path style="fill:#556080;" d="M54.392,20H3.608C1.616,20,0,18.384,0,16.392V4.608C0,2.616,1.616,1,3.608,1h50.783
+	C56.384,1,58,2.616,58,4.608v11.783C58,18.384,56.384,20,54.392,20z"/>
+<circle style="fill:#7383BF;" cx="9.5" cy="10.5" r="3.5"/>
+<circle style="fill:#7383BF;" cx="49" cy="9" r="1"/>
+<circle style="fill:#7383BF;" cx="45" cy="9" r="1"/>
+<circle style="fill:#7383BF;" cx="51" cy="12" r="1"/>
+<circle style="fill:#7383BF;" cx="47" cy="12" r="1"/>
+<circle style="fill:#7383BF;" cx="41" cy="9" r="1"/>
+<circle style="fill:#7383BF;" cx="43" cy="12" r="1"/>
+<circle style="fill:#7383BF;" cx="37" cy="9" r="1"/>
+<circle style="fill:#7383BF;" cx="39" cy="12" r="1"/>
+<circle style="fill:#7383BF;" cx="33" cy="9" r="1"/>
+<circle style="fill:#7383BF;" cx="35" cy="12" r="1"/>
+<circle style="fill:#7383BF;" cx="9.5" cy="29.5" r="3.5"/>
+<circle style="fill:#7383BF;" cx="9.5" cy="48.5" r="3.5"/>
+<g>
+	<path style="fill:#1A9172;" d="M42,48.75c-9.941,0-18-2.854-18-6.375V53h0.034c0.548,3.346,8.381,6,17.966,6s17.418-2.654,17.966-6
+		H60V42.375C60,45.896,51.941,48.75,42,48.75z"/>
+	<path style="fill:#1A9172;" d="M24,42v0.375c0-0.126,0.013-0.251,0.034-0.375H24z"/>
+	<path style="fill:#1A9172;" d="M59.966,42C59.987,42.124,60,42.249,60,42.375V42H59.966z"/>
+</g>
+<g>
+	<path style="fill:#25AE88;" d="M42,38c-9.941,0-18-2.854-18-6.375V42.75h0.034c0.548,3.346,8.381,6,17.966,6s17.418-2.654,17.966-6
+		H60V31.625C60,35.146,51.941,38,42,38z"/>
+	<path style="fill:#25AE88;" d="M24,31.25v0.375c0-0.126,0.013-0.251,0.034-0.375H24z"/>
+	<path style="fill:#25AE88;" d="M59.966,31.25C59.987,31.374,60,31.499,60,31.625V31.25H59.966z"/>
+</g>
+<ellipse style="fill:#88C057;" cx="42" cy="21.375" rx="18" ry="6.375"/>
+<g>
+	<path style="fill:#61B872;" d="M42,27.75c-9.941,0-18-2.854-18-6.375V32h0.034c0.548,3.346,8.381,6,17.966,6s17.418-2.654,17.966-6
+		H60V21.375C60,24.896,51.941,27.75,42,27.75z"/>
+	<path style="fill:#61B872;" d="M24,21v0.375c0-0.126,0.013-0.251,0.034-0.375H24z"/>
+	<path style="fill:#61B872;" d="M59.966,21C59.987,21.124,60,21.249,60,21.375V21H59.966z"/>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>

ui/images/delivery-cart (2).svg

@@ -0,0 +1,55 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 18.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 59 59" style="enable-background:new 0 0 59 59;" xml:space="preserve">
+<g>
+	<rect x="27" y="21.5" style="fill:#8F6127;" width="18" height="18"/>
+	<path style="fill:#70491E;" d="M40,42.069h-8V18.5h8V42.069z M34,40.069h4V20.5h-4V40.069z"/>
+	<circle style="fill:#556080;" cx="19" cy="51.5" r="4"/>
+	<circle style="fill:#556080;" cx="49" cy="51.5" r="4"/>
+	<path style="fill:#556080;" d="M9,7.5H4c-0.553,0-1-0.447-1-1s0.447-1,1-1h5c0.553,0,1,0.447,1,1S9.553,7.5,9,7.5z"/>
+	<path style="fill:#556080;" d="M9,47.5c-0.553,0-1-0.447-1-1v-40c0-0.553,0.447-1,1-1s1,0.447,1,1v40C10,47.053,9.553,47.5,9,47.5z
+		"/>
+	<path style="fill:#556080;" d="M58,47.5H9c-0.553,0-1-0.447-1-1s0.447-1,1-1h49c0.553,0,1,0.447,1,1S58.553,47.5,58,47.5z"/>
+	<rect x="27" y="39.5" style="fill:#CA965A;" width="24" height="6"/>
+	<rect x="21" y="21.5" style="fill:#AD7E4E;" width="6" height="24"/>
+	<rect x="21" y="15.5" style="fill:#CA965A;" width="24" height="6"/>
+	<rect x="45" y="15.5" style="fill:#AD7E4E;" width="6" height="24"/>
+	<circle style="fill:#D8625E;" cx="3" cy="6.5" r="3"/>
+	<path style="fill:#CA965A;" d="M49,37.5c0-0.553-0.447-1-1-1s-1,0.447-1,1v2h2V37.5z"/>
+	<path style="fill:#AD7E4E;" d="M43,17.5c-0.553,0-1,0.447-1,1s0.447,1,1,1h2v-2H43z"/>
+	<path style="fill:#AD7E4E;" d="M29,43.5c0.553,0,1-0.447,1-1s-0.447-1-1-1h-2v2H29z"/>
+	<path style="fill:#CA965A;" d="M23,23.5c0,0.553,0.447,1,1,1s1-0.447,1-1v-2h-2V23.5z"/>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>

ui/images/delivery-cart.svg

@@ -0,0 +1,50 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 18.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 59 59" style="enable-background:new 0 0 59 59;" xml:space="preserve">
+<g>
+	<rect x="15" y="4.5" style="fill:#E8D5B2;" width="15" height="42"/>
+	<rect x="30" y="25.5" style="fill:#A98258;" width="26" height="21"/>
+	<circle style="fill:#8697CB;" cx="40.5" cy="15" r="10.5"/>
+	<rect x="20" y="4.5" style="fill:#CBB292;" width="5" height="6"/>
+	<rect x="40" y="25.5" style="fill:#F4D5BD;" width="5" height="6"/>
+	<circle style="fill:#556080;" cx="19" cy="51.5" r="4"/>
+	<circle style="fill:#556080;" cx="49" cy="51.5" r="4"/>
+	<path style="fill:#BDC3C7;" d="M58,47.5H9c-0.553,0-1-0.447-1-1s0.447-1,1-1h49c0.553,0,1,0.447,1,1S58.553,47.5,58,47.5z"/>
+	<path style="fill:#BDC3C7;" d="M9,7.5H4c-0.553,0-1-0.447-1-1s0.447-1,1-1h5c0.553,0,1,0.447,1,1S9.553,7.5,9,7.5z"/>
+	<path style="fill:#BDC3C7;" d="M9,47.5c-0.553,0-1-0.447-1-1v-40c0-0.553,0.447-1,1-1s1,0.447,1,1v40C10,47.053,9.553,47.5,9,47.5z
+		"/>
+	<circle style="fill:#D8625E;" cx="3" cy="6.5" r="3"/>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>

ui/images/exchange.svg

@@ -0,0 +1,53 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
+<path style="fill:#5D9BEB;" d="M512,256.006C512,397.402,397.394,512.004,256.004,512C114.606,512.004,0,397.402,0,256.006
+	C-0.007,114.61,114.606,0,256.004,0C397.394,0,512,114.614,512,256.006z"/>
+<path style="fill:#4988DB;" d="M510.768,280.99c-0.112-0.111-0.222-0.224-0.334-0.335c-0.542-0.548-138.178-138.186-138.725-138.725
+	C342.203,112.003,301.25,93.391,256,93.391c-89.665,0-162.609,72.946-162.609,162.609c0,45.246,18.611,86.197,48.537,115.705
+	c0.542,0.549,138.179,138.187,138.73,138.73c0.112,0.113,0.224,0.224,0.336,0.336C402.427,499.007,499.005,402.43,510.768,280.99z"
+	/>
+<g>
+	<path style="fill:#F4F6F9;" d="M277.21,305.489h-96.051l30.351-30.351c2.762-2.762,2.762-7.235,0-9.997
+		c-2.762-2.762-7.235-2.762-9.997,0l-42.419,42.419c-2.762,2.762-2.762,7.235,0,9.997l42.419,42.419
+		c1.381,1.381,3.189,2.071,4.998,2.071c1.809,0,3.618-0.69,4.998-2.071c2.762-2.762,2.762-7.235,0-9.997l-30.351-30.351h96.051
+		c3.908,0,7.07-3.166,7.07-7.07C284.279,308.655,281.118,305.489,277.21,305.489z"/>
+	<path style="fill:#F4F6F9;" d="M310.489,152.022c-2.762-2.762-7.235-2.762-9.997,0c-2.762,2.762-2.762,7.235,0,9.997l30.351,30.351
+		h-96.051c-3.908,0-7.07,3.166-7.07,7.07s3.162,7.07,7.07,7.07h96.051l-30.351,30.351c-2.762,2.762-2.762,7.235,0,9.997
+		c1.381,1.381,3.189,2.071,4.998,2.071s3.618-0.69,4.998-2.071l42.419-42.419c2.762-2.762,2.762-7.235,0-9.997L310.489,152.022z"/>
+	<path style="fill:#F4F6F9;" d="M256,93.392c-89.665,0-162.608,72.946-162.608,162.608S166.335,418.608,256,418.608
+		S418.608,345.662,418.608,256S345.665,93.392,256,93.392z M256,404.468c-81.863,0-148.468-66.602-148.468-148.468
+		S174.137,107.532,256,107.532S404.468,174.133,404.468,256S337.863,404.468,256,404.468z"/>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>

ui/images/list.svg

@@ -0,0 +1,49 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 58 58" style="enable-background:new 0 0 58 58;" xml:space="preserve">
+<polygon style="fill:#EDEADA;" points="51.5,14 37.5,0 6.5,0 6.5,58 51.5,58 "/>
+<polygon style="fill:#CEC9AE;" points="37.5,0 37.5,14 51.5,14 "/>
+<path style="fill:#CEC9AE;" d="M41.5,22h-16c-0.552,0-1-0.447-1-1s0.448-1,1-1h16c0.552,0,1,0.447,1,1S42.052,22,41.5,22z"/>
+<path style="fill:#14A085;" d="M17.5,23c-0.257,0-0.514-0.099-0.708-0.293l-2-2c-0.391-0.391-0.391-1.023,0-1.414
+	s1.023-0.391,1.414,0l1.367,1.367l4.301-3.441c0.43-0.345,1.061-0.275,1.405,0.156c0.345,0.432,0.275,1.061-0.156,1.406l-5,4
+	C17.941,22.928,17.72,23,17.5,23z"/>
+<path style="fill:#CEC9AE;" d="M41.5,33h-16c-0.552,0-1-0.447-1-1s0.448-1,1-1h16c0.552,0,1,0.447,1,1S42.052,33,41.5,33z"/>
+<path style="fill:#14A085;" d="M17.5,34c-0.257,0-0.514-0.099-0.708-0.293l-2-2c-0.391-0.391-0.391-1.023,0-1.414
+	s1.023-0.391,1.414,0l1.367,1.367l4.301-3.441c0.43-0.345,1.061-0.275,1.405,0.156c0.345,0.432,0.275,1.061-0.156,1.406l-5,4
+	C17.941,33.928,17.72,34,17.5,34z"/>
+<path style="fill:#CEC9AE;" d="M41.5,44h-16c-0.552,0-1-0.447-1-1s0.448-1,1-1h16c0.552,0,1,0.447,1,1S42.052,44,41.5,44z"/>
+<path style="fill:#14A085;" d="M17.5,45c-0.257,0-0.514-0.099-0.708-0.293l-2-2c-0.391-0.391-0.391-1.023,0-1.414
+	s1.023-0.391,1.414,0l1.367,1.367l4.301-3.441c0.43-0.345,1.061-0.275,1.405,0.156c0.345,0.432,0.275,1.061-0.156,1.406l-5,4
+	C17.941,44.928,17.72,45,17.5,45z"/>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>

ui/images/logout.svg

@@ -0,0 +1,51 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 512.001 512.001" width="50px" style="enable-background:new 0 0 512.001 512.001;" xml:space="preserve">
+<path style="fill:#5D9BEB;" d="M0.001,256.006c0,141.395,114.606,255.998,255.996,255.994
+	c141.398,0.004,256.004-114.598,256.004-255.994C512.009,114.61,397.395,0,255.996,0C114.606,0,0.001,114.614,0.001,256.006z"/>
+<path style="fill:#4988DB;" d="M504.406,317.975c-0.228-0.213-212.195-212.38-212.837-212.837c-0.455-0.641-0.992-1.175-1.633-1.632
+	c-1.281-1.796-3.279-3.044-5.655-3.044H100.461c-3.907,0-7.07,3.166-7.07,7.07v296.937c0,2.377,1.249,4.377,3.046,5.659
+	c0.457,0.641,92.388,92.572,93.028,93.028c0.026,0.035,0.065,0.055,0.09,0.09c21.194,5.68,43.453,8.756,66.441,8.756
+	C376.019,512.003,476.696,429.417,504.406,317.975z"/>
+<g>
+	<path style="fill:#F4F6F9;" d="M284.28,340.839c-3.908,0-7.07,3.166-7.07,7.07v49.489H107.532V114.602H277.21v49.489
+		c0,3.904,3.163,7.07,7.07,7.07c3.908,0,7.07-3.166,7.07-7.07v-56.559c0-3.904-3.162-7.07-7.07-7.07H100.462
+		c-3.908,0-7.07,3.166-7.07,7.07v296.938c0,3.904,3.163,7.07,7.07,7.07h183.819c3.908,0,7.07-3.166,7.07-7.07V347.91
+		C291.35,344.004,288.188,340.839,284.28,340.839z"/>
+	<path style="fill:#F4F6F9;" d="M416.538,251.002l-70.7-70.7c-2.762-2.762-7.235-2.762-9.997,0c-2.762,2.762-2.762,7.235,0,9.997
+		l58.63,58.63H178.231c-3.908,0-7.07,3.166-7.07,7.07c0,3.904,3.163,7.07,7.07,7.07h216.24l-58.63,58.63
+		c-2.762,2.762-2.762,7.235,0,9.997c1.381,1.381,3.189,2.071,4.998,2.071s3.618-0.69,4.998-2.071l70.7-70.7
+		C419.3,258.237,419.3,253.763,416.538,251.002z"/>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>

ui/images/map-location.svg

@@ -0,0 +1,79 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 59.51 59.51" style="enable-background:new 0 0 59.51 59.51;" xml:space="preserve">
+<polygon style="fill:#FFFFFF;" points="53.057,24.76 43.057,24.76 17.057,24.76 7.057,24.76 3.402,53.76 56.171,53.76 "/>
+<path style="fill:#556080;" d="M53.057,24.76l3.114,29H3.402l3.655-29h10h26H53.057 M55.752,21.76h-2.695h-10h-26h-10H4.411
+	L4.08,24.385l-3.655,29L0,56.76h3.402h52.769h3.339l-0.357-3.32l-3.114-29L55.752,21.76L55.752,21.76z"/>
+<path style="fill:#EBBA16;" d="M13.684,49.76c-0.257,0-0.513-0.016-0.769-0.047c-0.218-0.026-0.438-0.067-0.653-0.124
+	c-0.535-0.138-0.856-0.684-0.718-1.218c0.138-0.535,0.683-0.86,1.218-0.718c0.132,0.033,0.264,0.059,0.396,0.075
+	c0.403,0.05,0.811,0.037,1.215-0.015c0.552-0.065,1.049,0.319,1.117,0.867c0.069,0.548-0.319,1.048-0.867,1.117
+	C14.31,49.738,13.995,49.76,13.684,49.76z M18.334,48.602c-0.401,0-0.779-0.243-0.933-0.64c-0.199-0.516,0.058-1.095,0.572-1.293
+	c0.592-0.229,1.188-0.483,1.774-0.759c0.503-0.235,1.096-0.019,1.33,0.48c0.234,0.5,0.02,1.096-0.48,1.33
+	c-0.628,0.295-1.269,0.568-1.903,0.813C18.576,48.581,18.454,48.602,18.334,48.602z M9.987,46.87c-0.507,0-0.941-0.384-0.994-0.898
+	c-0.02-0.197-0.028-0.395-0.028-0.592c0-0.116,0.003-0.232,0.009-0.347c0.023-0.469,0.099-0.942,0.225-1.406
+	c0.144-0.535,0.697-0.853,1.226-0.704c0.533,0.144,0.849,0.692,0.704,1.226c-0.088,0.326-0.141,0.657-0.156,0.983
+	c-0.004,0.082-0.007,0.165-0.007,0.248c0,0.129,0.005,0.26,0.019,0.389c0.056,0.55-0.345,1.04-0.894,1.097
+	C10.055,46.868,10.021,46.87,9.987,46.87z M23.666,45.871c-0.327,0-0.648-0.16-0.84-0.455c-0.301-0.464-0.169-1.083,0.294-1.384
+	c0.535-0.347,1.066-0.72,1.58-1.107c0.444-0.332,1.068-0.241,1.401,0.196c0.332,0.441,0.244,1.068-0.196,1.401
+	c-0.552,0.415-1.122,0.815-1.695,1.188C24.041,45.819,23.853,45.871,23.666,45.871z M28.425,42.221c-0.309,0-0.613-0.143-0.81-0.411
+	c-0.325-0.446-0.227-1.072,0.22-1.397c0.209-0.151,0.422-0.3,0.641-0.441c0.377-0.245,0.781-0.477,1.2-0.688
+	c0.496-0.247,1.095-0.048,1.343,0.444c0.248,0.493,0.049,1.095-0.444,1.343c-0.354,0.178-0.693,0.372-1.01,0.577
+	c-0.188,0.123-0.372,0.25-0.552,0.382C28.835,42.159,28.629,42.221,28.425,42.221z M12.469,41.748c-0.355,0-0.699-0.189-0.88-0.523
+	c-0.264-0.485-0.083-1.092,0.402-1.355c0.518-0.281,1.071-0.456,1.644-0.52c0.29-0.033,0.593-0.032,0.891,0.008
+	c0.547,0.072,0.933,0.574,0.86,1.122c-0.072,0.546-0.561,0.931-1.122,0.86c-0.133-0.018-0.271-0.018-0.406-0.002
+	c-0.316,0.034-0.623,0.132-0.913,0.289C12.793,41.709,12.63,41.748,12.469,41.748z M33.903,39.896c-0.462,0-0.877-0.321-0.977-0.791
+	c-0.115-0.541,0.229-1.072,0.769-1.187c0.643-0.138,1.335-0.252,2.058-0.342c0.553-0.081,1.047,0.32,1.115,0.869
+	c0.068,0.548-0.321,1.048-0.869,1.115c-0.665,0.083-1.3,0.188-1.886,0.313C34.042,39.889,33.972,39.896,33.903,39.896z
+	 M39.863,39.279c-0.533,0-0.977-0.421-0.998-0.959c-0.022-0.552,0.406-1.018,0.958-1.04l1.993-0.082
+	c0.55-0.05,1.02,0.401,1.045,0.954c0.025,0.551-0.402,1.019-0.954,1.044l-2.002,0.082C39.892,39.279,39.877,39.279,39.863,39.279z
+	 M45.842,38.836c-0.465,0-0.881-0.325-0.979-0.798c-0.111-0.541,0.236-1.07,0.777-1.182c0.578-0.119,1.006-0.286,1.347-0.525
+	c0.437-0.341,1.102-0.285,1.438,0.149c0.339,0.437,0.296,1.039-0.14,1.378c-0.055,0.042-0.11,0.083-0.169,0.122
+	c-0.544,0.384-1.229,0.661-2.072,0.835C45.977,38.829,45.908,38.836,45.842,38.836z M49.911,34.806
+	c-0.098,0-0.197-0.015-0.296-0.045c-0.527-0.163-0.823-0.724-0.659-1.251c0.053-0.171,0.086-0.341,0.097-0.506l0.004-0.116
+	c0-0.229-0.044-0.462-0.13-0.694c-0.192-0.518,0.071-1.093,0.59-1.285c0.514-0.191,1.094,0.071,1.285,0.59
+	c0.169,0.455,0.255,0.923,0.255,1.39c0,0.084-0.003,0.167-0.008,0.25c-0.022,0.324-0.084,0.646-0.183,0.964
+	C50.734,34.531,50.338,34.806,49.911,34.806z M44.851,30.699c-0.436,0-0.837-0.287-0.961-0.729c-0.15-0.531,0.158-1.084,0.69-1.233
+	c0.779-0.22,1.597-0.286,2.386-0.18c0.547,0.074,0.931,0.577,0.857,1.125c-0.073,0.547-0.566,0.931-1.125,0.857
+	c-0.521-0.069-1.058-0.023-1.575,0.121C45.032,30.687,44.942,30.699,44.851,30.699z"/>
+<path style="fill:#DD352E;" d="M40.844,11.931C40.32,7.932,38.23,2.75,30.022,2.75c-8.207,0-10.298,5.182-10.822,9.181
+	c-0.287,2.192-0.126,4.419,0.33,6.582c2.509,11.893,8.71,19.022,10.177,20.577c0.172,0.182,0.458,0.182,0.63,0
+	c1.467-1.555,7.668-8.684,10.177-20.577C40.971,16.35,41.132,14.123,40.844,11.931z M30.022,19.672
+	c-3.505,0-6.346-2.841-6.346-6.346c0-3.505,2.841-6.345,6.346-6.345c3.505,0,6.346,2.841,6.346,6.345
+	C36.368,16.831,33.527,19.672,30.022,19.672z"/>
+<g>
+	<path style="fill:#B02721;" d="M30.023,5.981c-4.051,0-7.346,3.295-7.346,7.345c0,4.051,3.295,7.346,7.346,7.346
+		s7.346-3.295,7.346-7.346C37.368,9.276,34.073,5.981,30.023,5.981z M30.023,18.672c-2.947,0-5.346-2.398-5.346-5.346
+		s2.398-5.345,5.346-5.345s5.346,2.397,5.346,5.345S32.97,18.672,30.023,18.672z"/>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>

ui/images/old/bind.svg

@@ -0,0 +1,33 @@
+<svg width="190" height="135" xmlns="http://www.w3.org/2000/svg">
+ <style type="text/css">.st0{fill:none;stroke:#424242;stroke-width:2.6517;stroke-miterlimit:10;}
+	.st1{fill:#424242;}
+	.st2{fill:none;stroke:#424242;stroke-width:1.9888;stroke-miterlimit:10;}
+	.st3{fill:none;stroke:#424242;stroke-width:1.965;stroke-miterlimit:10;}
+	.st4{fill:none;stroke:#424242;stroke-width:6.5501;stroke-miterlimit:10;}
+	.st5{fill:none;stroke:#424242;stroke-width:2.0365;stroke-miterlimit:10;}
+	.st6{fill:none;stroke:#424242;stroke-width:2.0403;stroke-miterlimit:10;}
+	.st7{fill:none;stroke:#424242;stroke-width:2.0403;stroke-linecap:round;stroke-miterlimit:10;}
+	.st8{fill:none;stroke:#424242;stroke-width:2.0953;stroke-miterlimit:10;}
+	.st9{fill:none;stroke:#424242;stroke-width:2.0953;stroke-linecap:round;stroke-miterlimit:10;}
+	.st10{fill:none;stroke:#FFD242;stroke-width:6.9844;stroke-miterlimit:10;}</style>
+
+ <g>
+  <title>background</title>
+  <rect fill="none" id="canvas_background" height="137" width="192" y="-1" x="-1"/>
+ </g>
+ <g>
+  <title>Layer 1</title>
+  <g id="svg_1">
+   <line id="svg_2" y2="44.900001" x2="160.2" y1="31.800001" x1="160.2" class="st0"/>
+   <path id="svg_3" d="m7.8,30.900001l14.9,0l0,-4.9c0,0 -1.5,-2.8 -7.5,-2.8c-5.9,0.1 -6.8,2.8 -6.8,2.8l0,4.9" class="st1"/>
+   <circle id="svg_4" r="37.400002" cy="38.400001" cx="148.4" class="st2"/>
+   <g id="svg_5">
+    <path id="svg_6" d="m149.5,75.700001c0.3,0 0.7,0.1 0.9,0.1l0,42.3c0,2.9 -2.4,5.3 -5.3,5.3l-110.5,0c-2.9,0 -5.3,-2.4 -5.3,-5.3l0,-75.4c0,-2.9 2.4,-5.3 5.3,-5.3l75.9,0c0,0.7 0.1,1.4 0.2,2.3c0,-3.4 0.4,-6.6 0.9,-9.1l-100.7,0c-5.5,0 -9.9,4.5 -9.9,9.9l0,81.2c0,5.5 4.5,9.9 9.9,9.9l136.4,0c5.5,0 9.9,-4.5 9.9,-9.9l0,-47.1c-1.5,0.9 -4.3,1.2 -7.7,1.1zm-124.8,40.8c0,1.2 -1,2.1 -2.1,2.1l-14.9,0c-1.2,0 -2.1,-1 -2.1,-2.1l0,-1.2c0,-1.2 1,-2.1 2.1,-2.1l14.9,0c1.2,0 2.1,1 2.1,2.1l0,1.2zm0,-10.2c0,1.2 -1,2.1 -2.1,2.1l-14.9,0c-1.2,0 -2.1,-1 -2.1,-2.1l0,-1.2c0,-1.2 1,-2.1 2.1,-2.1l14.9,0c1.2,0 2.1,1 2.1,2.1l0,1.2zm0,-13.3c0,1.2 -1,2.1 -2.1,2.1l-14.9,0c-1.2,0 -2.1,-1 -2.1,-2.1l0,-1.3c0,-1.2 1,-2.1 2.1,-2.1l14.9,0c1.2,0 2.1,1 2.1,2.1l0,1.3zm0,-10.6c0,1.2 -1,2.1 -2.1,2.1l-14.9,0c-1.2,0 -2.1,-1 -2.1,-2.1l0,-1.2c0,-1.2 1,-2.1 2.1,-2.1l14.9,0c1.2,0 2.1,1 2.1,2.1l0,1.2zm0,-9.9c0,1.2 -1,2.1 -2.1,2.1l-14.9,0c-1.2,0 -2.1,-1 -2.1,-2.1l0,-1.2c0,-1.2 1,-2.1 2.1,-2.1l14.9,0c1.2,0 2.1,1 2.1,2.1l0,1.2zm0,-14.9c0,1.2 -1,2.1 -2.1,2.1l-14.9,0c-1.2,0 -2.1,-1 -2.1,-2.1l0,-1.2c0,-1.2 1,-2.1 2.1,-2.1l14.9,0c1.2,0 2.1,1 2.1,2.1l0,1.2zm0,-10.2c0,1.2 -1,2.1 -2.1,2.1l-14.9,0c-1.2,0 -2.1,-1 -2.1,-2.1l0,-1.2c0,-1.2 1,-2.1 2.1,-2.1l14.9,0c1.2,0 2.1,1 2.1,2.1l0,1.2z" class="st1"/>
+    <path id="svg_7" d="m125.3,68.000001c8.9,6.4 17.2,7.2 22,7.5c-7.7,-0.8 -17.6,-4 -24.6,-9.9c-0.5,-0.5 -1,-0.9 -1.5,-1.4c1.2,1.4 2.6,2.7 4.1,3.8z" class="st1"/>
+   </g>
+   <path id="svg_8" d="m128,23.900001l0,7.9l39.6,0l0,-7.9l-39.6,0zm13.4,5.2l-8.9,0l0,-2.6l8.9,0l0,2.6z" class="st1"/>
+   <path id="svg_9" d="m128,34.400001l0,7.9l39.6,0l0,-7.9l-39.6,0zm8.6,5.5l-4.1,0l0,-3.2l4.1,0l0,3.2z" class="st1"/>
+   <path id="svg_10" d="m128,44.900001l0,9.3l39.6,0l0,-9.3l-39.6,0zm8.6,5l-4.3,0l0,-2.5l4.3,0l0,2.5z" class="st1"/>
+  </g>
+ </g>
+</svg>

ui/images/old/geoloc.svg

@@ -0,0 +1,35 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" style="enable-background:new 0 0 1200 630;" xml:space="preserve" width="169.521739012127" height="192.5217390121269"><rect id="backgroundrect" width="100%" height="100%" x="0" y="0" fill="none" stroke="none" class="" style=""/>
+<style type="text/css">
+	.st0{fill:none;stroke:#424242;stroke-width:2.6517;stroke-miterlimit:10;}
+	.st1{fill:#424242;}
+	.st2{fill:none;stroke:#424242;stroke-width:1.9888;stroke-miterlimit:10;}
+	.st3{fill:none;stroke:#424242;stroke-width:1.965;stroke-miterlimit:10;}
+	.st4{fill:none;stroke:#424242;stroke-width:6.5501;stroke-miterlimit:10;}
+	.st5{fill:none;stroke:#424242;stroke-width:2.0365;stroke-miterlimit:10;}
+	.st6{fill:none;stroke:#424242;stroke-width:2.0403;stroke-miterlimit:10;}
+	.st7{fill:none;stroke:#424242;stroke-width:2.0403;stroke-linecap:round;stroke-miterlimit:10;}
+	.st8{fill:none;stroke:#424242;stroke-width:2.0953;stroke-miterlimit:10;}
+	.st9{fill:none;stroke:#424242;stroke-width:2.0953;stroke-linecap:round;stroke-miterlimit:10;}
+	.st10{fill:none;stroke:#FFD242;stroke-width:6.9844;stroke-miterlimit:10;}
+</style>
+
+
+<g class="currentLayer" style=""><title>Layer 1</title><g id="svg_1" class="">
+	<circle class="st5" cx="128.91084814071655" cy="40.610867977142334" r="37.400001525878906" id="svg_2"/>
+	<path class="st1" d="M128.91087255477908,17.01086950302124 c-8.5,0 -15.5,7.9 -15.5,17.7 c0,3.7 1,7.3 2.9,10.3 l0.4,0.7000000000000005 l11.1,18 c0.2,0.4 0.6000000000000005,0.6000000000000005 1,0.6000000000000005 c0.4,0 0.8,-0.2 1,-0.6000000000000005 l11,-17.7 l0.5,-0.9 c1.9,-3 2.9,-6.6 2.9,-10.3 C144.31087255477905,24.910869503021246 137.41087255477908,17.01086950302124 128.91087255477908,17.01086950302124 zM128.91087255477908,40.610869503021235 c-2.8,0 -5.2,-2.6 -5.2,-5.9 c0,-3.3 2.3,-5.9 5.2,-5.9 c2.8,0 5.2,2.6 5.2,5.9 C134.0108725547791,38.01086950302124 131.71087255477903,40.610869503021235 128.91087255477908,40.610869503021235 z" id="svg_3"/>
+	<rect x="3.2108969688415527" y="40.610867977142334" class="st1" width="10.899999618530273" height="148.6999969482422" id="svg_4"/>
+	<polygon class="st1" points="129.91084814071655,189.3108673095703 119.0108847618103,189.3108673095703 119.0108847618103,77.01087188720703 129.91084814071655,78.01087188720703 " id="svg_5"/>
+	<polygon class="st1" points="3.2108969688415527,60.41086959838867 3.2108969688415527,49.41086959838867 92.6108603477478,49.41086959838867 96.91084814071655,59.91086959838867 " id="svg_6"/>
+	
+		<rect x="844.31085729599" y="944.9891304969788" transform="matrix(-1.83697e-16,1,-1,-1.83697e-16,1074.9199,-754.5736) " class="st1" width="10.899999618530273" height="126.69999694824219" id="svg_7"/>
+	
+		<rect x="844.31085729599" y="984.3891243934631" transform="matrix(-1.83697e-16,1,-1,-1.83697e-16,1114.306,-715.1875) " class="st1" width="10.899999618530273" height="126.69999694824219" id="svg_8"/>
+	
+		<rect x="844.31085729599" y="1023.9891304969788" transform="matrix(-1.83697e-16,1,-1,-1.83697e-16,1153.9404,-675.5531) " class="st1" width="10.899999618530273" height="126.69999694824219" id="svg_9"/>
+	
+		<rect x="845.2108817100525" y="1025.689127445221" transform="matrix(-1.83697e-16,1,-1,-1.83697e-16,1139.0541,-693.1997) " class="st1" width="11.899999618530273" height="90.9000015258789" id="svg_10"/>
+	
+		<rect x="818.2108817100525" y="1005.9891304969788" transform="matrix(-1.83697e-16,1,-1,-1.83697e-16,1071.2657,-712.9153) " class="st1" width="17.799999237060547" height="42.79999923706055" id="svg_11"/>
+	
+		<rect x="864.6108450889587" y="1005.9891304969788" transform="matrix(-1.83697e-16,1,-1,-1.83697e-16,1117.6943,-759.3438) " class="st1" width="17.799999237060547" height="42.79999923706055" id="svg_12"/>
+</g></g></svg>

ui/images/old/unbind.svg

@@ -0,0 +1,30 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" style="enable-background:new 0 0 1200 630;" xml:space="preserve" width="189.34782600808444" height="135.34782600808455"><rect id="backgroundrect" width="100%" height="100%" x="0" y="0" fill="none" stroke="none" class="" style=""/>
+<style type="text/css">
+	.st0{fill:none;stroke:#424242;stroke-width:2.6517;stroke-miterlimit:10;}
+	.st1{fill:#424242;}
+	.st2{fill:none;stroke:#424242;stroke-width:1.9888;stroke-miterlimit:10;}
+	.st3{fill:none;stroke:#424242;stroke-width:1.965;stroke-miterlimit:10;}
+	.st4{fill:none;stroke:#424242;stroke-width:6.5501;stroke-miterlimit:10;}
+	.st5{fill:none;stroke:#424242;stroke-width:2.0365;stroke-miterlimit:10;}
+	.st6{fill:none;stroke:#424242;stroke-width:2.0403;stroke-miterlimit:10;}
+	.st7{fill:none;stroke:#424242;stroke-width:2.0403;stroke-linecap:round;stroke-miterlimit:10;}
+	.st8{fill:none;stroke:#424242;stroke-width:2.0953;stroke-miterlimit:10;}
+	.st9{fill:none;stroke:#424242;stroke-width:2.0953;stroke-linecap:round;stroke-miterlimit:10;}
+	.st10{fill:none;stroke:#FFD242;stroke-width:6.9844;stroke-miterlimit:10;}
+</style>
+
+
+
+
+<g class="currentLayer" style=""><title>Layer 1</title><g id="svg_1" class="selected">
+	<line class="st0" x1="161.4738941192627" y1="33.17391300201416" x2="161.4738941192627" y2="46.273911476135254" id="svg_2"/>
+	<path class="st1" d="M9.07391853332524,32.27391452789307 h14.9 v-4.9 c0,0 -1.5,-2.8 -7.5,-2.8 c-5.9,0.1 -6.8,2.8 -6.8,2.8 v4.9 " id="svg_3"/>
+	<circle class="st2" cx="149.67390632629395" cy="39.773911476135254" r="37.400001525878906" id="svg_4"/>
+	<g id="svg_5">
+		<path class="st1" d="M150.77391853332517,77.07391452789307 c0.30000000000000016,0 0.7000000000000003,0.1 0.9,0.1 v42.3 c0,2.9 -2.4,5.3 -5.3,5.3 H35.873918533325195 c-2.9,0 -5.3,-2.4 -5.3,-5.3 V44.073914527893066 c0,-2.9 2.4,-5.3 5.3,-5.3 h75.9 c0,0.7000000000000003 0.1,1.4 0.2,2.3 c0,-3.4 0.4,-6.6 0.9,-9.1 H12.17391853332515 c-5.5,0 -9.9,4.5 -9.9,9.9 V123.07391452789307 c0,5.5 4.5,9.9 9.9,9.9 h136.4 c5.5,0 9.9,-4.5 9.9,-9.9 v-47.1 C156.97391853332522,76.87391452789308 154.17391853332515,77.17391452789306 150.77391853332517,77.07391452789307 zM25.973918533325218,117.87391452789308 c0,1.2 -1,2.1 -2.1,2.1 h-14.9 c-1.2,0 -2.1,-1 -2.1,-2.1 v-1.2 c0,-1.2 1,-2.1 2.1,-2.1 h14.9 c1.2,0 2.1,1 2.1,2.1 V117.87391452789308 zM25.973918533325218,107.67391452789306 c0,1.2 -1,2.1 -2.1,2.1 h-14.9 c-1.2,0 -2.1,-1 -2.1,-2.1 v-1.2 c0,-1.2 1,-2.1 2.1,-2.1 h14.9 c1.2,0 2.1,1 2.1,2.1 V107.67391452789306 zM25.973918533325218,94.37391452789308 c0,1.2 -1,2.1 -2.1,2.1 h-14.9 c-1.2,0 -2.1,-1 -2.1,-2.1 V93.07391452789307 c0,-1.2 1,-2.1 2.1,-2.1 h14.9 c1.2,0 2.1,1 2.1,2.1 V94.37391452789308 zM25.973918533325218,83.77391452789306 c0,1.2 -1,2.1 -2.1,2.1 h-14.9 c-1.2,0 -2.1,-1 -2.1,-2.1 v-1.2 c0,-1.2 1,-2.1 2.1,-2.1 h14.9 c1.2,0 2.1,1 2.1,2.1 V83.77391452789306 zM25.973918533325218,73.87391452789308 c0,1.2 -1,2.1 -2.1,2.1 h-14.9 c-1.2,0 -2.1,-1 -2.1,-2.1 v-1.2 c0,-1.2 1,-2.1 2.1,-2.1 h14.9 c1.2,0 2.1,1 2.1,2.1 V73.87391452789308 zM25.973918533325218,58.97391452789307 c0,1.2 -1,2.1 -2.1,2.1 h-14.9 c-1.2,0 -2.1,-1 -2.1,-2.1 v-1.2 c0,-1.2 1,-2.1 2.1,-2.1 h14.9 c1.2,0 2.1,1 2.1,2.1 V58.97391452789307 zM25.973918533325218,48.773914527893055 c0,1.2 -1,2.1 -2.1,2.1 h-14.9 c-1.2,0 -2.1,-1 -2.1,-2.1 v-1.2 c0,-1.2 1,-2.1 2.1,-2.1 h14.9 c1.2,0 2.1,1 2.1,2.1 V48.773914527893055 z" id="svg_6"/>
+		<path class="st1" d="M126.57391853332524,69.37391452789308 c8.9,6.4 17.2,7.2 22,7.5 c-7.7,-0.8 -17.6,-4 -24.6,-9.9 c-0.5,-0.5 -1,-0.9 -1.5,-1.4 C123.67391853332515,66.97391452789307 125.07391853332524,68.27391452789306 126.57391853332524,69.37391452789308 z" id="svg_7"/>
+	</g>
+	<path class="st1" d="M129.27391853332517,25.27391452789307 v7.9 h39.6 v-7.9 H129.27391853332517 zM142.67391853332515,30.473914527893072 h-8.9 v-2.6 h8.9 V30.473914527893072 z" id="svg_8"/>
+	<path class="st1" d="M129.27391853332517,35.77391452789307 v7.9 h39.6 v-7.9 H129.27391853332517 zM137.8739185333252,41.273914527893055 h-4.1 V38.073914527893066 h4.1 V41.273914527893055 z" id="svg_9"/>
+	<path class="st1" d="M129.27391853332517,46.273914527893055 v9.3 h39.6 v-9.3 H129.27391853332517 zM137.8739185333252,51.273914527893055 h-4.3 v-2.5 h4.3 V51.273914527893055 z" id="svg_10"/>
+</g></g></svg>

ui/images/packing.svg

@@ -0,0 +1,76 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
+<path style="fill:#EBD2AF;" d="M282.483,225.103H88.276c-4.875,0-8.828,3.953-8.828,8.828v194.207c0,4.875,3.953,8.828,8.828,8.828
+	h194.207c4.875,0,8.828-3.953,8.828-8.828V233.931C291.31,229.056,287.358,225.103,282.483,225.103z"/>
+<rect x="105.931" y="251.586" style="fill:#DEC3A1;" width="158.897" height="158.897"/>
+<g>
+	<rect x="105.931" y="278.069" style="fill:#D2B493;" width="158.897" height="17.655"/>
+	<rect x="105.931" y="366.345" style="fill:#D2B493;" width="158.897" height="17.655"/>
+	<rect x="105.931" y="322.207" style="fill:#D2B493;" width="158.897" height="17.655"/>
+</g>
+<path style="fill:#F0DCBE;" d="M291.31,216.276V22.069c0-4.875-3.953-8.828-8.828-8.828H88.276c-4.875,0-8.828,3.953-8.828,8.828
+	v194.207c0,4.875,3.953,8.828,8.828,8.828h194.207C287.358,225.103,291.31,221.151,291.31,216.276z"/>
+<rect x="105.931" y="39.724" style="fill:#EBD2AF;" width="158.897" height="158.897"/>
+<g>
+	<rect x="220.69" y="39.724" style="fill:#D2B493;" width="17.655" height="158.897"/>
+	<rect x="132.414" y="39.724" style="fill:#D2B493;" width="17.655" height="158.897"/>
+	<rect x="176.552" y="39.724" style="fill:#D2B493;" width="17.655" height="158.897"/>
+</g>
+<circle style="fill:#5B5D6E;" cx="472.276" cy="476.69" r="22.069"/>
+<path style="fill:#C7CFE2;" d="M472.276,483.862L472.276,483.862c-4.427,0-8.238-3.125-9.107-7.466l-6.121-30.603h30.455
+	l-6.121,30.603C480.514,480.737,476.703,483.862,472.276,483.862z"/>
+<path style="fill:#A2AAC2;" d="M503.172,454.621H52.966c-4.879,0-8.828-3.948-8.828-8.828V133.802
+	c0-7.078-2.759-13.732-7.758-18.733L2.586,81.276c-3.448-3.448-3.448-9.034,0-12.482c3.448-3.448,9.034-3.448,12.482,0
+	l33.793,33.793c8.337,8.335,12.931,19.422,12.931,31.215v303.164h441.379c4.879,0,8.828,3.948,8.828,8.828
+	C512,450.673,508.052,454.621,503.172,454.621z"/>
+<circle style="fill:#5B5D6E;" cx="44.138" cy="454.621" r="44.138"/>
+<g>
+	<circle style="fill:#FF6464;" cx="44.138" cy="454.621" r="26.483"/>
+	<path style="fill:#FF6464;" d="M35.31,110.345c-2.259,0-4.518-0.862-6.241-2.586L2.586,81.276c-3.448-3.448-3.448-9.034,0-12.482
+		c3.448-3.448,9.034-3.448,12.482,0l26.483,26.483c3.448,3.448,3.448,9.035,0,12.483C39.828,109.483,37.569,110.345,35.31,110.345z"
+		/>
+</g>
+<path style="fill:#F0DCBE;" d="M432.552,428.138V145.655c0-4.875-3.953-8.828-8.828-8.828H300.138c-4.875,0-8.828,3.953-8.828,8.828
+	v282.483c0,4.875,3.953,8.828,8.828,8.828h123.586C428.599,436.966,432.552,433.013,432.552,428.138z"/>
+<rect x="317.793" y="163.31" style="fill:#EBD2AF;" width="88.276" height="247.172"/>
+<g>
+	<rect x="317.793" y="189.793" style="fill:#D2B493;" width="88.276" height="17.655"/>
+	<rect x="317.793" y="233.931" style="fill:#D2B493;" width="88.276" height="17.655"/>
+	<rect x="317.793" y="278.069" style="fill:#D2B493;" width="88.276" height="17.655"/>
+	<rect x="317.793" y="322.207" style="fill:#D2B493;" width="88.276" height="17.655"/>
+	<rect x="317.793" y="366.345" style="fill:#D2B493;" width="88.276" height="17.655"/>
+</g>
+<circle style="fill:#D2555A;" cx="44.138" cy="454.621" r="8.828"/>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>

ui/images/question.svg

@@ -0,0 +1,55 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
+<path style="fill:#5D9BEB;" d="M0,256.006C0,397.402,114.606,512.004,255.996,512C397.394,512.004,512,397.402,512,256.006
+	C512.009,114.61,397.394,0,255.996,0C114.606,0,0,114.614,0,256.006z"/>
+<g>
+	<path style="fill:#4988DB;" d="M508.399,298.651c-0.342-0.339-176.863-176.847-177.353-177.353
+		c-18.14-19.633-45.642-32.186-76.388-32.186c-53.911,0-96.144,37.836-96.144,86.135c0,2.37,1.223,4.371,2.995,5.678
+		c0.427,0.579,90.045,90.322,90.318,90.59v68.825c0,2.372,1.223,4.372,2.995,5.679c0.427,0.579,129.424,129.575,130.002,130.002
+		c0.213,0.29,0.5,0.5,0.749,0.749C449.522,439.161,495.659,374.591,508.399,298.651z"/>
+	<path style="fill:#4988DB;" d="M269.753,399.274c-2.633-3.058-6.401-5.099-10.749-5.099c-7.936,0-14.355,6.434-14.355,14.355
+		c0,4.355,2.036,8.124,5.093,10.755c0.468,0.545,0.949,1.025,1.494,1.493c0.468,0.545,78.653,78.73,79.198,79.198
+		c0.243,0.284,0.518,0.521,0.777,0.777c9.97-3.059,19.653-6.755,29.063-10.958C359.994,489.507,270.299,399.744,269.753,399.274z"/>
+</g>
+<g>
+	<path style="fill:#F4F6F9;" d="M259.004,394.175c-7.935,0-14.356,6.434-14.356,14.356c0,7.935,6.421,14.356,14.356,14.356
+		c7.921,0,14.356-6.421,14.356-14.356C273.36,400.609,266.925,394.175,259.004,394.175z"/>
+	<path style="fill:#F4F6F9;" d="M254.658,89.114c-53.911,0-96.145,37.835-96.145,86.135c0,3.964,3.211,7.178,7.178,7.178
+		c3.967,0,7.178-3.214,7.178-7.178c0-40.25,35.924-71.779,81.789-71.779c45.788,0,84.474,33.658,84.474,73.493
+		c0,41.897-34.446,73.49-80.128,73.49c-3.968,0-7.178,3.214-7.178,7.178v82.711c0,3.968,3.211,7.178,7.178,7.178
+		c3.968,0,7.178-3.211,7.178-7.178v-75.772c49.503-3.309,87.306-40.596,87.306-87.607
+		C353.487,128.522,309.151,89.114,254.658,89.114z"/>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>

ui/images/route.svg

@@ -0,0 +1,79 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 59 59" style="enable-background:new 0 0 59 59;" xml:space="preserve">
+<path style="fill:#ED8A19;" d="M45.07,59c-0.553,0-1-0.447-1-1s0.447-1,1-1H47c0.553,0,1.035,0.447,1.035,0.999
+	c0,0.553-0.412,1-0.965,1v-1l-0.029,1L45.07,59z M41.07,59h-2c-0.553,0-1-0.447-1-1s0.447-1,1-1h2c0.553,0,1,0.447,1,1
+	S41.623,59,41.07,59z M35.07,59h-2c-0.553,0-1-0.447-1-1s0.447-1,1-1h2c0.553,0,1,0.447,1,1S35.623,59,35.07,59z M29.07,59h-2
+	c-0.553,0-1-0.447-1-1s0.447-1,1-1h2c0.553,0,1,0.447,1,1S29.623,59,29.07,59z M23.07,59h-2c-0.553,0-1-0.447-1-1s0.447-1,1-1h2
+	c0.553,0,1,0.447,1,1S23.623,59,23.07,59z M17.07,59h-2c-0.553,0-1-0.447-1-1s0.447-1,1-1h2c0.553,0,1,0.447,1,1S17.623,59,17.07,59
+	z M50.537,57.282c-0.216,0-0.434-0.07-0.617-0.214c-0.435-0.342-0.509-0.971-0.168-1.404c0.325-0.413,0.548-0.882,0.663-1.392
+	c0.121-0.539,0.656-0.877,1.195-0.756s0.877,0.656,0.756,1.195c-0.178,0.792-0.538,1.549-1.042,2.188
+	C51.127,57.151,50.834,57.282,50.537,57.282z M50.538,51.719c-0.297,0-0.59-0.131-0.787-0.382c-0.32-0.407-0.734-0.744-1.197-0.974
+	c-0.494-0.246-0.696-0.846-0.45-1.341c0.246-0.494,0.844-0.697,1.341-0.45c0.727,0.361,1.376,0.89,1.879,1.528
+	c0.341,0.434,0.267,1.063-0.168,1.404C50.973,51.648,50.754,51.719,50.538,51.719z M45.071,50h-2c-0.553,0-1-0.447-1-1s0.447-1,1-1
+	h2c0.553,0,1,0.447,1,1S45.624,50,45.071,50z M39.071,50h-2c-0.553,0-1-0.447-1-1s0.447-1,1-1h2c0.553,0,1,0.447,1,1
+	S39.624,50,39.071,50z M33.129,49.594c-0.139,0-0.28-0.029-0.415-0.091c-0.736-0.336-1.402-0.844-1.927-1.467
+	c-0.355-0.423-0.301-1.054,0.122-1.409s1.053-0.301,1.409,0.122c0.334,0.397,0.759,0.721,1.228,0.936
+	c0.502,0.229,0.723,0.822,0.493,1.325C33.871,49.377,33.509,49.594,33.129,49.594z M30.58,44.65c-0.063,0-0.126-0.006-0.189-0.018
+	c-0.543-0.104-0.897-0.629-0.794-1.171c0.155-0.809,0.483-1.556,0.973-2.222c0.328-0.445,0.953-0.539,1.398-0.213
+	c0.445,0.328,0.54,0.954,0.213,1.398c-0.313,0.424-0.521,0.899-0.619,1.413C31.469,44.317,31.05,44.65,30.58,44.65z M34.784,41.005
+	c-0.533,0-0.977-0.421-0.998-0.959c-0.022-0.552,0.406-1.018,0.958-1.04C34.829,39.002,34.914,39,35,39h1.785c0.553,0,1,0.447,1,1
+	s-0.447,1-1,1l-1.959,0.004C34.812,41.005,34.798,41.005,34.784,41.005z M53,41h-0.215c-0.553,0-1-0.447-1-1s0.447-1,1-1H53
+	c0.469,0,0.923-0.091,1.352-0.271c0.505-0.215,1.095,0.025,1.309,0.535c0.214,0.509-0.025,1.095-0.535,1.309
+	C54.451,40.856,53.736,41,53,41z M48.785,41h-2c-0.553,0-1-0.447-1-1s0.447-1,1-1h2c0.553,0,1,0.447,1,1S49.338,41,48.785,41z
+	 M42.785,41h-2c-0.553,0-1-0.447-1-1s0.447-1,1-1h2c0.553,0,1,0.447,1,1S43.338,41,42.785,41z M57.318,37.77
+	c-0.093,0-0.188-0.013-0.281-0.04c-0.53-0.155-0.834-0.711-0.679-1.241c0.094-0.32,0.142-0.652,0.142-0.988
+	c0.002-0.192-0.014-0.374-0.042-0.552c-0.088-0.545,0.283-1.059,0.829-1.146c0.543-0.09,1.058,0.283,1.146,0.829
+	c0.047,0.293,0.069,0.588,0.067,0.876c0,0.519-0.074,1.04-0.222,1.543C58.15,37.487,57.751,37.77,57.318,37.77z M55.25,32.604
+	c-0.17,0-0.343-0.043-0.501-0.135c-0.453-0.263-0.947-0.417-1.47-0.458c-0.551-0.043-0.962-0.524-0.919-1.075
+	c0.043-0.552,0.526-0.959,1.075-0.919c0.823,0.064,1.604,0.308,2.317,0.722c0.478,0.277,0.641,0.89,0.363,1.367
+	C55.931,32.425,55.595,32.604,55.25,32.604z M49.357,32h-2c-0.553,0-1-0.447-1-1s0.447-1,1-1h2c0.553,0,1,0.447,1,1
+	S49.91,32,49.357,32z M43.357,32h-2c-0.553,0-1-0.447-1-1s0.447-1,1-1h2c0.553,0,1,0.447,1,1S43.91,32,43.357,32z M37.357,32h-2
+	c-0.553,0-1-0.447-1-1s0.447-1,1-1h2c0.553,0,1,0.447,1,1S37.91,32,37.357,32z M31.357,32H31c-0.678-0.001-1.337-0.123-1.963-0.361
+	c-0.516-0.197-0.774-0.775-0.578-1.291c0.198-0.517,0.779-0.773,1.291-0.578c0.398,0.152,0.819,0.229,1.252,0.23h0.355
+	c0.553,0,1,0.447,1,1S31.91,32,31.357,32z M26.724,28.905c-0.42,0-0.812-0.267-0.95-0.688c-0.182-0.552-0.273-1.13-0.273-1.718
+	c0.001-0.238,0.016-0.469,0.044-0.694c0.068-0.546,0.552-0.931,1.117-0.867c0.548,0.068,0.937,0.569,0.867,1.117
+	c-0.019,0.147-0.027,0.298-0.028,0.449c0,0.37,0.059,0.737,0.174,1.088c0.172,0.524-0.113,1.09-0.638,1.263
+	C26.933,28.89,26.827,28.905,26.724,28.905z M28.628,23.676c-0.334,0-0.66-0.167-0.85-0.471c-0.292-0.469-0.149-1.086,0.319-1.378
+	c0.7-0.437,1.472-0.703,2.294-0.794c0.553-0.057,1.043,0.336,1.104,0.885s-0.336,1.043-0.885,1.104
+	c-0.521,0.058-1.011,0.227-1.454,0.503C28.991,23.627,28.809,23.676,28.628,23.676z M42.5,23h-2c-0.553,0-1-0.447-1-1s0.447-1,1-1h2
+	c0.553,0,1,0.447,1,1S43.053,23,42.5,23z M36.5,23h-2c-0.553,0-1-0.447-1-1s0.447-1,1-1h2c0.553,0,1,0.447,1,1S37.053,23,36.5,23z"
+	/>
+<path style="fill:#26B99A;" d="M53.47,2.669L53.47,2.669c-3.157-3.559-8.276-3.559-11.433,0v0c-3.157,3.559-3.157,9.328,0,12.887
+	L47.753,22l5.716-6.444C56.627,11.998,56.627,6.228,53.47,2.669z M48,13c-2.485,0-4.5-2.015-4.5-4.5S45.515,4,48,4
+	s4.5,2.015,4.5,4.5S50.485,13,48,13z"/>
+<path style="fill:#3083C9;" d="M19.278,28.64c-4.296-4.853-11.261-4.853-15.556,0h0c-4.296,4.853-4.296,12.721,0,17.573L11.5,55
+	l7.778-8.787C23.574,41.36,23.574,33.492,19.278,28.64z M11.5,41c-2.761,0-5-2.239-5-5s2.239-5,5-5s5,2.239,5,5S14.261,41,11.5,41z"
+	/>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>

ui/images/server.svg

@@ -0,0 +1,74 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 58 58" style="enable-background:new 0 0 58 58;" xml:space="preserve">
+<path style="fill:#556080;" d="M54.392,19.5H3.608C1.616,19.5,0,17.884,0,15.892V4.108C0,2.116,1.616,0.5,3.608,0.5h50.783
+	C56.384,0.5,58,2.116,58,4.108v11.783C58,17.884,56.384,19.5,54.392,19.5z"/>
+<path style="fill:#424A60;" d="M54.392,38.5H3.608C1.616,38.5,0,36.884,0,34.892V23.108C0,21.116,1.616,19.5,3.608,19.5h50.783
+	c1.993,0,3.608,1.616,3.608,3.608v11.783C58,36.884,56.384,38.5,54.392,38.5z"/>
+<path style="fill:#556080;" d="M54.392,57.5H3.608C1.616,57.5,0,55.884,0,53.892V42.108C0,40.116,1.616,38.5,3.608,38.5h50.783
+	c1.993,0,3.608,1.616,3.608,3.608v11.783C58,55.884,56.384,57.5,54.392,57.5z"/>
+<circle style="fill:#7383BF;" cx="9.5" cy="10" r="3.5"/>
+<circle style="fill:#7383BF;" cx="49" cy="8.5" r="1"/>
+<circle style="fill:#7383BF;" cx="45" cy="8.5" r="1"/>
+<circle style="fill:#7383BF;" cx="51" cy="11.5" r="1"/>
+<circle style="fill:#7383BF;" cx="47" cy="11.5" r="1"/>
+<circle style="fill:#7383BF;" cx="41" cy="8.5" r="1"/>
+<circle style="fill:#7383BF;" cx="43" cy="11.5" r="1"/>
+<circle style="fill:#7383BF;" cx="37" cy="8.5" r="1"/>
+<circle style="fill:#7383BF;" cx="39" cy="11.5" r="1"/>
+<circle style="fill:#7383BF;" cx="33" cy="8.5" r="1"/>
+<circle style="fill:#7383BF;" cx="35" cy="11.5" r="1"/>
+<circle style="fill:#7383BF;" cx="9.5" cy="29" r="3.5"/>
+<circle style="fill:#7383BF;" cx="49" cy="27.5" r="1"/>
+<circle style="fill:#7383BF;" cx="45" cy="27.5" r="1"/>
+<circle style="fill:#7383BF;" cx="51" cy="30.5" r="1"/>
+<circle style="fill:#7383BF;" cx="47" cy="30.5" r="1"/>
+<circle style="fill:#7383BF;" cx="41" cy="27.5" r="1"/>
+<circle style="fill:#7383BF;" cx="43" cy="30.5" r="1"/>
+<circle style="fill:#7383BF;" cx="37" cy="27.5" r="1"/>
+<circle style="fill:#7383BF;" cx="39" cy="30.5" r="1"/>
+<circle style="fill:#7383BF;" cx="33" cy="27.5" r="1"/>
+<circle style="fill:#7383BF;" cx="35" cy="30.5" r="1"/>
+<circle style="fill:#7383BF;" cx="9.5" cy="48" r="3.5"/>
+<circle style="fill:#7383BF;" cx="49" cy="46.5" r="1"/>
+<circle style="fill:#7383BF;" cx="45" cy="46.5" r="1"/>
+<circle style="fill:#7383BF;" cx="51" cy="49.5" r="1"/>
+<circle style="fill:#7383BF;" cx="47" cy="49.5" r="1"/>
+<circle style="fill:#7383BF;" cx="41" cy="46.5" r="1"/>
+<circle style="fill:#7383BF;" cx="43" cy="49.5" r="1"/>
+<circle style="fill:#7383BF;" cx="37" cy="46.5" r="1"/>
+<circle style="fill:#7383BF;" cx="39" cy="49.5" r="1"/>
+<circle style="fill:#7383BF;" cx="33" cy="46.5" r="1"/>
+<circle style="fill:#7383BF;" cx="35" cy="49.5" r="1"/>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>

ui/images/tablet.svg

@@ -0,0 +1,53 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
+<g>
+	<path style="fill:#556080;" d="M70.621,0h370.759c14.626,0,26.483,11.857,26.483,26.483v459.034
+		c0,14.626-11.857,26.483-26.483,26.483H70.621c-14.626,0-26.483-11.857-26.483-26.483V26.483C44.138,11.857,55.995,0,70.621,0z"/>
+	<path style="fill:#9FC9D3;" d="M308.966,52.966h114.759c4.875,0,8.828,3.952,8.828,8.828v388.414c0,4.875-3.952,8.828-8.828,8.828
+		H88.276c-4.875,0-8.828-3.952-8.828-8.828V61.793c0-4.875,3.952-8.828,8.828-8.828H308.966z"/>
+	<g>
+		<path style="fill:#3D324C;" d="M256,61.793c-1.155-0.014-2.296-0.254-3.358-0.707c-1.068-0.447-2.053-1.074-2.91-1.853
+			c-2.525-2.527-3.261-6.335-1.858-9.621c0.427-1.081,1.058-2.071,1.858-2.915c2.556-2.47,6.33-3.197,9.621-1.854
+			c1.07,0.448,2.055,1.075,2.914,1.854c0.797,0.845,1.426,1.834,1.854,2.914c0.943,2.136,0.943,4.571,0,6.707
+			c-0.45,1.068-1.077,2.053-1.854,2.914c-0.859,0.779-1.844,1.406-2.914,1.854C258.292,61.539,257.153,61.779,256,61.793z"/>
+		<circle style="fill:#3D324C;" cx="256" cy="459.034" r="17.655"/>
+	</g>
+	<path style="fill:#F29C1F;" d="M256,132.414c-29.07-0.148-52.77,23.273-52.966,52.343c0.034,18.759,10.148,36.052,26.483,45.277
+		v24.514l17.655,17.448l-17.655,17.448l17.655,17.448l-17.655,17.448l17.655,17.448l-17.655,17.448L256,379.586l26.483-20.351
+		V230.034c16.334-9.225,26.449-26.518,26.483-45.277C308.77,155.687,285.071,132.266,256,132.414z M256.811,203.292
+		c-9.731,0.332-17.894-7.278-18.245-17.009c-0.351-9.731,7.242-17.908,16.972-18.279c9.73-0.37,17.923,7.206,18.313,16.935
+		C274.204,194.71,266.58,202.92,256.811,203.292z"/>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>

ui/images/unbind.svg

@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 52.965 52.965" style="enable-background:new 0 0 52.965 52.965;" xml:space="preserve">
+<path style="fill:none;stroke:#D5354E;stroke-width:2;stroke-linecap:round;stroke-miterlimit:10;" d="M24.008,13.401L33.2,4.208
+	c4.278-4.278,11.278-4.278,15.556,0l0,0c4.278,4.278,4.278,11.278,0,15.556L36.735,31.786c-4.278,4.278-11.278,4.278-15.556,0l0,0"
+	/>
+<path style="fill:none;stroke:#D5354E;stroke-width:2;stroke-linecap:round;stroke-miterlimit:10;" d="M27.543,40.978l-7.778,7.778
+	c-4.278,4.278-11.278,4.278-15.556,0l0,0c-4.278-4.278-4.278-11.278,0-15.556l11.314-11.314c4.278-4.278,11.278-4.278,15.556,0l0,0"
+	/>
+<line style="fill:none;stroke:#D5354E;stroke-width:2;stroke-linecap:round;stroke-miterlimit:10;" x1="33.965" y1="45" x2="33.965" y2="51"/>
+<line style="fill:none;stroke:#D5354E;stroke-width:2;stroke-linecap:round;stroke-miterlimit:10;" x1="37.722" y1="43" x2="41.965" y2="47.243"/>
+<line style="fill:none;stroke:#D5354E;stroke-width:2;stroke-linecap:round;stroke-miterlimit:10;" x1="38.965" y1="39" x2="44.965" y2="39"/>
+<line style="fill:none;stroke:#D5354E;stroke-width:2;stroke-linecap:round;stroke-miterlimit:10;" x1="15.965" y1="10" x2="15.965" y2="4"/>
+<line style="fill:none;stroke:#D5354E;stroke-width:2;stroke-linecap:round;stroke-miterlimit:10;" x1="12.207" y1="12" x2="7.965" y2="7.757"/>
+<line style="fill:none;stroke:#D5354E;stroke-width:2;stroke-linecap:round;stroke-miterlimit:10;" x1="10.965" y1="16" x2="4.965" y2="16"/>
+
+</svg>

ui/images/user.svg

@@ -0,0 +1,62 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 409.6 409.6" style="enable-background:new 0 0 409.6 409.6;" xml:space="preserve">
+<path style="fill:#2F4859;" d="M315.117,345.083c18.517,0,32.577-17.035,28.727-35.147
+	c-16.162-76.034-83.692-133.074-164.544-133.074S30.919,233.901,14.757,309.936c-3.85,18.113,10.21,35.147,28.727,35.147H315.117z"
+	/>
+<path style="fill:#3A556A;" d="M14.757,309.936c16.162-76.034,83.692-133.074,164.544-133.074v168.221H43.484
+	C24.967,345.083,10.907,328.048,14.757,309.936z"/>
+<path style="fill:#44C4A1;" d="M392.148,273.945c-0.22-1.745-1.53-3.178-2.955-3.2l-25.211-0.391
+	c-2.841-7.276-6.642-14.003-11.273-20.051l11.385-21.958c0.656-1.265,0.015-3.096-1.418-4.118l-21.438-15.289
+	c-1.433-1.023-3.374-1.033-4.356,0l-15.576,16.365c-7.6-3.467-15.763-5.793-24.281-6.816l-6.165-22.633
+	c-0.375-1.375-2.087-2.287-3.834-2.069l-26.126,3.277c-1.746,0.219-3.18,1.526-3.204,2.952l-0.385,23.453
+	c-7.603,2.942-14.604,6.94-20.867,11.825l-20.252-11.389c-1.242-0.699-3.095-0.121-4.165,1.276l-16.009,20.905
+	c-1.07,1.397-1.146,3.336-0.148,4.354l15.949,16.248c-3.334,7.425-5.582,15.378-6.595,23.672l-23.87,6.875
+	c-1.37,0.395-2.258,2.12-2.014,3.864l3.655,26.075c0.244,1.743,1.573,3.157,2.998,3.161l24.25,0.046
+	c2.942,7.561,6.931,14.525,11.798,20.757l-13.069,21.722c-0.735,1.221-0.21,3.089,1.155,4.2l20.428,16.615
+	c1.365,1.111,3.301,1.243,4.347,0.275l19.302-17.866c7.129,3.111,14.733,5.219,22.648,6.208l6.867,25.208
+	c0.375,1.375,2.087,2.288,3.833,2.069l26.126-3.277c1.746-0.218,3.18-1.526,3.204-2.951l0.429-26.124
+	c7.41-2.907,14.243-6.816,20.373-11.577l20.667,12.655c1.215,0.745,3.088,0.235,4.209-1.122l16.774-20.296
+	c1.121-1.356,1.269-3.292,0.309-4.345l-17.055-18.718c3.241-7.303,5.433-15.111,6.437-23.249l24.359-6.658
+	c1.375-0.376,2.286-2.09,2.065-3.836L392.148,273.945z"/>
+<g transform="matrix(0.99223 -0.12445 0.12445 0.99223 -8.03 8.757)">
+	
+		<ellipse transform="matrix(-0.9922 -0.1244 0.1244 -0.9922 470.5902 681.5917)" style="fill:#31978C;" cx="256.583" cy="326.098" rx="54.676" ry="54.676"/>
+	
+		<ellipse transform="matrix(-0.9922 -0.1244 0.1244 -0.9922 470.5902 681.5917)" style="fill:#EBF0F3;" cx="256.583" cy="326.098" rx="32.287" ry="32.287"/>
+</g>
+<path style="fill:#3A556A;" d="M259.77,80.469c0,44.442-36.027,99.39-80.469,99.39s-80.469-54.948-80.469-99.39S134.859,0,179.301,0
+	S259.77,36.027,259.77,80.469z"/>
+<path style="fill:#2F4859;" d="M179.301,179.859c44.442,0,80.469-54.948,80.469-99.39S223.742,0,179.301,0V179.859z"/>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>

ui/images/warning.svg

@@ -0,0 +1,59 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
+<path style="fill:#47CEAC;" d="M512,256.006C512,397.402,397.394,512.004,256.004,512C114.606,512.004,0,397.402,0,256.006
+	C-0.007,114.61,114.606,0,256.004,0C397.394,0,512,114.614,512,256.006z"/>
+<path style="fill:#36BB9A;" d="M511.712,267.373c-0.119-0.137-0.238-0.274-0.368-0.402
+	c-0.223-0.221-132.713-132.715-132.993-132.992c-0.222-0.22-0.47-0.403-0.693-0.621c-0.281-0.282-0.518-0.594-0.801-0.874
+	c-32.27-31.934-75.417-49.161-120.981-48.268c-46.031,0.791-89.349,19.387-121.969,52.361
+	c-32.838,33.193-50.485,76.668-49.694,122.415c0.799,46.023,18.887,88.827,50.934,120.528c0.226,0.223,0.477,0.41,0.703,0.631
+	c0.276,0.277,0.512,0.587,0.791,0.863c0.226,0.223,130.481,130.414,130.707,130.636c0.02,0.02,0.037,0.043,0.058,0.063
+	C399.729,505.913,505.926,399.705,511.712,267.373z"/>
+<g>
+	<polygon style="fill:#F4F6F9;" points="427.788,253.013 427.788,253.017 427.788,253.017 	"/>
+	<path style="fill:#F4F6F9;" d="M255.876,84.217c-46.032,0.791-89.349,19.387-121.969,52.361
+		c-32.838,33.193-50.485,76.668-49.694,122.415c0.799,46.025,18.886,88.828,50.934,120.529
+		c31.558,31.216,73.338,48.297,117.947,48.297c1.01,0,2.028-0.007,3.042-0.026c46.032-0.799,89.346-19.397,121.963-52.371
+		c32.842-33.191,50.484-76.661,49.691-122.404c-0.799-46.028-18.883-88.831-50.93-120.532
+		C344.588,100.55,301.441,83.323,255.876,84.217z M412.847,253.276c0.73,41.68-15.386,81.329-45.367,111.639
+		c-29.862,30.179-69.497,47.206-111.606,47.936c-41.633,0.828-80.833-14.885-110.218-43.953
+		c-29.261-28.94-45.773-68.066-46.502-110.166c-0.725-41.687,15.389-81.34,45.375-111.65
+		c29.862-30.179,69.497-47.202,111.606-47.924c0.933-0.018,1.868-0.026,2.798-0.026c40.641,0,78.691,15.553,107.42,43.971
+		c29.253,28.943,45.765,68.07,46.495,110.17C412.847,253.276,412.847,253.276,412.847,253.276z"/>
+	<path style="fill:#F4F6F9;" d="M256,285.885c4.126,0,7.47-3.345,7.47-7.47V158.892c0-4.126-3.345-7.47-7.47-7.47
+		c-4.126,0-7.47,3.345-7.47,7.47v119.522C248.53,282.54,251.874,285.885,256,285.885z"/>
+	<path style="fill:#F4F6F9;" d="M256.007,315.765h-0.27c-8.241,0-14.821,6.954-14.675,15.195c0.139,8.17,6.798,14.686,14.93,14.686
+		h0.27c8.241,0,14.821-6.954,14.675-15.195C270.791,322.281,264.14,315.765,256.007,315.765z"/>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>

ui/pick2light.tpl

@@ -6,7 +6,7 @@
       <form class="form" method="post" action="{{@BASEURL}}/pick2light/{{@STEP+1}}">
         <input type="submit" hidden id="submitform"/>
         <select name="consegna" class="form-control form-control-lg bg-secondary mb-3" onchange="javascript:$('#submitform').click()">
-          <option {{isset(@PAGEVALUES.consegna) ? '' : 'selected'}} >Seleziona una distinta</option>
+          <option {{isset(@PAGEVALUES.consegna) ? '' : 'selected'}} >Selezionare una distinta</option>
           <repeat group="{{ @DISTINTE }}" value="{{ @DISTINTA }}">
             <option {{@PAGEVALUES.consegna == @@DISTINTA.consegna ? 'selected' : ''}} value="{{@@DISTINTA.consegna}}">{{@@DISTINTA.consegna}} - {{@@DISTINTA.data_creazione}} - {{@@DISTINTA.time_creazione}} - {{@@DISTINTA.destinazione_merci}}</option>
           </repeat>