rebuilt

dist/vis.css

@@ -583,7 +583,7 @@
 
 
 
-div.network-manipulationDiv {
+div.vis-network div.vis-manipulation {
   border-width: 0;
   border-bottom: 1px;
   border-style:solid;
@@ -604,14 +604,16 @@ div.network-manipulationDiv {
   height: 30px;
 }
 
-div.network-manipulation-editMode {
+div.vis-network div.vis-edit-mode {
   position:absolute;
   left: 0;
   top: 15px;
   height: 30px;
 }
 
-div.network-manipulation-closeDiv {
+/* FIXME: shouldn't the vis-close button be a child of the vis-manipulation div? */
+
+div.vis-network div.vis-close {
   position:absolute;
   right: 0;
   top: 0;
@@ -630,13 +632,14 @@ div.network-manipulation-closeDiv {
   user-select: none;
 }
 
-div.network-manipulation-closeDiv:hover {
+div.vis-network div.vis-close:hover {
   opacity: 0.6;
 }
 
-div.network-manipulationUI {
-    position:relative;
-    top:-7px;
+div.vis-network div.vis-manipulation div.vis-button,
+div.vis-network div.vis-edit-mode div.vis-button {
+  position:relative;
+  top:-7px;
   font-family: verdana;
   font-size: 12px;
   -moz-border-radius: 15px;
@@ -657,68 +660,69 @@ div.network-manipulationUI {
   user-select: none;
 }
 
-div.network-manipulationUI:hover {
+div.vis-network div.vis-manipulation div.vis-button:hover {
   box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.20);
 }
 
-div.network-manipulationUI:active {
+div.vis-network div.vis-manipulation div.vis-button:active {
   box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.50);
 }
 
-div.network-manipulationUI.back {
+div.vis-network div.vis-manipulation div.vis-button.vis-back {
   background-image: url("img/network/backIcon.png");
 }
 
-div.network-manipulationUI.none:hover {
+div.vis-network div.vis-manipulation div.vis-button.vis-none:hover {
   box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.0);
   cursor: default;
 }
-div.network-manipulationUI.none:active {
+div.vis-network div.vis-manipulation div.vis-button.vis-none:active {
   box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.0);
 }
-div.network-manipulationUI.none {
+div.vis-network div.vis-manipulation div.vis-button.vis-none {
   padding: 0;
 }
-div.network-manipulationUI.notification{
+div.vis-network div.vis-manipulation div.notification {
   margin: 2px;
   font-weight: bold;
 }
 
-div.network-manipulationUI.add {
+div.vis-network div.vis-manipulation div.vis-button.vis-add {
   background-image: url("img/network/addNodeIcon.png");
 }
 
-div.network-manipulationUI.edit {
+div.vis-network div.vis-manipulation div.vis-button.vis-edit,
+div.vis-network div.vis-edit-mode div.vis-button.vis-edit {
   background-image: url("img/network/editIcon.png");
 }
 
-div.network-manipulationUI.edit.editmode {
+div.vis-network div.vis-edit-mode div.vis-button.vis-edit.vis-edit-mode {
   background-color: #fcfcfc;
-  border-style:solid;
-  border-width:1px;
-  border-color: #cccccc;
+  border: 1px solid #cccccc;
 }
 
-div.network-manipulationUI.connect {
+div.vis-network div.vis-manipulation div.vis-button.vis-connect {
   background-image: url("img/network/connectIcon.png");
 }
 
-div.network-manipulationUI.delete {
+div.vis-network div.vis-manipulation div.vis-button.vis-delete {
   background-image: url("img/network/deleteIcon.png");
 }
 /* top right bottom left */
-div.network-manipulationLabel {
-  margin: 0px 0px 0px 23px;
+div.vis-network div.vis-manipulation div.vis-label,
+div.vis-network div.vis-edit-mode div.vis-label {
+  margin: 0 0 0 23px;
   line-height: 25px;
 }
-div.network-seperatorLine {
+div.vis-network div.vis-manipulation div.vis-separator-line {
   display:inline-block;
   width:1px;
   height:20px;
   background-color: #bdbdbd;
-  margin: 5px 7px 0px 15px;
+  margin: 5px 7px 0 15px;
 }
 
+/* TODO: is this redundant?
 div.network-navigation_wrapper {
   position: absolute;
   left: 0;
@@ -726,7 +730,8 @@ div.network-navigation_wrapper {
   width: 100%;
   height: 100%;
 }
-div.network-navigation {
+*/
+div.vis-network div.vis-navigation div.vis-button {
     width:34px;
     height:34px;
     -moz-border-radius: 17px;
@@ -744,45 +749,45 @@ div.network-navigation {
     user-select: none;
 }
 
-div.network-navigation:hover {
-    box-shadow: 0px 0px 3px 3px rgba(56, 207, 21, 0.30);
+div.vis-network div.vis-navigation div.vis-button:hover {
+    box-shadow: 0 0 3px 3px rgba(56, 207, 21, 0.30);
 }
 
-div.network-navigation:active {
-    box-shadow: 0px 0px 1px 3px rgba(56, 207, 21, 0.95);
+div.vis-network div.vis-navigation div.vis-button:active {
+    box-shadow: 0 0 1px 3px rgba(56, 207, 21, 0.95);
 }
 
-div.network-navigation.up {
+div.vis-network div.vis-navigation div.vis-button.vis-up {
     background-image: url("img/network/upArrow.png");
     bottom:50px;
     left:55px;
 }
-div.network-navigation.down {
+div.vis-network div.vis-navigation div.vis-button.vis-down {
     background-image: url("img/network/downArrow.png");
     bottom:10px;
     left:55px;
 }
-div.network-navigation.left {
+div.vis-network div.vis-navigation div.vis-button.vis-left {
     background-image: url("img/network/leftArrow.png");
     bottom:10px;
     left:15px;
 }
-div.network-navigation.right {
+div.vis-network div.vis-navigation div.vis-button.vis-right {
     background-image: url("img/network/rightArrow.png");
     bottom:10px;
     left:95px;
 }
-div.network-navigation.zoomIn {
+div.vis-network div.vis-navigation div.vis-button.vis-zoomIn {
     background-image: url("img/network/plus.png");
     bottom:10px;
     right:15px;
 }
-div.network-navigation.zoomOut {
+div.vis-network div.vis-navigation div.vis-button.vis-zoomOut {
     background-image: url("img/network/minus.png");
     bottom:10px;
     right:55px;
 }
-div.network-navigation.zoomExtends {
+div.vis-network div.vis-navigation div.vis-button.vis-zoomExtends {
     background-image: url("img/network/zoomExtends.png");
     bottom:50px;
     right:15px;

dist/vis.js

@@ -20950,7 +20950,7 @@ return /******/ (function(modules) { // webpackBootstrap
         }
 
         this.frame = document.createElement('div');
-        this.frame.className = 'vis network-frame';
+        this.frame.className = 'vis-network';
         this.frame.style.position = 'relative';
         this.frame.style.overflow = 'hidden';
         this.frame.tabIndex = 900; // tab index is required for keycharm to bind keystrokes to the div instead of the window
@@ -23814,7 +23814,7 @@ return /******/ (function(modules) { // webpackBootstrap
         // load the manipulator HTML elements. All styling done in css.
         if (this.manipulationDiv === undefined) {
           this.manipulationDiv = document.createElement('div');
-          this.manipulationDiv.className = 'network-manipulationDiv';
+          this.manipulationDiv.className = 'vis-manipulation';
           if (this.editMode === true) {
             this.manipulationDiv.style.display = 'block';
           } else {
@@ -23826,7 +23826,7 @@ return /******/ (function(modules) { // webpackBootstrap
         // container for the edit button.
         if (this.editModeDiv === undefined) {
           this.editModeDiv = document.createElement('div');
-          this.editModeDiv.className = 'network-manipulation-editMode';
+          this.editModeDiv.className = 'vis-edit-mode';
           if (this.editMode === true) {
             this.editModeDiv.style.display = 'none';
           } else {
@@ -23838,7 +23838,7 @@ return /******/ (function(modules) { // webpackBootstrap
         // container for the close div button
         if (this.closeDiv === undefined) {
           this.closeDiv = document.createElement('div');
-          this.closeDiv.className = 'network-manipulation-closeDiv';
+          this.closeDiv.className = 'vis-close';
           this.closeDiv.style.display = this.manipulationDiv.style.display;
           this.canvas.frame.appendChild(this.closeDiv);
         }
@@ -23882,7 +23882,7 @@ return /******/ (function(modules) { // webpackBootstrap
 
         // create the contents for the editMode button
         var locale = this.options.locales[this.options.locale];
-        var button = this._createButton('editMode', 'network-manipulationUI edit editmode', locale.edit);
+        var button = this._createButton('editMode', 'vis-button vis-edit vis-edit-mode', locale.edit);
         this.editModeDiv.appendChild(button);
 
         // bind a hammer listener to the button, calling the function toggleEditMode.
@@ -23974,7 +23974,7 @@ return /******/ (function(modules) { // webpackBootstrap
         var index = arguments[0] === undefined ? 1 : arguments[0];
 
         this.manipulationDOM['seperatorLineDiv' + index] = document.createElement('div');
-        this.manipulationDOM['seperatorLineDiv' + index].className = 'network-seperatorLine';
+        this.manipulationDOM['seperatorLineDiv' + index].className = 'vis-separator-line';
         this.manipulationDiv.appendChild(this.manipulationDOM['seperatorLineDiv' + index]);
       }
     }, {
@@ -23983,49 +23983,49 @@ return /******/ (function(modules) { // webpackBootstrap
       // ----------------------    DOM functions for buttons    --------------------------//
 
       value: function _createAddNodeButton(locale) {
-        var button = this._createButton('addNode', 'network-manipulationUI add', locale.addNode);
+        var button = this._createButton('addNode', 'vis-button vis-add', locale.addNode);
         this.manipulationDiv.appendChild(button);
         this._bindHammerToDiv(button, this.addNodeMode.bind(this));
       }
     }, {
       key: '_createAddEdgeButton',
       value: function _createAddEdgeButton(locale) {
-        var button = this._createButton('addEdge', 'network-manipulationUI connect', locale.addEdge);
+        var button = this._createButton('addEdge', 'vis-button vis-connect', locale.addEdge);
         this.manipulationDiv.appendChild(button);
         this._bindHammerToDiv(button, this.addEdgeMode.bind(this));
       }
     }, {
       key: '_createEditNodeButton',
       value: function _createEditNodeButton(locale) {
-        var button = this._createButton('editNode', 'network-manipulationUI edit', locale.editNode);
+        var button = this._createButton('editNode', 'vis-button vis-edit', locale.editNode);
         this.manipulationDiv.appendChild(button);
         this._bindHammerToDiv(button, this.editNode.bind(this));
       }
     }, {
       key: '_createEditEdgeButton',
       value: function _createEditEdgeButton(locale) {
-        var button = this._createButton('editEdge', 'network-manipulationUI edit', locale.editEdge);
+        var button = this._createButton('editEdge', 'vis-button vis-edit', locale.editEdge);
         this.manipulationDiv.appendChild(button);
         this._bindHammerToDiv(button, this.editEdgeMode.bind(this));
       }
     }, {
       key: '_createDeleteButton',
       value: function _createDeleteButton(locale) {
-        var button = this._createButton('delete', 'network-manipulationUI delete', locale.del);
+        var button = this._createButton('delete', 'vis-button vis-delete', locale.del);
         this.manipulationDiv.appendChild(button);
         this._bindHammerToDiv(button, this.deleteSelected.bind(this));
       }
     }, {
       key: '_createBackButton',
       value: function _createBackButton(locale) {
-        var button = this._createButton('back', 'network-manipulationUI back', locale.back);
+        var button = this._createButton('back', 'vis-button vis-back', locale.back);
         this.manipulationDiv.appendChild(button);
         this._bindHammerToDiv(button, this.showManipulatorToolbar.bind(this));
       }
     }, {
       key: '_createButton',
       value: function _createButton(id, className, label) {
-        var labelClassName = arguments[3] === undefined ? 'network-manipulationLabel' : arguments[3];
+        var labelClassName = arguments[3] === undefined ? 'vis-label' : arguments[3];
 
         this.manipulationDOM[id + 'Div'] = document.createElement('div');
         this.manipulationDOM[id + 'Div'].className = className;
@@ -24038,7 +24038,7 @@ return /******/ (function(modules) { // webpackBootstrap
     }, {
       key: '_createDescription',
       value: function _createDescription(label) {
-        this.manipulationDiv.appendChild(this._createButton('description', 'network-manipulationUI none', label));
+        this.manipulationDiv.appendChild(this._createButton('description', 'vis-button vis-none', label));
       }
     }, {
       key: '_temporaryBindEvent',
@@ -33878,11 +33878,12 @@ return /******/ (function(modules) { // webpackBootstrap
         var navigationDivActions = ['_moveUp', '_moveDown', '_moveLeft', '_moveRight', '_zoomIn', '_zoomOut', '_zoomExtent'];
 
         this.navigationDOM.wrapper = document.createElement('div');
+        this.navigationDOM.wrapper.className = 'vis-navigation';
         this.canvas.frame.appendChild(this.navigationDOM.wrapper);
 
         for (var i = 0; i < navigationDivs.length; i++) {
           this.navigationDOM[navigationDivs[i]] = document.createElement('div');
-          this.navigationDOM[navigationDivs[i]].className = 'network-navigation ' + navigationDivs[i];
+          this.navigationDOM[navigationDivs[i]].className = 'vis-button vis-' + navigationDivs[i];
           this.navigationDOM.wrapper.appendChild(this.navigationDOM[navigationDivs[i]]);
 
           var hammer = new Hammer(this.navigationDOM[navigationDivs[i]]);