Custom Global Nav Tweaks

A collection of css tweaks to be used with the "GitHub Custom Global Navigation" UserScript: https://greasyfork.org/en/scripts/478687-github-custom-global-navigation
Installer som brugerstil ?
Skaberens foreslåede script
Du vil måske også kunne lide GitHub Custom Global Navigation
Installer dette script
Ask a question, post a review, or report the script.
Wrap lines
/* ==UserStyle==
@name           Custom Global Nav Tweaks
@namespace      github.com/JunkiEDM
@version        1.4.1
@description    A collection of css tweaks to be used with the "GitHub Custom Global Navigation" UserScript: https://greasyfork.org/en/scripts/478687-github-custom-global-navigation
@author         JunkiEDM
@preprocessor   less
@var checkbox full-buttons "Full mobile action buttons" 1
@var checkbox hide-reponav "Using GitHub Custom Global Navigation" 0
@var checkbox custom-header "Use custom header" 0
==/UserStyle== */

@-moz-document domain("github.com") {
    & when (@hide-reponav = 1) {
        .AppHeader-context-compact {
            display: none;
        }
    }
    .AppHeader-context-full:not(.f3 *, .AppHeader-globalBar *) {
        font-size: 20px;
    }
    .AppHeader img.avatar.d-none {
        display: inline-block!important;
    }
    .customizedRepositoryHeader {
        padding-top: 0!important;
        & when (@full-buttons = 1) {
            &.mb-2, > div.mb-3 {
                margin-bottom: 0!important;
            }
        }
    }
    .about-margin {
        width: 100%;
        margin-left: 0;
    }
    @media (max-width: 767.98px) {
        :root {
            --Layout-pane-width: 100vw !important; 
        }
        .Layout--sidebarPosition-flowRow-end {
            --Layout-sidebar-width: 100vw !important;
        }
        .Layout.Layout--sidebarPosition-end {
            display: flex;
            flex-direction: column;
            align-items: stretch;
            width: 100% !important;
            max-width: 100% !important;
            & > .Layout-sidebar {
                max-width: none !important;
                & > .about-margin {
                    width: calc(100vw - 96px) !important;
                    margin-left: 24px;
                }
            }
        }
        .Layout .Layout-main, .ml-n3 {
            margin-right: 0;
        }
        .AppHeader-context-full:not(.f3 *, .AppHeader-globalBar *) {
            font-size: 18px;
        }
        .customizedRepositoryHeader.px-md-4 {
            padding-right: var(--base-size-24, 24px);
            padding-left: var(--base-size-24, 24px);
        }
        & when (@full-buttons = 1) {
            @media (max-width: 460px) {
                & .btn .Counter, [data-component="buttonContent"] .Counter {
                    display: none;
                }
            }
            @media (min-width: 330px) {
                & .btn .octicon:not(.octicon-triangle-down) {
                    --icon-margin-right: 1vw;
                    margin-right: calc(var(--icon-margin-right) + -1px)!important;
                    &.octicon-bell {
                        margin-right: calc(var(--icon-margin-right) + 1px)!important;
                    }
                }
                & .d-inline {
                    margin-left: -2px!important;
                }
            }
            #repository-container-header > .d-flex.flex-justify-end.mb-3.px-3.px-lg-5 {
                margin-bottom: 0!important;
                flex-direction: column;
            }
            #responsive-meta-container {
                & > .d-block.d-md-none.mb-2.px-3.px-md-4.px-lg-5 {
                    padding-top: var(--base-size-16, 16px) !important;
                    & > .d-flex.flex-wrap.gap-2 {
                        display: none!important;
                    }
                }
                & .d-flex.gap-2.mt-n3.mb-3.flex-wrap {
                    display: none !important;
                }
            }
            #repository-details-container {
                justify-content: center;
                align-items: center;
                width: 100%;
                max-width: 100% !important;
                & > .pagehead-actions {
                    max-width: calc(100vw - 36px);
                    width: 100%;
                    display: flex !important;
                    justify-content: space-evenly;
                    gap: 8px;
                    & > li {
                        display: flex;
                        flex-grow: 1;
                        margin-right: 0;
                        @media (max-width: 330px) { /* browsing github with an ipod nano */
                            & .d-inline {
                                display: none!important;
                            }
                            & .btn .octicon {
                                margin-right: 0!important;
                                vertical-align: middle!important;
                            }
                            & *:not(template) {
                                content: " "!important;
                                font-size: 0!important;
                            }
                            & .btn .dropdown-caret {
                                margin-left: 8px;
                            }
                        }
                        &:has(include-fragment:first-child:last-child) {
                            display: none;
                        }
                        &:last-child:not(:has(*:not(template))) {
                            display: none;
                        }
                        & .btn-sm {
                            padding: 3px 8px;
                            height: 100%;
                            &:not(.px-2) {
                                flex-grow: 1;
                            }
                        }
                        & > *:not(template) {
                            width: 100%;
                            flex-grow: 1;
                            text-align: center;
                            &.starring-container { /* Star */
                                & .BtnGroup-parent:first-child .BtnGroup-item {
                                    width: 100%;
                                    height: 100%;
                                }
                            }
                            &.d-flex { /* Fork */
                                &:has(> #fork-button), > div.position-relative.d-inline-block {
                                    display: flex!important;
                                    flex-grow: 1;
                                    & #fork-button {
                                        width: 100%;
                                        height: 100%;
                                        text-align: center;
                                        align-content: center;
                                    }
                                }
                            }
                            &:is(notifications-list-subscription-form) details, &:is([partial-name="notifications-subscriptions-menu"]) button { /* Watch */
                                width: 100%;
                                & > summary {
                                    text-align: center;
                                    width: 100%;
                                }
                            }
                            &:is([partial-name="notifications-subscriptions-menu"]) > [data-target="react-partial.reactRoot"] > div {
                                &.d-md-none {
                                    display: none;
                                }
                                &.d-md-block.d-none {
                                    display: block !important;
                                }
                            }
                            &:is(include-fragment) > div > button {
                                width: 100%;
                                text-align: center;
                                padding: 3px 32px;
                            }
                            &:is(details[id^="funding-links"]) > #sponsor-button, & > button[aria-label^="Sponsor"], &:is([data-url-param="sponsor"]) > button {
                                width: 100%;
                                height: 100%;
                                text-align: center;
                                @media (max-width: 556px) {
                                    padding: 0;
                                    font-size: 0;
                                    &.btn-sm .octicon, .icon-sponsor {
                                        vertical-align: middle;
                                        margin-right: 0 !important;
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
        & when (@custom-header = 1) {
            #context-region-dialog:not([open]) {
                all: unset;
                display: contents;
                & > .Overlay-header,
                & > [data-catalyst] ul > li a svg {
                    display: none;
                }
                & > [data-catalyst], [data-catalyst] :is(div, li) {
                    display: contents;
                }
                & > [data-catalyst] ul {
                    display: flex;
                    position: absolute;
                    top: 114px;
                    left: 50px;
                    z-index: 1;
                    font-size: var(--h3-size-mobile, 18px) !important;
                    font-weight: var(--base-text-weight-semibold, 600);
                    & > li {
                        & a:hover {
                            color: var(--fgColor-default, var(--color-fg-default)) !important
                        }
                        &:first-of-type {
                            &::after {
                                margin: 2px;
                                content: " / ";
                                display: block;
                                box-sizing: border-box;
                            }
                        }
                    }
                }
            }
            #repo-title-component > strong[itemprop="name"] {
                display: none !important;
            }
        }
        #repository-container-header > .container-xl {
            flex-direction: column
        }
        #repository-container-header > .container-xl > .width-fit .d-none {
            display: inline-block !important;
            &:is([itemprop="name"], .Label--secondary) when (@custom-header = 1) {
                display: none !important;
            }
        }
    }
}