Fixes sidebar

main
Yasen Pramatarov 2024-08-03 16:25:42 +03:00
parent ae7929b4e1
commit 22e502c90c
4 changed files with 27 additions and 15 deletions

View File

@ -120,3 +120,16 @@
.widget { .widget {
border: 1px solid gray; border: 1px solid gray;
} }
.sidebar-wrapper {
width: 250px; /* Default width of the sidebar */
transition: width 0.3s; /* Smooth transition for collapsing */
overflow-x: hidden; /* Hide horizontal scrollbar */
}
.sidebar-wrapper.collapsed {
width: 0; /* Collapsed width */
}
.sidebar-content {
width: 250px; /* Keep content width for centering */
}

View File

@ -5,9 +5,9 @@
<link rel="stylesheet" type="text/css" href="static/bootstrap.min.css"> <link rel="stylesheet" type="text/css" href="static/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="static/all.css"> <link rel="stylesheet" type="text/css" href="static/all.css">
<script src="static/bootstrap.min.js"></script> <script src="static/bootstrap.min.js"></script>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script> <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.12.9/dist/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/popper.js@1.12.9/dist/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<title>Jilo Web</title> <title>Jilo Web</title>
</head> </head>

View File

@ -2,6 +2,10 @@
<!-- Menu --> <!-- Menu -->
<div class="menu-container"> <div class="menu-container">
<ul class="menu-left"> <ul class="menu-left">
<button class="btn btn-primary mb-3" type="button" data-toggle="collapse" data-target="#sidebar" aria-expanded="false" aria-controls="sidebar">
sidebar
</button>
<li><a href="index.php">home</a></li> <li><a href="index.php">home</a></li>
<?php if ( isset($_SESSION['username']) ) { ?> <?php if ( isset($_SESSION['username']) ) { ?>
<li><a href="?page=config">config</a></li> <li><a href="?page=config">config</a></li>

View File

@ -1,18 +1,13 @@
<div class="row"> <div class="row">
<!-- Sidebar --> <!-- Sidebar -->
<div class="col-md-3"> <div class="col-md-3 sidebar-wrapper collapse show" id="sidebar">
<button class="btn btn-primary mb-3" type="button" data-toggle="collapse" data-target="#sidebar" aria-expanded="false" aria-controls="sidebar"> <div class="card card-body bg-light">
sidebar <ul class="list-group">
</button> <li class="list-group-item"><a href="#">stats</a></li>
<div class="collapse show" id="sidebar"> <li class="list-group-item"><a href="#">config</a></li>
<div class="card card-body bg-light"> <li class="list-group-item"><a href="#">logs</a></li>
<ul class="list-group"> </ul>
<li class="list-group-item"><a href="#">stats</a></li>
<li class="list-group-item"><a href="#">config</a></li>
<li class="list-group-item"><a href="#">logs</a></li>
</ul>
</div>
</div> </div>
</div> </div>
<!-- /Sidebar --> <!-- /Sidebar -->