static/css/devhub/compat.less

@import '../impala/lib';

.compat-versions td.app,
.new-apps a.app {
    font-weight: bold;
    min-height: 24px;
    padding-left: 35px;
}
.compat-versions td.app {
    background-position: 0 0.5em;
    .background-size(auto 24px);
    line-height: 30px;
    width: 152px;
}
.devhub-form .compat-versions td.app {
    background-position: 0 4px;
}
.new-apps a.app {
    background-position: 0 50%;
    .background-size(auto 16px);
    line-height: 24px;
}

.compat-versions p.add-app a,
.new-apps a.app {
    display: block;
}

.devhub-form .compat-versions {
    tbody {
        border: 0;
    }
    p.add-app {
        margin-top: 1em;
    }
}

.compat-versions {
    table {
        width: 100%;
    }
    tbody {
        border: 1px solid @dark-gray;
        border-width: 1px 0;

        tr:not(:last-child) {
            border-bottom: 1px dotted @border-blue;
        }
    }
    thead th {
        color: #888;
    }
    table tbody td {
        padding-top: 0;
    }
    p.add-app + .new-apps {
        margin: 0 0 1em;
    }
    td div .errorlist {
        font-size: 0.85em;
    }
    thead th,
    table + p,
    .errorlist {
        margin-bottom: 0;
    }
    td.select {
        display: flex;
        justify-content: space-between;
        flex-flow: row wrap;
        width: 320px;

        div {
            padding: 0 .5em 0;
            flex: 1 auto;

            &:first-child {
                padding-left: 0;
            }
        }
        ul.errorlist {

        }
        select {
            width: 120px;
        }
    }
    td label,
    td.remove input {
        position: absolute;
        left: -9999px;
    }
    td.remove div {
        position: relative;
        top: 0.308em;
    }
    tr.app-extra,
    .new-apps {
        display: none;
    }
}

.version-comments {
    border-top: 1px dotted #bbb;
    display: none;
    margin: 0 10px;
    padding: 6px;

    &:first-child {
        border-top: 0 none;
        padding-top: 10px;
    }
}