DuckDuckGo - Wider, Prettier and Customizable

Customizable UserCSS for DuckDuckGo
2020-05-10 يوللانغان نەشرى. ئەڭ يېڭى نەشرىنى كۆرۈش.
ياردەم ئۈچۈن ئاپتورنىڭ بېتىنى زىيارەت قىلىش، سوئال سوراش، ئوبزور يېزىش ياكى قوليازمىنى پاش قىلىش.
Wrap lines
/* ==UserStyle==
@name           DuckDuckGo - Wider, Prettier and Customizable
@description    Customizable UserCSS for DuckDuckGo
@author         krisu (https://github.com/krisu5)
@namespace      github.com/krisu5/userstyles
@homepageURL    https://github.com/krisu5/userstyles/tree/master/DuckDuckGo%20-%20Wider%20Prettier%20and%20Customizable
@supportURL     https://github.com/krisu5/userstyles/issues
@version        1.0.2
@license        unlicense
@preprocessor   stylus
@var checkbox   ibm-plex-font      "Use 'IBM Plex' font (external load)"                        1
@var checkbox   wideScreen         "Wider layout (for 1920px+ wide resolution)"                 1
@var checkbox   biggerFont         "Bigger font (recommended when 'Wider layout' is enabled)"   1
@var checkbox   hideCheckmark      "Force hide visited link checkmark"                          0
@var checkbox   sidebarAnimation   "Delay showing sidebar in the pageload"                      1
==/UserStyle== */

@-moz-document domain("duckduckgo.com") {
/* ====================================================
   === [TOGGLE] Use "IBM Plex" font (external load) ===
   ==================================================== */
    
if ibm-plex-font {
    /* ibm-plex-sans-400normal - all */
    @font-face {
        font-family: 'IBM Plex Sans';
        font-style: normal;
        font-display: swap;
        font-weight: 400;
        src:
         local('IBM Plex Sans'),
         local('IBMPlexSans'), 
         url('https://cdn.jsdelivr.net/npm/@openfonts/[email protected]/files/ibm-plex-sans-all-400.woff2') format('woff2');
    }

    /* ibm-plex-sans-500normal - all */
    @font-face {
        font-family: 'IBM Plex Sans';
        font-style: normal;
        font-display: swap;
        font-weight: 500;
        src:
         local('IBM Plex Sans Medium'),
         local('IBMPlexSans-Medium'), 
         url('https://cdn.jsdelivr.net/npm/@openfonts/[email protected]/files/ibm-plex-sans-all-500.woff2') format('woff2');
    }

    /* ibm-plex-sans-600normal - all */
    @font-face {
        font-family: 'IBM Plex Sans';
        font-style: normal;
        font-display: swap;
        font-weight: 600;
        src:
         local('IBM Plex Sans SemiBold'),
         local('IBMPlexSans-SemiBold'), 
         url('https://cdn.jsdelivr.net/npm/@openfonts/[email protected]/files/ibm-plex-sans-all-600.woff2') format('woff2');
    }
        
    body, input, textarea, .search__input--adv { font-family: "IBM Plex Sans", "DDG_ProximaNova","DDG_ProximaNova_UI_0","DDG_ProximaNova_UI_1","DDG_ProximaNova_UI_2","DDG_ProximaNova_UI_3","DDG_ProximaNova_UI_4","DDG_ProximaNova_UI_5","DDG_ProximaNova_UI_6","Proxima Nova"; }

    #zero_click_wrapper, #zero_click_wrapper input, #zero_click_wrapper textarea { font-family: "DDG_ProximaNova","DDG_ProximaNova_UI_0","DDG_ProximaNova_UI_1","DDG_ProximaNova_UI_2","DDG_ProximaNova_UI_3","DDG_ProximaNova_UI_4","DDG_ProximaNova_UI_5","DDG_ProximaNova_UI_6","Proxima Nova"; }

    .result__title, #links .result__title b, #links .result__title strong {
        padding-bottom: 1px !important;
        font-weight: 500 !important;
    }
}

    
/* ===========================================================
   === [TOGGLE] Wider layout (for 1920px+ wide resolution) ===
   =========================================================== */

if wideScreen {
    @media only screen and (min-width: 1460px) {
        .cw { max-width: 1700px; }

        .has-zcm .header { width: 1063px; }

        .header__search-wrap { max-width: 905px; }

        .zcm-wrap--header { max-width: inherit; }

        .header__search-wrap, .content__internal { padding-right: 0; }

        .modal--dropdown--settings.is-showing { margin-left: -108px; }

        .results--main {
            max-width: 900px;
            margin-right: 50px;
        }
        
        .result__sitelink-col { width: 415px !important; }

        .result--more {
            width: 920px;
            margin-left: -10px;
        }

        .module--carousel__item:not(:last-child) { margin-right: 1.6%; }
    }
}

    
/* =========================================================================
   === [TOGGLE] Bigger font (recommended when "Wider layout" is enabled) ===
   ========================================================================= */
    
    if biggerFont { html { font-size: 99%; } } 
    

/* ==================================================
   === [TOGGLE] Force hide visited link checkmark ===
   ================================================== */

    if hideCheckmark { .result__check { display: none; } }
    
    
/* ======================================================
   === [TOGGLE] Delay showing sidebar in the pageload ===
   ====================================================== */

if sidebarAnimation {
    .results--sidebar {
        animation: showSidebar 0.75s ease-in-out 0.75s forwards;
        /* animation time = approximated load time for search results links */
        opacity: 0;
    }

    @keyframes showSidebar { to { opacity: 1; } }
}


/* ===============
   === Results ===
   =============== */

.result.highlight { background: hsl(0, 0%, 98%); }

.result__a { line-height: 1.3; }

.result__icon { margin-top: -6px; }
    

/* =========================
   === Results seperator ===
   ========================= */

.result__pagenum {
    font-size: 15px;
    margin-top: -4px;
}

.result__pagenum--side {
    padding: 5px 10px;
    background-color: #fafafa;
    border-radius: 50%;
    border: 1px solid #d9d9d9;
}

.result--sep { margin: 1em auto 1.25em; }

.result--sep--hr::before {
    background-color: #d9d9d9;
    right: 0px;
}


/* ==============================
   === Instant Answer modules ===
   ============================== */

.zci--calculator .tile__calc .tile__past-calc { height: 60px; }

.zci--timer .name { margin-top: 27px; }

.zci--timer .time_display { margin-top: -20px; }

.zci--timer .corner_btn.reset { top: 5px; }

.zci--timer .corner_btn.close { top: -3px; }

.zci--timer .play_pause a:after {
    right: 0;
    bottom: 0;
}

.tile__ctrl__btn {
    -moz-user-select: none;
    -webkit-user-select: none;
    user-select: none;
}


/* =============
   === Misc. ===
   ============= */

.zcm__sep--h:before { top: 0.2em; }
    
.zcm__sep--h+.zcm__item { padding-left: 0.85em; }
    
.dropdown__switch { margin-top: 10.5px; }

.dropdown__button::after { margin-top: -5px; }

.module__link--two-line { padding-bottom: 5px; }
    
.about-profiles { padding-bottom: 5px; }
    
}