volumio style

[dddesign]

I wanna share this with you. I styled it so it fits better in volumio design and it working with the tabs.

I don't use equal.php file because I have to integrate code to the /var/www/templates/indextpl.html file. so you can also leave index.php as it was originally.

in indextpl.html I added the form element (with id attribute):

.....
<!-- -------------------- PLAYBACK PANEL -------------------- -->
    <div id="playback" class="tab-pane active">
        <form id="form_mixer" action="mixer.php" method="post">
            <input type="submit" name="flat" value="flat" />
            <input type="submit" name="classical" value="classical" />
            <input type="submit" name="club" value="club" />
            <input type="submit" name="dance" value="dance" />
            <input type="submit" name="headphones" value="headphones" />
            <input type="submit" name="bass" value="bass" />
            <input type="submit" name="treble" value="treble" />
            <input type="submit" name="large_hall" value="large_hall" />
            <input type="submit" name="live" value="live" />
            <input type="submit" name="party" value="party" />
            <input type="submit" name="pop" value="pop" />
            <input type="submit" name="reggae" value="reggae" />
            <input type="submit" name="rock" value="rock" />
            <input type="submit" name="ska" value="ska" />
            <input type="submit" name="soft_rock" value="soft_rock" />
            <input type="submit" name="soft" value="soft" />
            <input type="submit" name="techno" value="techno" />
        </form>
        <div class="container txtmid">
        .....

and in /var/www/css/panels.css I added these lines:

#form_mixer input {
    color: white;
    background-color: inherit;
    border-radius: 6px;
    padding: 0px 10px;
    margin-bottom: 4px;
    font-size: smaller;
    border-style: dotted;
    border-width: thin;
}
#form_mixer {
    margin: 0px !important;
    text-align: center;
    padding-top: 10px;
}

thats it. looks like this:

[v0d0r]

That looks awesome. Good job. I will give it a try later. Thanks for sharing.