chg: [css] add basic toggle sidebar

This commit is contained in:
Terrtia 2019-02-27 16:58:17 +01:00
parent aaf4712877
commit 460f70fee6
No known key found for this signature in database
GPG key ID: 1E1B1F50D84613D0
2 changed files with 22 additions and 4 deletions

View file

@ -50,10 +50,14 @@
<div class="container-fluid"> <div class="container-fluid">
<div class="row"> <div class="row">
<div class="col-12 col-lg-2 p-0 bg-light border-right"> <div class="col-12 col-lg-2 p-0 bg-light border-right" id="side_menu">
<button type="button" class="btn btn-outline-secondary mt-1 ml-3" onclick="toggle_sidebar()">
<i class="fas fa-align-left"></i>
<span>Toggle Sidebar</span>
</button>
<nav class="navbar navbar-expand navbar-light bg-light flex-md-column flex-row align-items-start py-2"> <nav class="navbar navbar-expand navbar-light bg-light flex-md-column flex-row align-items-start py-2" id="nav_menu">
<h5 class="d-flex text-muted w-100"> <h5 class="d-flex text-muted w-100">
<span>Splash Crawlers </span> <span>Splash Crawlers </span>
<a class="ml-auto" href="#"> <a class="ml-auto" href="#">
@ -83,7 +87,7 @@
</nav> </nav>
</div> </div>
<div class="col-12 col-lg-10"> <div class="col-12 col-lg-10" id="core_content">
<div class="row"> <div class="row">
<div class="col-12 col-xl-6"> <div class="col-12 col-xl-6">
@ -255,6 +259,20 @@ $(document).ready(function(){
}); });
}); });
function toggle_sidebar(){
if($('#nav_menu').is(':visible')){
$('#nav_menu').hide();
$('#side_menu').removeClass('border-right')
$('#side_menu').removeClass('col-lg-2')
$('#core_content').removeClass('col-lg-10')
}else{
$('#nav_menu').show();
$('#side_menu').addClass('border-right')
$('#side_menu').addClass('col-lg-2')
$('#core_content').addClass('col-lg-10')
}
}
</script> </script>

View file

@ -16,7 +16,7 @@
<a class="nav-link" href="#" aria-disabled="true"><i class="fas fa-external-link-alt"></i> Submit</a> <a class="nav-link" href="#" aria-disabled="true"><i class="fas fa-external-link-alt"></i> Submit</a>
</li> </li>
<li class="nav-item mr-3"> <li class="nav-item mr-3">
<a class="nav-link" href="#" aria-disabled="true"><i class="fas fa-tag"></i> Browse Pastes</a> <a class="nav-link" href="#" aria-disabled="true"><i class="fas fa-tag"></i> Browse Items</a>
</li> </li>
<li class="nav-item mr-3"> <li class="nav-item mr-3">
<a class="nav-link" href="#" aria-disabled="true"><i class="fas fa-crosshairs"></i> Leaks Hunter</a> <a class="nav-link" href="#" aria-disabled="true"><i class="fas fa-crosshairs"></i> Leaks Hunter</a>