ManyVids responsive + customizations

ManyVids website is more suitable for wide screens.

/* ==UserStyle==
@name           ManyVids responsive + customizations
@version        1.0.2
@description    ManyVids website is more suitable for wide screens.
@author         BreatFR (https://breat.fr)
@namespace      https://gitlab.com/breatfr
@homepageURL    https://gitlab.com/breatfr/manyvids
@supportURL     https://discord.gg/Q8KSHzdBxs
@license        AGPL-3.0-or-later; https://www.gnu.org/licenses/agpl-3.0.txt
@preprocessor   stylus

@var    checkbox    bigmedias   "Big medias"        1
@var    text        fontsize    "Custom font size"  1.2rem
@var    checkbox    widemode    "Wide mode"         1
==/UserStyle== */

/* === Credits ===
Website         https://breat.fr
facebook        https://www.facebook.com/breatfroff
mastodon        https://mastodon.social/@breat_fr
telegram        https://t.me/breatfr
vk              https://vk.com/breatfroff
X (twitter)     https://x.com/breatfroff
=== Credits === */

@-moz-document domain("manyvids.com") {
    :root {
        --fontsize: fontsize;
    }
    
    /* Custom font size */
    :root,
    a[class^="CardCreatorHeaderUI_creatorLink__"],
    a[class^="SubNav_menuItem__"],
    div,
    input,
    label,
    p:not(.mav-badge),
    pre,
    span:not([class^="CardCreatorHeaderUI_topMvRank__"],[class^="CardCreatorHeaderUI_topClubEarner__"]),
    strong,
    textarea {
        font-size: fontsize !important;
        line-height: 1.5 !important;
    }
    [aria-label="Twitter Icon"] svg {
        height: auto !important;
        width: calc(var(--fontsize) - .2rem) !important;
    }
    a.mav-button-primary,
    button:not([value="Send application"]),
    .banner-info p,
    [class^="ViewMore_viewMore__"],
    [class^="SubNavUI_container__"] a,
    [class^="CardCreatorHeaderUI_topClubEarner__"],
    [class^="CardCreatorHeaderUI_topMvRank__"] {
        font-size: calc(var(--fontsize) - .3rem) !important;
        line-height: 1.2 !important;
    }
    a#uploadButton,
    a[value="Download application"],
    button:not(.rmp-button),
    div#photoIDImageBtn,
    [class^="ViewMore_viewMore__"],
    .nav-title {
        padding: 0 10px !important;
        width: max-content !important;
    }
    a.mav-button-primary,
    .banner-info p {
        padding: 0 10px !important;
        white-space: wrap !important;
    }
    
    .card-media * {
        border-radius: .5em !important;
    }
    
    if bigmedias {
        [class^="post_body__"],
        [class^="image_container__"],
        [class^="MessagesBroadcast_container-message-image__"],
        [class^="MVPlayer_mv_container__"],
        [class^="post_container__"],
        [class^="single_image__"],
        [class^="single_imageContent__"],
        [class^="videoAuto_postType___"],
        #main-video-player,
        img[style="color: transparent;"]:not([class^="post_avatar__"],[data-testid="search-container"] [alt="avatar"],[alt="Google logo"],[alt="X logo"]),
        video {
            height: auto !important;
            max-height: 100% !important;
            max-width: 100% !important;
            object-fit: contain !important;
            width: 100% !important;
        }
        [class^="post_content__"] {
            padding-right: 20px !important;
        }
    }
    
    if widemode {
        [data-testid="search-container"] {
            margin-top: 20px;
        }
        [class^="avatar_avatar__"] {
            aspect-ratio: 1 / 1;
            height: auto;
            width: auto;
        }
        [class^="CardFooter_container__"],
        [class^="VideoCardUI_footerContent__"] {
            height: auto !important;
        }
        [class^="VideoCardUI_videoTitle__"] a {
            text-overflow: initial;
            white-space: normal;
        }
    }
}

