diff options
| author | nachoparker <nacho@ownyourbits.com> | 2018-02-21 00:16:59 +0300 |
|---|---|---|
| committer | nachoparker <nacho@ownyourbits.com> | 2018-02-21 23:06:49 +0300 |
| commit | d2318a4e98c12a8e86cf8a391a84323f93718536 (patch) | |
| tree | bc2716b5d969c489d6e41a8f0e54ceba22fc93af /ncp-web/wizard | |
| parent | 6dd70a754a8d3f2cfe8d346fbe33b404ffec862c (diff) | |
wizard: animate side logsv0.46.27
Diffstat (limited to 'ncp-web/wizard')
| -rw-r--r-- | ncp-web/wizard/CSS/wizard.css | 36 | ||||
| -rw-r--r-- | ncp-web/wizard/JS/wizard.js | 12 | ||||
| -rw-r--r-- | ncp-web/wizard/index.php | 1 |
3 files changed, 39 insertions, 10 deletions
diff --git a/ncp-web/wizard/CSS/wizard.css b/ncp-web/wizard/CSS/wizard.css index 71b36fb2..ac9b275d 100644 --- a/ncp-web/wizard/CSS/wizard.css +++ b/ncp-web/wizard/CSS/wizard.css @@ -80,6 +80,20 @@ div.linkbox { min-width: 16px; min-height: 16px; background-image:url("../../../img/menu.svg"); + + position:fixed; + display:inline-block !important; + top:45px; + left:0; + width:44px; + height:44px; + z-index:2000; + cursor:pointer; + opacity:0.6 +} + +.menu-icon:hover,.menu-icon:focus { + opacity:1 } #ncp-welcome-logo { @@ -121,7 +135,7 @@ div.linkbox { bottom:0; height:100%; width:100%; - z-index:9000; + z-index:2000; text-align:center; cursor:pointer; } @@ -130,16 +144,10 @@ div.linkbox { display:block; background: white; position:relative; - width:40em; + width:0em; height:100%; } -#output-btn { - position:fixed; - top:5px; - left:5px; -} - td { width: 7em; } @@ -147,4 +155,14 @@ td { .buttons-area label{ margin: 0; font-weight: 100; -}; +} + +#overlay { + background-color: rgba(0, 0, 0, 0.2); + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + z-index: 1500; +} diff --git a/ncp-web/wizard/JS/wizard.js b/ncp-web/wizard/JS/wizard.js index 464c2ac9..130dd8a0 100644 --- a/ncp-web/wizard/JS/wizard.js +++ b/ncp-web/wizard/JS/wizard.js @@ -23,6 +23,8 @@ $(document).ready(function(){ $('#output-wrapper').show(); var textarea = $('#output-box'); textarea[0].scrollTop = textarea[0].scrollHeight; + textarea.animate({ width: "40em" }); + $('#overlay').show(); } // launch an request for launch action to the backend @@ -284,7 +286,15 @@ $(document).ready(function(){ // close log output $('.output-close').on('click', function(e){ if( e.target.id == 'output-wrapper' ) - $('#output-wrapper').hide(); + { + $('#output-box').animate( + { width: "0em" }, + { complete: function() { + $('#output-wrapper').hide(); + $('#overlay').hide(); + } + } ); + } } ); // make sure log box starts empty diff --git a/ncp-web/wizard/index.php b/ncp-web/wizard/index.php index be4b2e53..b96e6839 100644 --- a/ncp-web/wizard/index.php +++ b/ncp-web/wizard/index.php @@ -25,6 +25,7 @@ <link rel="icon" type="image/png" href="../img/favicon.png" /> </head> <body> +<div id='overlay' class="ncp-hidden"></div> <div id="rootwizard"> <ul id="ncp-nav"> <li><a href="#tab1" data-toggle="tab">Welcome</a></li> |