ninefolio/templates/Include/style.css.twig

:root{
    --colorbgbodylight: {{ app.session.get('colorbgbodylight')|raw }};
    --colorbgbodydark: {{ app.session.get('colorbgbodydark')|raw }};
    --colorbgbodydarkdarker: {{ app.session.get('colorbgbodydarkdarker')|raw }};
    --colorfttitlelight: {{ app.session.get('colorfttitlelight')|raw }};
    --colorfttitledark: {{ app.session.get('colorfttitledark')|raw }};   
    --colorftbodylight: {{ app.session.get('colorftbodylight')|raw }};
    --colorftbodydark: {{ app.session.get('colorftbodydark')|raw }};       
    --fontbody: "{{ app.session.get('fontbody')|raw }}";
    --fonttitle: "{{ app.session.get('fonttitle')|raw }}";
}

/* COLOR BODY  */

body {
    background-color: var(--colorbgbodylight);
    color:  var(--colorftbodylight);
}

body .navbar.bg-dark {
    background-color: var(--colorbgbodydark)!important;
}

body #sidebar {
    background-color: var(--colorbgbodydark);
}

body #sidebar .title {
    color: var(--colorfttitledark); 
}

body #sidebar .nav a {
    color: var(--colorfttitledark); 
}

body h1, body h2, body h3 {
    color: var(--colorfttitlelight); 
}

body a, btn-link {
    color: var(--colorfttitlelight); 
}

body .nav a{
    color: var(--colorfttitledark); 
}

body .page-item.active .page-link {
    background-color: var(--colorbgbodydark);
    border-color: var(--colorbgbodydark);
}


/* COLOR BODY HOME */

body.monocolor {
    background-color: var(--colorbgbodydark);
    color:  var(--colorftbodydark);
}

body.monocolor .navbar.bg-dark {
    background-color: var(--colorbgbodydark)!important;
}

body.monocolor #sidebar {
    background-color: var(--colorbgbodydark);
}

body.monocolor #sidebar .title {
    color: var(--colorfttitledark); 
}

body.monocolor #sidebar .nav a {
    color: var(--colorfttitledark); 
}

body.monocolor h1, body.monocolor h2, body.monocolor h3 {
    color: var(--colorfttitledark); 
}

body.monocolor a {
    color: var(--colorfttitledark); 
}

body.monocolor .nav a{
    color: var(--colorfttitledark); 
}

body.monocolor .modal-content {
    background-color: var(--colorbgbodydark);
}
body.monocolor .modal-header .close {
    color: var(--colorftbodydark);
}

a.btn {
    color: white !important;
}




/* FONT */
body {
    font-family: var(--fontbody); 
}

h1,h2,h3, .navbar-brand {
    font-family:  var(--fonttitle); 
}

{% if not useheader is defined or not useheader %}
#main {padding:0px}
{%endif%}