Cs 1 1

[[module CSS]]
.div {
    background-color: rgb(55,55,55);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0, 0, 0, .25);
color: rgb(255, 255, 255);
transition: transform 2s;
}
div:hover {
transform: rotate(50deg);
}
[[/module]]
[[div class="div"]]
超级炫酷代码
[[/div]]

[[module CSS]]
@import url("https://hoah.backroomswiki.cn/Backrooms/component-level-class/main.css");
[[/module]]

[[div class="lang-{$lang} sd-container"]]
[[div class="top-box class-{$class} color-{$color}" style="--custom-color: {$color}"]]
[[div class="header-diamond"]]
[[div class="bg"]]
[[/div]]
[[div class="diamondy diamond-color class-{$class} color-{$color}" style="--custom-color: {$color}"]]
[[/div]]
[[div class="diamondy diamond-pattern"]]
[[/div]]
[[div class="diamondy diamond-image class-{$class} {$image}" style="--custom-image: url("{$image}")"]]
[[/div]]
[[/div]]
[[div class="gradient-box"]]
[[div class="top-text"]]
[[span class="lang-cn"]]生存难度：[[/span]][[span class="lang-tr"]]生存難度：[[/span]]
[[/div]]
[[div class="bottom-text"]]
[[span class="lang-cn"]]等级[[/span]][[span class="lang-tr"]]等級[[/span]] {$class}
[[/div]]
[[/div]]
[[/div]]
[[div class="bottom-box class-{$class}"]]
* [[span class="{$one}"]]{$one}[[/span]][[span class="default"]]@@ @@[[/span]]
* [[span class="{$two}"]]{$two}[[/span]][[span class="default"]]@@ @@[[/span]]
* [[span class="{$three}"]]{$three}[[/span]][[span class="default"]]@@ @@[[/span]]
[[/div]]
[[/div]]

[[div style="display: none; [[iftags +组件]]display: initial;[[/iftags]]"]]
[[module css]]
.cntr td {
    text-align: center;
}
[[/module]]
------

[[div class="blockquote" style="margin: 1rem 0;"]]