@-moz-document url("https://www.manyvids.com/Vids/"), regexp("https://www\\.manyvids\\.com/Vids/\\?[^/]*") {
    if widemode {
        .vids-page,
        .wrapper.is-filter-visible {
            margin-top: 10px !important;
            max-width: 100% !important;
            width: 100% !important;
        }
        .wrapper.is-filter-visible {
            grid-column-gap: 20px !important;
        }
        
        body:not(:has(.nav-bar.collapsed)) .vids-page {
            margin-left: 240px !important;
        }
        body:has(.nav-bar.collapsed) .vids-page {
            margin-left: 75px !important;
        }
        .video-card-list {
            grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)) !important;
        }
        .filter-panel {
            width: auto !important;
        }
    }
}

@-moz-document regexp("https://www\\.manyvids\\.com/results\\?[^/]*") {
    if widemode {
        body>div:nth-of-type(1)>div:nth-of-type(1) {
            max-width: 100% !important;
            width: 100% !important;
        }
        .content_wrapper__IMR_j.content_collapsed__QvzFk>main>div {
            margin-left: 50px !important;
            max-width: 100% !important;
            width: 100% !important;
        }
        .content_wrapper__IMR_j.content_collapsed__QvzFk>main>div>section {
            margin-left: -30px;
            padding-right: 140px;
        }
        .content_wrapper__IMR_j.content_notCollapsed__c9BAb>main>div {
            margin-left: 50px !important;
            max-width: 100% !important;
            width: 100% !important;
        }
        .content_wrapper__IMR_j.content_notCollapsed__c9BAb>main>div>section {
            margin-left: -30px;
            padding-right: 30px;
        }
        .filter-panel {
            width: auto !important;
        }
    }
}

@-moz-document url-prefix("https://www.manyvids.com/Video/") {
    if widemode {
        [class^="videoPage_playerActivity__zPeds"] {
            max-width: 100% !important;
            padding: 0 20px;
            width: 100% !important;
        }
        
        [class^="videoPage_playerActivityContent__"] {
            box-sizing: border-box !important;
            grid-template-areas: "player activity_right" "activity_right";
            grid-template-columns: auto 300px !important;
        }        
        body:has(aside[class^="bigSideBar_big_sidebar__"]) [class^="videoPage_playerActivityContent__"] {
            margin-left: 225px !important;            
        }
        body:not(:has(aside[class^="bigSideBar_big_sidebar__"])) [class^="videoPage_playerActivityContent__"] {
            margin-left: 0 !important;
        }
        .rmp-control-bar-hint {
            border-radius: 10px !important;
            height: auto !important;
            width: auto !important;
        }
        .rmp-large .rmp-module-overlay,
        .rmp-overlay-levels-area * {
            height: auto !important;
            width: auto !important;
        }
        
        [data-testid="overlay"] {
            display: none !important;
        }
        .wrapper.is-filter-visible {
            grid-column-gap: 20px !important;
        }
        [class^="banner_banner__"] {
            height: auto;
        }
    }
}

@-moz-document regexp("https://www\\.manyvids\\.com/Profile/[^/]+/[^/]+/Store/Videos"), regexp("https://www\\.manyvids\\.com/Profile/[^/]+/[^/]+/Store/Videos\\?[^/]*") {
    if widemode {
        body>div>div:nth-of-type(1)>div:nth-of-type(1),
        body>div>div:nth-of-type(1)>div:nth-of-type(2),
        body>div>div:nth-of-type(1)>div:nth-of-type(1)>div {
            max-width: 100% !important;
            padding: 0 20px;
            width: 100% !important;
        }
        .wrapper.is-filter-visible {
            grid-column-gap: 20px !important;
        }
        
        [class^="ProfileTabGrid_grid__"],
        [class^="ProfileTabGrid_itemsGrid__"] {
            gap: 20px!important;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)) !important;
        }
    }
}

