static cssTemplate()

in resources/perf.webkit.org/public/v3/components/ratio-bar-graph.js [56:116]


    static cssTemplate()
    {
        return `
            .ratio-bar-graph {
                position: relative;
                display: block;
                margin-left: auto;
                margin-right: auto;
                width: 10rem;
                height: 2.5rem;
                overflow: hidden;
                text-decoration: none;
                color: black;
            }
            .ratio-bar-graph warning-icon {
                position: absolute;
                display: block;
                top: 0;
            }
            .ratio-bar-graph:not(.warning-on-right) warning-icon {
                left: 0;
            }
            .ratio-bar-graph.warning-on-right warning-icon {
                transform: scaleX(-1);
                right: 0;
            }
            .ratio-bar-graph .separator {
                position: absolute;
                left: 50%;
                width: 0px;
                height: 100%;
                border-left: solid 1px #ccc;
            }
            .ratio-bar-graph .bar {
                position: absolute;
                left: 50%;
                top: 0.5rem;
                height: calc(100% - 1rem);
                background: #ccc;
            }
            .ratio-bar-graph .bar.worse {
                transform: translateX(-100%);
                background: #c33;
            }
            .ratio-bar-graph .bar.better {
                background: #3c3;
            }
            .ratio-bar-graph .label {
                position: absolute;
                line-height: 2.5rem;
            }
            .ratio-bar-graph .label.worse {
                text-align: left;
                left: calc(50% + 0.2rem);
            }
            .ratio-bar-graph .label.better {
                text-align: right;
                right: calc(50% + 0.2rem);
            }
        `;
    }