mirror of
https://github.com/ONLYOFFICE/desktop-sdk.git
synced 2026-03-31 10:23:12 +08:00
92 lines
2.5 KiB
HTML
92 lines
2.5 KiB
HTML
<!doctype html>
|
|
<html>
|
|
<head>
|
|
<title>Manage Plugins</title>
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
|
<script type='text/javascript' src='../v1/plugins.js'></script>
|
|
<script type='text/javascript' src='../v1/plugins-ui.js'></script>
|
|
<link rel="stylesheet" href="../v1/plugins.css">
|
|
|
|
<style >
|
|
#viewport {
|
|
display: flex;
|
|
flex-direction:column;
|
|
position: absolute;
|
|
right: 0;
|
|
bottom: 0;
|
|
left: 0;
|
|
top: 0;
|
|
padding: 10px;
|
|
user-select: none;
|
|
}
|
|
|
|
.separator {
|
|
border-top: 1px solid #cbcbcb;
|
|
}
|
|
|
|
#plugins-list-box {
|
|
flex-grow: 1;
|
|
overflow: auto;
|
|
user-select: none;
|
|
overflow: hidden;
|
|
position: absolute;
|
|
margin: 0px 16px 0px 16px;
|
|
padding: 0;
|
|
left: 0px;
|
|
right: 0px;
|
|
bottom: 0px;
|
|
top: 103px;
|
|
}
|
|
|
|
ul {
|
|
list-style: none;
|
|
padding-left: 0;
|
|
}
|
|
|
|
.item {
|
|
display: flex;
|
|
padding: 3px;
|
|
transition: all 0.2s;
|
|
}
|
|
|
|
.item:hover {
|
|
background-color: #ededed;
|
|
}
|
|
|
|
.item .icon {
|
|
width: 28px;
|
|
height: 28;
|
|
}
|
|
|
|
.btn {
|
|
display: inline-block;
|
|
width: 20px;
|
|
height: 20px;
|
|
opacity: 0.8;
|
|
}
|
|
|
|
.btn:hover {
|
|
opacity: 1;
|
|
}
|
|
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="viewport">
|
|
<label id="l1" class="defaultlable" style="margin:10px;">Please see the <a href="https://api.onlyoffice.com/plugin/basic" target="_blank">Help</a> to find out what the plugin contents must be and how it is added to the editors.</label>
|
|
<div style="position:relative;">
|
|
<button class="btn-text-default" style="margin:0px 10px 10px 10px;" id="button_add">Add plugin</button>
|
|
</div>
|
|
<label id="l2" class="defaultlable" style="font-weight: bold; margin:0px 10px 5px 10px;">Installed plugins</label>
|
|
<div class="separator" id="id_separator"></div>
|
|
<div id="plugins-list-box">
|
|
<div id="content" style="margin: 0; padding: 0;"></div>
|
|
</div>
|
|
</div>
|
|
<div id="mask" style="position:absolute; left: 0;right: 0; top: 0; bottom: 0; margin: 0; padding: 0; background-color: #FFFFFF; z-index: 100;">
|
|
</div>
|
|
|
|
<!-- code -->
|
|
<script src="code.js"></script>
|
|
</body>
|
|
</html> |