Skip to content

Improve NixOS Manual (desktop only) by xav-ie

Screenshot of Improve NixOS Manual (desktop only)

Details

Authorxav-ie

LicenseNo License

Categorynixos

Created

Updated

Size2.8 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

Improve the user manual to have sticky headers and navigation making it easier to find where you are and where you want to go.

Notes

  • only works for desktop

Source code

/* ==UserStyle==
@name           nixos.org/manual/nixos/stable/ - Jun 2024
@namespace      github.com/openstyles/stylus
@version        1.0.0
@description    A new userstyle
@author         Me
==/UserStyle== */
@-moz-document url-prefix("https://nixos.org/manual/") {
    /* Insert code here... */
    body {
        padding: 0;
        font-size: 16px;
    }
    .book {
        max-width: unset;
    }
    .book > .toc {
        width: 200px;
        background: #fefefef0;
        backdrop-filter: blur(10px);
        position: sticky;
        top: 0;
        max-height: calc(50vh);
        border-bottom: 2px solid black;
        overflow-y: auto;
        z-index: 2;
        padding-left: 0.5em;
        p {
            margin: 0;
        }
    }
    .chapter > .toc {
        padding-left: 0.5em;
        border-top: 2px solid black;
        position: sticky;
        left: 0;
        width: 200px;
        top: calc(50vh);
        margin-left: calc(-200px - 20px);
        overflow-y: auto;
        z-index: 1;
        max-height: 50vh;
    }

    .navheader,
    .navfooter {
        display: none;
    }
    .book > .preface,
    .book > .part,
    .book > .chapter {
        width: calc(100% - 200px - 1em);
        max-width: calc(100% - 220px);
        background: #fefefefe;
        margin-left: auto;
        margin-right: 0;
        /*float: right;*/
    }

    /*maximize space left*/
    div.book .programlisting,
    div.appendix .programlisting,
    div.book .note,
    div.book .warning {
        border-radius: 0;
    }


    /* fix overflow issue */
    div.book code,
    div.appendix code {
        word-wrap: anywhere;
    }

    .book > .part > .titlepage {
        position: sticky;
        top: -1px;
        background: #fefefeef;
        backdrop-filter: blur(10px);
        height: calc(2em + 1px);
        z-index: 4;
        h1 {
            font-size: 1.5em;
            font-variant: small-caps;
        }
    }
    .book > .part > .chapter > .titlepage {
        background: #fefefeef;
        backdrop-filter: blur(10px);
        position: sticky;
        top: 2em;
        height: 2em;
        z-index: 3;
        h2 {
            font-size: 1.5em;
            padding-left: .5em;
        }
    }
    .book > .part > .chapter > .section > .titlepage {
        background: #fefefeef;
        backdrop-filter: blur(10px);
        position: sticky;
        top: 4em;
        height: 2em;
        z-index: 2;
        h2 {
            font-size: 1.35em;
            padding-left: .5em;
            font-variant: small-caps;
        }
    }
    .book > .part > .chapter > .section > .section > .titlepage {
        background: #fefefeef;
        backdrop-filter: blur(10px);
        position: sticky;
        top: 6em;
        h3 {
            font-size: 1.35em;
            padding-left: .5em;
        }
    }
}

Reviews

No reviews yet.