|
@ -22,6 +22,7 @@
|
|||
20. 支持 mp3,wav,mp4,flv 等音视频格式文件
|
||||
21. 支持 avi,mov,rm,webm,ts,rm,mkv,mpeg,ogg,mpg,rmvb,wmv,3gp,ts,swf 等视频格式转码预览
|
||||
22. 支持 dcm 等医疗数位影像预览
|
||||
23. 支持 drawio 绘图预览
|
||||
|
||||
> 基于当前良好的架构模式,支持的文件类型在进一步丰富中
|
||||
### 项目特性
|
||||
|
|
|
@ -26,6 +26,7 @@ Document online preview project solution, built using the popular Spring Boot fr
|
|||
20. Supports `mp3`,`wav`,`mp4`,`flv` .
|
||||
21. Supports many audio and video format files such as `avi`, `mov`, `wmv`, `mkv`, `3gp`, and `rm`.
|
||||
22. Supports for `dcm` .
|
||||
23. Supports for `drawio` .
|
||||
|
||||
### Features
|
||||
- Build with the popular frame spring boot
|
||||
|
|
|
@ -31,7 +31,8 @@ public enum FileType {
|
|||
SVG("svgFilePreviewImpl"),
|
||||
Epub("epubFilePreviewImpl"),
|
||||
BPMN("bpmnFilePreviewImpl"),
|
||||
DCM("dcmFilePreviewImpl");
|
||||
DCM("dcmFilePreviewImpl"),
|
||||
DRAWUI("drawioFilePreviewImpl");
|
||||
|
||||
private static final String[] OFFICE_TYPES = {"docx", "wps", "doc", "docm", "xls", "xlsx", "csv" ,"xlsm", "ppt", "pptx", "vsd", "rtf", "odt", "wmf", "emf", "dps", "et", "ods", "ots", "tsv", "odp", "otp", "sxi", "ott", "vsdx", "fodt", "fods", "xltx","tga","psd","dotm","ett","xlt","xltm","wpt","dot","xlam","dotx","xla"};
|
||||
private static final String[] PICTURE_TYPES = {"jpg", "jpeg", "png", "gif", "bmp", "ico", "jfif", "webp"};
|
||||
|
@ -41,6 +42,7 @@ public enum FileType {
|
|||
private static final String[] XMIND_TYPES = {"xmind"};
|
||||
private static final String[] Epub_TYPES = {"epub"};
|
||||
private static final String[] DCM_TYPES = {"dcm"};
|
||||
private static final String[] DRAWUI_TYPES = {"drawio"};
|
||||
private static final String[] TIFF_TYPES = {"tif", "tiff"};
|
||||
private static final String[] OFD_TYPES = {"ofd"};
|
||||
private static final String[] SVG_TYPES = {"svg"};
|
||||
|
@ -100,6 +102,9 @@ public enum FileType {
|
|||
for (String dcm : DCM_TYPES) {
|
||||
FILE_TYPE_MAPPER.put(dcm, FileType.DCM);
|
||||
}
|
||||
for (String drawio : DRAWUI_TYPES) {
|
||||
FILE_TYPE_MAPPER.put(drawio, FileType.DRAWUI);
|
||||
}
|
||||
FILE_TYPE_MAPPER.put("md", FileType.MARKDOWN);
|
||||
FILE_TYPE_MAPPER.put("xml", FileType.XML);
|
||||
FILE_TYPE_MAPPER.put("pdf", FileType.PDF);
|
||||
|
|
|
@ -30,6 +30,7 @@ public interface FilePreview {
|
|||
String MARKDOWN_FILE_PREVIEW_PAGE = "markdown";
|
||||
String BPMN_FILE_PREVIEW_PAGE = "bpmn";
|
||||
String DCM_FILE_PREVIEW_PAGE = "dcm";
|
||||
String DRAWUI_FILE_PREVIEW_PAGE = "drawio";
|
||||
String NOT_SUPPORTED_FILE_PAGE = "fileNotSupported";
|
||||
|
||||
String filePreviewHandle(String url, Model model, FileAttribute fileAttribute);
|
||||
|
|
|
@ -0,0 +1,25 @@
|
|||
package cn.keking.service.impl;
|
||||
|
||||
import cn.keking.model.FileAttribute;
|
||||
import cn.keking.service.FilePreview;
|
||||
import org.springframework.stereotype.Service;
|
||||
import org.springframework.ui.Model;
|
||||
|
||||
/**
|
||||
* Drawio 文件处理
|
||||
*/
|
||||
@Service
|
||||
public class DrawioFilePreviewImpl implements FilePreview {
|
||||
|
||||
private final CommonPreviewImpl commonPreview;
|
||||
|
||||
public DrawioFilePreviewImpl(CommonPreviewImpl commonPreview) {
|
||||
this.commonPreview = commonPreview;
|
||||
}
|
||||
|
||||
@Override
|
||||
public String filePreviewHandle(String url, Model model, FileAttribute fileAttribute) {
|
||||
commonPreview.filePreviewHandle(url,model,fileAttribute);
|
||||
return DRAWUI_FILE_PREVIEW_PAGE;
|
||||
}
|
||||
}
|
|
@ -0,0 +1,313 @@
|
|||
<!--[if IE]><meta http-equiv="X-UA-Compatible" content="IE=5" ><![endif]-->
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>drawio文件预览</title>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, user-scalable=yes, initial-scale=1.0">
|
||||
<script type="text/javascript">
|
||||
|
||||
var urlParams = (function()
|
||||
{
|
||||
var result = new Object();
|
||||
var params = window.location.search.slice(1).split('&');
|
||||
|
||||
for (var i = 0; i < params.length; i++)
|
||||
{
|
||||
var idx = params[i].indexOf('=');
|
||||
|
||||
if (idx > 0)
|
||||
{
|
||||
result[params[i].substring(0, idx)] = params[i].substring(idx + 1);
|
||||
}
|
||||
}
|
||||
|
||||
return result;
|
||||
})();
|
||||
|
||||
|
||||
if (window.location.hash != null && window.location.hash.substring(0, 2) == '#P')
|
||||
{
|
||||
try
|
||||
{
|
||||
urlParams = JSON.parse(decodeURIComponent(window.location.hash.substring(2)));
|
||||
|
||||
if (urlParams.hash != null)
|
||||
{
|
||||
window.location.hash = urlParams.hash;
|
||||
}
|
||||
}
|
||||
catch (e)
|
||||
{
|
||||
// ignore
|
||||
}
|
||||
}
|
||||
|
||||
// Global variable for desktop
|
||||
var mxIsElectron = window && window.process && window.process.type;
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* Synchronously adds scripts to the page.
|
||||
*/
|
||||
function mxscript(src, onLoad, id, dataAppKey, noWrite, onError)
|
||||
{
|
||||
var defer = onLoad == null && !noWrite;
|
||||
|
||||
if ((urlParams['dev'] != '1' && typeof document.createElement('canvas').getContext === "function") ||
|
||||
onLoad != null || noWrite)
|
||||
{
|
||||
var s = document.createElement('script');
|
||||
s.setAttribute('type', 'text/javascript');
|
||||
s.setAttribute('defer', 'true');
|
||||
s.setAttribute('src', src);
|
||||
|
||||
if (id != null)
|
||||
{
|
||||
s.setAttribute('id', id);
|
||||
}
|
||||
|
||||
|
||||
|
||||
if (onLoad != null)
|
||||
{
|
||||
var r = false;
|
||||
|
||||
s.onload = s.onreadystatechange = function()
|
||||
{
|
||||
if (!r && (!this.readyState || this.readyState == 'complete'))
|
||||
{
|
||||
r = true;
|
||||
onLoad();
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
if (onError != null)
|
||||
{
|
||||
s.onerror = function(e)
|
||||
{
|
||||
onError('Failed to load ' + src, e);
|
||||
};
|
||||
}
|
||||
|
||||
var t = document.getElementsByTagName('script')[0];
|
||||
|
||||
if (t != null)
|
||||
{
|
||||
t.parentNode.insertBefore(s, t);
|
||||
}
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* Asynchronously adds scripts to the page.
|
||||
*/
|
||||
function mxinclude(src)
|
||||
{
|
||||
var g = document.createElement('script');
|
||||
g.type = 'text/javascript';
|
||||
g.async = true;
|
||||
g.src = src;
|
||||
|
||||
var s = document.getElementsByTagName('script')[0];
|
||||
s.parentNode.insertBefore(g, s);
|
||||
};
|
||||
|
||||
|
||||
|
||||
// Checks for local storage
|
||||
var isLocalStorage = false;
|
||||
|
||||
try
|
||||
{
|
||||
isLocalStorage = urlParams['local'] != '1' && typeof(localStorage) != 'undefined';
|
||||
}
|
||||
catch (e)
|
||||
{
|
||||
// ignored
|
||||
}
|
||||
|
||||
var mxScriptsLoaded = false, mxWinLoaded = false;
|
||||
|
||||
function checkAllLoaded()
|
||||
{
|
||||
if (mxScriptsLoaded && mxWinLoaded)
|
||||
{
|
||||
App.main();
|
||||
}
|
||||
};
|
||||
|
||||
var t0 = new Date();
|
||||
|
||||
// Changes paths for local development environment
|
||||
if (urlParams['dev'] == '1')
|
||||
{
|
||||
mxForceIncludes = false;
|
||||
mxscript(drawDevUrl + 'js/PreConfig.js');
|
||||
mxscript(drawDevUrl + 'js/diagramly/Init.js');
|
||||
mxscript(geBasePath + '/Init.js');
|
||||
mxscript(mxBasePath + '/mxClient.js');
|
||||
mxscript(drawDevUrl + 'js/PostConfig.js');
|
||||
}
|
||||
else
|
||||
{
|
||||
(function()
|
||||
{
|
||||
var hostName = window.location.hostname;
|
||||
|
||||
// Supported domains are *.draw.io and the packaged version in Quip
|
||||
var supportedDomain = (hostName.substring(hostName.length - 8, hostName.length) === '.draw.io') ||
|
||||
(hostName.substring(hostName.length - 13, hostName.length) === '.kkview.cn');
|
||||
|
||||
function loadAppJS()
|
||||
{
|
||||
mxscript('js/app.min.js', function()
|
||||
{
|
||||
mxScriptsLoaded = true;
|
||||
checkAllLoaded();
|
||||
|
||||
// Electron
|
||||
if (mxIsElectron)
|
||||
{
|
||||
mxscript('js/diagramly/DesktopLibrary.js', function()
|
||||
{
|
||||
mxscript('js/diagramly/ElectronApp.js', function()
|
||||
{
|
||||
mxscript('js/extensions.min.js', function()
|
||||
{
|
||||
mxscript('js/stencils.min.js', function()
|
||||
{
|
||||
mxscript('js/shapes-14-6-5.min.js', function()
|
||||
{
|
||||
mxscript('js/PostConfig.js');
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
else if (!supportedDomain)
|
||||
{
|
||||
mxscript('js/PostConfig.js');
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
if (!supportedDomain || mxIsElectron)
|
||||
{
|
||||
mxscript('js/PreConfig.js', loadAppJS);
|
||||
}
|
||||
else
|
||||
{
|
||||
loadAppJS();
|
||||
}
|
||||
})();
|
||||
}
|
||||
|
||||
// Adds basic error handling
|
||||
window.onerror = function()
|
||||
{
|
||||
var status = document.getElementById('geStatus');
|
||||
|
||||
if (status != null)
|
||||
{
|
||||
status.innerHTML = 'Page could not be loaded. Please try refreshing.';
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<link rel="stylesheet" type="text/css" href="styles/grapheditor.css">
|
||||
|
||||
<link rel="shortcut icon" href="favicon.ico">
|
||||
<style type="text/css">
|
||||
body { overflow:hidden; }
|
||||
div.picker { z-index: 10007; }
|
||||
.geSidebarContainer .geTitle input {
|
||||
font-size:8pt;
|
||||
color:#606060;
|
||||
}
|
||||
.geBlock {
|
||||
z-index:-3;
|
||||
margin:100px;
|
||||
margin-top:40px;
|
||||
margin-bottom:30px;
|
||||
padding:20px;
|
||||
text-align:center;
|
||||
min-width:50%;
|
||||
}
|
||||
.geBlock h1, .geBlock h2 {
|
||||
margin-top:0px;
|
||||
padding-top:0px;
|
||||
}
|
||||
.geEditor *:not(.geScrollable)::-webkit-scrollbar {
|
||||
width:10px;
|
||||
height:10px;
|
||||
}
|
||||
.geEditor ::-webkit-scrollbar-track {
|
||||
background-clip:padding-box;
|
||||
border:solid transparent;
|
||||
border-width:1px;
|
||||
}
|
||||
.geEditor ::-webkit-scrollbar-corner {
|
||||
background-color:transparent;
|
||||
}
|
||||
.geEditor ::-webkit-scrollbar-thumb {
|
||||
background-color:rgba(0,0,0,.1);
|
||||
background-clip:padding-box;
|
||||
border:solid transparent;
|
||||
border-radius:10px;
|
||||
}
|
||||
.geEditor ::-webkit-scrollbar-thumb:hover {
|
||||
background-color:rgba(0,0,0,.4);
|
||||
}
|
||||
.geTemplate {
|
||||
border:1px solid transparent;
|
||||
display:inline-block;
|
||||
_display:inline;
|
||||
vertical-align:top;
|
||||
border-radius:3px;
|
||||
overflow:hidden;
|
||||
font-size:14pt;
|
||||
cursor:pointer;
|
||||
margin:5px;
|
||||
}
|
||||
</style>
|
||||
<!-- Workaround for binary XHR in IE 9/10, see App.loadUrl -->
|
||||
<!--[if (IE 9)|(IE 10)]><!-->
|
||||
<script type="text/vbscript">
|
||||
Function mxUtilsBinaryToArray(Binary)
|
||||
Dim i
|
||||
ReDim byteArray(LenB(Binary))
|
||||
For i = 1 To LenB(Binary)
|
||||
byteArray(i-1) = AscB(MidB(Binary, i, 1))
|
||||
Next
|
||||
mxUtilsBinaryToArray = byteArray
|
||||
End Function
|
||||
</script>
|
||||
<!--<![endif]-->
|
||||
</head>
|
||||
<body class="geEditor">
|
||||
|
||||
<script type="text/javascript">
|
||||
/**
|
||||
* Main
|
||||
*/
|
||||
if (urlParams['dev'] != '1' && typeof document.createElement('canvas').getContext === "function")
|
||||
{
|
||||
window.addEventListener('load', function()
|
||||
{
|
||||
mxWinLoaded = true;
|
||||
checkAllLoaded();
|
||||
});
|
||||
}
|
||||
else
|
||||
{
|
||||
App.main();
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,8 @@
|
|||
/**
|
||||
* Copyright (c) 2006-2020, JGraph Ltd
|
||||
* Copyright (c) 2006-2020, draw.io AG
|
||||
*/
|
||||
// null'ing of global vars need to be after init.js
|
||||
window.VSD_CONVERT_URL = null;
|
||||
window.EMF_CONVERT_URL = null;
|
||||
window.ICONSEARCH_PATH = null;
|
|
@ -0,0 +1,13 @@
|
|||
/**
|
||||
* Copyright (c) 2006-2020, JGraph Ltd
|
||||
* Copyright (c) 2006-2020, draw.io AG
|
||||
*/
|
||||
// Overrides of global vars need to be pre-loaded
|
||||
window.EXPORT_URL = 'REPLACE_WITH_YOUR_IMAGE_SERVER';
|
||||
window.PLANT_URL = 'REPLACE_WITH_YOUR_PLANTUML_SERVER';
|
||||
window.DRAWIO_BASE_URL = null; // Replace with path to base of deployment, e.g. https://www.example.com/folder
|
||||
window.DRAWIO_VIEWER_URL = null; // Replace your path to the viewer js, e.g. https://www.example.com/js/viewer.min.js
|
||||
window.DRAWIO_LIGHTBOX_URL = null; // Replace with your lightbox URL, eg. https://www.example.com
|
||||
window.DRAW_MATH_URL = 'math/es5';
|
||||
window.DRAWIO_CONFIG = null; // Replace with your custom draw.io configurations. For more details, https://www.diagrams.net/doc/faq/configure-diagram-editor
|
||||
urlParams['sync'] = 'manual';
|
|
@ -0,0 +1,146 @@
|
|||
div.mxRubberband {
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
border-color: #0000FF;
|
||||
background: #0077FF;
|
||||
}
|
||||
.mxCellEditor {
|
||||
background: url(data:image/gif;base64,R0lGODlhMAAwAIAAAP///wAAACH5BAEAAAAALAAAAAAwADAAAAIxhI+py+0Po5y02ouz3rz7D4biSJbmiabqyrbuC8fyTNf2jef6zvf+DwwKh8Si8egpAAA7);
|
||||
_background: url('../images/transparent.gif');
|
||||
border-color: transparent;
|
||||
border-style: solid;
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
overflow: visible;
|
||||
word-wrap: normal;
|
||||
border-width: 0;
|
||||
min-width: 1px;
|
||||
resize: none;
|
||||
padding: 0px;
|
||||
margin: 0px;
|
||||
}
|
||||
.mxPlainTextEditor * {
|
||||
padding: 0px;
|
||||
margin: 0px;
|
||||
}
|
||||
div.mxWindow {
|
||||
-webkit-box-shadow: 3px 3px 12px #C0C0C0;
|
||||
-moz-box-shadow: 3px 3px 12px #C0C0C0;
|
||||
box-shadow: 3px 3px 12px #C0C0C0;
|
||||
background: url(data:image/gif;base64,R0lGODlhGgAUAIAAAOzs7PDw8CH5BAAAAAAALAAAAAAaABQAAAIijI+py70Ao5y02lud3lzhD4ZUR5aPiKajyZbqq7YyB9dhAQA7);
|
||||
_background: url('../images/window.gif');
|
||||
border:1px solid #c3c3c3;
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
z-index: 1;
|
||||
}
|
||||
table.mxWindow {
|
||||
border-collapse: collapse;
|
||||
table-layout: fixed;
|
||||
font-family: Arial;
|
||||
font-size: 8pt;
|
||||
}
|
||||
td.mxWindowTitle {
|
||||
background: url(data:image/gif;base64,R0lGODlhFwAXAMQAANfX18rKyuHh4c7OzsDAwMHBwc/Pz+Li4uTk5NHR0dvb2+jo6O/v79/f3/n5+dnZ2dbW1uPj44yMjNPT0+Dg4N3d3ebm5szMzAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAAAAAAALAAAAAAXABcAAAWQICESxWiW5Ck6bOu+MMvMdG3f86LvfO/rlqBwSCwaj8ikUohoOp/QaDNCrVqvWKpgezhsv+AwmEIum89ocmPNbrvf64p8Tq/b5Yq8fs/v5x+AgYKDhIAAh4iJiouHEI6PkJGSjhOVlpeYmZUJnJ2en6CcBqMDpaanqKgXq6ytrq+rAbKztLW2shK5uru8vbkhADs=) repeat-x;
|
||||
_background: url('../images/window-title.gif') repeat-x;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
overflow: hidden;
|
||||
height: 13px;
|
||||
padding: 2px;
|
||||
padding-top: 4px;
|
||||
padding-bottom: 6px;
|
||||
color: black;
|
||||
}
|
||||
td.mxWindowPane {
|
||||
vertical-align: top;
|
||||
padding: 0px;
|
||||
}
|
||||
div.mxWindowPane {
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
img.mxToolbarItem {
|
||||
margin-right: 6px;
|
||||
margin-bottom: 6px;
|
||||
border-width: 1px;
|
||||
}
|
||||
select.mxToolbarCombo {
|
||||
vertical-align: top;
|
||||
border-style: inset;
|
||||
border-width: 2px;
|
||||
}
|
||||
div.mxToolbarComboContainer {
|
||||
padding: 2px;
|
||||
}
|
||||
img.mxToolbarMode {
|
||||
margin: 2px;
|
||||
margin-right: 4px;
|
||||
margin-bottom: 4px;
|
||||
border-width: 0px;
|
||||
}
|
||||
img.mxToolbarModeSelected {
|
||||
margin: 0px;
|
||||
margin-right: 2px;
|
||||
margin-bottom: 2px;
|
||||
border-width: 2px;
|
||||
border-style: inset;
|
||||
}
|
||||
div.mxTooltip {
|
||||
-webkit-box-shadow: 3px 3px 12px #C0C0C0;
|
||||
-moz-box-shadow: 3px 3px 12px #C0C0C0;
|
||||
box-shadow: 3px 3px 12px #C0C0C0;
|
||||
background: #FFFFCC;
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
border-color: black;
|
||||
font-family: Arial;
|
||||
font-size: 8pt;
|
||||
position: absolute;
|
||||
cursor: default;
|
||||
padding: 4px;
|
||||
color: black;
|
||||
}
|
||||
div.mxPopupMenu {
|
||||
-webkit-box-shadow: 3px 3px 12px #C0C0C0;
|
||||
-moz-box-shadow: 3px 3px 12px #C0C0C0;
|
||||
box-shadow: 3px 3px 12px #C0C0C0;
|
||||
background: url(data:image/gif;base64,R0lGODlhGgAUAIAAAOzs7PDw8CH5BAAAAAAALAAAAAAaABQAAAIijI+py70Ao5y02lud3lzhD4ZUR5aPiKajyZbqq7YyB9dhAQA7);
|
||||
_background: url('../images/window.gif');
|
||||
position: absolute;
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
border-color: black;
|
||||
}
|
||||
table.mxPopupMenu {
|
||||
border-collapse: collapse;
|
||||
margin-top: 1px;
|
||||
margin-bottom: 1px;
|
||||
}
|
||||
tr.mxPopupMenuItem {
|
||||
color: black;
|
||||
cursor: pointer;
|
||||
}
|
||||
tr.mxPopupMenuItemHover {
|
||||
background-color: #000066;
|
||||
color: #FFFFFF;
|
||||
cursor: pointer;
|
||||
}
|
||||
td.mxPopupMenuItem {
|
||||
padding: 2px 30px 2px 10px;
|
||||
white-space: nowrap;
|
||||
font-family: Arial;
|
||||
font-size: 8pt;
|
||||
}
|
||||
td.mxPopupMenuIcon {
|
||||
background-color: #D0D0D0;
|
||||
padding: 2px 4px 2px 4px;
|
||||
}
|
||||
.mxDisabled {
|
||||
opacity: 0.2 !important;
|
||||
cursor:default !important;
|
||||
}
|
|
@ -0,0 +1,18 @@
|
|||
div.mxTooltip {
|
||||
filter:progid:DXImageTransform.Microsoft.DropShadow(OffX=4, OffY=4,
|
||||
Color='#A2A2A2', Positive='true');
|
||||
}
|
||||
div.mxPopupMenu {
|
||||
filter:progid:DXImageTransform.Microsoft.DropShadow(OffX=4, OffY=4,
|
||||
Color='#C0C0C0', Positive='true');
|
||||
}
|
||||
div.mxWindow {
|
||||
_filter:progid:DXImageTransform.Microsoft.DropShadow(OffX=4, OffY=4,
|
||||
Color='#C0C0C0', Positive='true');
|
||||
}
|
||||
td.mxWindowTitle {
|
||||
_height: 23px;
|
||||
}
|
||||
.mxDisabled {
|
||||
filter:alpha(opacity=20) !important;
|
||||
}
|
After Width: | Height: | Size: 137 B |
After Width: | Height: | Size: 70 B |
After Width: | Height: | Size: 877 B |
After Width: | Height: | Size: 907 B |
After Width: | Height: | Size: 878 B |
After Width: | Height: | Size: 843 B |
After Width: | Height: | Size: 64 B |
After Width: | Height: | Size: 845 B |
After Width: | Height: | Size: 55 B |
After Width: | Height: | Size: 74 B |
After Width: | Height: | Size: 146 B |
After Width: | Height: | Size: 56 B |
After Width: | Height: | Size: 90 B |
After Width: | Height: | Size: 276 B |
After Width: | Height: | Size: 425 B |
After Width: | Height: | Size: 275 B |
After Width: | Height: | Size: 75 B |
|
@ -0,0 +1,215 @@
|
|||
html body .geToolbarContainer .geButton, html body .geToolbarContainer .geLabel {
|
||||
padding:3px 5px 5px 5px;
|
||||
position: relative;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
border-radius:3px;
|
||||
}
|
||||
html body .geMenubarContainer .geBigButton {
|
||||
margin-top: 4px;
|
||||
}
|
||||
html body .geBigStandardButton:active, .geSidebarContainer .geTitle:active {
|
||||
background-color: #DEEBFF;
|
||||
color: #0052CC;
|
||||
}
|
||||
body .geToolbarContainer .geButton:active, body .geToolbarContainer .geLabel:active {
|
||||
background-color: #DEEBFF;
|
||||
color: #0052CC;
|
||||
}
|
||||
body > .geToolbarContainer .geLabel, body > .geToolbarContainer .geButton {
|
||||
-webkit-box-shadow: none !important;
|
||||
-moz-box-shadow: none !important;
|
||||
box-shadow: none !important;
|
||||
border: 1px solid transparent !important;
|
||||
}
|
||||
body > .geToolbarContainer {
|
||||
background: #f5f5f5 !important;
|
||||
border-bottom: 1px solid #ccc !important;
|
||||
-webkit-box-shadow: none !important;
|
||||
-moz-box-shadow: none !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
body > .geToolbarContainer > .geToolbar {
|
||||
padding-top:4px !important;
|
||||
}
|
||||
body > .geToolbarContainer > .geToolbar .geSeparator {
|
||||
width:1px !important;
|
||||
background:#cccccc !important;
|
||||
margin-top:3px;
|
||||
height:24px;
|
||||
}
|
||||
.geSidebarContainer .geToolbarContainer .geButton {
|
||||
padding:0px 2px 4px 2px;
|
||||
}
|
||||
.geToolbarContainer .geLabel {
|
||||
height:18px;
|
||||
_height:31px;
|
||||
}
|
||||
html body .geStatus .geStatusAlert {
|
||||
color:#ffffff !important;
|
||||
font-size:12px;
|
||||
border:none;
|
||||
border-radius:6px;
|
||||
text-shadow: rgb(41, 89, 137) 0px 1px 0px;
|
||||
background-color:#428bca;
|
||||
background-image:linear-gradient(rgb(70, 135, 206) 0px, rgb(48, 104, 162) 100%);
|
||||
-webkit-box-shadow: rgba(255, 255, 255, 0.0980392) 0px 1px 0px 0px inset, rgba(0, 0, 0, 0.2) 0px 1px 1px 0px;
|
||||
-moz-box-shadow: rgba(255, 255, 255, 0.0980392) 0px 1px 0px 0px inset, rgba(0, 0, 0, 0.2) 0px 1px 1px 0px;
|
||||
box-shadow: rgba(255, 255, 255, 0.0980392) 0px 1px 0px 0px inset, rgba(0, 0, 0, 0.2) 0px 1px 1px 0px;
|
||||
}
|
||||
html body .geStatus .geStatusAlert:hover {
|
||||
background-color: #2d6ca2;
|
||||
background-image: linear-gradient(rgb(90, 148, 211) 0px, rgb(54, 115, 181) 100%);
|
||||
}
|
||||
html body .geStatus .geStatusMessage {
|
||||
color:#ffffff !important;
|
||||
font-size:12px;
|
||||
border:none;
|
||||
border-radius:6px;
|
||||
text-shadow: rgb(41, 89, 137) 0px 1px 0px;
|
||||
background-color:#428bca;
|
||||
background-image:linear-gradient(rgb(70, 135, 206) 0px, rgb(48, 104, 162) 100%);
|
||||
-webkit-box-shadow: rgba(255, 255, 255, 0.0980392) 0px 1px 0px 0px inset, rgba(0, 0, 0, 0.2) 0px 1px 1px 0px;
|
||||
-moz-box-shadow: rgba(255, 255, 255, 0.0980392) 0px 1px 0px 0px inset, rgba(0, 0, 0, 0.2) 0px 1px 1px 0px;
|
||||
box-shadow: rgba(255, 255, 255, 0.0980392) 0px 1px 0px 0px inset, rgba(0, 0, 0, 0.2) 0px 1px 1px 0px;
|
||||
}
|
||||
html body .geStatus .geStatusMessage:hover {
|
||||
background-color: #2d6ca2;
|
||||
background-image: linear-gradient(rgb(90, 148, 211) 0px, rgb(54, 115, 181) 100%);
|
||||
}
|
||||
html body div.mxWindow .geToolbarContainer {
|
||||
font-size:11px !important;
|
||||
color: #000000 !important;
|
||||
-webkit-box-shadow: none !important;
|
||||
-moz-box-shadow: none !important;
|
||||
box-shadow: none !important;
|
||||
border-width: 0px 0px 1px !important;
|
||||
border-color: rgb(195, 195, 195) !important;
|
||||
border-style: solid !important;
|
||||
border-bottom:1px solid #e0e0e0;
|
||||
}
|
||||
html body div.mxWindow .geButton, .mxWindow .geLabel {
|
||||
-webkit-box-shadow: none !important;
|
||||
-moz-box-shadow: none !important;
|
||||
box-shadow: none !important;
|
||||
background-image: none !important;
|
||||
border:1px solid transparent !important;
|
||||
}
|
||||
div.mxWindow .geButton {
|
||||
margin:1px !important;
|
||||
}
|
||||
div.mxWindow .geLabel {
|
||||
padding:3px 5px 3px 5px !important;
|
||||
margin:2px;
|
||||
}
|
||||
div.mxWindow .geButton:hover, .mxWindow .geLabel:hover {
|
||||
-webkit-box-shadow: none !important;
|
||||
-moz-box-shadow: none !important;
|
||||
box-shadow: none !important;
|
||||
background: none !important;
|
||||
border:1px solid gray;
|
||||
}
|
||||
div.mxWindow .geButton:active, .mxWindow .geLabel:active {
|
||||
-webkit-box-shadow: none !important;
|
||||
-moz-box-shadow: none !important;
|
||||
box-shadow: none !important;
|
||||
background-image: none !important;
|
||||
border:1px solid black;
|
||||
}
|
||||
body > .geToolbarContainer .geButton {
|
||||
margin:0px -1px 0px 0px !important;
|
||||
height:20px;
|
||||
}
|
||||
html body .geSidebarTooltip, .geSidebarTooltipImage {
|
||||
z-index:2;
|
||||
}
|
||||
html body .geSidebarContainer .geTitle {
|
||||
font-size:13px;
|
||||
padding:8px 0px 8px 16px;
|
||||
}
|
||||
html body .geMenubarContainer * {
|
||||
color: #DEEBFF;
|
||||
}
|
||||
html body .geMenubarContainer .geStatus {
|
||||
color: rgb(179, 179, 179);
|
||||
}
|
||||
.geMenubarContainer .geItem:hover:not(.geStatus) {
|
||||
background-color: rgba(9, 30, 66, 0.48) !important;
|
||||
}
|
||||
html body .geToolbarContainer .geLabel {
|
||||
margin:0px;
|
||||
padding:6px 20px 4px 10px !important;
|
||||
}
|
||||
.geToolbar .geSeparator {
|
||||
width:0px !important;
|
||||
}
|
||||
.geMenubarContainer .geItem, .geToolbar .geButton, .geToolbar .geLabel, .geSidebar, .geSidebarContainer .geTitle, .geSidebar .geItem, .mxPopupMenuItem {
|
||||
-webkit-transition: none;
|
||||
-moz-transition: none;
|
||||
-o-transition: none;
|
||||
-ms-transition: none;
|
||||
transition: none;
|
||||
}
|
||||
html body .geMenubarContainer {
|
||||
background-color: #0049B0;
|
||||
color: #ffffff;
|
||||
font-size: 14px;
|
||||
}
|
||||
html body .geMenubar > .geItem {
|
||||
padding-left:14px;
|
||||
padding-right:15px;
|
||||
}
|
||||
html body .geSidebarContainer .geToolbarContainer {
|
||||
-webkit-box-shadow: none;
|
||||
-moz-box-shadow: none;
|
||||
box-shadow: none;
|
||||
border:none;
|
||||
}
|
||||
html body .geSidebarContainer .geToolbarContainer .geButton {
|
||||
margin:2px !important;
|
||||
height:20px !important;
|
||||
}
|
||||
html body .geSidebarContainer .geToolbarContainer .geLabel {
|
||||
margin:2px !important;
|
||||
padding:4px !important;
|
||||
}
|
||||
html body .geToolbar {
|
||||
margin:0px;
|
||||
padding:8px 10px 0px 10px;
|
||||
-webkit-box-shadow:none;
|
||||
-moz-box-shadow:none;
|
||||
box-shadow:none;
|
||||
border:none;
|
||||
}
|
||||
html body .geMenubarContainer .mxDisabled {
|
||||
opacity: 1;
|
||||
color: rgb(179, 179, 179);
|
||||
}
|
||||
html .geButtonContainer {
|
||||
padding-right:10px;
|
||||
}
|
||||
.geDialogTitle {
|
||||
box-sizing:border-box;
|
||||
white-space:nowrap;
|
||||
background:rgb(32, 80, 129);
|
||||
border-bottom:1px solid rgb(192, 192, 192);
|
||||
font-size:15px;
|
||||
font-weight:bold;
|
||||
text-align:center;
|
||||
color:white;
|
||||
}
|
||||
.geDialogFooter {
|
||||
background:whiteSmoke;
|
||||
white-space:nowrap;
|
||||
text-align:right;
|
||||
box-sizing:border-box;
|
||||
border-top:1px solid #e5e5e5;
|
||||
color:darkGray;
|
||||
}
|
||||
html .geNotification-bell {
|
||||
opacity: 1;
|
||||
}
|
||||
html .geNotification-bell * {
|
||||
background-color: #DEEBFF;
|
||||
box-shadow: 0px 0px 10px #DEEBFF;
|
||||
}
|
|
@ -0,0 +1,109 @@
|
|||
<mxStylesheet>
|
||||
<add as="defaultVertex">
|
||||
<add as="shape" value="label"/>
|
||||
<add as="perimeter" value="rectanglePerimeter"/>
|
||||
<add as="fontSize" value="12"/>
|
||||
<add as="fontFamily" value="Helvetica"/>
|
||||
<add as="align" value="center"/>
|
||||
<add as="verticalAlign" value="middle"/>
|
||||
<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="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="default"/>
|
||||
<add as="fontColor" value="default"/>
|
||||
</add>
|
||||
<add as="text">
|
||||
<add as="fillColor" value="none"/>
|
||||
<add as="gradientColor" value="none"/>
|
||||
<add as="strokeColor" value="none"/>
|
||||
<add as="align" value="left"/>
|
||||
<add as="verticalAlign" value="top"/>
|
||||
</add>
|
||||
<add as="edgeLabel" extend="text">
|
||||
<add as="labelBackgroundColor" value="default"/>
|
||||
<add as="fontSize" value="11"/>
|
||||
</add>
|
||||
<add as="label">
|
||||
<add as="fontStyle" value="1"/>
|
||||
<add as="align" value="left"/>
|
||||
<add as="verticalAlign" value="middle"/>
|
||||
<add as="spacing" value="2"/>
|
||||
<add as="spacingLeft" value="52"/>
|
||||
<add as="imageWidth" value="42"/>
|
||||
<add as="imageHeight" value="42"/>
|
||||
<add as="rounded" value="1"/>
|
||||
</add>
|
||||
<add as="icon" extend="label">
|
||||
<add as="align" value="center"/>
|
||||
<add as="imageAlign" value="center"/>
|
||||
<add as="verticalLabelPosition" value="bottom"/>
|
||||
<add as="verticalAlign" value="top"/>
|
||||
<add as="spacingTop" value="4"/>
|
||||
<add as="labelBackgroundColor" value="default"/>
|
||||
<add as="spacing" value="0"/>
|
||||
<add as="spacingLeft" value="0"/>
|
||||
<add as="spacingTop" value="6"/>
|
||||
<add as="fontStyle" value="0"/>
|
||||
<add as="imageWidth" value="48"/>
|
||||
<add as="imageHeight" value="48"/>
|
||||
</add>
|
||||
<add as="swimlane">
|
||||
<add as="shape" value="swimlane"/>
|
||||
<add as="fontSize" value="12"/>
|
||||
<add as="fontStyle" value="1"/>
|
||||
<add as="startSize" value="23"/>
|
||||
</add>
|
||||
<add as="group">
|
||||
<add as="verticalAlign" value="top"/>
|
||||
<add as="fillColor" value="none"/>
|
||||
<add as="strokeColor" value="none"/>
|
||||
<add as="gradientColor" value="none"/>
|
||||
<add as="pointerEvents" value="0"/>
|
||||
</add>
|
||||
<add as="ellipse">
|
||||
<add as="shape" value="ellipse"/>
|
||||
<add as="perimeter" value="ellipsePerimeter"/>
|
||||
</add>
|
||||
<add as="rhombus">
|
||||
<add as="shape" value="rhombus"/>
|
||||
<add as="perimeter" value="rhombusPerimeter"/>
|
||||
</add>
|
||||
<add as="triangle">
|
||||
<add as="shape" value="triangle"/>
|
||||
<add as="perimeter" value="trianglePerimeter"/>
|
||||
</add>
|
||||
<add as="line">
|
||||
<add as="shape" value="line"/>
|
||||
<add as="strokeWidth" value="4"/>
|
||||
<add as="labelBackgroundColor" value="default"/>
|
||||
<add as="verticalAlign" value="top"/>
|
||||
<add as="spacingTop" value="8"/>
|
||||
</add>
|
||||
<add as="image">
|
||||
<add as="shape" value="image"/>
|
||||
<add as="labelBackgroundColor" value="default"/>
|
||||
<add as="verticalAlign" value="top"/>
|
||||
<add as="verticalLabelPosition" value="bottom"/>
|
||||
</add>
|
||||
<add as="roundImage" extend="image">
|
||||
<add as="perimeter" value="ellipsePerimeter"/>
|
||||
</add>
|
||||
<add as="rhombusImage" extend="image">
|
||||
<add as="perimeter" value="rhombusPerimeter"/>
|
||||
</add>
|
||||
<add as="arrow">
|
||||
<add as="shape" value="arrow"/>
|
||||
<add as="edgeStyle" value="none"/>
|
||||
<add as="fillColor" value="default"/>
|
||||
</add>
|
||||
</mxStylesheet>
|
|
@ -0,0 +1,281 @@
|
|||
:root {
|
||||
--dark-color: #18141D;
|
||||
--header-color: #363238;
|
||||
--panel-color: #2A252F;
|
||||
--text-color: #888888;
|
||||
--border-color: #505759;
|
||||
}
|
||||
.geEditor * {
|
||||
border-color:#000;
|
||||
}
|
||||
html body .geStatus > *, html body .geUser {
|
||||
color:var(--text-color);
|
||||
}
|
||||
html body .geDiagramContainer {
|
||||
background-color:var(--dark-color);
|
||||
}
|
||||
html body div.geMenubarContainer, html body .geFormatContainer,
|
||||
html body div.geMenubarContainer .geStatus:hover {
|
||||
background-color:var(--panel-color);
|
||||
border-color:#000000;
|
||||
}
|
||||
html body .geActiveItem {
|
||||
background-color:#e0e0e0;
|
||||
}
|
||||
html body .mxCellEditor {
|
||||
color: #f0f0f0;
|
||||
}
|
||||
html body.geEditor div.mxPopupMenu {
|
||||
border:1px solid var(--border-color);
|
||||
background:var(--panel-color);
|
||||
box-shadow:none;
|
||||
}
|
||||
.geEditor .geTabItem {
|
||||
background:var(--panel-color);
|
||||
border-color:#000000;
|
||||
}
|
||||
.geTabContainer {
|
||||
border-left-color:#000000;
|
||||
border-right-color:#000000;
|
||||
}
|
||||
.geTabContainer div {
|
||||
border-color:var(--dark-color);
|
||||
}
|
||||
html body .geShapePicker {
|
||||
box-shadow:none;
|
||||
}
|
||||
html body .geTabContainer div.geActivePage, html body .geRuler {
|
||||
background:var(--dark-color);
|
||||
}
|
||||
.geSearchSidebar input, .geBtnStepper, .geBtnUp,
|
||||
html body a.geStatus .geStatusBox {
|
||||
border-color: var(--border-color);
|
||||
}
|
||||
html body.geEditor div.mxPopupMenu hr {
|
||||
background-color:var(--border-color);
|
||||
}
|
||||
html body .geDragPreview {
|
||||
border: 1px dashed #cccccc;
|
||||
}
|
||||
html body .geMenubarContainer .geItem:active, html .geSidebarContainer button:active {
|
||||
opacity: 0.7;
|
||||
}
|
||||
html body, html body .geFooterContainer, html body #geFooterItem1, html body textarea,
|
||||
html body .mxWindowTitle, html body .geDialogTitle, html body .geDialogFooter,
|
||||
html .geEditor div.mxTooltip, html .geHint
|
||||
{
|
||||
background: var(--panel-color);
|
||||
color:#c0c0c0;
|
||||
}
|
||||
html > body > div > div.geToolbarContainer.geSimpleMainMenu,
|
||||
html > body > div > div.geToolbarContainer.geSimpleMainMenu .geToolbarContainer {
|
||||
background:var(--header-color);
|
||||
}
|
||||
html > body > div > div.geToolbarContainer.geSimpleMainMenu,
|
||||
html body .mxWindowTitle, .geDialogTitle, .geDialogFooter {
|
||||
border-color:black !important;
|
||||
}
|
||||
html body .geFooterContainer a, html body .geDiagramContainer a, html body .geStatus a {
|
||||
color:#337ab7;
|
||||
}
|
||||
html body div.mxRubberband {
|
||||
border:1px dashed #ffffff !important;
|
||||
background:var(--border-color) !important;
|
||||
}
|
||||
html body .geTemplate {
|
||||
color:#000000;
|
||||
}
|
||||
html body .geSidebar {
|
||||
opacity:0.7;
|
||||
}
|
||||
html body.geEditor .geSidebarContainer div.geDropTarget {
|
||||
color:#767676;
|
||||
border-color:#767676;
|
||||
}
|
||||
html body.geEditor .gePrimaryBtn:not([disabled]),
|
||||
html body.geEditor .geBigButton:not([disabled]) {
|
||||
background:var(--header-color);
|
||||
border: 1px solid var(--border-color);
|
||||
color:#aaaaaa;
|
||||
}
|
||||
html body.geEditor .geBtn, html body.geEditor button,
|
||||
html body.geEditor button:hover:not([disabled]),
|
||||
html body.geEditor button:focus, html body.geEditor select,
|
||||
html body.geEditor .geColorBtn {
|
||||
background:none;
|
||||
border: 1px solid var(--border-color);
|
||||
color:#aaaaaa;
|
||||
}
|
||||
html body .geBtn:hover:not([disabled]) {
|
||||
color: #c0c0c0;
|
||||
}
|
||||
html body.geEditor button:hover:not([disabled]),
|
||||
html body.geEditor select:hover:not([disabled]),
|
||||
html body.geEditor .geColorBtn:hover:not([disabled]) {
|
||||
background:var(--dark-color);
|
||||
border: 1px solid var(--border-color);
|
||||
}
|
||||
html body.geEditor .geSidebar, html body.geEditor .geSidebarContainer .geTitle, html body.geEditor input, html body.geEditor textarea,
|
||||
html body.geEditor .geBaseButton, html body.geEditor .geSidebarTooltip, html body.geEditor .geBaseButton, html body.geEditor select,
|
||||
html body.geEditor .geSidebarContainer .geDropTarget, html body.geEditor .geToolbarContainer {
|
||||
background:var(--panel-color);
|
||||
border-color:var(--dark-color);
|
||||
box-shadow:none;
|
||||
color:#aaaaaa;
|
||||
}
|
||||
html body.geEditor button, html body.geEditor input,
|
||||
html body.geEditor textarea, html body.geEditor select,
|
||||
.geInsertTablePicker, .geInsertTablePicker * {
|
||||
border-color:var(--border-color);
|
||||
}
|
||||
html body .geMenubarContainer .geToolbarContainer, html body div.geToolbarContainer, html body .geToolbar {
|
||||
border-color:#000000;
|
||||
box-shadow:none;
|
||||
}
|
||||
html body .geSketch .geToolbarContainer {
|
||||
border-style:none;
|
||||
}
|
||||
html body.geEditor .geColorBtn, html body .geToolbarContainer {
|
||||
box-shadow:none;
|
||||
}
|
||||
html body .geSidebarTooltip {
|
||||
border:1px solid var(--border-color);
|
||||
}
|
||||
html body .geSprite, html body .geSocialFooter img, html body .mxPopupMenuItem>img, .geAdaptiveAsset {
|
||||
filter:invert(100%);
|
||||
}
|
||||
.geAdaptiveAsset {
|
||||
color: #333333;
|
||||
}
|
||||
.geInverseAdaptiveAsset {
|
||||
filter:none !important
|
||||
}
|
||||
html body .geSidebarFooter {
|
||||
border-color:var(--dark-color);
|
||||
}
|
||||
html body .geFormatSection {
|
||||
border-bottom:1px solid var(--dark-color);
|
||||
border-color:var(--dark-color);
|
||||
}
|
||||
html body .geDiagramContainer {
|
||||
border-color:var(--border-color);
|
||||
}
|
||||
html body .geSidebarContainer a, html body .geMenubarContainer a, html body .geToolbar a {
|
||||
color:#cccccc;
|
||||
}
|
||||
html body .geMenubarMenu {
|
||||
border-color:var(--border-color) !important;
|
||||
}
|
||||
html body .geToolbarMenu, html body .geFooterContainer, html body .geFooterContainer td {
|
||||
border-color:var(--border-color);
|
||||
}
|
||||
html body .geFooterContainer a {
|
||||
background-color:none;
|
||||
}
|
||||
html body .geBigStandardButton {
|
||||
border: 1px solid var(--border-color);
|
||||
}
|
||||
html body .geFooterContainer td:hover, html body #geFooterItem1:hover, html body .geBigStandardButton:hover {
|
||||
background-color:#000000;
|
||||
}
|
||||
html body .geSidebarContainer, html body .geDiagramBackdrop {
|
||||
background:var(--panel-color);
|
||||
}
|
||||
html body .geBackgroundPage {
|
||||
box-shadow:none;
|
||||
}
|
||||
.gePropHeader, .gePropRow, .gePropRowDark, .gePropRowCell, .gePropRow>.gePropRowCell, .gePropRowAlt>.gePropRowCell, .gePropRowDark>.gePropRowCell, .gePropRowDarkAlt>.gePropRowCell {
|
||||
background:var(--panel-color) !important;
|
||||
border-color:var(--panel-color) !important;
|
||||
color:#cccccc !important;
|
||||
font-weight:normal !important;
|
||||
}
|
||||
html body tr.mxPopupMenuItem {
|
||||
color:#cccccc;
|
||||
}
|
||||
html body.geEditor table.mxPopupMenu tr.mxPopupMenuItemHover {
|
||||
background:var(--dark-color);
|
||||
color:#cccccc;
|
||||
}
|
||||
html body .geSidebarContainer .geTitle:hover, html body .geSidebarContainer .geItem:hover,
|
||||
html body .geMenubarContainer .geItem:hover, html body.geEditor .geBaseButton:hover {
|
||||
background:var(--dark-color);
|
||||
}
|
||||
html body .geToolbarContainer .geSeparator {
|
||||
background-color:var(--border-color);
|
||||
}
|
||||
html body .geVsplit, html body table.mxPopupMenu hr {
|
||||
border-color:var(--border-color);
|
||||
background-color:var(--dark-color);
|
||||
}
|
||||
html body .geHsplit {
|
||||
border-color:#000;
|
||||
}
|
||||
html body .geHsplit:hover {
|
||||
background-color:#000;
|
||||
}
|
||||
html body .geToolbarContainer .geButton:hover, html body .geToolbarContainer .geButton:active,
|
||||
html body .geToolbarContainer .geLabel:hover, html body .geToolbarContainer .geLabel:active,
|
||||
html body .geVsplit:hover, html .geSidebarContainer button:active:not([disabled]) {
|
||||
background-color:var(--dark-color);
|
||||
}
|
||||
html body .geToolbarContainer .geButton.geAdaptiveAsset:hover {
|
||||
background-color: #fff;
|
||||
}
|
||||
html body .geDialog, html body div.mxWindow {
|
||||
background:var(--panel-color);
|
||||
border-color:var(--header-color);
|
||||
}
|
||||
html body .geDialog {
|
||||
box-shadow:none;
|
||||
}
|
||||
.geHint {
|
||||
-webkit-box-shadow: 1px 1px 1px 0px #ccc;
|
||||
-moz-box-shadow: 1px 1px 1px 0px #ccc;
|
||||
box-shadow: 1px 1px 1px 0px #ccc;
|
||||
}
|
||||
html .geEditor ::-webkit-scrollbar-thumb {
|
||||
background-color: var(--header-color);
|
||||
}
|
||||
html .geEditor ::-webkit-scrollbar-thumb:hover, .geVsplit:hover {
|
||||
background-color:#a0a0a0;
|
||||
}
|
||||
html body a.geStatus .geStatusAlertOrange {
|
||||
background-color:rgb(187, 103, 0);
|
||||
border:rgb(240, 135, 5);
|
||||
}
|
||||
html body a.geStatus .geStatusAlert {
|
||||
background-color:#a20025;
|
||||
border:1px solid #bd002b;
|
||||
color:#fff !important;
|
||||
}
|
||||
html body a.geStatus .geStatusAlert:hover {
|
||||
background-color:#a20025;
|
||||
border-color:#bd002b;
|
||||
}
|
||||
html body .geCommentContainer {
|
||||
background-color: transparent;
|
||||
border-width: 1px;
|
||||
box-shadow: none;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
html .geNotification-bell * {
|
||||
background-color: #aaa;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
html .geNotification-count {
|
||||
color: #DEEBFF;
|
||||
}
|
||||
|
||||
html .geNotifPanel .header {
|
||||
height: 30px;
|
||||
width: 100%;
|
||||
background: #424242;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
.geNotifPanel .notifications {
|
||||
background-color: #707070;
|
||||
}
|
|
@ -0,0 +1,109 @@
|
|||
<mxStylesheet>
|
||||
<add as="defaultVertex">
|
||||
<add as="shape" value="label"/>
|
||||
<add as="perimeter" value="rectanglePerimeter"/>
|
||||
<add as="fontSize" value="12"/>
|
||||
<add as="fontFamily" value="Verdana"/>
|
||||
<add as="align" value="center"/>
|
||||
<add as="verticalAlign" value="middle"/>
|
||||
<add as="fillColor" value="#adc5ff"/>
|
||||
<add as="gradientColor" value="#7d85df"/>
|
||||
<add as="strokeColor" value="#5d65df"/>
|
||||
<add as="fontColor" value="#1d258f"/>
|
||||
</add>
|
||||
<add as="defaultEdge">
|
||||
<add as="shape" value="connector"/>
|
||||
<add as="labelBackgroundColor" value="#FFFFFF"/>
|
||||
<add as="endArrow" value="classic"/>
|
||||
<add as="fontSize" value="11"/>
|
||||
<add as="fontFamily" value="Verdana"/>
|
||||
<add as="align" value="center"/>
|
||||
<add as="verticalAlign" value="middle"/>
|
||||
<add as="labelBackgroundColor" value="#FFFFFF"/>
|
||||
<add as="rounded" value="1"/>
|
||||
<add as="strokeColor" value="#5d65df"/>
|
||||
<add as="fontColor" value="#1d258f"/>
|
||||
</add>
|
||||
<add as="text">
|
||||
<add as="fillColor" value="none"/>
|
||||
<add as="gradientColor" value="none"/>
|
||||
<add as="strokeColor" value="none"/>
|
||||
<add as="align" value="left"/>
|
||||
<add as="verticalAlign" value="top"/>
|
||||
</add>
|
||||
<add as="label">
|
||||
<add as="fontStyle" value="1"/>
|
||||
<add as="align" value="left"/>
|
||||
<add as="verticalAlign" value="middle"/>
|
||||
<add as="spacing" value="2"/>
|
||||
<add as="spacingLeft" value="50"/>
|
||||
<add as="imageWidth" value="42"/>
|
||||
<add as="imageHeight" value="42"/>
|
||||
<add as="rounded" value="1"/>
|
||||
<add as="shadow" value="1"/>
|
||||
<add as="glass" value="1"/>
|
||||
</add>
|
||||
<add as="icon" extend="label">
|
||||
<add as="align" value="center"/>
|
||||
<add as="imageAlign" value="center"/>
|
||||
<add as="verticalLabelPosition" value="bottom"/>
|
||||
<add as="verticalAlign" value="top"/>
|
||||
<add as="spacingTop" value="4"/>
|
||||
<add as="labelBackgroundColor" value="#FFFFFF"/>
|
||||
<add as="spacing" value="0"/>
|
||||
<add as="spacingLeft" value="0"/>
|
||||
<add as="spacingTop" value="6"/>
|
||||
<add as="fontStyle" value="0"/>
|
||||
<add as="imageWidth" value="48"/>
|
||||
<add as="imageHeight" value="48"/>
|
||||
</add>
|
||||
<add as="swimlane">
|
||||
<add as="shape" value="swimlane"/>
|
||||
<add as="fontSize" value="12"/>
|
||||
<add as="fontStyle" value="1"/>
|
||||
<add as="startSize" value="23"/>
|
||||
</add>
|
||||
<add as="group">
|
||||
<add as="verticalAlign" value="top"/>
|
||||
<add as="fillColor" value="none"/>
|
||||
<add as="strokeColor" value="none"/>
|
||||
<add as="gradientColor" value="none"/>
|
||||
</add>
|
||||
<add as="ellipse">
|
||||
<add as="shape" value="ellipse"/>
|
||||
<add as="perimeter" value="ellipsePerimeter"/>
|
||||
</add>
|
||||
<add as="rhombus">
|
||||
<add as="shape" value="rhombus"/>
|
||||
<add as="perimeter" value="rhombusPerimeter"/>
|
||||
</add>
|
||||
<add as="triangle">
|
||||
<add as="shape" value="triangle"/>
|
||||
<add as="perimeter" value="trianglePerimeter"/>
|
||||
</add>
|
||||
<add as="line">
|
||||
<add as="shape" value="line"/>
|
||||
<add as="strokeWidth" value="4"/>
|
||||
<add as="labelBackgroundColor" value="#FFFFFF"/>
|
||||
<add as="verticalAlign" value="top"/>
|
||||
<add as="spacingTop" value="8"/>
|
||||
</add>
|
||||
<add as="image">
|
||||
<add as="shape" value="image"/>
|
||||
<add as="labelBackgroundColor" value="white"/>
|
||||
<add as="verticalAlign" value="top"/>
|
||||
<add as="verticalLabelPosition" value="bottom"/>
|
||||
</add>
|
||||
<add as="roundImage" extend="image">
|
||||
<add as="perimeter" value="ellipsePerimeter"/>
|
||||
</add>
|
||||
<add as="rhombusImage" extend="image">
|
||||
<add as="perimeter" value="rhombusPerimeter"/>
|
||||
</add>
|
||||
<add as="arrow">
|
||||
<add as="shape" value="arrow"/>
|
||||
<add as="edgeStyle" value="none"/>
|
||||
<add as="fillColor" value="#adc5ff"/>
|
||||
<add as="gradientColor" value="#7d85df"/>
|
||||
</add>
|
||||
</mxStylesheet>
|
|
@ -0,0 +1,203 @@
|
|||
<mxStylesheet>
|
||||
<add as="defaultVertex">
|
||||
<add as="shape" value="label"/>
|
||||
<add as="perimeter" value="rectanglePerimeter"/>
|
||||
<add as="fontSize" value="12"/>
|
||||
<add as="fontFamily" value="Helvetica"/>
|
||||
<add as="align" value="center"/>
|
||||
<add as="verticalAlign" value="middle"/>
|
||||
<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="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="default"/>
|
||||
<add as="fontColor" value="default"/>
|
||||
</add>
|
||||
<add as="text">
|
||||
<add as="fillColor" value="none"/>
|
||||
<add as="gradientColor" value="none"/>
|
||||
<add as="strokeColor" value="none"/>
|
||||
<add as="align" value="left"/>
|
||||
<add as="verticalAlign" value="top"/>
|
||||
</add>
|
||||
<add as="edgeLabel" extend="text">
|
||||
<add as="labelBackgroundColor" value="default"/>
|
||||
<add as="fontSize" value="11"/>
|
||||
</add>
|
||||
<add as="label">
|
||||
<add as="fontStyle" value="1"/>
|
||||
<add as="align" value="left"/>
|
||||
<add as="verticalAlign" value="middle"/>
|
||||
<add as="spacing" value="2"/>
|
||||
<add as="spacingLeft" value="52"/>
|
||||
<add as="imageWidth" value="42"/>
|
||||
<add as="imageHeight" value="42"/>
|
||||
<add as="rounded" value="1"/>
|
||||
</add>
|
||||
<add as="icon" extend="label">
|
||||
<add as="align" value="center"/>
|
||||
<add as="imageAlign" value="center"/>
|
||||
<add as="verticalLabelPosition" value="bottom"/>
|
||||
<add as="verticalAlign" value="top"/>
|
||||
<add as="spacingTop" value="4"/>
|
||||
<add as="labelBackgroundColor" value="default"/>
|
||||
<add as="spacing" value="0"/>
|
||||
<add as="spacingLeft" value="0"/>
|
||||
<add as="spacingTop" value="6"/>
|
||||
<add as="fontStyle" value="0"/>
|
||||
<add as="imageWidth" value="48"/>
|
||||
<add as="imageHeight" value="48"/>
|
||||
</add>
|
||||
<add as="swimlane">
|
||||
<add as="shape" value="swimlane"/>
|
||||
<add as="fontSize" value="12"/>
|
||||
<add as="fontStyle" value="1"/>
|
||||
<add as="startSize" value="23"/>
|
||||
</add>
|
||||
<add as="group">
|
||||
<add as="verticalAlign" value="top"/>
|
||||
<add as="fillColor" value="none"/>
|
||||
<add as="strokeColor" value="none"/>
|
||||
<add as="gradientColor" value="none"/>
|
||||
<add as="pointerEvents" value="0"/>
|
||||
</add>
|
||||
<add as="ellipse">
|
||||
<add as="shape" value="ellipse"/>
|
||||
<add as="perimeter" value="ellipsePerimeter"/>
|
||||
</add>
|
||||
<add as="rhombus">
|
||||
<add as="shape" value="rhombus"/>
|
||||
<add as="perimeter" value="rhombusPerimeter"/>
|
||||
</add>
|
||||
<add as="triangle">
|
||||
<add as="shape" value="triangle"/>
|
||||
<add as="perimeter" value="trianglePerimeter"/>
|
||||
</add>
|
||||
<add as="line">
|
||||
<add as="shape" value="line"/>
|
||||
<add as="strokeWidth" value="4"/>
|
||||
<add as="labelBackgroundColor" value="default"/>
|
||||
<add as="verticalAlign" value="top"/>
|
||||
<add as="spacingTop" value="8"/>
|
||||
</add>
|
||||
<add as="image">
|
||||
<add as="shape" value="image"/>
|
||||
<add as="labelBackgroundColor" value="default"/>
|
||||
<add as="verticalAlign" value="top"/>
|
||||
<add as="verticalLabelPosition" value="bottom"/>
|
||||
</add>
|
||||
<add as="roundImage" extend="image">
|
||||
<add as="perimeter" value="ellipsePerimeter"/>
|
||||
</add>
|
||||
<add as="rhombusImage" extend="image">
|
||||
<add as="perimeter" value="rhombusPerimeter"/>
|
||||
</add>
|
||||
<add as="arrow">
|
||||
<add as="shape" value="arrow"/>
|
||||
<add as="edgeStyle" value="none"/>
|
||||
<add as="fillColor" value="default"/>
|
||||
</add>
|
||||
<add as="fancy">
|
||||
<add as="shadow" value="1"/>
|
||||
<add as="glass" value="1"/>
|
||||
</add>
|
||||
<add as="gray" extend="fancy">
|
||||
<add as="gradientColor" value="#B3B3B3"/>
|
||||
<add as="fillColor" value="#F5F5F5"/>
|
||||
<add as="strokeColor" value="#666666"/>
|
||||
</add>
|
||||
<add as="blue" extend="fancy">
|
||||
<add as="gradientColor" value="#7EA6E0"/>
|
||||
<add as="fillColor" value="#DAE8FC"/>
|
||||
<add as="strokeColor" value="#6C8EBF"/>
|
||||
</add>
|
||||
<add as="green" extend="fancy">
|
||||
<add as="gradientColor" value="#97D077"/>
|
||||
<add as="fillColor" value="#D5E8D4"/>
|
||||
<add as="strokeColor" value="#82B366"/>
|
||||
</add>
|
||||
<add as="turquoise" extend="fancy">
|
||||
<add as="gradientColor" value="#67AB9F"/>
|
||||
<add as="fillColor" value="#D5E8D4"/>
|
||||
<add as="strokeColor" value="#6A9153"/>
|
||||
</add>
|
||||
<add as="yellow" extend="fancy">
|
||||
<add as="gradientColor" value="#FFD966"/>
|
||||
<add as="fillColor" value="#FFF2CC"/>
|
||||
<add as="strokeColor" value="#D6B656"/>
|
||||
</add>
|
||||
<add as="orange" extend="fancy">
|
||||
<add as="gradientColor" value="#FFA500"/>
|
||||
<add as="fillColor" value="#FFCD28"/>
|
||||
<add as="strokeColor" value="#D79B00"/>
|
||||
</add>
|
||||
<add as="red" extend="fancy">
|
||||
<add as="gradientColor" value="#EA6B66"/>
|
||||
<add as="fillColor" value="#F8CECC"/>
|
||||
<add as="strokeColor" value="#B85450"/>
|
||||
</add>
|
||||
<add as="pink" extend="fancy">
|
||||
<add as="gradientColor" value="#B5739D"/>
|
||||
<add as="fillColor" value="#E6D0DE"/>
|
||||
<add as="strokeColor" value="#996185"/>
|
||||
</add>
|
||||
<add as="purple" extend="fancy">
|
||||
<add as="gradientColor" value="#8C6C9C"/>
|
||||
<add as="fillColor" value="#E1D5E7"/>
|
||||
<add as="strokeColor" value="#9673A6"/>
|
||||
</add>
|
||||
<add as="plain-gray">
|
||||
<add as="gradientColor" value="#B3B3B3"/>
|
||||
<add as="fillColor" value="#F5F5F5"/>
|
||||
<add as="strokeColor" value="#666666"/>
|
||||
</add>
|
||||
<add as="plain-blue">
|
||||
<add as="gradientColor" value="#7EA6E0"/>
|
||||
<add as="fillColor" value="#DAE8FC"/>
|
||||
<add as="strokeColor" value="#6C8EBF"/>
|
||||
</add>
|
||||
<add as="plain-green">
|
||||
<add as="gradientColor" value="#97D077"/>
|
||||
<add as="fillColor" value="#D5E8D4"/>
|
||||
<add as="strokeColor" value="#82B366"/>
|
||||
</add>
|
||||
<add as="plain-turquoise">
|
||||
<add as="gradientColor" value="#67AB9F"/>
|
||||
<add as="fillColor" value="#D5E8D4"/>
|
||||
<add as="strokeColor" value="#6A9153"/>
|
||||
</add>
|
||||
<add as="plain-yellow">
|
||||
<add as="gradientColor" value="#FFD966"/>
|
||||
<add as="fillColor" value="#FFF2CC"/>
|
||||
<add as="strokeColor" value="#D6B656"/>
|
||||
</add>
|
||||
<add as="plain-orange">
|
||||
<add as="gradientColor" value="#FFA500"/>
|
||||
<add as="fillColor" value="#FFCD28"/>
|
||||
<add as="strokeColor" value="#D79B00"/>
|
||||
</add>
|
||||
<add as="plain-red">
|
||||
<add as="gradientColor" value="#EA6B66"/>
|
||||
<add as="fillColor" value="#F8CECC"/>
|
||||
<add as="strokeColor" value="#B85450"/>
|
||||
</add>
|
||||
<add as="plain-pink">
|
||||
<add as="gradientColor" value="#B5739D"/>
|
||||
<add as="fillColor" value="#E6D0DE"/>
|
||||
<add as="strokeColor" value="#996185"/>
|
||||
</add>
|
||||
<add as="plain-purple">
|
||||
<add as="gradientColor" value="#8C6C9C"/>
|
||||
<add as="fillColor" value="#E1D5E7"/>
|
||||
<add as="strokeColor" value="#9673A6"/>
|
||||
</add>
|
||||
</mxStylesheet>
|
After Width: | Height: | Size: 113 B |