🚸 (admin/koblog): ajoute une sidebar full-size
Cela permettra d'avoir plus d'espace pour le contenu
This commit is contained in:
Kazhnuz
parent
4765b7bd5c
commit
bfb58fbfb5
3 changed files with 111 additions and 50 deletions
|
|
@ -1,58 +1,123 @@
|
|||
a {
|
||||
color: #0078D4;
|
||||
@charset "UTF-8";
|
||||
|
||||
body {
|
||||
background-color: var(--bs-light);
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: #003f6f;
|
||||
text-decoration: none;
|
||||
#main-area {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.bg-success {
|
||||
background-color: #8BC34A!important;
|
||||
#main-area>.container {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.text-primary {
|
||||
color: #0078D4!important;
|
||||
.admin-sidebar {
|
||||
min-height: 100vh;
|
||||
width: 240px;
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.text-danger {
|
||||
color: #D40000!important;
|
||||
}
|
||||
a.text-danger:focus,
|
||||
a.text-danger:hover {
|
||||
color: #790000!important;
|
||||
.admin-sidebar h4 {
|
||||
font-weight: bolder;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
/* Buttons */
|
||||
.btn-primary {
|
||||
background-color: #0078D4;
|
||||
border-color: #0078D4;
|
||||
.admin-sidebar ul {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
margin-bottom: 1.5rem;
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
.btn-primary:hover {
|
||||
background-color: #4585CF;
|
||||
border-color: #4a90e2;
|
||||
.admin-sidebar a {
|
||||
padding: .5rem .75rem;
|
||||
display: block;
|
||||
color: white!important;
|
||||
border-radius: 6px;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.btn-light.focus, .btn-light:focus {
|
||||
box-shadow: none;
|
||||
.admin-sidebar a:hover {
|
||||
background-color: rgba(255, 255, 255, 0.2);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.btn.focus, .btn:focus {
|
||||
box-shadow: none;
|
||||
.admin-sidebar a i.fa {
|
||||
display: inline-block;
|
||||
width: 1.5rem;
|
||||
}
|
||||
|
||||
/* Form */
|
||||
.form-control:focus {
|
||||
box-shadow: none;
|
||||
.card-connection {
|
||||
margin: auto;
|
||||
max-width: 360px;
|
||||
}
|
||||
|
||||
/* Tables */
|
||||
.table-striped tbody tr:nth-of-type(odd) {
|
||||
background-color: rgba(0, 0, 0, 0.02);
|
||||
.container-password {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.table thead th {
|
||||
font-size: 0.8em;
|
||||
text-transform: uppercase!important;
|
||||
/* Composant de la page d'accueil */
|
||||
.nav-link.nav-title {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.nav-link.nav-title:hover {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.card-header .nav-tabs {
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
.card-stats tr:first-child td,
|
||||
.card-stats tr:first-child th {
|
||||
border-top: 0;
|
||||
}
|
||||
|
||||
.modifier-listelement-line {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
/* Fonctionnalités globale : tableau dont la première ligne est fusionné à un card-header */
|
||||
tr.card-header td,
|
||||
tr.card-header th {
|
||||
border: 0;
|
||||
background-color: transparent!important;
|
||||
}
|
||||
|
||||
tr.card-tablebody td,
|
||||
tr.card-tablebody th {
|
||||
/* on va plutôt gérer les border au niveau des tr pour éviter les soucis */
|
||||
border: 0;
|
||||
background-color: transparent!important;
|
||||
padding: 0.5rem;
|
||||
}
|
||||
|
||||
tr.card-tablebody:not(:last-child) {
|
||||
border-bottom: 1px solid #dee2e6;
|
||||
}
|
||||
|
||||
.td-id {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.card {
|
||||
box-shadow: 0px 1px 1px 0px rgba(0,0,0,0.15);
|
||||
}
|
||||
|
||||
#main-area a.nav-link:not(.active):hover {
|
||||
background-color: rgba(0,0,0,0.1)!important;
|
||||
}
|
||||
|
||||
.navbar .nav-link {
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
|
@ -1,11 +1,6 @@
|
|||
html {
|
||||
height: 100%;
|
||||
font-size: 0.9rem;
|
||||
background: #fcfcfc;
|
||||
}
|
||||
|
||||
body {
|
||||
background: #fcfcfc;
|
||||
}
|
||||
|
||||
/* Prevent events in iframes */
|
||||
|
|
|
|||
|
|
@ -60,23 +60,24 @@
|
|||
<!-- Overlay background -->
|
||||
<div id="jsshadow"></div>
|
||||
|
||||
<!-- Alert -->
|
||||
<?php include('html/alert.php'); ?>
|
||||
|
||||
<!-- Navbar, only for small devices -->
|
||||
<?php include('html/navbar.php'); ?>
|
||||
<!-- LEFT SIDEBAR - Display only on large devices -->
|
||||
<div class="bg-dark admin-sidebar text-white d-none d-lg-block">
|
||||
<?php include('html/sidebar.php'); ?>
|
||||
</div>
|
||||
|
||||
<div class="container h-100">
|
||||
<div class="container h-100" id="main-area">
|
||||
<!-- 25%/75% split on large devices, small, medium devices hide -->
|
||||
<div class="row h-100">
|
||||
|
||||
<!-- LEFT SIDEBAR - Display only on large devices -->
|
||||
<div class="sidebar col-lg-2 d-none d-lg-block">
|
||||
<?php include('html/sidebar.php'); ?>
|
||||
</div>
|
||||
<!-- Alert -->
|
||||
<?php include('html/alert.php'); ?>
|
||||
|
||||
<!-- Navbar -->
|
||||
<?php include('html/navbar.php'); ?>
|
||||
|
||||
<!-- RIGHT MAIN -->
|
||||
<div class="col-lg-10 pt-3 pb-1 h-100">
|
||||
<div class="h-100">
|
||||
<?php
|
||||
if (Sanitize::pathFile(PATH_ADMIN_VIEWS, $layout['view'].'.php')) {
|
||||
include(PATH_ADMIN_VIEWS.$layout['view'].'.php');
|
||||
|
|
|
|||
Loading…
Reference in a new issue