Skip to content

www.esv.org font & color customization by lwchkg

Screenshot of www.esv.org font & color customization

Details

Authorlwchkg

LicenseCC0

Categorywww.esv.org

Created

Updated

Size1.8 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

Font: Caladea & Roboto Flex
Color: White text for dark style to increase clarity
Column size: About 47.6em

Notes

Userstyle doesn't have notes.

Source code

/* ==UserStyle==
@name           www.esv.org font & color customization
@namespace      github.com/openstyles/stylus
@version        1.0.3
@description    Change in font, column width and text color of dark theme.
@author         WC Leung
==/UserStyle== */
@-moz-document domain("www.esv.org") {
    @import url('https://fonts.googleapis.com/css2?family=Caladea&family=Roboto+Flex:opsz,wght@8..144,400;8..144,700&display=swap');
    
    * {
        font-variant-numeric: proportional-nums;
    }
    
    .theme-black {
        --main-text-color: #fff;
        --main-footer-text-color: #fff;
        --main-link-color: #b6ecff;
        --main-subheading-text-color: #fff;
        
        ::selection { background: #026591; }
    }
    
    .bible-column {
        padding-left: 8rem;
        padding-right: 8rem;
    }
    
    .font-size-extra-large #bible-content { max-width: 100rem; }
    .font-size-large #bible-content { max-width: 90.48rem; }
    .font-size-medium #bible-content { max-width: 80.95rem; }
    .font-size-small #bible-content { max-width: 71.43rem; }
    .font-size-extra-small #bible-content { max-width: 61.90rem; }

    #bible-content h3 {
        font-family: "Roboto Flex", san-serif;
        font-weight: 700;
    }

    #bible-content p {
        font-family: "Caladea", serif;
        font-weight: 400;
    }

    #bible-content .crossref,
    #bible-content .footnote,
    #bible-content .verse-num {
        font-family: "Roboto Flex", san-serlf;
        font-size: .6em;
        vertical-align: .5em;
    }
    
    .chapter-num {
        word-spacing: -0.05em;
    }
    
    /* Real small caps. */
    .small-caps-lower {
        font-variant-caps: small-caps;
        font-size: inherit;
        text-transform: none;
    }
}

Reviews

No reviews yet.