CSS enabling easy printout of Azure Devops markdown page preview from repositories browser

inspector-stylesheet.css

/*
 * When you open a markdown file from a code repository in Azure Devops, inject this CSS into the code inspector of your browser.
 * See https://stackoverflow.com/a/54613970 for instruction on how to do that.
 */
@media print {
    pre, blockquote {
        page-break-inside: avoid;
    }

    @page {
        size: A4;
        /* DIN A4 standard, Europe */
        margin: 0.1in;
    }

    .bolt-tabbar.sticky, .project-header, .vss-Splitter--pane-fixed, .repos-files-header-path-row,
    .vss-Splitter--divider, .navigation-container, .page-content, .repos-files-header-commandbar {
        display: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .toc-container, .markdown-content>*:first-child, .toc-container + p {
        /* hides the page table of content. Comment out if you want to keep it */
        display: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .flex-grow, .full-size {
        display: revert !important;
        overflow: revert !important;
    }

    .bolt-header.repos-files-header {
        padding-left: 0;
        margin-left: 0;
    }

    .bolt-page-grey {
        background-color: transparent !important;
    }

    .depth-8 {
        box-shadow: none;
    }

    .hljs {
        overflow: hidden !important;
        word-break: break-all !important;
        overflow-wrap: break-word !important;
    }
}

Here is an example :
Original page :

Without custom CSS :

With custom CSS :