Tema do Big Brother

Módulo de Avaliação:

Cores do Tema:

Cor do Tema--medium-accent(33, 33, 33)

Cor Secundária--dark-accent(17, 17, 17)

Cor Alternativa--alt-accent(215, 215, 215)

Cor Clara--bright-accent(51, 51, 51)

{$color5-name}{$color5-variable}{$color5-info}

{$color6-name}{$color6-variable}{$color6-info}

{$subcolor1-name}{$subcolor1-variable}{$subcolor1-info}

{$subcolor2-name}{$subcolor2-variable}{$subcolor2-info}

{$subcolor3-name}{$subcolor3-variable}{$subcolor3-info}

{$subcolor4-name}{$subcolor4-variable}{$subcolor4-info}

{$subcolor5-name}{$subcolor5-variable}{$subcolor5-info}

{$subcolor6-name}{$subcolor6-variable}{$subcolor6-info}

{$subcolor7-name}{$subcolor7-variable}{$subcolor7-info}

{$subcolor8-name}{$subcolor8-variable}{$subcolor8-info}

{$subcolor9-name}{$subcolor9-variable}{$subcolor9-info}

{$subcolor10-name}{$subcolor10-variable}{$subcolor10-info}

{$subcolor11-name}{$subcolor11-variable}{$subcolor11-info}

{$subcolor12-name}{$subcolor12-variable}{$subcolor12-info}

---

Este é um tema baseado no Black Highlighter feito por L200. Este tema foi criado a fim de ser usado para o Grupo de Interesse Lusófono da Olhos Anônimos Ltda.

Você precisará importar o tema Black Highlighter também a fim de usar este tema. Para aprender mais sobre o tema do Black Highlighter, clique aqui.

Para importar este tema, adicione isso à sua página:

[[include :scp-pt-br:theme:black-highlighter-theme]]
[[include :scp-pt-br:theme:big-brother]]

Linhas horizontais podem ser criadas com 5 hifens "- - - - -" e se estendem por toda a página se não forem colocadas dentro de nada (como uma citação). As linhas separando este documento são linhas horizontais.¹

Títulos podem ser criados colocando de 1 a 6 sinais de mais (+) no começo da linha.

+ Títulos!

Primeiro Título

Segundo Título

Terceiro Título

Quarto Título

Quinto Título

Sexto Título

---

Este link quase certamente não existe.
Este link existe.

Abalador

Esta é uma tab view.

Abalação

Ei, olhe, mais texto aqui.

Que chique.

Aba Longa

Esta é uma aba longa. Ele tem muito texto.

Esta é uma aba longa. Ele tem muito texto.

Esta é uma aba longa. Ele tem muito texto.

Esta é uma aba longa. Ele tem muito texto.

Esta é uma aba longa. Ele tem muito texto.

Esta é uma aba longa. Ele tem muito texto.

Esta é uma aba longa. Ele tem muito texto.

Esta é uma aba longa. Ele tem muito texto.

Aba Tão Super Duper Hiper Extra Alongada Que Ela Supera A Compreensão Humana Convencional

Esta é uma aba longa. Ele tem muito texto.

Esta é uma aba longa. Ele tem muito texto.

Esta é uma aba longa. Ele tem muito texto.

Esta é uma aba longa. Ele tem muito texto.

Esta é uma aba longa. Ele tem muito texto.

Esta é uma aba longa. Ele tem muito texto.

Esta é uma aba longa. Ele tem muito texto.

Esta é uma aba longa. Ele tem muito texto.

Esta é uma aba longa. Ele tem muito texto.

Esta é uma aba longa. Ele tem muito texto.

Esta é uma aba longa. Ele tem muito texto.

Esta é uma aba longa. Ele tem muito texto.

Esta é uma aba longa. Ele tem muito texto.

Esta é uma aba longa. Ele tem muito texto.

Aba Vazia

Esta é uma	tabela
Você já deveria	saber como
fazer uma

Esta é uma citação, criada ao colocar "> " no começo de cada linha.

Mais texto.

---

Aquela é uma linha horizontal.

Citação dentro de citação.

---

Código Fonte:

+ Mostrar

/*
   Tema Big Brother
   [Tema de 2022 da Wikidot]
   por L200
*/
 
/* Variáveis Base */
 
