How to dynamically modify CSS using PHP

Question

I need to modify some CSS styles according to a condition in PHP, so I gave a search, and so I saw it is necessary to include a header in the CSS file and change the file .css for .php, or create an htacess file (but where? where?)... but I think because they are old, these articles are outdated with some (or all, or no :D) versions of PHP, CSS, Apache or Bootstrap that I’m using, or else more likely, that it’s just me doing something really wrong.

The case is that I assembled these panels with nav-tabs bootstrap:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet"/>

<div class="row">
    <div class="col-md-2"></div>
    <div class="col-md-8">
        <div class="row">
        <div class="col-md-4">
            <div class="panel panel-success">
                <div class="panel-heading" align="center">
                    <label class="btn" id="cdom">
                        <i class="glyphicon glyphicon-ok">
                        </i>&nbsp; Título</label></div>
                           <ul class="nav nav-tabs">
                                <li class="active"><a data-toggle="tab" href="#sectionA">Resumo</a></li>
                                <li><a data-toggle="tab" href="#sectionB">Entenda</a></li>                                   
                            </ul>

                        <div class="tab-content">
                            <div id="sectionA" class="tab-pane fade in active">
                                Seção A
                            </div>
                            <div id="sectionB" class="tab-pane fade">
                                <h5>Section B</h5>
                            </div>                               
                        </div>
            </div>
        </div> <div class="col-md-8></div>

            </div>
        </div>
    <div class="col-md-2"></div>
</div>

And I’ve managed to change the color of panel-header escaping the HTML, according to one condition.

 <div class="panel <?php if ($var1 > 60000){echo 'panel-success';}else {echo 'panel-danger';}?> bs-example" align="center">

But now I need to also change the CSS of nav-tab, according to the same condition. I have tried to do span, but it didn’t work. And I’ve changed the name of the CSS file, it includes the header and called the .php where the variable is, but it still didn’t work.

The current CSS style.php:

<?php header('Content-type:text/css');
include "../saida.php";
?>

.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
    color: #020202;
    cursor: default;
    background-color: <?php if ($var1 > 60000){echo '#0e7363';}else {echo '#f2dede';}?> ;
    border-bottom-color: transparent;

}

But he still doesn’t change the color according to the condition.

The question

How to include PHP script in CSS file, without having to change to .php, that is, using the htacess or the equivalent, and how to include PHP within the CSS (the form I am doing is correct?)?

Answer 1

As said in the comment, when loading a stylesheet even with HTACCESS, the parameters do not transit, at most pass via GET an ULR like: <link ... href="localhost/php.css?parametro=XXX">

In order not to have such clear data exposure and improve the parameter, I will use base64_encode and base64_decode in the variable $_GET in the style sheet file, along with parse_str to create an array with attributes.

For testing purposes just change background=f3f3f3 by the value you want. Ideone does not allow HTACCESS, so there is no way to provide an online example, but the execution was done as you wish.

---

_HTACCESS

RewriteRule ^home/         /test.php
RewriteRule ^style/php.css /style.php

_PHP

<?php
$argument = base64_encode( 'background=f3f3f3' );
?>

<link rel="stylesheet" type="text/css"
href="http://localhost/style/php.css?argument=<?php echo $argument;?>">

_CSS

<?php
parse_str( base64_decode( $_GET['argument'] ) , $output );
?>

*{background:#<?php echo $output['background'] ;?>}

---

The HTACCESS is accepting the URL http://localhost/home/, I did not increase much to leave as didactic as possible. Just need to create test.php and style.php.

Realize that RewriteRule ^style/php.css /style.php would be like an exclusive rule for when you point the way to style/php.css always run style.php without other style sheets being redirected.

Answer 2

I don’t know what your need is to change CSS via PHP, I’ve had this thought in a project, and I did it as you wanted. But it is not recommended to do the right thing.

I advise to take a look at Javascript, Jquery. You could do that in just one line per ex:

$(".nav-tabs > li.active > a").on('click', function(){
    $(this).css({'css', '#0e7363'});
});

Using this you can modify the CSS both in PHP and direct in HTML etc..

Jquery documentation: http://jquery.com/

How to use CSS manipulation: http://api.jquery.com/css/