@-moz-document regexp("https://www\\.manyvids\\.com/Profile/[^/]+/[^/]+/Store/Items"), regexp("https://www\\.manyvids\\.com/Profile/[^/]+/[^/]+/Store/Items\\?[^/]*") {
    if widemode {
        body>div>div:nth-of-type(1)>div:nth-of-type(1),
        body>div>div:nth-of-type(1)>div:nth-of-type(2),
        body>div>div:nth-of-type(1)>div:nth-of-type(1)>div {
            max-width: 100% !important;
            padding: 0 20px;
            width: 100% !important;
        }
        .wrapper.is-filter-visible {
            grid-column-gap: 20px !important;
        }
        
        [class^="ProfileTabGrid_grid__"],
        [class^="ProfileTabGrid_itemsGrid__"] {
            gap: 20px!important;
            grid-template-columns: repeat(auto-fit, minmax(266px, 1fr)) !important;
        }
    }
}

@-moz-document regexp("https://www\\.manyvids\\.com/Profile/[^/]+/[^/]+/Store/Custom") {
    if widemode {
        body>div>div:nth-of-type(1)>div:nth-of-type(1),
        body>div>div:nth-of-type(1)>div:nth-of-type(2),
        body>div>div:nth-of-type(1)>div:nth-of-type(1)>div {
            max-width: 100% !important;
            padding: 0 20px;
            width: 100% !important;
        }
    }
}

@-moz-document regexp("https://www\\.manyvids\\.com/Activity/[^/]+/[^/]+/club"), regexp("https://www\\.manyvids\\.com/Activity/[^/]+/[^/]+/club\\?[^/]*") {
    if widemode {
        body>div>div:nth-of-type(1)>div:nth-of-type(1),
        body>div>div:nth-of-type(1)>div:nth-of-type(2),
        body>div>div:nth-of-type(1)>div:nth-of-type(1)>div,
        body>div>div:nth-of-type(1)>div:nth-of-type(2)>nav,
        body>div>div:nth-of-type(1)>div:nth-of-type(2)>div,
        body>div>div:nth-of-type(1)>div:nth-of-type(2)>div>div {
            max-width: 100% !important;
            padding: 20px;
            width: 100% !important;
        }
        body>div>div:nth-of-type(1)>div:nth-of-type(1) {
            margin: 0 auto !important;
        }
        body>div>div:nth-of-type(1)>div:nth-of-type(2),
        body>div>div:nth-of-type(1)>div:nth-of-type(2)>nav {
            padding: 0 20px !important;
        }
        .wrapper.is-filter-visible {
            grid-column-gap: 20px !important;
        }
    }
}

@-moz-document regexp("https://www\\.manyvids\\.com/Profile/[^/]+/[^/]+/live") {
    if widemode {
        body>div>div:nth-of-type(1)>div:nth-of-type(1),
        body>div>div:nth-of-type(1)>div:nth-of-type(1)>div,
        body>div>div:nth-of-type(1)>div:nth-of-type(1)>div>div {
            max-width: 100% !important;
            padding: 20px;
            width: 100% !important;
        }
        body>div>div:nth-of-type(1)>div:nth-of-type(1) {
            margin: 0 auto !important;
        }
        [class^="ticker_container__"],
        [class^="ticker_tickerContainer__"] {
            max-width: 100% !important;
            overflow: hidden;
        }
    }
}

@-moz-document regexp("https://www\\.manyvids\\.com/Profile/[^/]+/[^/]+/Purchased") {
    if widemode {
        body>div>div:nth-of-type(1)>div:nth-of-type(1),
        body>div>div:nth-of-type(1)>div:nth-of-type(2),
        body>div>div:nth-of-type(1)>div:nth-of-type(1)>div {
            max-width: 100% !important;
            padding: 0 20px;
            width: 100% !important;
        }
        .wrapper.is-filter-visible {
            grid-column-gap: 20px !important;
        }
        
        [class^="ProfileTabGrid_grid__"],
        [class^="ProfileTabGrid_itemsGrid__"] {
            gap: 20px!important;
            grid-template-columns: repeat(auto-fit, minmax(266px, 1fr)) !important;
        }
    }
}

