Manager skin:
* Full screen size for menu tree * Help no more draggable/resizable * Hide/display box contents with clik on title * Edited configuration key is displayed in editon box title
This commit is contained in:
parent
dc5b0cbed6
commit
88d237da47
@ -9,11 +9,17 @@
|
|||||||
*/
|
*/
|
||||||
|
|
||||||
/* Main */
|
/* Main */
|
||||||
|
html,body
|
||||||
|
{
|
||||||
|
margin:0;
|
||||||
|
padding:0;
|
||||||
|
height:100%;
|
||||||
|
min-height:100%;
|
||||||
|
}
|
||||||
|
|
||||||
body
|
body
|
||||||
{
|
{
|
||||||
font:normal 9pt sans-serif;
|
font:normal 9pt sans-serif;
|
||||||
margin:0;
|
|
||||||
padding:10px;
|
|
||||||
background:#000;
|
background:#000;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -47,6 +53,12 @@ input
|
|||||||
}
|
}
|
||||||
|
|
||||||
/* Divs */
|
/* Divs */
|
||||||
|
#container
|
||||||
|
{
|
||||||
|
height:96%;
|
||||||
|
padding:1%;
|
||||||
|
}
|
||||||
|
|
||||||
#header img, #header p
|
#header img, #header p
|
||||||
{
|
{
|
||||||
float:left;
|
float:left;
|
||||||
@ -61,7 +73,9 @@ input
|
|||||||
#page
|
#page
|
||||||
{
|
{
|
||||||
clear:both;
|
clear:both;
|
||||||
|
overflow:hidden;
|
||||||
margin-top:50px;
|
margin-top:50px;
|
||||||
|
height:92%;
|
||||||
}
|
}
|
||||||
|
|
||||||
#menu
|
#menu
|
||||||
@ -69,55 +83,45 @@ input
|
|||||||
float:left;
|
float:left;
|
||||||
padding:10px;
|
padding:10px;
|
||||||
width:300px;
|
width:300px;
|
||||||
border-right:2px solid #bbb;
|
border-right:4px double #aaa;
|
||||||
|
height:96%;
|
||||||
|
overflow-x:hidden;
|
||||||
|
overflow-y:auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
#data
|
#data
|
||||||
{
|
{
|
||||||
margin:0 0 0 320px;
|
margin:0 0 0 320px;
|
||||||
padding:10px;
|
padding:10px;
|
||||||
border-left:2px solid #bbb;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#buttons, #edition
|
#buttons, #edition, #help
|
||||||
{
|
{
|
||||||
text-align:center;
|
text-align:center;
|
||||||
margin:10px 50px;
|
margin:10px 50px;
|
||||||
padding:0 0 5px 0;
|
padding:5px;
|
||||||
border:solid #bbb 1px;
|
border:solid #bbb 1px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#help
|
|
||||||
{
|
|
||||||
width:600px;
|
|
||||||
padding:5px 10px;
|
|
||||||
background:#eee;
|
|
||||||
margin:10px auto;
|
|
||||||
border:1px solid #bbb;
|
|
||||||
position:absolute;
|
|
||||||
left:393px;
|
|
||||||
top:230px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#help h1, #buttons h1, #edition h1
|
#help h1, #buttons h1, #edition h1
|
||||||
{
|
{
|
||||||
text-align:center;
|
text-align:center;
|
||||||
font-size:12pt;
|
font-size:12pt;
|
||||||
padding:5px 10px;
|
padding:5px 10px;
|
||||||
margin:5px 10px;
|
margin:5px 10px;
|
||||||
|
cursor:pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
#help_content, #buttons_content, #content
|
||||||
|
{
|
||||||
|
padding:5px 10px;
|
||||||
|
margin:5px 10px;
|
||||||
|
overflow:auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
#help_content
|
#help_content
|
||||||
{
|
{
|
||||||
padding:5px;
|
text-align:left;
|
||||||
overflow:auto;
|
|
||||||
cursor:help;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* jQuery UI */
|
|
||||||
.ui-draggable h1
|
|
||||||
{
|
|
||||||
cursor:move;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* jQuery Simple Tree */
|
/* jQuery Simple Tree */
|
||||||
|
@ -5,14 +5,15 @@
|
|||||||
var simpleTreeCollection;
|
var simpleTreeCollection;
|
||||||
|
|
||||||
$(document).ready(function(){
|
$(document).ready(function(){
|
||||||
/* Help div (require jQuery UI) */
|
/* Display/hide divs */
|
||||||
// Allow drag
|
$("#buttons h1").click(function(){
|
||||||
$("#help").draggable({ handle: 'h1', opacity: '0.70' });
|
$("#buttons_content").slideToggle('fast');
|
||||||
// Allow resize
|
});
|
||||||
$("#help").resizable({ handles: 'all', alsoResize: '#help_content', ghost: 'true'});
|
$("#edition h1").click(function(){
|
||||||
// Display/hide content with double click on title bar
|
$("#content").slideToggle('fast');
|
||||||
$("#help h1").dblclick(function(){
|
});
|
||||||
$("#help_content").slideToggle('slow');
|
$("#help h1").click(function(){
|
||||||
|
$("#help_content").slideToggle('fast');
|
||||||
});
|
});
|
||||||
|
|
||||||
/* Simple Tree */
|
/* Simple Tree */
|
||||||
|
@ -19,31 +19,36 @@ var scriptname='<TMPL_VAR NAME="SCRIPT_NAME">';var imagepath='<TMPL_VAR NAME="DI
|
|||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|
||||||
|
<!-- Container -->
|
||||||
|
<div id="container" class="ui-widget ui-helper-clearfix">
|
||||||
|
|
||||||
<!-- Header -->
|
<!-- Header -->
|
||||||
<div id="header" class="ui-widget">
|
<div id="header">
|
||||||
<img alt="Lemonldap::NG" src="<TMPL_VAR NAME="DIR">/logo_lemonldap-ng.png" class="logo" width="200" height="38" />
|
<img alt="Lemonldap::NG" src="<TMPL_VAR NAME="DIR">/logo_lemonldap-ng.png" class="logo" width="200" height="38" />
|
||||||
<p class="ui-state-default ui-corner-all ui-state-active"><a href="index.pl"><lang en="Configuration management" fr="Gestion de la configuration"/></a></p>
|
<p class="ui-state-default ui-corner-all ui-state-active"><a href="index.pl"><lang en="Configuration management" fr="Gestion de la configuration"/></a></p>
|
||||||
<p class="ui-state-default ui-corner-all"><a href="sessions.pl"><lang en="Sessions explorer" fr="Explorateur de sessions"/></a></p>
|
<p class="ui-state-default ui-corner-all"><a href="sessions.pl"><lang en="Sessions explorer" fr="Explorateur de sessions"/></a></p>
|
||||||
|
<!-- Header -->
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Main -->
|
<!-- Page -->
|
||||||
<div id="page" class="ui-corner-all ui-helper-clearfix ui-widget-content">
|
<div id="page" class="ui-corner-all ui-helper-clearfix ui-widget-content">
|
||||||
|
|
||||||
<!-- Menu (tree) -->
|
<!-- Menu (tree) -->
|
||||||
<div id="menu" class="ui-widget">
|
<div id="menu">
|
||||||
<TMPL_VAR NAME="MENU">
|
<TMPL_VAR NAME="MENU">
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Data -->
|
<!-- Data -->
|
||||||
<div id="data">
|
<div id="data">
|
||||||
|
|
||||||
<!-- All buttons -->
|
<!-- Buttons -->
|
||||||
<div id="buttons" class="ui-widget ui-corner-all">
|
<div id="buttons" class="ui-corner-all">
|
||||||
|
|
||||||
<h1 class="ui-widget-header ui-corner-all">
|
<h1 class="ui-widget-header ui-corner-all">
|
||||||
<lang en="Available actions" fr="Actions disponibles" />
|
<lang en="Available actions" fr="Actions disponibles" />
|
||||||
</h1>
|
</h1>
|
||||||
|
|
||||||
|
<div id="buttons_content" class="ui-corner-all ui-widget-content">
|
||||||
<button id="bsave" onclick="uploadConf()" class="ui-state-default ui-corner-all" >
|
<button id="bsave" onclick="uploadConf()" class="ui-state-default ui-corner-all" >
|
||||||
<lang en="Save" fr="Sauver" />
|
<lang en="Save" fr="Sauver" />
|
||||||
</button>
|
</button>
|
||||||
@ -79,21 +84,25 @@ var scriptname='<TMPL_VAR NAME="SCRIPT_NAME">';var imagepath='<TMPL_VAR NAME="DI
|
|||||||
<button id="delkb" style="display:none;" onclick="delKey();return false;" class="ui-state-default ui-corner-all">
|
<button id="delkb" style="display:none;" onclick="delKey();return false;" class="ui-state-default ui-corner-all">
|
||||||
<lang en="Delete key" fr="Effacer la clef" />
|
<lang en="Delete key" fr="Effacer la clef" />
|
||||||
</button>
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Buttons -->
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
<div id="edition" class="ui-widget ui-corner-all">
|
<!-- Edition -->
|
||||||
<span id="content_title"> </span>
|
<div id="edition" class="ui-corner-all">
|
||||||
|
|
||||||
<form action="#" onsubmit="return false">
|
<form action="#" onsubmit="return false">
|
||||||
|
|
||||||
<h1 class="ui-widget-header ui-corner-all">
|
<h1 class="ui-widget-header ui-corner-all">
|
||||||
<lang en="Values to edit" fr="Valeurs à éditer" />
|
<lang en="Edit key " fr="Édition de la clé " />
|
||||||
|
<span id="content_title"> </span>
|
||||||
</h1>
|
</h1>
|
||||||
|
|
||||||
<!-- Form content -->
|
|
||||||
<div id="content">
|
<!-- Edition content -->
|
||||||
|
<div id="content" class="ui-corner-all ui-widget-content">
|
||||||
|
|
||||||
<!-- Default text -->
|
<!-- Default text -->
|
||||||
<div id="content_default" class="content">
|
<div id="content_default" class="content">
|
||||||
@ -144,21 +153,31 @@ var scriptname='<TMPL_VAR NAME="SCRIPT_NAME">';var imagepath='<TMPL_VAR NAME="DI
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</form>
|
</form>
|
||||||
|
|
||||||
|
<!-- Edition -->
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
<!-- Help -->
|
||||||
|
<div id="help" class="ui-corner-all">
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="help" class="ui-widget ui-corner-all">
|
|
||||||
<h1 class="ui-widget-header ui-corner-all"><lang en="Help" fr="Aide"/></h1>
|
<h1 class="ui-widget-header ui-corner-all"><lang en="Help" fr="Aide"/></h1>
|
||||||
|
|
||||||
<div id="help_content" class="ui-widget-content">
|
<div id="help_content" class="ui-widget-content ui-corner-all">
|
||||||
<!-- AJAX content -->
|
<!-- AJAX content -->
|
||||||
<lang en="Click on the configuration tree to edit parameters" fr="Cliquer sur l'arbre de configuration pour éditer les paramètres" />
|
<lang en="Click on the configuration tree to edit parameters" fr="Cliquer sur l'arbre de configuration pour éditer les paramètres" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<!-- Help -->
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Data -->
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Page -->
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Container -->
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
|
Loading…
Reference in New Issue
Block a user