The Streamer Awards 2025
The Streamer Awards 2025
Byㅤ Drzony13Drzony13
Published on 27 Aug 2022 15:03
ocena: +9+x

What this is

A bunch of miscellaneous CSS 'improvements' that I, CroquemboucheCroquembouche, use on a bunch of pages because I think it makes them easier to deal with.

The changes this component makes are bunch of really trivial modifications to ease the writing experience and to make documenting components/themes a bit easier (which I do a lot). It doesn't change anything about the page visually for the reader — the changes are for the writer.

I wouldn't expect translations of articles that use this component to also use this component, unless the translator likes it and would want to use it anyway.

This component probably won't conflict with other components or themes, and even if it does, it probably won't matter too much.

Usage

On any wiki:

[[include :scp-wiki:component:croqstyle]]

This component is designed to be used on other components. When using on another component, be sure to add this inside the component's [[iftags]] block, so that users of your component are not forced into also using Croqstyle.

Related components

Other personal styling components (which change just a couple things):

Personal styling themes (which are visual overhauls):

CSS changes

Reasonably-sized footnotes

Stops footnotes from being a million miles wide, so that you can actually read them.

.hovertip { max-width: 400px; }

Monospace edit/code

Makes the edit textbox monospace, and also changes all monospace text to Fira Code, the obviously superior monospace font.

@import url('https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;700&display=swap');
 
:root { --mono-font: "Fira Code", Cousine, monospace; }
#edit-page-textarea, .code pre, .code p, .code, tt, .page-source { font-family: var(--mono-font); }
.code pre * { white-space: pre; }
.code *, .pre * { font-feature-settings: unset; }

Teletype backgrounds

Adds a light grey background to <tt> elements ({{text}}), so code snippets stand out more.

tt {
  background-color: var(--swatch-something-bhl-idk-will-fix-later, #f4f4f4);
  font-size: 85%;
  padding: 0.2em 0.4em;
  margin: 0;
  border-radius: 6px;
}

No more bigfaces

Stops big pictures from appearing when you hover over someone's avatar image, because they're stupid and really annoying and you can just click on them if you want to see the big version.

.avatar-hover { display: none !important; }

Breaky breaky

Any text inside a div with class nobreak has line-wrapping happen between every letter.

.nobreak { word-break: break-all; }

Code colours

Add my terminal's code colours as variables. Maybe I'll change this to a more common terminal theme like Monokai or something at some point, but for now it's just my personal theme, which is derived from Tomorrow Night Eighties.

Also, adding the .terminal class to a fake code block as [[div class="code terminal"]] gives it a sort of pseudo-terminal look with a dark background. Doesn't work with [[code]], because Wikidot inserts a bunch of syntax highlighting that you can't change yourself without a bunch of CSS. Use it for non-[[code]] code snippets only.

Quick tool to colourise a 'standard' Wikidot component usage example with the above vars: link

:root {
  --c-bg: #393939;
  --c-syntax: #e0e0e0;
  --c-comment: #999999;
  --c-error: #f2777a;
  --c-value: #f99157;
  --c-symbol: #ffcc66;
  --c-string: #99cc99;
  --c-operator: #66cccc;
  --c-builtin: #70a7df;
  --c-keyword: #cc99cc;
}
 
.terminal, .terminal > .code {
  color: var(--c-syntax);
  background: var(--c-bg);
  border: 0.4rem solid var(--c-comment);
  border-radius: 1rem;
}

Debug mode

Draw lines around anything inside .debug-mode. The colour of the lines is red but defers to CSS variable --debug-colour.

You can also add div.debug-info.over and div.debug-info.under inside an element to annotate the debug boxes — though you'll need to make sure to leave enough vertical space that the annotation doesn't overlap the thing above or below it.

…like this!

.debug-mode, .debug-mode *, .debug-mode *::before, .debug-mode *::after {
  outline: 1px solid var(--debug-colour, red);
  position: relative;
}
.debug-info {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  font-family: 'Fira Code', monospace;
  font-size: 1rem;
  white-space: nowrap;
}
.debug-info.over { top: -2.5rem; }
.debug-info.under { bottom: -2.5rem; }
.debug-info p { margin: 0; }
/* source: http://ah-sandbox.wikidot.com/component:collapsible-sidebar-x1 */
 
#top-bar .open-menu a {
        position: fixed;
        top: 0.5em;
        left: 0.5em;
        z-index: 5;
        font-family: 'Nanum Gothic', san-serif;
        font-size: 30px;
        font-weight: 700;
        width: 30px;
        height: 30px;
        line-height: 0.9em;
        text-align: center;
        border: 0.2em solid #888;
        background-color: #fff;
        border-radius: 3em;
        color: #888;
}
 
