15.5.7 release

ChangeLog

@@ -1,3 +1,20 @@
+20-OCT-2021: 15.5.7
+
+- Fixes rendering of row lines https://github.com/jgraph/drawio/issues/2332
+- Fixes hardcoded dark mode colors
+- Adds oneDriveInlinePicker switch https://github.com/jgraph/drawio/issues/2330
+- Adds settingsName config
+- Fixes color override for non-formatted text
+- Changes for conf server to use sketch mode
+- Fixes in-place editor default color
+- Adds Graph.defaultForegroundColor
+- Fixes background page default foreground
+
+19-OCT-2021: 15.5.6
+
+- [conf Cloud] Adds Config JSON Schema validation and error check in viewer
+- Minor fix for inline embed mode
+
 18-OCT_2021: 15.5.5
 
 - Adds support for "primary key (PK)" SQL syntax #DID-3505

VERSION

@@ -1 +1 @@
-15.5.5
+15.5.7

src/main/webapp/electron.js

@@ -682,11 +682,11 @@ app.on('ready', e =>
 	    submenu: [
 	      {
 	        label: 'Website',
-	        click() { shell.openExternal('https://about.draw.io'); }
+	        click() { shell.openExternal('https://www.diagrams.net'); }
 	      },
 	      {
 	        label: 'Support',
-	        click() { shell.openExternal('https://about.draw.io/support'); }
+	        click() { shell.openExternal('https://github.com/jgraph/drawio-desktop/issues'); }
 		  },
 		  checkForUpdates,
 	      {
@@ -714,11 +714,11 @@ app.on('ready', e =>
 	      submenu: [
 	        {
 	          label: 'About ' + app.name,
-	          click() { shell.openExternal('https://about.draw.io'); }
+	          click() { shell.openExternal('https://www.diagrams.net'); }
 	        },
 	        {
 	          label: 'Support',
-	          click() { shell.openExternal('https://about.draw.io/support'); }
+	          click() { shell.openExternal('https://github.com/jgraph/drawio-desktop/issues'); }
 			},
 			checkForUpdates,
 			{ type: 'separator' },

src/main/webapp/js/diagramly/App.js

@@ -516,7 +516,7 @@ App.getStoredMode = function()
 						if (App.mode == App.MODE_ONEDRIVE || (window.location.hash != null &&
 							window.location.hash.substring(0, 2) == '#W'))
 						{
-							if (urlParams['inlinePicker'] == '0')
+							if (!Editor.oneDriveInlinePicker)
 							{
 								mxscript(App.ONEDRIVE_URL);
 							}
@@ -954,7 +954,7 @@ App.main = function(callback, createUi)
 						urlParams['od'] == '1')) && (navigator.userAgent == null ||
 						navigator.userAgent.indexOf('MSIE') < 0 || document.documentMode >= 10))))
 					{
-						if (urlParams['inlinePicker'] == '0')
+						if (!Editor.oneDriveInlinePicker)
 						{
 							mxscript(App.ONEDRIVE_URL, window.DrawOneDriveClientCallback);
 						}

src/main/webapp/js/diagramly/Devel.js

@@ -33,7 +33,7 @@ if (!mxIsElectron && location.protocol !== 'http:')
 
 		var styleHashes = '\'sha256-JjkxVHHCCVO0nllPD6hU8bBYSlsikA8TM/o3fhr0bas=\' ' + // index.html
 			'\'sha256-VTG4NbRCx30lYCdLPlgZTrdTopzcdviOjAbS7nk+KbI=\' ' + // Minimal.js/Light
-			'\'sha256-YeH9p6l4gps8LqwnJMaRzzR/7ecH/yGYkQV9fNFXKkA=\' ' + // Minimal.js/Dark
+			'\'sha256-mbkyvR7KVIpvb+DU65TAGUt3LYuyF2kUg8Ktoee8eY4=\' ' + // Minimal.js/Dark
 			'\'sha256-7kY8ozVqKLIIBwZ24dhdmZkM26PsOlZmEi72RhmZKoM=\' ' + // mxTooltipHandler.js
 			'\'sha256-01chdey79TzZe4ihnvvUXXI5y8MklIcKH+vzDdQvsuU=\' ' + // Editor.js/mathJaxWebkitCss
 			'\'sha256-fGbXK7EYpvNRPca81zPnqJHi2y+34KSgAcZv8mhaSzI=\' ' + // MathJax.js

src/main/webapp/js/diagramly/Editor.js

@@ -262,6 +262,11 @@
 	 */
 	Editor.compressXml = true;
 
+	/**
+	 * Specifies if XML files should be compressed. Default is true.
+	 */
+	Editor.oneDriveInlinePicker = (window.urlParams != null && window.urlParams['inlinePicker'] == '0') ? false : true;
+
 	/**
 	 * Specifies global variables.
 	 */
@@ -1847,6 +1852,23 @@
 			{
 				Editor.simpleLabels = config.simpleLabels;
 			}
+
+			if (config.oneDriveInlinePicker != null)
+			{
+				Editor.oneDriveInlinePicker = config.oneDriveInlinePicker;
+			}
+
+			if (config.darkColor != null)
+			{
+				Editor.darkColor = config.darkColor;
+			}
+
+			if (config.settingsName != null)
+			{
+				Editor.configurationKey = '.' + config.settingsName + '-configuration';
+				Editor.settingsKey = '.' + config.settingsName + '-config';
+				mxSettings.key = Editor.settingsKey;
+			}
 			
 			if (config.customFonts)
 			{
@@ -6442,14 +6464,18 @@
 		incExtFonts, keepTheme, exportType, cells)
 	{
 		var temp = null;
+		var tempFg = null;
 		var tempBg = null;
 		
 		if (!keepTheme && this.themes != null && this.defaultThemeName == 'darkTheme')
 		{
 			temp = this.stylesheet;
+			tempFg = this.defaultForegroundColor;
 			tempBg = this.defaultPageBackgroundColor;
 			this.defaultPageBackgroundColor = (this.defaultThemeName == 'darkTheme') ?
 				'#ffffff' : Editor.darkColor;
+			this.defaultForegroundColor = (this.defaultThemeName == 'darkTheme') ?
+				'#000000' : '#f0f0f0';
 			this.stylesheet = this.getDefaultStylesheet();
 			// LATER: Fix math export in dark mode by fetching text nodes before
 			// calling refresh and changing the font color in-place
@@ -6493,6 +6519,7 @@
 		if (temp != null)
 		{
 			this.defaultPageBackgroundColor = tempBg;
+			this.defaultForegroundColor = tempFg;
 			this.stylesheet = temp;
 			this.refresh();
 		}

src/main/webapp/js/diagramly/EditorUi.js

@@ -461,6 +461,16 @@
 	 * Restores app defaults for UI
 	 */
 	EditorUi.prototype.closableScratchpad = true;
+	
+	/**
+	 * Restores app defaults for UI
+	 */
+	EditorUi.prototype.embedExportBorder = 8;
+	
+	/**
+	 * Restores app defaults for UI
+	 */
+	EditorUi.prototype.embedExportBackground = null;
 
 	/**
 	 * Capability check for canvas export
@@ -9002,7 +9012,7 @@
 		// Must be set before UI is created in superclass
 		if (this.isSettingsEnabled())
 		{
-			if (urlParams['sketch'] == '1' && urlParams['embedInline'] != '1')
+			if (urlParams['sketch'] == '1')
 			{
 				this.doSetSketchMode((mxSettings.settings.sketchMode != null &&
 					urlParams['rough'] == null) ? mxSettings.settings.sketchMode :
@@ -11653,7 +11663,8 @@
 				event: 'export',
 				data: Editor.createSvgDataUri(svg)
 			}), '*');
-		}), null, null, true, null, 1, 8);
+		}), null, null, true, this.embedExportBackground,
+			1, this.embedExportBorder);
 
 		this.diagramContainer.removeAttribute('data-bounds');
 		Editor.inlineFullscreen = false;
@@ -12344,6 +12355,18 @@
 							}
 						}
 
+						if (data.border != null)
+						{
+							this.embedExportBorder = data.border;
+						}
+
+						var border = this.embedExportBorder;
+
+						if (data.background != null)
+						{
+							this.embedExportBackground = data.background;
+						}
+
 						if (data.rect != null)
 						{
 							this.diagramContainer.style.border = '2px solid #295fcc';
@@ -12358,11 +12381,11 @@
 							{
 								var graph = this.editor.graph;
 								var prev = graph.maxFitScale;
-								graph.maxFitScale = 1;
-								graph.fit(20);
+								graph.maxFitScale = data.maxFitScale;
+								graph.fit(2 * border);
 								graph.maxFitScale = prev;
-								graph.container.scrollTop -= 20;
-								graph.container.scrollLeft -= 20;
+								graph.container.scrollTop -= 2 * border;
+								graph.container.scrollLeft -= 2 * border;
 								this.fireEvent(new mxEventObject('editInlineStart', 'data', [data]));
 							});
 						}

src/main/webapp/js/diagramly/GraphViewer.js

@@ -1981,11 +1981,7 @@ GraphViewer.prototype.showLocalLightbox = function()
 		{
 			return self.getImageUrl(key);
 		};
-
-		// newGraph.defaultPageBackgroundColor = graph.defaultPageBackgroundColor;
-		// newGraph.defaultPageBorderColor = graph.defaultPageBorderColor;
-		// newGraph.defaultThemeName = graph.defaultThemeName;
-			
+	
 		return newGraph;
 	};
 	

src/main/webapp/js/diagramly/Minimal.js

@@ -126,8 +126,8 @@ EditorUi.initMinimalTheme = function()
 	    {
 			var w = Math.min(graph.container.clientWidth - 10, 218);
 	        
-			ui.sidebarWindow = new WrapperWindow(ui, mxResources.get('shapes'),
-				10, (urlParams['sketch'] == '1') ? 15 : 56,
+			ui.sidebarWindow = new WrapperWindow(ui, mxResources.get('shapes'), 10,
+				(urlParams['sketch'] == '1' && urlParams['embedInline'] != '1') ? 15 : 56,
 				w - 6, Math.min(650, graph.container.clientHeight - 30),
 				function(container)
 			{
@@ -333,10 +333,11 @@ EditorUi.initMinimalTheme = function()
 			this.spinner.opts.color = Editor.isDarkMode() ? '#c0c0c0' : '#000';
 			this.setGridColor(Editor.isDarkMode() ? graph.view.defaultDarkGridColor : graph.view.defaultGridColor);
 			graph.defaultPageBorderColor = Editor.isDarkMode() ? '#505759' : '#ffffff';
+			graph.defaultForegroundColor = Editor.isDarkMode() ? '#f0f0f0' : '#000000';
 			graph.defaultThemeName = Editor.isDarkMode() ? 'darkTheme' : 'default-style2';
 			graph.graphHandler.previewColor = Editor.isDarkMode() ? '#cccccc' : 'black';
-			graph.defaultPageBackgroundColor = (urlParams['embedInline'] == '1') ? 'transparent' :
-				(Editor.isDarkMode() ? Editor.darkColor : '#ffffff');
+			graph.defaultPageBackgroundColor = Editor.isDarkMode() ? Editor.darkColor : '#ffffff';
+			Graph.prototype.defaultPageBackgroundColor = graph.defaultPageBackgroundColor;
 			document.body.style.backgroundColor = (urlParams['embedInline'] == '1') ? 'transparent' :
 				(Editor.isDarkMode() ? Editor.darkColor : '#ffffff');
 			graph.loadStylesheet();
@@ -415,7 +416,8 @@ EditorUi.initMinimalTheme = function()
 			'html body .geMenubarContainer .geMenuItem .geMenuItem, html body .geMenubarContainer a.geMenuItem { color: #353535; }' +
 			'html > body > div > .geToolbarContainer { border: 1px solid #c0c0c0 !important; box-shadow: none !important; }' +
 			'html > body.geEditor > div > a.geItem { background-color: #2a2a2a; color: #cccccc; border-color: #505759; }' +
-			'html body .geTabContainer, html body .geTabContainer div, html body .geMenubarContainer { border-color: #505759 !important; }'
+			'html body .geTabContainer, html body .geTabContainer div, html body .geMenubarContainer { border-color: #505759 !important; }' +
+			'html body .mxCellEditor { color: #f0f0f0; }'
 			:
 			// Non-dark mode styles
 			'html body div.geToolbarContainer a.geInverted { filter: invert(1); }' +
@@ -1064,6 +1066,10 @@ EditorUi.initMinimalTheme = function()
 				
 				menu.addSeparator(parent);
 			}
+			else if(ui.mode == App.MODE_ATLAS) 
+			{
+				ui.menus.addMenuItems(menu, ['save', 'synchronize', '-'], parent);
+			}
 			else
 			{
 	        	ui.menus.addMenuItems(menu, ['new'], parent);
@@ -1207,8 +1213,12 @@ EditorUi.initMinimalTheme = function()
 	            ui.menus.addMenuItems(menu, ['publishLink'], parent);
     		}
     		
-            menu.addSeparator(parent);
-            ui.menus.addSubmenu('embed', menu, parent);
+    		if(ui.mode != App.MODE_ATLAS) 
+    		{
+    			menu.addSeparator(parent);
+    			ui.menus.addSubmenu('embed', menu, parent);
+    		}
+
         })));
 
         var langMenu = this.get('language');
@@ -1377,10 +1387,52 @@ EditorUi.initMinimalTheme = function()
 			}
 		}));
 	};
+
+	var formatWindowInitialized = false;
+
+	EditorUi.prototype.initFormatWindow = function()
+	{
+		if (!formatWindowInitialized)
+		{
+			formatWindowInitialized = true;
+			this.formatWindow.window.setClosable(false);
+
+			var toggleMinimized = this.formatWindow.window.toggleMinimized;
+			
+			this.formatWindow.window.toggleMinimized = function()
+			{
+				toggleMinimized.apply(this, arguments);
+				
+				if (this.minimized)
+				{
+					this.div.style.width = '90px';
+					this.table.style.width = '90px';
+					this.div.style.left = parseInt(this.div.style.left) + 150 + 'px';
+				}
+				else
+				{
+					
+					this.div.style.width = '240px';
+					this.table.style.width = '240px';
+					this.div.style.left = Math.max(0, parseInt(this.div.style.left) - 150) + 'px';
+				}
+				
+				this.fit();
+			};
+			
+			mxEvent.addListener(this.formatWindow.window.title, 'dblclick', mxUtils.bind(this, function(evt)
+			{
+				if (mxEvent.getSource(evt) == this.formatWindow.window.title)
+				{
+					this.formatWindow.window.toggleMinimized();
+				}
+			}));
+		}
+	};
 	
 	// Initializes the user interface
 	var editorUiInit = EditorUi.prototype.init;
-	
+
 	EditorUi.prototype.init = function()
 	{
 		editorUiInit.apply(this, arguments);
@@ -1421,44 +1473,15 @@ EditorUi.initMinimalTheme = function()
 
 		if (urlParams['sketch'] == '1' || iw >= 1000)
 		{
-			toggleFormat(this, true);
-			
-			if (urlParams['sketch'] == '1')
+			if (urlParams['embedInline'] != '1')
 			{
-				this.formatWindow.window.setClosable(false);
+				toggleFormat(this, true);
 
-				var toggleMinimized = this.formatWindow.window.toggleMinimized;
-				
-				this.formatWindow.window.toggleMinimized = function()
-				{
-					toggleMinimized.apply(this, arguments);
-					
-					if (this.minimized)
-					{
-						this.div.style.width = '90px';
-						this.table.style.width = '90px';
-						this.div.style.left = parseInt(this.div.style.left) + 150 + 'px';
-					}
-					else
-					{
-						
-						this.div.style.width = '240px';
-						this.table.style.width = '240px';
-						this.div.style.left = Math.max(0, parseInt(this.div.style.left) - 150) + 'px';
-					}
-					
-					this.fit();
-				};
-				
-				mxEvent.addListener(this.formatWindow.window.title, 'dblclick', mxUtils.bind(this, function(evt)
+				if (urlParams['sketch'] == '1')
 				{
-					if (mxEvent.getSource(evt) == this.formatWindow.window.title)
-					{
-						this.formatWindow.window.toggleMinimized();
-					}
-				}));
-				
-				this.formatWindow.window.toggleMinimized();
+					this.initFormatWindow();
+					this.formatWindow.window.toggleMinimized();
+				}
 			}
 		}
         
@@ -1752,6 +1775,8 @@ EditorUi.initMinimalTheme = function()
 			{
 				this.sidebar.graph.stylesheet.styles =
 					mxUtils.clone(graph.stylesheet.styles);
+				this.sidebar.graph.defaultForegroundColor =
+					graph.defaultForegroundColor;
 				this.sidebar.container.innerHTML = '';
 				this.sidebar.palettes = new Object();
 				this.sidebar.init();
@@ -1865,6 +1890,11 @@ EditorUi.initMinimalTheme = function()
 			this.diagramContainer.style.background = (Editor.inlineFullscreen) ?
 				(Editor.isDarkMode() ? Editor.darkColor : '#ffffff') : 'transparent';
 			inlineSizeChanged();
+
+			toggleFormat(ui, true);
+			ui.initFormatWindow();
+			var r  = this.diagramContainer.getBoundingClientRect();
+			this.formatWindow.window.setLocation(r.x + r.width + 4, r.y);
 		});
 
 		ui.addListener('inlineFullscreenChanged', editInlineStart);
@@ -2311,6 +2341,8 @@ EditorUi.initMinimalTheme = function()
 				if (urlParams['embedInline'] == '1')
 				{
 					footer.appendChild(fullscreenElt);
+					var exitAction = ui.actions.get('exit');
+					footer.appendChild(addMenuItem('', exitAction.funct, null, mxResources.get('exit'), exitAction, Editor.closeImage));
 				}
 
 				var pageMenu = this.createPageMenuTab(false);

src/main/webapp/js/diagramly/OneDriveClient.js

@@ -18,7 +18,7 @@ window.OneDriveClient = function(editorUi, isExtAuth, inlinePicker, noLogout)
 	
 	if (inlinePicker == null) //Use inline picker as default
 	{
-		inlinePicker = (window.urlParams != null && window.urlParams['inlinePicker'] == '0')? false : true;
+		inlinePicker = window.Editor != null? Editor.oneDriveInlinePicker : true;
 	}
 	
 	if (noLogout == null && window.urlParams != null && window.urlParams['noLogoutOD'] == '1')

src/main/webapp/js/diagramly/Pages.js

@@ -357,6 +357,7 @@ EditorUi.prototype.getImageForPage = function(page, sourcePage, sourceGraph)
 	sourceGraph = (sourceGraph != null) ? sourceGraph : this.editor.graph;
 	var graphGetGlobalVariable = sourceGraph.getGlobalVariable;
 	var graph = this.createTemporaryGraph(sourceGraph.getStylesheet());
+	graph.defaultForegroundColor = sourceGraph.defaultForegroundColor;
 	var index = this.getPageIndex((sourcePage != null) ?
 		sourcePage : this.currentPage);
 

src/main/webapp/js/grapheditor/Graph.js

@@ -1900,6 +1900,11 @@ Graph.prototype.lightbox = false;
  */
 Graph.prototype.defaultPageBackgroundColor = '#ffffff';
 
+/**
+ * 
+ */
+Graph.prototype.defaultForegroundColor = '#000000';
+
 /**
  * 
  */
@@ -10920,13 +10925,14 @@ if (typeof mxVertexHandler != 'undefined')
 		var mxCellRendererPostConfigureShape = mxCellRenderer.prototype.postConfigureShape;
 		mxCellRenderer.prototype.postConfigureShape = function(state)
 		{
-			var fg = Editor.isDarkMode() ? '#ffffff' : '#000000';
 			var bg = state.view.graph.defaultPageBackgroundColor;
+			var fg = state.view.graph.defaultForegroundColor;
 
 			this.resolveDefaultColor(state, 'fill', state.shape, bg);
 			this.resolveDefaultColor(state, 'stroke', state.shape, fg);
 			this.resolveDefaultColor(state, 'laneFill', state.shape, bg);
 			this.resolveDefaultColor(state, 'imageBackground', state.shape, bg);
+			this.resolveDefaultColor(state, 'labelBackgroundColor', state.shape, bg);
 			this.resolveDefaultColor(state, 'imageBorder', state.shape, fg);
 			this.resolveDefaultColor(state, 'background', state.text, bg);
 			this.resolveDefaultColor(state, 'color', state.text, fg);

src/main/webapp/js/grapheditor/Shapes.js

@@ -212,19 +212,22 @@
 						c.moveTo(x + start.x, y + geo.y);
 						var tw = 0;
 
-						if (graph.model.isVisible(data.cells[i]))
+						for (j = 0; j < data.cells.length; j++)
 						{
-							tw = data.x;
-						}
-						else
-						{
-							if (tw > 0)
+							if (graph.model.isVisible(data.cells[j]))
 							{
-								c.lineTo(x + tw - start.width, y + geo.y);
+								tw = data.x;
 							}
+							else
+							{
+								if (tw > 0)
+								{
+									c.lineTo(x + tw - start.width, y + geo.y);
+								}
 
-							c.moveTo(x + geo.x + geo.width + start.x, y + geo.y);
-							tw = 0;
+								c.moveTo(x + geo.x + geo.width + start.x, y + geo.y);
+								tw = 0;
+							}
 						}
 
 						c.lineTo(x + w - start.width, y + geo.y);
@@ -234,11 +237,11 @@
 				}
 			}
 			
+			// Paints column lines
 			if (columnLines)
 			{
 				var cols = rowData[0].cells;
 				
-				// Paints column lines
 				for (var i = 1; i < cols.length; i++)
 				{
 					geo = graph.getCellGeometry(cols[i]);

src/main/webapp/js/grapheditor/Sidebar.js

@@ -13,6 +13,7 @@ function Sidebar(editorUi, container)
 	this.lastCreated = 0;
 	this.showTooltips = true;
 	this.graph = editorUi.createTemporaryGraph(this.editorUi.editor.graph.getStylesheet());
+	this.graph.defaultForegroundColor = editorUi.editor.graph.defaultForegroundColor;
     this.graph.cellRenderer.minSvgStrokeWidth = this.minThumbStrokeWidth;
 	this.graph.cellRenderer.antiAlias = this.thumbAntiAlias;
 	this.graph.container.style.visibility = 'hidden';
@@ -292,6 +293,7 @@ Sidebar.prototype.createTooltip = function(elt, cells, w, h, title, showLabel, o
 		}), this.tooltip);
 		
 		this.graph2 = new Graph(this.tooltip, null, null, this.editorUi.editor.graph.getStylesheet());
+		this.graph2.defaultForegroundColor = this.editorUi.editor.graph.defaultForegroundColor;
 		this.graph2.resetViewOnRootChange = false;
 		this.graph2.foldingEnabled = false;
 		this.graph2.gridEnabled = false;

src/main/webapp/styles/dark-default.xml

@@ -6,21 +6,21 @@
 		<add as="fontFamily" value="Helvetica"/>
 		<add as="align" value="center"/>
 		<add as="verticalAlign" value="middle"/>
-		<add as="fillColor" value="#2a2a2a"/>
-		<add as="strokeColor" value="#f0f0f0"/>
-		<add as="fontColor" value="#f0f0f0"/>
+		<add as="fillColor" value="default"/>
+		<add as="strokeColor" value="default"/>
+		<add as="fontColor" value="default"/>
 	</add>
 	<add as="defaultEdge">
 		<add as="shape" value="connector"/>
-		<add as="labelBackgroundColor" value="#2a2a2a"/>
+		<add as="labelBackgroundColor" value="default"/>
 		<add as="endArrow" value="classic"/>
 		<add as="fontSize" value="11"/>
 		<add as="fontFamily" value="Helvetica"/>
 		<add as="align" value="center"/>
 		<add as="verticalAlign" value="middle"/>
 		<add as="rounded" value="1"/>
-		<add as="strokeColor" value="#f0f0f0"/>
-		<add as="fontColor" value="#f0f0f0"/>
+		<add as="strokeColor" value="default"/>
+		<add as="fontColor" value="default"/>
 	</add>
 	<add as="text">
 		<add as="fillColor" value="none"/>
@@ -30,7 +30,7 @@
 		<add as="verticalAlign" value="top"/>
 	</add>
 	<add as="edgeLabel" extend="text">
-		<add as="labelBackgroundColor" value="#2a2a2a"/>
+		<add as="labelBackgroundColor" value="default"/>
 		<add as="fontSize" value="11"/>
 	</add>
 	<add as="label">
@@ -49,7 +49,7 @@
 		<add as="verticalLabelPosition" value="bottom"/>
 		<add as="verticalAlign" value="top"/>
 		<add as="spacingTop" value="4"/>
-		<add as="labelBackgroundColor" value="#2a2a2a"/>
+		<add as="labelBackgroundColor" value="default"/>
 		<add as="spacing" value="0"/>
 		<add as="spacingLeft" value="0"/>
 		<add as="spacingTop" value="6"/>

src/main/webapp/styles/dark.css

@@ -1,6 +1,9 @@
 html body .geDiagramContainer, html body div.geMenubarContainer, html body td.mxPopupMenuIcon, html body .geFormatContainer, html body div.geMenubarContainer .geStatus:hover {
 	background-color:#2a2a2a;
 }
+html body .mxCellEditor {
+	color: #f0f0f0;
+}
 html body.geEditor div.mxPopupMenu {
 	border:3px solid #505759;
 	background:#2a2a2a;