:root:lang(pt-br), :root#interwiki {
    --logo-image: url("http://scp-pt-br.wdfiles.com/local--files/theme%3Abig-brother/OlhosBolas.svg");
    --header-title: "OLHOS ANÔNIMOS";
    --header-subtitle: "Conhecimento é Poder";
 
    --rating-module-bg-color: 210, 210, 210;
    --rating-module-bottom-border-color: 76, 76, 76;
    --newpage-color: var(--bright-accent);
 
/* ===CORES DO TEMA=== */
    /* CORES BASE */
    --pale-accent: 0, 76, 6;
    --bright-accent: 51, 51, 51;
    --medium-accent: 33, 33, 33;
    --dark-accent: 17, 17, 17;
    --alt-accent: 215, 215, 215;
    --modal-header-bg: 150, 255, 155;
}
 
/* Miscelânea */
 
#main-content {
    --tables-header-bg: 193, 193, 193;
    --footnotes-footer-colorbar-color: var(--dark-accent);
    --pagetags-title-bg: 112, 112, 112;
    --blockquote-border-color: 60, 60, 60;
    --footnotes-footer-num-color: var(--dark-accent);
}
 
#top-bar {
    --topmenu-hover-border-color: var(--alt-accent);
}
 
#page-title::after, .meta-title::after, #page-title::before, .meta-title::before {
  background-color: rgb(var(--alt-accent));
}
 
.top-bar {
  width: 100%;
}
 
#content-wrap::before {
  content: "";
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  background-repeat: repeat-x;
  pointer-events: none;
}
 
#page-title,
.meta-title {
    color: rgb(200, 200, 200);
}
h1,
h2,
h3,
h4,
h5,
h6 {
    color: rgb(115, 115, 115);
}
 
hr {
    color: rgb(115, 115, 115);
    background:rgb(115, 115, 115);
    border: rgb(115, 115, 115) 1px solid;
}
 
.code {
   background-color: rgb(var(--bright-accent));
}
 
/* Links */
 
a {
  color: gray;
}
 
a:visited {
  color: gray;
}
 
a.newpage {
  color: rgb(var(--alt-accent));
}
 
/* Cabeçalho */
 
#header {
   background: none !important;
}
 
#header h1 a {
    margin: 0 !important;
    padding: 0 !important
}
 
#header h2 span {
    margin: 0 !important;
}
 
#header h2 {
    padding: 2.5em 0 !important;
}
 
/* Consertando posicionamento do login */
 
#login-status {
    justify-content: start !important;
}
 
#login-status #account-options {
    left: 5em !important;
}
 
/* Removendo o plano de fundo */
 
body {
    background-color: black;
    background-image: url("http://scp-pt-br.wdfiles.com/local--files/theme%3Abig-brother/Olhos2.svg");
    background-size: contain;
    background-position: top;
    background-repeat: no-repeat;
    color: #EDEDED;
    font-family: 'Inter', sans-serif;
}
 
body:before {
  content: ' ';
  position: fixed;
  display: block;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(to bottom, transparent, #0c0c0c 75%, #0c0c0c 75%, #0c0c0c 100%);
}
 
div#container-wrap {
    background-image: none;
}
 
/* Barra Lateral */
 
#side-bar {
   display: block !important;
}
 
/* Abas */
 
.yui-navset .yui-content {
   background-color: rgba(var(--alt-accent));
   color: rgba(var(--dark-accent));
}
 
/* Citações */
 
blockquote {
    background-color: rgb(var(--alt-accent));
    color: rgb(var(--dark-accent));
}
 
/* Tabelas */
 
#page-content div.b-tables table.wiki-content-table tr th, #page-content table.wiki-content-table tr th {
   background-color: rgb(var(--medium-accent));
}
 
/* Consertando o módulo de avaliação */
 
#page-content .rate-box-with-credit-button, .page-rate-widget-box {
    background-color: rgb(var(--rating-module-bg-color)) !important;
}
 
.rate-box-with-credit-button .page-rate-widget-box .cancel {
    border-top: 0px !important;
    border-bottom: 5px solid rgb(var(--rating-module-bg-color)) !important;
}
 
.creditButton .fa {
    border-top: 4px solid rgb(var(--rating-module-bg-color));
    border-left: 0px !important;
    border-bottom: 3px solid rgb(var(--rating-module-bg-color));
}
 