@media (min-width: 768px) {
 
    #top-bar .mobile-top-bar {
        display: block;
    }
 
    #top-bar .mobile-top-bar li {
        display: none;
    }
 
    #main-content {
        max-width: 708px;
        margin: 0 auto;
        padding: 0;
        transition: max-width 0.2s ease-in-out;
    }
 
    #side-bar {
        display: block;
        position: fixed;
        top: 0;
        left: -20em;
        width: 17.75em;
        height: 100%;
        margin: 0;
        overflow-y: auto;
        z-index: 10;
        padding: 1em 1em 0 1em;
        background-color: rgba(0,0,0,0.1);
        transition: left 0.4s ease-in-out;
 
        scrollbar-width: thin;
    }
 
    #side-bar:target {
        left: 0;
    }
    #side-bar:focus-within:not(:target) {
        left: 0;
    }
 
    #side-bar:target .close-menu {
        display: block;
        position: fixed;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        margin-left: 19.75em;
        opacity: 0;
        z-index: -1;
        visibility: visible;
    }
    #side-bar:not(:target) .close-menu { display: none; }
 
    #top-bar .open-menu a:hover {
        text-decoration: none;
    }
 
    /* FIREFOX-SPECIFIC COMPATIBILITY METHOD */
    @supports (-moz-appearance:none) {
    #top-bar .open-menu a {
        pointer-events: none;
    }
    #side-bar:not(:target) .close-menu {
        display: block;
        pointer-events: none;
        user-select: none;
    }
 
    /* This pseudo-element is meant to overlay the regular sidebar button
    so the fixed positioning (top, left, right and/or bottom) has to match */
 
    #side-bar .close-menu::before {
        content: "";
        position: fixed;
        z-index: 5;
        display: block;
 
        top: 0.5em;
        left: 0.5em;
 
        border: 0.2em solid transparent;
        width: 30px;
        height: 30px;
        font-size: 30px;
        line-height: 0.9em;
 
        pointer-events: all;
        cursor: pointer;
    }
    #side-bar:focus-within {
        left: 0;
    }
    #side-bar:focus-within .close-menu::before {
        pointer-events: none;
    }
    }
}

The Streamer Awards 2025
Autorstwa Drzony13Drzony13
Opublikowane 27.08.2022

The Streamer Awards 2025

ocena: +9+x

Rozpoczyna się trzecia edycja The Streamer Awards. Podczas gdy prezenterzy na scenie omawiają wydarzenia z ostatniego roku, siedzący w widowni przy stołach streamerzy gawędzą, żartują i bawią się kolorowankami.

Tymczasem na końu sali, na krześle pod ścianą, siedzi samotnie Jeremy Harrington, wpatrzony w podłogę, z rękami opartymi o uda. Trzęsie nogą i bawi się palcami. Co chwila marszczy brwi i przegryza wargi. Raz na jakiś czas rozgląda się i spogląda na innych tu obecnych, ale szybko wraca wzrokiem do podłogi, aby ci nie myśleli, że się na nich gapi.

PVQxb9g.png

I nie, nie siedział sam pod ścianą, bo nigdzie nie było wolnych miejsc. Wręcz przeciwnie. Przy stołach była tona wolnych krzeseł, które mógł zająć, aby pogadać sobie z kolegami streamerami. Sęk w tym, że on nie miał ochoty z nikim gadać.

Tak naprawdę, to on w ogóle nie chciał tutaj nawet być. Miał wyjebane, czy dostanie jakąkolwiek nagrodę, czy nie. To Fundacja kazała mu przyjść, tak dla zachowania pozoru. W końcu, gdyby wydano mu nagrodę za cykl transmisji, do którego rzekomo przygotowywał się miesiącami i dobrze się przy nim bawił, byłoby to co najmniej dziwne. Wtedy, w najlepszym wypadku ludzie zadawaliby pytania, a w najgorszym, mogłoby to zepsuć przykrywkę. Zwłaszcza że Jeremy był na rozdaniu za pierwsze Dollhouse, przez co tym bardziej mogłoby to wzbudzić podejrzenia. A już wystarczy, że jego kolegów nafaszerowano amnestykami i wciśnięto im kit, że rzeczywiście byli na tych streamach.