++* 翻译者须知：
从 2026 年 5 月 20 日起，后室英文维基开始使用[[[https://backrooms-wiki-cn.wikidot.com/component:sd-class|层级等级（后室英文维基）]]]，全面替代此组件。最终的结果是，此组件从 {{component:level-class}} 变成了 {{component:old-level-class}}；而 {{component:level-class}} 则被替换成了上述的新组件。

这导致后室英文维基所有使用了生存难度分级组件的页面，都自动更新成另一版本。中文维基不会跟进这一改动，亦不会重命名此组件。**译者可以自由选择在翻译过程中应用新版组件，使之与原文相同；也可以继续使用此组件，即不改动 [[include]] 代码。**

除了外形有所变化，新组件还新增了 1E-5E 的环境危害分级，并稍微扩展了自定义维度；因此部分页面可能有必要更换为新组件，才能正常显示。请译者自行甄别。

[[/div]]

+* 如何使用：

[[div class="code"]]
@@[[include :backrooms-wiki-cn:component:level-class@@
|class=等级
]]
[[/div]]
{{class}} 处的可用参数包括以下内容，支持简繁体及英文输入。
[[table class="wiki-content-table cntr"]]
[[row]]
[[hcell colspan="6"]]English[[/hcell]][[hcell colspan="6"]]简体中文[[/hcell]][[hcell colspan="6"]]繁體中文[[/hcell]]
[[/row]][[row]]
[[cell]]0[[/cell]][[cell]]1[[/cell]][[cell]]2[[/cell]][[cell]]3[[/cell]][[cell]]4[[/cell]][[cell]]5[[/cell]]
[[cell]]0[[/cell]][[cell]]1[[/cell]][[cell]]2[[/cell]][[cell]]3[[/cell]][[cell]]4[[/cell]][[cell]]5[[/cell]]
[[cell]]0[[/cell]][[cell]]1[[/cell]][[cell]]2[[/cell]][[cell]]3[[/cell]][[cell]]4[[/cell]][[cell]]5[[/cell]]
[[/row]][[row]]
[[cell colspan="6"]]unknown[[/cell]][[cell colspan="6"]]未知[[/cell]][[cell colspan="6"]]未知[[/cell]]
[[/row]][[row]]
[[cell colspan="6"]]habitable[[/cell]][[cell colspan="6"]]宜居[[/cell]][[cell colspan="6"]]宜居[[/cell]]
[[/row]][[row]]
[[cell colspan="6"]]deadzone[[/cell]][[cell colspan="6"]]死区[[/cell]][[cell colspan="6"]]死區[[/cell]]
[[/row]][[row]]
[[cell colspan="6"]]pending[[/cell]][[cell colspan="6"]]等待分级[[/cell]][[cell colspan="6"]]等待分級[[/cell]]
[[/row]][[row]]
[[cell colspan="6"]]n/a[[/cell]][[cell colspan="6"]]不适用[[/cell]][[cell colspan="6"]]不適用[[/cell]]
[[/row]][[row]]
[[cell colspan="6"]]amended[[/cell]][[cell colspan="6"]]修正[[/cell]][[cell colspan="6"]]修正[[/cell]]
[[/row]][[row]]
[[cell colspan="6"]]omega[[/cell]][[cell colspan="6"]]终结[[/cell]][[cell colspan="6"]]終結[[/cell]]
[[/row]]
[[/table]]

该组件支持简繁切换，如下方代码所示：
[[div class="code"]]
@@[[include :backrooms-wiki-cn:component:level-class@@
|lang=cn/tr
|class=等级
]]
[[/div]]
在 {{lang}} 处选择语言，cn 表示简体中文，tr 表示繁体中文，不填默认选择简体中文。

------

++* 自定义等级

[[div class="code"]]
@@[[include :backrooms-wiki-cn:component:level-class@@
|lang=cn/tr
|class=等级名字
|color=#000000（带有井号的十六进制色号代码。）
|image=链接（至图片的链接。）
|one=在这
|two=随便
|three=放文字
@@]]@@
[[/div]]

+* 使用 CSS 进行自定义：
你可以使用 CSS 进行额外的自定义，将代码放入到 {{@@[[module css]]@@}} 中或者是放入到页面的版式内都可以。**在这一组件中，不要把 {{@@[[module css]]@@}} 放在 {{@@[[include]]@@}} 里面，把它放在那个的下面或者是页面的顶部或底部。**
将这些代码放入到你的页面/版式中以编辑所有的颜色，因为组件的 {{|color=}} 部分仅能控制背景：
[[div class="code"]]
@@[[module css]]@@
.sd-container {
@@    /* 字体 */@@
@@    --sd-font: Poppins, Noto Sans SC, Noto Serif SC;@@

@@    /* 边框 */@@
@@    --sd-border: var(--gray-monochrome); /* 大多数等级 */@@
@@    --sd-border-secondary: 0, 0, 0; /* 不适用 */@@
@@    --sd-border-deadzone: 20, 0, 0; /* 死区 */@@

@@    /* 标志 */@@
@@    --sd-symbol: var(--sd-border) !important; /* 大多数标志 */@@
@@    --sd-symbol-secondary: 255, 255, 255; /* 4 级以上的是白色 */@@

@@    /* 文本 */@@
@@    --sd-bullets: var(--sd-border) !important; /* 点句符文本颜色 */@@
@@    --sd-text: var(--swatch-text-secondary-color); /* 顶部框文本颜色 */@@

@@    /* 等级颜色 */@@
@@    --class-0: 247, 227, 117;@@
@@    --class-1: 255, 201, 14;@@
@@    --class-2: 245, 156, 0;@@
@@    --class-3: 249, 90, 0;@@
@@    --class-4: 254, 23, 1;@@
@@    --class-5: 175, 6, 6;@@
@@    --class-unknown: 38, 38, 38;@@
@@    --class-habitable: 26, 128, 111;@@
@@    --class-deadzone: 44, 13, 12;@@
@@    --class-pending: 182, 182, 182;@@
@@    --class-n-a: 38, 38, 38;@@
@@    --class-amended: 185, 135, 212;@@
@@    --class-omega: 25, 46, 255;@@
}
@@[[/module]]@@
[[/div]]

++* 旧版颜色：
如果你不喜欢新版的样式，想要用回旧版的红色边框色，只需要在你的页面中与组件一同引入下方的代码：
[[div class="code"]]
@@[[module css]]@@
.sd-container {
@@   --sd-border: 90, 29, 27;@@
@@   --sd-image: 90, 29, 27;@@
@@   --sd-symbol: 90, 29, 27;@@
}
@@[[/module]]@@
[[/div]]
[[/div]]