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
2024-01-17 يوللانغان نەشرى. ئەڭ يېڭى نەشرىنى كۆرۈش.
ئىشلەتكۈچى ئۇسلۇبى قىلىپ قاچىلاش ؟
سوئال سوراش، ئوبزور يېزىش ياكى قوليازمىنى پاش قىلىش.
Wrap lines
/* ==UserStyle==
@name           Custom Global Nav Tweaks
@namespace      github.com/JunkiEDM
@version        1.2.0
@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
==/UserStyle== */

@-moz-document domain("github.com") {
    .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;
            }
        }
    }
    @media (max-width: 767.98px) {
        .Layout.Layout--flowRow-until-md.Layout--sidebarPosition-flowRow-end .Layout-sidebar {
            display: none;
            width: 0!important;
        }
        .Layout.Layout--sidebarPosition-end {
            display: flex;
        }
        .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 {
                    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-wrap.flex-justify-end.mb-3.px-3.px-md-4.px-lg-5 {
                margin-bottom: 0!important;
            }
            #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%;
                & > .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;
                            }
                        }
                        &:last-child:not(:has(*:not(template))) {
                            display: none;
                        }
                        & .btn-sm {
                            padding: 3px 8px;
                            &: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%;
                                }
                            }
                            &.d-flex > div.position-relative.d-inline-block { /* Fork */
                                display: flex!important;
                                flex-grow: 1;
                                & #fork-button {
                                    width: 100%;
                                    text-align: center;
                                }
                            }
                            &:is(notifications-list-subscription-form) details { /* Watch */
                                width: 100%;
                                & > summary {
                                    text-align: center;
                                    width: 100%;
                                }
                            }
                            &:is(include-fragment) > div > button {
                                width: 100%;
                                text-align: center;
                                padding: 3px 32px;
                            }
                            &:is(details[id^="funding-links"]) > #sponsor-button {
                                width: 100%;
                                text-align: center;
                                @media (max-width: 556px) {
                                    font-size: 0;
                                    &.btn-sm .octicon {
                                        vertical-align: middle;
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
    }
}