<commit_before>@supports (display: grid) {
    .app-contents {
        margin: $HEADER_HEIGHT 0 $FOOTER_HEIGHT;
        height: calc(100vh - #{$HEADER_HEIGHT} - #{$FOOTER_HEIGHT});
        overflow-y: auto;
        overflow-x: hidden;

        &--show-portfolio-drawer {
            padding-right: $PORTFOLIO_DRAWER_WIDTH;

            .trade-container {
                transform: translateX(-#{$PORTFOLIO_DRAWER_WIDTH});
                margin-right: -#{$PORTFOLIO_DRAWER_WIDTH};
            }
            .chart-container {
                .ciq-chart {
                    .cq-top-ui-widgets, .cq-chart-controls {
                        transform: translateX(#{$PORTFOLIO_DRAWER_WIDTH});
                    }
                    .cq-top-ui-widgets .info-box {
                        transform: translateX(-#{$PORTFOLIO_DRAWER_WIDTH});
                    }
                }
                .cq-chart-controls {
                    will-change: max-width;
                    max-width: calc(100% - #{$PORTFOLIO_DRAWER_WIDTH});
                    transform: translateX(#{$PORTFOLIO_DRAWER_WIDTH});
                }
                .cq-chart-control-left {
                    .cq-chart-controls {
                        transform: translateX(#{$PORTFOLIO_DRAWER_WIDTH}) !important;
                    }
                    .info-box {
                        transform: translateX(-#{$PORTFOLIO_DRAWER_WIDTH}) !important;
                    }
                }
            }
        }
        .chart-container {
            .cq-chart-control-left {
                .cq-chart-controls {
                    transform: translateX(0);
                    transition: transform 0.25s ease;
                }
                .cq-top-ui-widgets {
                    left: 90px;

                    .info-box {
                        transform: translateX(0);
                    }
                }
            }
            .ciq-chart {
                .cq-top-ui-widgets, & .info-box {
                    transition: transform 0.25s ease;

                    .cq-symbols-display {
                        z-index: 1;
                    }
                }
                .cq-chart-controls {
                    transition: max-width 0.25s ease, transform 0.25s ease;
                }
            }
        }
        @media screen and (max-width: 768px) {
            // no footer:
            margin-bottom: 0;
            height: calc(100vh - #{$HEADER_HEIGHT});
        }

        .sidebar-container {
            position: relative;

            .sidebar-items {
                opacity: 1;
                transform: none;
                transition: transform 0.4s ease, opacity 0.2s linear;

                &__slideout {
                    transform: translateX(calc(100% + 20px));
                    pointer-events: none;
                    opacity: 0;
                }
            }
            .contract-wrapper {
                position: absolute;
                width: 100%;
                height: 100%;
                z-index: 2;
                top: 0;
                left: 0;
                transition: transform 0.4s ease, opacity 0.2s linear;
                opacity: 1;
                transform: none;

                &-enter {
                    transform: translateX(calc(100% + 20px));
                    opacity: 0;
                }
                &-exit {
                    transform: translateX(calc(100% + 20px));
                    opacity: 0;
                    pointer-events: none;
                }
            }
        }
    }
    /* trade-app layout */
    .trade-container {
        position: relative;
        padding: 8px 12px 0;
        display: grid;
        grid-template-columns: repeat(12, [col-start] 1fr);
        grid-template-rows: 1fr;
        grid-gap: 4px;
        min-height: calc(100vh - 91px);
        transition: transform 0.25s ease;
        will-change: transform;

        .chart-container {
            position: relative;

            // smartchart library style fixes
            .cq-context {
                top: 0;
                left: 0;
                z-index: 0;

                div.ciq-chart {
                    height: calc(100% - 50px);
                    box-shadow: none;

                    div.chartContainer {
                        background: transparent;
                        min-height: 100%;
                    }
                    div.cq-chart-controls {
                        box-shadow: none;
                    }
                }
                div.cq-chart-controls {
                    border-right: 1px solid $COLOR_GRAY;
                }
                div.cq-chart-control-left {
                    .cq-chart-controls {<commit_msg>fixed z-index issue with asset information<commit_after>@supports (display: grid) {
    .app-contents {
        margin: $HEADER_HEIGHT 0 $FOOTER_HEIGHT;
        height: calc(100vh - #{$HEADER_HEIGHT} - #{$FOOTER_HEIGHT});
        overflow-y: auto;
        overflow-x: hidden;

        &--show-portfolio-drawer {
            padding-right: $PORTFOLIO_DRAWER_WIDTH;

            .trade-container {
                transform: translateX(-#{$PORTFOLIO_DRAWER_WIDTH});
                margin-right: -#{$PORTFOLIO_DRAWER_WIDTH};
            }
            .chart-container {
                .ciq-chart {
                    .cq-top-ui-widgets, .cq-chart-controls {
                        transform: translateX(#{$PORTFOLIO_DRAWER_WIDTH});
                    }
                    .cq-top-ui-widgets .info-box {
                        transform: translateX(-#{$PORTFOLIO_DRAWER_WIDTH});
                    }
                }
                .cq-chart-controls {
                    will-change: max-width;
                    max-width: calc(100% - #{$PORTFOLIO_DRAWER_WIDTH});
                    transform: translateX(#{$PORTFOLIO_DRAWER_WIDTH});
                }
                .cq-chart-control-left {
                    .cq-chart-controls {
                        transform: translateX(#{$PORTFOLIO_DRAWER_WIDTH}) !important;
                    }
                    .info-box {
                        transform: translateX(-#{$PORTFOLIO_DRAWER_WIDTH}) !important;
                    }
                }
            }
        }
        .chart-container {
            .cq-chart-control-left {
                .cq-chart-controls {
                    transform: translateX(0);
                    transition: transform 0.25s ease;
                }
                .cq-top-ui-widgets {
                    left: 90px;

                    .info-box {
                        transform: translateX(0);
                    }
                }
            }
            .ciq-chart {
                .cq-top-ui-widgets, & .info-box {
                    transition: transform 0.25s ease;

                    .cq-symbols-display {
                        z-index: 1;
                    }
                }
                .cq-chart-controls {
                    transition: max-width 0.25s ease, transform 0.25s ease;
                }
            }
        }
        @media screen and (max-width: 768px) {
            // no footer:
            margin-bottom: 0;
            height: calc(100vh - #{$HEADER_HEIGHT});
        }

        .sidebar-container {
            position: relative;

            .sidebar-items {
                opacity: 1;
                transform: none;
                transition: transform 0.4s ease, opacity 0.2s linear;

                &__slideout {
                    transform: translateX(calc(100% + 20px));
                    pointer-events: none;
                    opacity: 0;
                }
            }
            .contract-wrapper {
                position: absolute;
                width: 100%;
                height: 100%;
                z-index: 2;
                top: 0;
                left: 0;
                transition: transform 0.4s ease, opacity 0.2s linear;
                opacity: 1;
                transform: none;

                &-enter {
                    transform: translateX(calc(100% + 20px));
                    opacity: 0;
                }
                &-exit {
                    transform: translateX(calc(100% + 20px));
                    opacity: 0;
                    pointer-events: none;
                }
            }
        }
    }
    /* trade-app layout */
    .trade-container {
        position: relative;
        padding: 8px 12px 0;
        display: grid;
        grid-template-columns: repeat(12, [col-start] 1fr);
        grid-template-rows: 1fr;
        grid-gap: 4px;
        min-height: calc(100vh - 91px);
        transition: transform 0.25s ease;
        will-change: transform;

        .chart-container {
            position: relative;

            // smartchart library style fixes
            .cq-context {
                top: 0;
                left: 0;
                z-index: 0;

                div.ciq-chart {
                    height: calc(100% - 50px);
                    box-shadow: none;

                    div.chartContainer {
                        background: transparent;
                        min-height: 100%;
                    }
                    div.cq-chart-controls {
                        box-shadow: none;
                    }
                    div.ciq-asset-information {
                        z-index: 0;
                    }
                }
                div.cq-chart-controls {
                    border-right: 1px solid $COLOR_GRAY;
                }
                div.cq-chart-control-left {
                    .cq-chart-controls {
{'fraction_non_alphanumeric': 0.09819308208569953, 'fraction_numerical': 0.020134228187919462, 'mean_word_length': 0.9051927616050354, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5384569', 'n_tokens_mistral': 2772, 'n_tokens_neox': 2409, 'n_words': 448}