Template:Binary signal/styles.css

.signal-graph-table {
    padding: .6rem;
    background-color: var(--background-color-neutral-subtle,#f8f9fa);
    border: 1px solid var(--border-color-base,#a2a9b1);

    max-width: 500px;
    overflow-y: auto;

    display: inline-block;
}
.signal-graph-table table {
    border-collapse: collapse;
}

.signal-graph-table td.signal-header-cell {
    text-align: center;
    transform: translateX(-50%);
}

.signal-graph-table tr.signal-spacer-row {
    height: 1rem;
    border: none;
}
.signal-graph-table tr.signal-spacer-row td.signal-spacer-row-cell {
    border-left: var(--tick-marker-border);
    border-right: var(--tick-marker-border);
}

.signal-graph-table tr.signal-row {
    height: 2rem;
}
.signal-graph-table tr.signal-row td:first-of-type {
    width: auto;
    white-space: nowrap;
    padding: 0 0.5rem;
    font-weight: bold;
}
.signal-graph-table tr.signal-row td.signal-spacer {
    border: none;
    width: .5rem;
}

.signal-graph-table td.signal-value-cell {
    width: 3rem;
    min-width: 3rem;
    border-left: 1px solid;
    border-right: 1px solid;
    text-align: center;
}
.signal-graph-table td.signal-value-cell.signal-on-top {
    border-top: var(--signal-border);
}
.signal-graph-table td.signal-value-cell.signal-on-bottom {
    border-bottom: var(--signal-border);
}
.signal-graph-table td.signal-value-cell.signal-on-left {
    border-left: var(--signal-border);
}

.signal-graph-table td.signal-value-cell {
    border-right: var(--tick-marker-border);
}
.signal-graph-table td.signal-value-cell:not(.signal-on-left) {
    border-left: var(--tick-marker-border);
}