share/web_surfaces/builtin/mixer/ardour-toolkit-theme/css/valuebutton.css
/*
 * This file is part of Toolkit.
 *
 * Toolkit is free software; you can redistribute it and/or
 * modify it under the terms of the GNU General Public
 * License as published by the Free Software Foundation; either
 * version 3 of the License, or (at your option) any later version.
 *
 * Toolkit is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
 * Lesser General Public License for more details.
 *
 * You should have received a copy of the GNU General
 * Public License along with this program; if not, write to the
 * Free Software Foundation, Inc., 51 Franklin Street, Fifth Floor,
 * Boston, MA  02110-1301  USA
 */
.toolkit-valuebutton {
    padding: 0;
    
    grid-column-gap: 8px;
    grid-row-gap: 0px;
}

.toolkit-valuebutton.toolkit-dragging,
.toolkit-valuebutton.toolkit-scrolling {
    border: 1px solid #002f42;
}
.toolkit-valuebutton.toolkit-warn {
    border: 1px solid #c00;
}

.toolkit-valuebutton > .toolkit-icon {
    margin-left: 8px;
    margin-top: 4px;
    margin-bottom: 4px;
}
.toolkit-valuebutton > .toolkit-label {
    margin-top: 4px;
    margin-bottom: 4px;
}
.toolkit-valuebutton > .toolkit-scale {
    margin-left: 8px;
    margin-bottom: 4px;
    height: 16px;
}
.toolkit-valuebutton > .toolkit-scale::before {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: white;
}

.toolkit-valuebutton > .toolkit-scale > .toolkit-dot {
    height: 4px;
}

.toolkit-valuebutton > .toolkit-value {
    background: rgba(0,0,0,0.033);
    border: none;
    -webkit-border-top-right-radius: 5px;
    -webkit-border-bottom-right-radius: 5px;
    -moz-border-radius-topright: 5px;
    -moz-border-radius-bottomright: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    
    justify-self: stretch;
    align-self: stretch;
}
.toolkit-valuebutton > .toolkit-value > .toolkit-input {
    width: 100%;
    height: 100%;
}
.toolkit-valuebutton.toolkit-dragging > .toolkit-label,
.toolkit-valuebutton.toolkit-scrolling > .toolkit-label {
    background-color: #002f42;
    color: white;
    text-shadow: 0px -1px 0px black;
    -webkit-border-radius: 4px;
    -moz-border-radius:    4px;
    border-radius:         4px;
}