.creditButton a:hover {
    color: rgb(var(--bright-accent)) !important;
}
 
.creditButtonStandalone a.fa.fa-info {
    display: inline-flex;
    height: var(--rating-module-height);
    margin: 0 0 .75rem;
    padding: 0;
    overflow: hidden;
    border: .0625rem solid rgba(var(--swatch-border-color),.15);
    border-bottom-width: 0;
    border-radius: 0;
    background-color: rgb(var(--rating-module-bg-color));
    box-shadow: 0 .125rem 0 0 rgb(var(--rating-module-bottom-border-color));
}
 
.creditButtonStandalone a:hover {
    color: rgb(var(--bright-accent)) !important;
}
 
/* toc */
 
.content-panel .content-toc {
    border-radius: 0;
    background-color: rgb(var(--alt-accent));
}
 
/* Editor */
 
#action-area h1 {
   color: rgb(var(--alt-accent));
}
 
form#edit-page-form {
   background-color: white !important;
}
 
form#edit-page-form table.form:first-of-type td:last-of-type input:not(:placeholder-shown) {
   background-color: rgb(var(--alt-accent));
}
 
form#edit-page-form table.form:first-of-type td:last-of-type input:focus {
   color:  rgb(var(--alt-accent));
   background-color: rgb(var(--dark-accent));
}
 
.form td {
   background-color: white;
}
 
.form {
    color: rgb(var(--dark-accent));
}
 
/* Consertando a barra superior para celular */
 
.mobile-top-bar {
    background: rgba(var(--bright-accent),.5) !important;
}
 
#header div[class*=top-bar]>ul>li>ul {
   background-color: rgba(var(--bright-accent),.5) !important;
}
 
#header div[class*=top-bar]>ul {
    width: 100%;
}
 
@media (min-width: 769px) {
  .mobile-top-bar .open-menu {
      display: none !important;
  }
}
 
/* Consertando a barra lateral para celular */
 
@media (max-width: 767px) {
    #side-bar .side-bar-container {
        background-color: unset !important;
        padding: 0 !important;
    }
}
 
/* Consertando o plano de fundo para celular */
 
@media (max-width: 500px) {
   body {
       background-size: 200%;
   }
)

+ Mostrar código do componente