Kurwa… Ahh… Spokojnie, jakoś sobie poradzisz… Tylko zachowuj się naturalnie…

Prezenterzy zaczęli wyczytywać nominacje za najlepszy streamowany event. Jedną z nich było, a jakże, Jerma Dollhouse 2. Co się dziwić. Była komedia, był dramat, była improwizacja i interaktywność, elementy horroru, plot twist, plus wzruszające zakończenie.

Rozpoczyna się faza głosowania. Jeremy zaciska pięści i zęby. Pot mu spływał z czoła, kiedy czekał na ogłoszenie wyniku. Miał wyjebane w innych nominowanych. Zależało mu jedynie na tym, by Dollhouse nie wygrało. Nie miał najmniejszego zamiaru wchodzić na scenę i odbierać tej cholernej statuetki. Już samo siedzenie pod ścianą było dla niego stresujące, a co dopiero, gdyby miał być na scenie, z całą uwagą skupioną na nim.

Dobra, spokojnie. Nie myśl takimi kategoriami, bo się tylko niepotrzebnie wymęczysz.

Wdech i wydech…

Wdech…

…I wydech…

Tak… Wszystko będzie okej…

Faza głosowania się skończyła.

Jeremy zaciska palce u stóp.

— A nagrodę za najlepszy streamowany event…

Mężczyzna trzyma się kurczowo nogawek od garnituru, a stopy wbija w podłogę. Jego oddech przyspiesza, a serce podskakuje.

— …otrzymuje…

Jeremy zaciska zęby i hiperwentyluje. Pot leje mu się z czoła strumieniami. Trzesie nogą i zaciska pięści.

...Jerma Dollhouse 2!

Mężczyzna zamarł. Czuł, jakby cały świat wokół niego nagle się zatrzymał. Na podłogę spadały krople potu, jedna po drugiej. Jeremy ani drgnął. Miał wrażenie, że zaraz wypluje płuca, a jego serce eksploduje. Rozbolała go głowa, w której nie było ani jednej myśli.

Nagle się otrząsnął. Rozejrzał się i zobaczył, że wszyscy patrzą się na niego w niezręcznej ciszy. Zacisnął zęby i przełknął ślinę. Uśmiechnął się, wstał i chwiejnym krokiem zaczął iść w kierunku sceny. Dookoła rozległy się gromkie brawa. Pomimo faktu, że Jeremy cały czas patrzył pod nogi, w połowie drogi się potknął, ale na szczęście szybko zareagował i uniknął upadku. Zaczął iść dalej.

Wszedł na scenę i podszedł do prezentera. Podał mu rękę i odebrał nagrodę, po czym ze sztucznym uśmiechem spojrzał na publiczność. Wszystkie oczy i kamery były skierowane prosto na niego. Lekko dysząc, podszedł do mikrofonu.

— H-Hej… Chciałbym tylko powiedzieć, że… Że dziękuję… Jestem niezmiernie wdzięczny, że mogę tu teraz stać. Pracowaliśmy nad Dollhouse 2 miesiącami… T-To były naprawdę dobrze spędzone miesiące. Jestem zadowolony, jak to wyszło i nie mogę uwierzyć, że podobało się tylu ludziom. Odbieranie tej nagrody za naszą ciężką pracę, t-to dla mnie ogromny zaszczyt…

Widownia milczy.

— D-Dziękuję…

6kcwiuL.png

Niepewnym ruchem pomachał do widowni, po czym szybkim krokiem zszedł ze sceny i wrócił na swoje miejsce.


Kiedy Streamer Awards się skończyło, streamerzy zostali jeszcze na pogaduszki. Jeremy natomiast od razu wyszedł.

9ZUphea.png