@-moz-document regexp("https://www\\.manyvids\\.com/Social/[^/]+/[^/]+/Followers/"), regexp("https://www\\.manyvids\\.com/Social/[^/]+/[^/]+/Following/") {
    if widemode {
        #social-app>div:nth-of-type(2),
        .description {
            max-width: 100% !important;
            padding: 0 20px;
            width: 100% !important;
        }
        #social-app>div:nth-of-type(2)>div:nth-of-type(2) {
            grid-template-columns: 300px 1fr !important;
            max-width: 100% !important;
        }
    }
}

@-moz-document url("https://www.manyvids.com/Create-Free-Account"), url("https://www.manyvids.com/Login") {
    if widemode {
        [class^="page_page__"],
        [class^="page_fullHeight__"],
        [class^="page_contentContainer__"],
        [class^="SignupFooter_footer__"] {
            max-width: 100% !important;
            padding: 0 20px;
            width: 100% !important;
        }
        main {
            max-width: 60% !important;
        }
        [class^="SignupAccountTypeSelection_accountType__"] {
            justify-content: center;
        }
    }
}

@-moz-document url("https://www.manyvids.com/forgot-password") {
    if widemode {
        body>div>div:nth-of-type(2),
        body>div>div:nth-of-type(2)>div {
            max-width: 100% !important;
            padding: 0 20px;
            width: 100% !important;
        }
    }
}

@-moz-document url-prefix("https://www.manyvids.com/Post/") {
    if widemode {
        body>div>div:nth-of-type(1)>div:nth-of-type(1),
        body>div>div:nth-of-type(1)>div:nth-of-type(2),
        body>div>div:nth-of-type(1)>div:nth-of-type(1)>div {
            max-width: 100% !important;
            padding: 0 20px;
            width: 100% !important;
        }
        [class^="breadcrumbs_container__"] {
            justify-content: flex-start !important;
            margin-top: 20px;
        }
    }
}

@-moz-document url("https://www.manyvids.com/notifications") {
    if widemode {
        body>div>div:nth-of-type(1)>div>div>div {
            max-width: 100% !important;
            padding: 0 20px;
            width: 100% !important;
        }
        [class^="breadcrumbs_container__"] {
            justify-content: flex-start !important;
            margin-top: 20px;
        }
    }
}

@-moz-document url-prefix("https://www.manyvids.com/Inbox/") {
    if widemode {
        .fixed-wrapper {
            max-width: 100% !important;
            padding: 0 20px;
            width: 100% !important;
        }
        .fixed-wrapper>div>div>div>div:nth-of-type(2)>div,
        li#conversation-card,
        .media-body {
            height: auto !important;
            max-width: 100% !important;
            overflow: hidden !important;
            width: 100% !important;
        }
        .scroll-element_outer {
            display: none !important;
            height: 0;
            width: 0;
        }
        .notes-tabs {
            left: 0;
        }
    }
}

@-moz-document url("https://www.manyvids.com/inbox/broadcast") {
    if widemode {
        [class^="Conversation_container-options-date__"] {
            height: auto !important;
        }
    }
}

@-moz-document url("https://www.manyvids.com/Account-settings/"), url("https://www.manyvids.com/Security-center/") {
    if widemode {
        .fixed-wrapper {
            max-width: 100% !important;
            padding: 0 20px;
            width: 100% !important;
        }
        [class^="breadcrumbs_container__"] {
            justify-content: flex-start !important;
            margin-top: 20px;
        }
    }
}

@-moz-document url("https://www.manyvids.com/View-my-history/1/") {
    if widemode {
        .fixed-wrapper {
            max-width: 100% !important;
            padding: 0 20px;
            width: 100% !important;
        }
        [class^="breadcrumbs_container__"] {
            justify-content: flex-start !important;
            margin-top: 20px;
        }
    }
    form>div>input {
        height: fontsize !important;
    }
    form>div button {
        height: auto !important;
    }
    #btn_download_all_vids {
        right: 20px;
    }
}