@supports(display: grid) {
    :root {
     --sidebar-width-on-desktop: calc((var(--base-font-size) * (14 / 15)) * 19);
     --body-width-on-desktop: 45.75rem;
    }
    @media only screen and (min-width: 769px) {
     #side-bar .close-menu {
     display: block;
     position: fixed;
     top: 0.5rem;
     left: 0.5rem;
     width: 3rem;
     height: 3rem;
     background: unset;
     opacity: 1;
     pointer-events: all;
     z-index: -1;
     }
 
     #side-bar .close-menu img {
     color: transparent;
     }
 
     #side-bar .close-menu::before,
     #side-bar .close-menu::after {
     content: "";
     box-sizing: border-box;
     position: fixed;
     display: block;
     top: 0.5rem;
     left: 0.5rem;
     width: 3rem;
     height: 3rem;
     padding: 0;
     margin: 0;
     text-align: center;
     pointer-events: all;
     cursor: pointer;
     transition:
     opacity var(--sidebar-transition-timing);
     }
 
     #side-bar .close-menu::before {
     --mask:url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' id='Hamburger' x='0' y='0' baseProfile='tiny' overflow='visible' version='1.2' viewBox='0 0 32 32' xml:space='preserve'%3E%3Cpath d='M4 10h24c1.1 0 2-.9 2-2s-.9-2-2-2H4c-1.1 0-2 .9-2 2s.9 2 2 2zm24 4H4c-1.1 0-2 .9-2 2s.9 2 2 2h24c1.1 0 2-.9 2-2s-.9-2-2-2zm0 8H4c-1.1 0-2 .9-2 2s.9 2 2 2h24c1.1 0 2-.9 2-2s-.9-2-2-2z'/%3E%3C/svg%3E");
     z-index: -1;
     background-color: var(--toggle-icon-color, rgb(var(--sidebar-links-text))) !important;
     -webkit-mask: var(--mask);
     mask: var(--mask);
     -webkit-mask-repeat: no-repeat;
     mask-repeat: no-repeat;
     -webkit-mask-position: 50% 50%;
     mask-position: 50% 50%;
     -webkit-mask-size: 60%;
     mask-size: 60%;
     }
 
     #side-bar .close-menu::after {
     z-index: -2;
     background-color: var(--toggle-button-bg, rgb(var(--sidebar-bg-color))) !important;
     border-radius: var(--toggle-roundness, 50%);
     border: var(--toggle-border-color, rgb(var(--sidebar-links-text))) var(--toggle-border-width, 0.25rem) solid;
     }
 
     #side-bar:focus-within .close-menu,
     #side-bar:not(:has(.close-menu:hover)):not(:focus-within):hover .close-menu {
     pointer-events: none;
     }
 
     #side-bar:focus-within .close-menu::before,
     #side-bar:focus-within .close-menu::after {
     opacity: 0;
     pointer-events: none;
     }
 
     #side-bar:not(:has(.close-menu:hover)):not(:focus-within):hover .close-menu::before,
     #side-bar:not(:has(.close-menu:hover)):not(:focus-within):hover .close-menu::after {
     opacity: 0;
     pointer-events: none;
     }
 
     #side-bar {
     display: block;
     position: fixed;
     top: 0;
     left: calc(var(--sidebar-width-on-desktop)*-1);
     z-index: 10;
     transition:
     left 500ms cubic-bezier(0.4, 0, 0.2, 1) 100ms;
     height: 100%;
     overflow-y: auto;
     overflow-x: hidden;
     margin-top: 0;
     }
 
     #side-bar:focus-within {
     left: 0;
     }
 
     #side-bar:not(:has(.close-menu:hover)):not(:focus-within):hover {
     left: 0;
     }
 
     #side-bar .side-block {
     margin-top: 1rem;
     background-color: rgb(0, 0, 0, 0);
     border-radius: 0;
     border-left-width: 0px;
     border-right-width: 0px;
     }
 
     #main-content::before {
     content: "";
     display: block;
     position: fixed;
     top: 0;
     right: 0;
     z-index: -1;
     opacity: 0;
     transition:
     opacity 500ms cubic-bezier(0.4, 0, 0.2, 1) 100ms,
     width 500ms cubic-bezier(0.4, 0, 0.2, 1) 100ms;
     margin-left: var(--sidebar-width-on-desktop);
     background: rgba(var(--swatch-menubg-black-color), .3) 1px 1px repeat;
     padding-right: 0;
     width: 100%;
     height: 100vh;
     pointer-events: none;
     z-index: 99;
     }
 
     #side-bar:focus-within ~ #main-content::before {
     width: calc(100% - var(--sidebar-width-on-desktop));
     opacity: 1;
     pointer-events: all;
     }
 
     #side-bar:not(:has(.close-menu:hover)):not(:focus-within):hover ~ #main-content::before {
     width: calc(100% - var(--sidebar-width-on-desktop));
     opacity: 1;
     pointer-events: all;
     }
 
     @supports (-moz-appearance:none) and (background-attachment:local) and (not (-moz-osx-font-smoothing:auto)) { #side-bar {
     padding: inherit;
     } }
 
     #content-wrap {
     display: flex;
     flex-direction: row;
     width: calc(100vw - (100vw - 100%));
     min-height: calc(100vh - calc(var(--final-header-height-on-desktop, 10.125rem)));
     flex-grow: 2;
     height: auto;
     position: relative;
     margin: 0 auto;
     max-width: inherit;
     }
 
     #main-content {
     width: 100%;
     position: initial;
     max-height: 100%;
     padding: 2rem 1rem;
     max-width: var(--body-width-on-desktop, 45.75rem);
     margin: 0 auto;
     }
 
     #page-content {
     max-width: min(90vw, var(--body-width-on-desktop, 45.75rem));
     }
 
     @supports (-webkit-hyphens:none) {
     #side-bar {
     transition:
     left 500ms cubic-bezier(0.4, 0, 0.2, 1) 100ms,
     padding-right 500ms cubic-bezier(0.4, 0, 0.2, 1) 100ms,
     background-color 500ms cubic-bezier(0.4, 0, 0.2, 1) 100ms;
     padding-right: 0;
     background-color: rgb(0, 0, 0, 0);
     pointer-events: all;
     overflow-x: visible;
     overflow-y: visible;
     z-index: 999;
     }
 
     #side-bar::-webkit-scrollbar {
     opacity: 0;
     -webkit-transition: opacity 500ms cubic-bezier(0.4, 0, 0.2, 1) 100ms;
     transition: opacity 500ms cubic-bezier(0.4, 0, 0.2, 1) 100ms;
     }
 
     #side-bar .close-menu::before {
     z-index: 999;
     }
 
     #side-bar .close-menu::after {
     z-index: 998;
     }
 
     #side-bar:hover .close-menu::before,
     #side-bar:hover .close-menu::after {
     opacity: 0;
     }
 
     #side-bar:hover {
     left: 0;
     background-color: rgba(var(--swatch-menubg-color), 1);
     padding-right: 0;
     }
 
     #side-bar:hover::-webkit-scrollbar {
     opacity: 1;
     }
 
     #side-bar:hover~#main-content::before {
     width: calc(100% - var(--sidebar-width-on-desktop));
     opacity: 1;
     pointer-events: all;
     }
     }
    }
}

