implement sidebar hiding for device view

This commit is contained in:
Oliver Gorwits
2012-01-20 23:47:25 +00:00
parent 44e79b9b93
commit f574cd1db5
6 changed files with 45 additions and 4 deletions

View File

@@ -168,3 +168,20 @@ form .clearfix.success input {
.vlan_total {
float: right;
}
/* for placing the sidebar toggle icons */
#sidebar_toggle_img_in {
position: fixed;
top: 55px;
left: 25px;
}
/* for placing the sidebar toggle icons */
#sidebar_toggle_img_out {
position: fixed;
top: 60px;
left: 4px;
z-index: 1;
display: none;
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 547 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 581 B

0
Netdisco/public/images/glyphicons_072_bookmark.png Executable file → Normal file
View File

Before

Width:  |  Height:  |  Size: 153 B

After

Width:  |  Height:  |  Size: 153 B

View File

@@ -1,13 +1,17 @@
<img class="sidebar_toggle" id="sidebar_toggle_img_out"
src="[% uri_base %]/images/application_side_expand.png"
rel="twipsy" data-placement="right" data-offset="5" title="Show Sidebar"/>
<div class="container-fluid">
<div class="sidebar">
<div class="well">
<img class="sidebar_toggle" id="sidebar_toggle_img_in"
src="[% uri_base %]/images/application_side_contract.png"
rel="twipsy" data-placement="right" data-offset="5" title="Hide Sidebar"/>
<h3 class="device_label">[% d.ip %]</h3>
<p class="device_label">[% d.dns.remove(settings.domain_suffix) %]</p>
<div class="tab-content">
[% FOREACH tab IN vars.tabs %]
<div id="[% tab.id %]_search" class="tab-pane [% 'active' IF params.tab == tab.id %]">
<div class="clearfix">
<h3 class="device_label">[% d.ip %]</h3>
<p class="device_label">[% d.dns.remove(settings.domain_suffix) %]</p>
</div>
[%+ TRY %][% INCLUDE "sidebar/device/${tab.id}.tt" %][% CATCH %]<!-- no "[% tab.id %]" search options -->[% END %]
</div> <!-- /tab-pane -->
[% END %]

View File

@@ -113,4 +113,24 @@
$(this).parents('.add-on').toggleClass('active', $(this).is(':checked'));
};
$('.add-on :checkbox').each(syncCheckBox).click(syncCheckBox);
// sidebar toggle
$('#sidebar_toggle_img_in').click(
function() {
$('.sidebar').toggle(
function() {
$('#sidebar_toggle_img_out').toggle();
$('.nd_content').animate({'margin-left': '5px !important'}, 100);
}
);
}
);
$('#sidebar_toggle_img_out').click(
function() {
$('#sidebar_toggle_img_out').toggle();
$('.nd_content').animate({'margin-left': '225px !important'}, 200,
function() { $('.sidebar').toggle(200) }
);
}
);
});