Poszedł na parking i stanął przy swoim aucie. Wyjął z kieszeni kluczyk, a nastęnpie nacisnął na nim guzik z zamkniętą kłódeczką. Pociągnął za klamkę drzwi od miejsca kierowcy, ale nie udało mu się ich otworzyć. Burknął i wcisnął guzik z otwartą kłódką. Wsiadł do auta, rzucił statuetkę na miejsce pasażera i złapał za zakurzoną kierownicę.

Uruchomił silnik, wrzucił wsteczny i zaczął cofać. Zdejmując delikatnie nogę ze sprzęgła, nieustannie spoglądał na wszystkie trzy lusterka. Dla pewności nawet się odwracał, aby mieć pewność, że nic nie jedzie. Z tyłu jechało auto, ale zatrzymało się i zamigało długimi światłami. Jeremy na szybko wyjechał. Wrzucił jedynkę, zamrugał światłami awaryjnymi i ruszył.

Wyjechał z parkingu i zmierzał w kierunku domu. Ciężko mu było skupić się na drodze, ale jakoś dawał radę. Tak samo dawał też radę nie przejechać na wszystkich czerwonych światłach. Fakt tego, że o takiej porze droga była całkowicie pusta, bardzo tutaj pomagał.

Po chwili dojechał pod blok. Zaparkował samochód, wziął statuetkę, wysiadł i zamknął drzwi z głośnym trzaskiem. Nacisnął na kluczyku przycisk z zamkniętą kłódeczką. Samochód zamrugał wszystkimi kierunkowskazami i wydał z siebie pojedyncze kliknięcie.

Podszedł do drzwi od klatki, wbił kod w domofonie i wszedł do bloku. Dobrą chwilę wchodził po schodach, zanim doszedł do swojego mieszkania. Wszedł do środka, zamknął za sobą drzwi i zakluczył je. Przeszedł przez brudną kuchnię, po czym wszedł do swojego pokoju. Zapalił światło i się rozejrzał. Cóż, przez ostatni rok dosyć zaniedbał to miejsce.

Wg3oqua.png

Przyjrzał się złotej statuetce przedstawiającą żabę Pepe w garniturze. Zacisnął zęby i zaczął dyszeć. Krew go zalewała na widok tej nagrody. Nie wytrzymał i cisnął nią o ścianę. Połamała się tak samo, jak statuetka za pierwsze Dollhouse. Na ten widok wytrzeszczył oczy, a jego serce przyspieszyło. Zmarszczył brwi i zacisnął pięści. Po chwili prychnął. Rozebrał się, rozrzucił ubrania na podłodze i rzucił się do łóżka. Leżał tak przez chwilę, zanim w końcu zasnął.

Obudził się gdzieś tak o jedenastej. Był potwornie przymulony. Za cholerę nie chciało mu się wstawać. Postanowił poleżeć tak jeszcze przez chwilę.

Nagle obudził się o trzynastej. Kurwa… Dobra, żeby nie zasnąć znowu, wziął telefon i zaczął w nim szperać, aby mieć jakieś zajęcie. Przeglądał głównie shorty na Youtube i memy. Po chwili spojrzał na godzinę i zobaczył, że to już czternasta.

Od razu wstał i pobiegł do łazienki. Wziął szybki prysznic i włożył na siebie jakieś czyste ciuchy. Następnie siadł przed komputerem. Pierwsze, co zrobił, to zajrzał na maila. Zero nowych wiadomości. Westchnął i wszedł na Twitcha. Zastanawiał się, czy zrobić streama, czy nie. Za cholerę nie chciał tego robić. Nie miał ochoty pokazywać się komukolwiek. Najchętniej, to w ogóle rzuciłby się z powrotem do łóżka, ale to nie wchodzi w grę. Nie miał zamiaru rozpieprzać swojego zegaru biologicznego jeszcze bardziej. Plus, już i tak za bardzo zalegał z ostatnimi streamami, a to w końcu jego jedyne źródło utrzymania. Kurwa…

Włączył OBS'a i wpatrywał się w ekran przez kilka minut. Wzdychając, potarł czoło. Najechał kursorem na przycisk z napisem "Rozpocznij stream". Gapił się na kursor przez chwilę. Ostatecznie się rozmyślił. Zamknął OBS'a i przeglądarkę z Twitchem. Zrobi streama, ale później. Najpierw niech może coś zje.