---

+ Mostrar código de componente

@supports(display: grid) {
    :root:lang(pt-br) {
        /* header measurements */
        --header-height-on-desktop: 10rem;
        --header-height-on-mobile: 10rem;
        --header-h1-font-size: clamp(2rem, 5vw, 2.8125rem);
        --header-h2-font-size: clamp(0.875rem, 3vw, 0.9375rem);
    }
 
    #header {
        --search-textbox-text-color: var(--swatch-secondary-color);
        background: none;
    }
 
    #header::before {
        content: " ";
        position: absolute;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0.75rem;
        background-image: var(--logo-image);
        background-repeat: no-repeat;
        background-position: center 0;
        background-size: auto calc(var(--header-height-on-desktop) - 1.5rem);
        opacity: 0.8;
        pointer-events: none;
    }
 
    #header h1,
    #header h2 {
        margin: 0;
        padding: 0;
        width: 100%;
        height: var(--header-height-on-desktop);
        display: flex;
        align-items: center;
        justify-content: center;
        display: flex;
        align-items: center;
        justify-content: center;
    }
 
    #header h1 a,
    #header h1 a::before,
    #header h2 span,
    #header h2 span::before {
        margin: 0;
        padding: 0;
        z-index: 0;
        display: block;
        text-align: center;
    }
 
    #header h1 {
        z-index: 1;
    }
 
    #header h1 a::before,
    #header h1 a::after {
        content: var(--header-title);
    }
 
    #header h1 a::before  {
        color: rgb(var(--swatch-text-tertiary-color));
        z-index: -1;
        -webkit-text-stroke: 0.325rem rgb(var(--swatch-text-dark));
    }
 
    #header h1 a::after {
        color: rgb(var(--swatch-headerh1-color));
        z-index: 1;
    }
 
    #header h2 {
        z-index: 0;
        text-transform: uppercase;
        pointer-events: none;
    }
 
    #header h2 span {
        margin-top: calc(var(--header-height-on-mobile)/2 + var(--header-h1-font-size)/2 - 2em);
    }
 
    #header h2 span::before,
    #header h2 span::after {
        --wght: 600;
        content: var(--header-subtitle);
        position: absolute;
        left: 50%;
        transform: translateY(-50%) translateX(-50%);
        width: 100%;
        text-align: center;
    }
 
    #header h2 span::before {
        -webkit-text-stroke: 0.25rem rgb(var(--swatch-text-dark));
    }
 
    #header h2 span::after {
        color: rgb(var(--swatch-headerh2-color));
        z-index: 1;
    }
 
    #search-top-box form[id="search-top-box-form"]:not(:focus-within) input[type="text"] {
        color: rgba(0, 0, 0, 0);
    }
 
    /* fix for amazonian leaf */
    #content-wrap::before {
      background-size: 386px;
    }
 
    @media (min-width: 36rem) {
 
        #login-status {
            flex-grow: 1;
            left: 3%;
            right: initial;
        }
 
     #login-status::before {
     --mask-image: none;
     background-color: transparent;
     }
 
        #login-status:not(:focus-within) {
            color: rgb(var(--login-line-divider-color));
            -webkit-user-select: initial;
            -moz-user-select: initial;
            -ms-user-select: initial;
            user-select: initial;
        }
 
        #login-status #account-topbutton,
        #login-status:not(:focus-within) #account-topbutton {
            --clip-path:
                    polygon( 0 0, 100% 0, 100% 100%, 0 100% );
            background-color: rgba(var(--login-arrow-color), 0);
 
        }
 
        #login-status #account-topbutton::before{
            --clip-path:
                    polygon( 30% 35%, 70% 35%, 50% 60%, 50% 60% );
            --mask-image: initial;
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(var(--login-arrow-color), 1);
            -webkit-clip-path: var(--clip-path);
            clip-path: var(--clip-path);
        }
 
        #login-status #account-topbutton::before,
        #login-status:not(:focus-within) #account-topbutton::before,
        #login-status:not(:focus-within) #account-topbutton:hover::before {
            --clip-path:
                    polygon( 30% 35%, 70% 35%, 50% 60%, 50% 60% );
            --mask-image: initial;
        }
 
        #login-status:not(:focus-within) #account-topbutton::after {
            display: none;
        }
 
        #login-status:not(:focus-within) *:not(#account-topbutton):not([href*="account/messages"]) {
            --clip-path:
                    polygon(
                        0 0,
                        100% 0,
                        100% 100%,
                        0 100%
                    );
            pointer-events: all;
            -webkit-clip-path: var(--clip-path);
            clip-path: var(--clip-path);
        }
 
        #login-status:not(:focus-within) *:not(#account-topbutton):not(#account-options):not([href*="account/messages"]) {
            opacity: 1;
        }
 
        #login-status #my-account {
            --wght: 300;
        }
 
        #account-options {
            background: var(--gradient-header);
        }
 
        #search-top-box {
            top: 1.5em;
            right: 3%;
            background: rgba(var(--search-focus-textbox-bg-color), 0.4);
            box-shadow: calc(var(--search-height) / 2 * -1) 0 calc(var(--search-height) / 2) rgba(var(--search-focus-textbox-bg-color), 0.4);
        }
 
     #search-top-box:focus-within ~ #login-status {
     opacity: 1;
     }
 
        #search-top-box::after {
            transition:
                background-color 150ms cubic-bezier(0.4, 0, 0.2, 1),
                -webkit-clip-path 150ms cubic-bezier(0.4, 0, 0.2, 1);
            transition:
                background-color 150ms cubic-bezier(0.4, 0, 0.2, 1),
                clip-path 150ms cubic-bezier(0.4, 0, 0.2, 1);
            transition:
                background-color 150ms cubic-bezier(0.4, 0, 0.2, 1),
                clip-path 150ms cubic-bezier(0.4, 0, 0.2, 1),
                -webkit-clip-path 150ms cubic-bezier(0.4, 0, 0.2, 1);
        }
 
        #search-top-box:not(:focus-within)::after {
            --clip-path:
                    polygon(
                        0 0,
                        100% 0,
                        100% 100%,
                        0% 100%
                    );
            background-color: rgba(var(--search-icon-bg-color, --dark-accent), 1);
            -webkit-clip-path: var(--clip-path);
            clip-path: var(--clip-path);
        }
 
        #search-top-box:not(:focus-within):hover::after {
            --clip-path:
                    polygon(
                        0 0,
                        100% 0,
                        100% 100%,
                        0 100%
                    );
            background-color: rgb(var(--search-icon-hover-bg-color));
        }
 
        #search-top-box form[id="search-top-box-form"]:not(:focus-within) {
            max-width: var(--search-width);
        }
 
        #search-top-box form[id="search-top-box-form"]:not(:focus-within) input[type="text"] {
            max-width: var(--search-width);
            padding: 0 var(--search-height) 0 1em;
            outline-width: 0;
            background-color: rgb(var(--search-focus-textbox-bg-color), 0.35);
            color: rgba(var(--search-textbox-text-color), 0.4);
            cursor: pointer;
        }
 
        #search-top-box form[id="search-top-box-form"]:not(:focus-within) input[type="submit"],
        #search-top-box form[id="search-top-box-form"]:focus-within input[type="submit"] {
            pointer-events: all;
            border: none;
        }
 
    }
 
    #page-title::after,
    .meta-title::after,
    #page-title::before,
    .meta-title::before {
        content: "";
        flex-grow: 1;
        height: 0.0625rem;
        background: rgb(var(--swatch-primary));
    }
 
    #page-title::before,
    .meta-title::before {
        margin: auto 1.25rem auto auto;
    }
}

Footnotes

1. Isto é uma nota de rodapé.