2594 lines · 60.0 KB · CSS
RawDownload
/*************//* VARIABLES *//*************/ :root {    --GW-serif-font-stack: "Source Serif 4", "Apple Garamond", "Baskerville", "Libre Baskerville", "Droid Serif", "Times New Roman", "Times", serif, "Noto Emoji", "Quivira";    --GW-sans-serif-font-stack: "Source Sans 3", "Lucida Sans Unicode", "Helvetica", "Trebuchet MS", sans-serif, "Noto Emoji", "Quivira";    --GW-monospaced-font-stack: "IBM Plex Mono", "Liberation Mono", "Consolas", "Courier", monospace, "Noto Emoji", "Quivira";    --GW-monospaced-serif-font-stack: "Nimbus Mono", "Free Mono", "Courier New", monospace, "Noto Emoji", "Quivira";     --GW-body-text-font-size: 20px;     --GW-body-max-width: 935px;    --GW-body-side-padding: 20px;}@media all and (max-width: 649px) {    :root {        --GW-body-text-font-size: 18px;         --GW-body-side-padding: 16px;    }}  /***********//* GENERAL *//***********/ html,.shadow-body {    --base-font-size: var(--GW-body-text-font-size);    --background-color: var(--GW-body-background-color);     background-color: var(--background-color);    color: var(--GW-body-text-color);    font-weight: 400;    font-family: var(--GW-serif-font-stack);    font-size: var(--base-font-size);}  /****************//* ADAPTIVENESS *//****************/ /*  Utility classes: show something only on mobile (`.desktop-not`)    or only on desktop (`.mobile-not`). */@media all and (max-width: 649px) {    .mobile-not {        display: none !important;    }}@media all and (min-width: 650px) {    .desktop-not {        display: none !important;    }}   /**********//* LAYOUT *//**********/ html,body {    margin: 0;    padding: 0;} body {    overflow-x: hidden;} main {    position: relative;    box-sizing: border-box;    min-height: 100vh;    max-width: var(--GW-body-max-width);    margin: 0 auto;    padding: 1rem             var(--GW-body-side-padding)             1.25rem             var(--GW-body-side-padding);    display: flex;    flex-flow: column;}@media all and (max-width: 649px) {    main {        overflow: hidden;        padding: 1rem                 var(--GW-body-side-padding)                 4.25rem                 var(--GW-body-side-padding);    }}  /***********//* SIDEBAR *//***********/ #sidebar {    position: relative;    display: flex;} /*  Sidebar links (including logo). */#sidebar a {    border: 1px dotted currentColor;    text-align: center;    margin: 1px 0 1px 2px;} /*  Logo. */#sidebar a.logo {    display: flex;    align-items: center;    margin: 1px 0;}#sidebar a.logo .logo-image {    width: var(--logo-width);    height: calc(var(--logo-width) * 94/80);} /*  Sidebar links (not including logo). */#sidebar .sidebar-links {    flex: 1 1 100%;    display: flex;    flex-flow: row wrap;}#sidebar .sidebar-links a {    flex: 1 1 auto;    padding: 0.25em 0.75em;} @media all and (max-width: 649px) {    #sidebar {        margin-right: -1px;    }     /*  Logo.     */    #sidebar a.logo {        margin: 1px 0 1px -1px;        padding: 0.5em 0.375em;    }    #sidebar a.logo .logo-image {        --logo-width: 2.5em;    }     /*  Sidebar links (not including logo).     */    #sidebar .sidebar-links a {        font-variant-caps: small-caps;        flex: 1 1 20%;    }     #sidebar .sidebar-links a.site {        order: -3;    }    #sidebar .sidebar-links a.me {        order: -2;    }    #sidebar .sidebar-links a.patreon {        order: -1;    }    #sidebar .sidebar-links a.new {        order: 1;    }    #sidebar .sidebar-links a.blog {        order: 2;    }    #sidebar .sidebar-links a.links {        order: 3;    }} @media all and (min-width: 650px) {    /*  Sidebar links (including logo).     */    #sidebar a {        color: var(--GW-nav-header-link-color);    }    #sidebar a:hover {        color: var(--GW-nav-header-link-hover-color);    }     /*  Sidebar links (not including logo).     */    #sidebar .sidebar-links a {        text-transform: uppercase;        font-weight: 600;    }     @media all and (max-width: 779px) {        #sidebar .sidebar-links .mobile-not {            display: none;        }    }    @media all and (max-width: 1179px) {        /*  Logo.         */        #sidebar a.logo {            padding: 0.25em 0.375em;        }        #sidebar a.logo .logo-image {            --logo-width: 1em;        }    }    @media all and (min-width: 1180px) {        /*  Logo.         */        #sidebar a.logo {            position: absolute;            right: 100%;            margin: 0 0.75em 0 0;            padding: 0.125em;            border: none;            opacity: 0.5;        }        #sidebar a.logo:hover,        #sidebar a.logo.bright {            opacity: 1.0;        }        #sidebar a.logo.fading {            transition:                opacity 1s ease;        }        #sidebar a.logo .logo-image {            --logo-width: 4em;        }         /*  Sidebar links (not including logo).         */        #sidebar .sidebar-links a:first-child {            margin-left: 0;        }    }}  /*********************//* ARTICLE CONTAINER *//*********************/ article {    margin-top: 1.75rem;    flex: 1 1 auto;}  /***************//* PAGE HEADER *//***************/ @media all and (max-width: 649px) {    header {        margin: 0 1rem 1.75rem 1rem;    }}@media all and (min-width: 650px) {    header {        margin: 0.375rem 2rem 1.75rem 2rem;    }} header h1 {    margin: 0;    text-align: center;    line-height: 1.15;    text-transform: none;    font-variant-caps: small-caps;    font-size: 2.5em;    font-weight: 600;    letter-spacing: -1px;}@media all and (max-width: 649px) {    header h1 {        font-size: 2em;    }} /*  Source Serif 4 has no italic small caps, sadly. */header h1 em {    font-variant-caps: normal;}  /***********************//* PAGE METADATA BLOCK *//***********************/ #page-metadata {    --text-alignment: center;    --text-hyphenation: none;    --text-indent: 0em;     line-height: 1.5;} #page-metadata:not(:last-child) {    margin-bottom: 2.25rem;} #page-metadata > * + * {    margin-top: 0.75em;} /*************//*  Page tags. */#page-metadata .link-tags {    font-family: var(--GW-monospaced-font-stack);    font-style: italic;}#page-metadata .link-tags a {    white-space: nowrap;    margin-right: 0.05em;    background-position: 0% calc(100% - 1px);}#page-metadata .link-tags a:nth-child(n+2) {    margin-left: 0.10em;} /********************//*  Page description. *//*  Override normal handling of italics: before, we wrapped descriptions in    `<em>`; however, they compile to HTML which can contain italics of their    own (eg. book titles). This causes HTML Tidy to warn about nested italics    (which is valid HTML but *usually* means you’ve made an error - this often    triggers when I mess up bolding, for example, like on /gpt-3). So we    removed the wrapper in favor of the above `font-style: italic`. However,    now the titles don’t unitalicize automatically like they would for nested    italics! So we force italicized titles back to normal Roman font to match    the expected typographic convention. */#page-metadata .page-description {    font-style: italic;}#page-metadata .page-description em {    font-style: normal;} /************************//*  Page metadata fields. */#page-metadata .page-metadata-fields {    display: flex;    flex-flow: row wrap;    justify-content: center;}#page-metadata .page-metadata-fields > span {    white-space: nowrap;}/*  Interpunct separators for the metadata fields; looks nicer than semicolons    or slashes. */#page-metadata .page-metadata-fields > span::after {    content: "\00B7"; /* interpunct MIDDLE DOT (U+00B7) '·'; TODO: replace with BULLET .separator-inline? */    margin: 0 0.75em;}/*  No separator at line end. */#page-metadata .page-metadata-fields .page-importance::after,#page-metadata .page-metadata-fields > span:last-child::after {    display: none;}/*  Adjust icon spacing. */#page-metadata .page-metadata-fields .progress-indicator-icon {    margin: 0 0 0 0.25em;}/*  Adjust z-order of text elements. */#page-metadata .page-metadata-fields a + span {    position: relative;    z-index: 1;} /*  Flex order. *//* date, author, status */#page-metadata .page-metadata-fields .page-author,#page-metadata .page-metadata-fields .page-date-range,#page-metadata .page-metadata-fields .page-status {    order: 1;}/* certainty, importance */#page-metadata .page-metadata-fields .page-confidence,#page-metadata .page-metadata-fields .page-importance {    order: 3;}/* backlinks, similar, bibliography */#page-metadata .page-metadata-fields .page-backlinks,#page-metadata .page-metadata-fields .page-similars,#page-metadata .page-metadata-fields .page-link-bibliography {    order: 5;} /*  Author. */#page-metadata .page-metadata-fields .page-author {    white-space: normal;} /*  Importance. */#page-metadata .page-metadata-fields .page-importance {    font-variant-numeric: tabular-nums;} /*=------------=*//*= Responsive =*//*=------------=*/ @media all and (min-width: 650px) {    #page-metadata {        font-size: calc((19/20) * var(--GW-body-text-font-size));        line-height: calc(1.5 / (19/20));    }     /*  Page tags.     */    #page-metadata .link-tags {        font-size: calc((16/20) * var(--GW-body-text-font-size));    }     /*  Page metadata fields.     */    #page-metadata .page-metadata-fields {        font-size: calc((18/20) * var(--GW-body-text-font-size));    }    /* line break in one place */    #page-metadata .page-metadata-fields::after {        content: "";        width: 100%;        height: calc(1em * (4/20));    }    /* break between certainty/importance and backlinks/similar/bibliography */    #page-metadata .page-metadata-fields::after {        order: 4;    }}@media all and (max-width: 649px) {    #page-metadata {        font-size: calc((17/18) * var(--GW-body-text-font-size));    }     /*  Page tags.     */    #page-metadata .link-tags {        font-size: calc((16/18) * var(--GW-body-text-font-size));    }     /*  Page description.     */    #page-metadata .page-description {        line-height: calc(25/17);    }     /*  Page metadata fields.     */    #page-metadata .page-metadata-fields {        display: flex;        flex-flow: row wrap;        justify-content: center;        font-size: calc((16/18) * var(--GW-body-text-font-size));        line-height: calc(25/16);    }    /* line breaks in two places */    #page-metadata .page-metadata-fields::before,    #page-metadata .page-metadata-fields::after {        content: "";        width: 100%;        height: calc(1em * (3/18));    }    /* break between date/status and certainty/importance */    #page-metadata .page-metadata-fields::before {        order: 2;    }    /* break between certainty/importance and backlinks/similar/bibliography */    #page-metadata .page-metadata-fields::after {        order: 4;    }    /*  No separator at line end.     */    #page-metadata .page-metadata-fields .page-author::after,    #page-metadata .page-metadata-fields .page-status::after {        display: none;    }    /*  Author (on its own line).     */    #page-metadata .page-metadata-fields .page-author {

Lines 1–500 of 2594.