基岩 版式

基岩

评分: +37+x

基岩是一个由 EstrellaYoshteEstrellaYoshteLirynLiryn 以及 Placeholder McDPlaceholder McD 制作的美学基础版式,特别感谢 aismallardaismallard 在 GitHub 上的协助,感谢 WoedenazWoedenaz 协助制作了编辑区域的按钮 SVG 以及一些常规的咨询。

此版式作为玄武岩 2.0 的基础架构存在。

Quartz--basalt-primary-color254,254,254
Calcite--basalt-secondary-color247,248,250
Lapis Lazuli--basalt-bright-element-color16,76,184
Amethyst--basalt-undertone61,71,202
Slate--basalt-overtone56,60,64
{$color6-name}{$color6-variable}{$color6-info}
Granite--basalt-tertiary-color218,219,222
Andesite--basalt-sub-text-color155,154,162
Sunstone--basalt-alternate-color255,132,0
Emerald--basalt-positive-color26,180,28
Ruby--basalt-negative-color255,48,48
Sapphire--basalt-dark-element-color18,20,150
{$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}

若需在某页面中使用,请添加以下代码:

[[include :scp-wiki-cn:theme:bedrock]]

示例

可通过四个连字符 “----1 创建水平分割线。若它未被放在其他部件(诸如引用块)中,则会左右延伸贯穿页面。这种将文件分割为多个部分的线就是分割线。

basaltlogo.svg

插图方块。

标题可通过在一行字起始处输入 1 至 6 个加号“+”来创建。

此为分页(tab view)。

这是一个引用块,在一行字的起始处加上“> ”来创建。

更多文字


一条分割线

嵌套引用块

这是 表格
你应该老早 就知道怎么
做这个了吧

标题字体为 Lexend / 思源黑体简中。

正文字体为 Inter / 思源黑体简中。

用户界面字体为 Jost / 思源黑体简中。

等宽字体为 JetBrains Mono / 思源宋体简中


CSS 变量

基岩内置了一系列的 CSS 变量,可以被修改以改变其外观。某些顶级变量如下:

:root {
    --basalt-primary-color: 254,254,254;
    --basalt-secondary-color: 247,248,250;
    --basalt-tertiary-color: 218,219,222;
    --basalt-main-text-color: 20,20,20;
    --basalt-overtone: 50,50,50;
    --basalt-undertone: 61,71,202;
 
    --basalt-bright-element-color: 16,76,184;
    --basalt-dark-element-color: 18,20,150;
    --basalt-alternate-color: 255,132,0;
    --basalt-positive-color: 24,163,20;
    --basalt-negative-color: 255,48,48;
    --basalt-cancel-color: var(--basalt-negative-color);
    --basalt-sub-text-color: 155,154,162;
    --basalt-light-text-color: var(--basalt-primary-color);
 
    --basalt-UI-dark-palette: var(--basalt-overtone);
    --basalt-focus-color: var(--basalt-undertone);
    --basalt-background-color: var(--basalt-primary-color);
}

颜色变量为 RGB 格式。

:root {
    --header-font-primary: 'Lexend';
    --UI-font-primary: 'Jost';
    --body-font-primary: 'Inter';
    --mono-font-primary: 'JetBrains Mono';
}
 
:root:lang(cn) {
    --body-font-fallback: "Noto Sans SC", Verdana, "Microsoft YaHei", "微软雅黑", Geneva, sans-serif, STXihei, "华文细黑";
    --UI-font-fallback: "Noto Sans SC", "方体", "PingFang SC", "黑体", "Heiti SC", "Microsoft JhengHei UI", "Microsoft JhengHei", Roboto, Noto, "Noto Sans CJK SC", sans-serif;
    --header-font-fallback: var(--body-font-fallback);
    --mono-font-fallback: "Noto Serif SC", "Microsoft YaHei", "微软雅黑", "Courier New", Courier, monospace, STXihei, "华文细黑";
}

这是四个被基岩所使用的字体种类。

:root {
    --header-logo: url('https://cdn.scpwiki.com/theme/en/basalt/basaltlogo.svg');
    --header-title: 'SCP Foundation';
    --header-subtitle: 'SECURE - CONTAIN - PROTECT';
    --title-size: 1.5rem;
    --subtitle-size: 0.825rem;
 
    --base-font-size: 1rem;
    --main-content-width: 67.5rem;
    --side-bar-width: 19rem;
}
 
:root:lang(cn) {
    --header-title: 'SCP基金会';
    --header-subtitle: '控制 - 收容 - 保护';
}

注意由于 CSS 的 calc() 函数机制,任何有长度单位的变量,比如 rem 或是 px,其单位都不应被省略,即使其值被设定为 0,比如 --subtitle-size: 0rem; 能使副标题消失,且亦不会使 calc() 功能无效。

--main-content-width 不应被以 % 单位设定。若需使主区域占据整个屏幕的宽度,则使用任意高的 rem 值即可。


其它

该版式的源代码可以在我们的 GitHub 页面中找到。

基岩目前与常规版式并不兼容。

除非特别注明,本页内容采用以下授权方式: Creative Commons Attribution-ShareAlike 3.0 License