ModernRFCs

A new interface for reading RFCs in modern times.

Você precisará instalar uma extensão como Tampermonkey, Greasemonkey ou Violentmonkey para instalar este script.

Você precisará instalar uma extensão como Tampermonkey para instalar este script.

Você precisará instalar uma extensão como Tampermonkey ou Violentmonkey para instalar este script.

Você precisará instalar uma extensão como Tampermonkey ou Userscripts para instalar este script.

Você precisará instalar uma extensão como o Tampermonkey para instalar este script.

Você precisará instalar um gerenciador de scripts de usuário para instalar este script.

(Eu já tenho um gerenciador de scripts de usuário, me deixe instalá-lo!)

Você precisará instalar uma extensão como o Stylus para instalar este estilo.

Você precisará instalar uma extensão como o Stylus para instalar este estilo.

Você precisará instalar uma extensão como o Stylus para instalar este estilo.

Você precisará instalar um gerenciador de estilos de usuário para instalar este estilo.

Você precisará instalar um gerenciador de estilos de usuário para instalar este estilo.

Você precisará instalar um gerenciador de estilos de usuário para instalar este estilo.

(Eu já possuo um gerenciador de estilos de usuário, me deixar fazer a instalação!)

/* ==UserStyle==
@name               ModernRFCs
@namespace          sun/userstyles
@version            1.0.8
@description        A new interface for reading RFCs in modern times.
@compatible         chrome
@compatible         edge
@compatible         firefox
@compatible         opera
@compatible         safari
@homepageURL        https://forgejo.sny.sh/sun/userstyles
@supportURL         https://forgejo.sny.sh/sun/userstyles/issues
@contributionURL    https://liberapay.com/sun
@contributionAmount €1.00
@author             Sunny <[email protected]>
@icon               https://forgejo.sny.sh/sun/userstyles/raw/branch/main/icons/ModernRFCs.ico
@copyright          2022-present, Sunny (https://sny.sh/)
@license            Hippocratic License; https://forgejo.sny.sh/sun/userstyles/src/branch/main/LICENSE.md
@preprocessor       stylus
==/UserStyle== */

@-moz-document regexp("https://www\\.rfc-editor\\.org\\/rfc\\/rfc\\d+\\.html(#.*)?")
{
  @font-face {
    font-family: "Fira Code";
    src: url("https://cdn.jsdelivr.net/npm/firacode/distr/woff2/FiraCode-VF.woff2");
  }
  html:not(.RFC) {
    body {
      width: max-content;
      margin: auto;
      color: #212121;
      @media (prefers-color-scheme: dark) {
        background-color: #212121;
        color: white;
      }
      .docinfo {
        display: block;
        white-space: initial;
        &:first-child {
          position: fixed;
          bottom: 0;
          left: 0;
          display: flex;
          align-items: center;
          justify-content: center;
          width: 100%;
          height: 80px;
          background-color: #f5f5f5;
          @media (prefers-color-scheme: dark) {
            background-color: #424242;
          }
          font-size: 0;
          a {
            display: inline-block;
            width: 80px;
            height: 40px !important;
            margin: 10px;
            background-repeat: no-repeat;
            background-position: center;
            border-radius: 20px;
            transition: all 125ms ease-in-out;
            &:hover {
              background-color: #eeeeee;
              @media (prefers-color-scheme: dark) {
                background-color: #9e9e9e;
              }
            }
            &:focus,
            &[href^="/rfc/rfc"][href$=".html"] {
              background-color: #e0e0e0;
              @media (prefers-color-scheme: dark) {
                background-color: #757575;
              }
            }
            &[href="https://www.rfc-editor.org"]
            {
              background-image: url(https://fonts.gstatic.com/s/i/materialicons/home/v16/24px.svg);
            }
            &[href^="/rfc/rfc"][href$=".txt"] {
              background-image: url(https://fonts.gstatic.com/s/i/materialicons/subject/v13/24px.svg);
            }
            &[href^="/rfc/pdfrfc/rfc"][href$=".txt.pdf"],
            &[href^="/rfc/rfc"][href$=".pdf"] {
              background-image: url(https://fonts.gstatic.com/s/i/materialicons/print/v16/24px.svg);
            }
            &[href^="/rfc/rfc"][href$=".html"] {
              background-image: url(https://fonts.gstatic.com/s/i/materialicons/preview/v7/24px.svg);
            }
            &[href^="https://datatracker.ietf.org/doc/rfc"]
            {
              background-image: url(https://fonts.gstatic.com/s/i/materialicons/more_vert/v19/24px.svg);
            }
            &[href^="https://datatracker.ietf.org/ipr/search"][href$="submit=rfc"]
            {
              background-image: url(https://fonts.gstatic.com/s/i/materialicons/flag/v18/24px.svg);
            }
            &[href^="/errata/rfc"] {
              background-image: url(https://fonts.gstatic.com/s/i/materialicons/warning/v17/24px.svg);
            }
            &[href^="https://www.rfc-editor.org/info/rfc"]
            {
              background-image: url(https://fonts.gstatic.com/s/i/materialicons/info/v20/24px.svg);
            }
            @media (prefers-color-scheme: dark) {
              filter: invert(1);
            }
          }
        }
        &:nth-child(5),
        &:nth-child(7):not(:empty):not(:-moz-only-whitespace) {
          position: fixed;
          border-radius: 28px;
          margin: 2.5em;
          padding: 0.5em 2em 1.25em 2em;
          color: white !important;
          box-shadow:
            0 1px 3px rgba(0, 0, 0, 0.12),
            0 1px 2px rgba(0, 0, 0, 0.24);
          text-transform: uppercase;
          a {
            color: inherit;
          }
          &:before {
            content: "";
            height: 24px;
            display: inline-block;
            position: relative;
            top: 7px;
            background-repeat: no-repeat;
            filter: invert(1);
          }
        }
        &:nth-child(7) {
          top: 0;
          left: 0;
          background-color: #f44336;
          span {
            color: white !important;
          }
          &:before {
            width: 30px;
            background-image: url(https://fonts.gstatic.com/s/i/materialicons/warning/v17/24px.svg);
          }
        }
        &:nth-child(5) {
          top: 0;
          right: 0;
          background-color: #2196f3;
          &:before {
            width: 28px;
            background-image: url(https://fonts.gstatic.com/s/i/materialicons/info/v20/24px.svg);
          }
        }
      }
      > br {
        display: none;
      }
      h1,
      h2,
      h3,
      h4,
      h5,
      h6,
      pre,
      .h1,
      .h2,
      .h3,
      .h4,
      .h5,
      .h6,
      .pre {
        font-family: "Fira Code";
        line-height: 1.3333;
      }
      pre {
        &:first-of-type {
          margin-top: 2.5em;
        }
        &:last-of-type {
          margin-bottom: calc(2.5em + 80px);
        }
      }
      .grey {
        color: #9e9e9e;
      }
      a,
      .grey a {
        text-decoration: none;
        color: #2196f3;
        &:visited {
          color: #9c27b0;
        }
        &:active {
          color: #f44336;
        }
        @media (prefers-color-scheme: dark) {
          color: #64b5f6;
          &:visited {
            color: #ba68c8;
          }
          &:active {
            color: #e57373;
          }
        }
      }
      hr {
        border: 1px solid #f5f5f5;
        @media (prefers-color-scheme: dark) {
          border: 1px solid #424242;
        }
        border-bottom: none !important;
        margin-top: 1.5em;
      }
    }
  }
}