Wstał i poszedł do kuchni. Otworzył zamrażarkę i wyjął z niej mrożoną pizzę. Rozpakował ją, po czym nastawił piekarnik do dwustu stopni. Następnie usiadł przy stole, wziął telefon i zaczął jak zwykle zapychać swój mózg ściekiem, jaki oferuje mu internet.

Z dwadzieścia minut później usłyszał kliknięcie. Spojrzał na piekarnik i zobaczył, że światełko nad pokrętłem od temperatury zgasło. Otworzył piekarnik i w jego twarz buchnął gęsty, szary dym i smród spalin. Kurwa! Dostało się do jego oczu! Odskoczył i odwrócił wzrok. Jak to piecze, ja pierdolę! Zamknął oczy i przycisnął do nich dłonie, aby sobie ulżyć. Po chwili przestały go piec. Otworzył je i odwrócił się z powrotem do piekarnika. Teraz nie było już dymu, ale nadal śmierdziało niemiłosiernie. Ahhh… Będzie musiał tu w końcu wytrzeć, ale nie teraz.

Ostrożnie wyłożył na ruszcie kawałek papieru do pieczenia, na którym położył zimną, gumowatą pizzę. Zamknął piekarnik, po czym usiadł z powrotem przy stole i gmerał w telefonie, co jakiś czas sprawdzając stan swojej picki.

089BUIq.png

Kiedy uznał, że jest już wystarczająco przypieczona, wyłączył i otworzył piekarnik. Następnie wsunął metalową szpachelkę pod pizzę, którą potem przeniósł na deskę do krojenia. Pokroił ją na cztery kawałki, które zjadł w gdzieś tak dziesięć minut. Smakowała okej. Nie była nie wiadomo, jak wyborna, ale była zjadliwa.

Skończywszy, położył deskę obok zlewu, w którym zaczęły się gromadzić brudne naczynia. Następnie wrócił do swojego pokoju i usiadł przed komputerem. Noga mu się trzęsła, kiedy włączał przeglądarkę i wchodził na Twitch'a. Przegryzł wargę i włączył OBS'a. Palec wskazujący jego lewej ręki bez przerwy stukał w biurko. Z jego czoła spływał pot, a jego prawa powieka drgała.

5vpgGLt.png

Wpatrywał się tępo w ekran, przesuwając kursor w kierunku guzika "Rozpocznij stream". Kiedy tylko kursor znalazł się na przycisku, Jeremy natychmiast zabrał rękę z myszy. Oparł ręce o biurko, po czym położył na nich głowę i leżał tak przez chwilę. Po kilku minutach podniósł się i spojrzał na ekran. Od razu odwrócił wzrok. Rozejrzał się po pokoju i jego uwagę przykuła połamana statuetka. Zacisnął pięści i zęby. Zaczął dyszeć, a z jego oka wydobyła się pojedyncza łza.

Wstał. Podszedł do statuetki, podniósł oba jej fragmenty i wrócił do biurka. Spojrzał na podgląd w OBS'ie, ukazujący widok na ekran oraz jego kamerkę. Położył połamaną nagrodę na biurku, jednym ruchem wytarł łzę o rękaw i na szybko wysprzątał tę część pokoju, którą było widać na kamerce. Usiadł przed komputerem i wpatrywał się w OBS'a.

Kliknął "Rozpocznij stream".

— Hejka, tutaj ja, Jerma985! Cóż, jak pewnie wiecie, wczoraj odebrałem nagrodę za Dollhouse 2! I hej, pamiętacie, jak rok temu niechcący połamałem statuetkę? Tak? To zgadnijcie, co. — Pokazuje połamaną statuetkę. — Tia… Jak wróciłem do domu, to potknąłem się i ją upuściłem. Co za ironia, prawda?

Jeremy milknie. Przełyka ślinę.

— Więc tak, rok temu, podczas promocji Dollhouse 2 udawałem, że chcę zagrać w GTA: San Andreas. To hej, co wy na to, abym z okazji odebrania nagrody zagrał właśnie w tę grę? Dobra, to zaczynajmy!

I jak zwykle, stream odbył się bez żadnych komplikacji.

O ile nie zaznaczono inaczej, treść tej strony objęta jest licencją Uznanie autorstwa — na tych samych warunkach 3.0 unported