소용돌이치는 재 테마 (BHL)
평가: 0+x

[[iftags +템플릿 -nobhl]]

평가: 0+x

black-highlighter-logo.svg
현재 이 컴포넌트를 사용 가능합니다


사용법

어디서나 아래를 붙여넣으세요.

[[include :scpko:theme:black-highlighter-theme]]

선택가능 애드온


어두운 사이드바

[[include :scpko:component:bhl-dark-sidebar]]

접는 사이드바

[[include :scp-wiki:component:collapsible-sidebar]]


※ 접는 사이드바는 시그마-9 테마에서도 작동합니다.

여기가 뭐냐면

여러분의 작품에 블랙 하이라이터(Black Highlighter) 테마를 적용할 수 있는 컴포넌트입니다.

본 컴포넌트는 블랙 하이라이터 테마의 파생 버전에도 적용 가능합니다. 단 업데이트 사정에 따라 오류가 있을 수 있습니다. 아직 손질할 부분이 많겠지만, 저희 바람으로는 현재가 가장 안정된 버전입니다. 기능도 아주 유용하고요.

주의사항!

블랙 하이라이터 CSS는 지금도 개발 중 상태입니다. 모든 버그를 해결하지 못했을 수 있으며, 수시로 변경될 수 있습니다. 여러분의 작품을 표시하는 데 오류가 생길 수도 있습니다.
페이지에 CSS를 적용하실 때 이 점을 꼭 양해 부탁드리겠습니다.

오류 신고

Github 계정이 있으시면 여기에서 이슈를 알려주세요. (기술적 사항, 미적 사항 모두 괜찮습니다) 파생 버전 사용 시에는 꼭 따로 알려주세요.

Github 계정이 없으시거나 개발자에게 직접 말씀드리고 싶은 사항이 있다면, 본사 SynIRC의 #black-highlighter 채널로 방문해 주시거나, WoedenazWoedenaz 또는 CroquemboucheCroquembouche에게 PM해 주세요.


테마 색깔

Payne's Grey gray-monochrome(66, 66, 72)
Rosewood bright-accent(133, 0, 5)
Alto very-light-gray-monochrome(215, 215, 215)
White Smoke pale-gray-monochrome(244, 244, 244)
Bastille dark-gray-monochrome(48, 48, 52)
Buccaneer medium-accent(100, 46, 44)
Maroon dark-accent(100, 3, 15)
Mango Tango newpage-color(221, 102, 17)

예시

logo.svg

SCP Foundation Logo

수평줄은 하이픈 5개 "------"를 치면 만들어지며, 따로 들어 있는 곳 (인용 블록 등) 이 없다면 페이지 전체를 가로지릅니다. 이 글에서 섹션을 나누는 줄은 모두 이 수평줄입니다.


제목은 문장 처음에 "+"을 1개부터 6개까지 입력해서 적용할 수 있습니다.

탭뷰입니다.

인용 블록입니다. 문장 처음에 ">"를 붙여서 만들 수 있습니다.
다른 텍스트


요건 수평줄

블록 속의 블록

이건 표입니다
어떤 식으로 만드는 건진
다 아시죠

body 폰트는 Proxima Nova + 나눔바른고딕,
header / title 폰트는 Poppins + 나눔바른고딕,
monospace 폰트는 나눔고딕코딩입니다.


[[/iftags]]

[[iftags +구성요소]]

평가: 0+x
Pretty self explanatory.
For anyone who really wants the dark sidebar from the O.G. BHL on their articles.
Just add this include AFTER the BHL include:
[[include :scp-wiki:component:bhl-dark-sidebar]]

[[/iftags]]

[[iftags +template]]

What this is

A bunch of miscellaneous CSS improvements. "Improvements" is subjective. I do not care.

If you're not me, which you're not (I think), then you definitely shouldn't use this component because it may break, disappear, or change in a way that you don't like at any time; and I promise you that if I want to add something to this I will without asking your permission or checking whether or not it breaks your article. There's a reason this isn't on the main wiki. But other than that go wild.

Usage

[[include :topia:cqb:css]]

Using this on a page tagged 'template'? You'll need to manually stop all these usage instructions from appearing:

[[div style="display: none;"]]
[[include :topia:cqb:css]]
[[/div]]

Improvements

Reasonably-sized footnotes

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

.hovertip { max-width: 400px; }

I'd add a demonstration, but I've included this component to a bunch of other template pages and it messes them up. You'll just have to trust me on this one.

Monospace edit/code

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

@font-face{
    font-family: 'Fira Code';
    src: url('https://raw.githubusercontent.com/tonsky/FiraCode/master/distr/eot/FiraCode-Regular.eot') format('embedded-opentype'),
    url('https://raw.githubusercontent.com/tonsky/FiraCode/master/distr/woff2/FiraCode-Regular.woff2') format('woff2'),
    url('https://raw.githubusercontent.com/tonsky/FiraCode/master/distr/woff/FiraCode-Regular.woff') format('woff'),
    url('https://raw.githubusercontent.com/tonsky/FiraCode/master/distr/ttf/FiraCode-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
: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; }

Fuck off bigfaces

Stops big pictures from appearing when you hover over someone's avatar image, because they're stupid and I hate them.

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

Breaky breaky

Break links if I want them to

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

Code colours

Add my terminal's code colours as variables

: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 {
  color: var(--c-syntax);
  background: var(--c-bg);
  border: 0.5rem solid var(--c-comment);
  border-radius: 2rem;
}

Debug mode

Draw lines around anything inside .debug-mode.

.debug-mode, .debug-mode *, .debug-mode *::before, .debug-mode *::after {
  outline: 1px solid var(--debug-colour, red);
}
.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; }

[[/iftags]]

이게 뭡니까?

이것은 쥐구멍 카논 항목에서 사용하려고 설계된 소용돌이치는 재 테마입니다.

만든 사람: CroquemboucheCroquembouche, 이름은 faminepulsefaminepulse가 2020년 9월 미국 오리건주 하늘을 묘사한 것에서 따옴.

제목 칸은 1분 주기로 밤낮을 반복합니다. 3일에 한 번 잠시 안개가 걷힙니다.

사용법

이 테마는 블랙 하이라이터를 필수로 사용해야 하며, BHL 어두운 사이드바를 선택적으로 사용할 수 있습니다.

[[include theme:black-highlighter-theme]]
[[include :scp-wiki:component:bhl-dark-sidebar]]
[[include theme:swirling-ashes]]

제목 수정용 태그

[[module CSS]]
:root {
--header-title: "SCP 재단";
--header-subtitle: "확보, 격리, 보호";
}
[[/module]]

Theme colours

산업폐기물색--dark-accentrgb(63, 9, 143)
배수관 밑바닥색--dark-gray-monochromergb(26, 24, 26)
{$color3-name}{$color3-variable}{$color3-info}
{$color4-name}{$color4-variable}{$color4-info}
{$color5-name}{$color5-variable}{$color5-info}
{$color6-name}{$color6-variable}{$color6-info}
여명색--sky-at-dawn
아침색--sky-at-morning
낮색--sky-at-daytime
저녁색--sky-at-evening
땅거미색--sky-at-dusk
밤색--sky-at-night
{$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}

소스코드