狐步舞 版式

狐步舞

在任意页面中：

[[include :cas-wiki-cn:theme:foxtrot]]

这是什么？

狐步舞是一个美学版式，设计以模仿将现代的平面设计与那古怪的早期网页舒适性相混合。由LinXingJun搬运自SCP基金会中文分部。

以下为用于控制此版式各方面的 CSS 变量。

+ 基础

基础

• --header-title — 显示在页眉标题处的文本。

• --header-subtitle — 显示在页眉副标题处的文本。

• --logo-img — 显示在页眉处的图片。

• --logo-opacity — 显示在页眉处的图片透明度。
  • 默认值： 14%
  • 默认值（暗色模式）： 30%

+ 颜色

颜色

• --accent — 版式的强调色。（RGB）
  • 默认值： 59, 59, 59
  • 默认值（暗色模式）： 153, 187, 255

• --header-txt-color — 版式标题的文本颜色。
  • 默认值： #333333
  • 默认值（暗色模式）： rgb(var(--accent))

• --misc-txt-color — 页眉内及周边多个元素的文本颜色。
  • 默认值： #464646
  • 默认值（暗色模式）： var(--dark-txt-color)

• --link-txt-color — 链接的文本及背景色。
  • 默认值： #E6283C
  • 默认值（暗色模式）： rgb(var(--accent))

• --darkmode-gradient-top — 暗色模式中页面背景顶部的渐变色。
  • 默认值（暗色模式）： var(--dark-bg-1)

• --darkmode-gradient-bottom — 暗色模式中页面背景底部（或主体）的渐变色。
  • 默认值（暗色模式）： var(--dark-bg-2)

• --dark-bg-1 — 暗色模式中所有元素的背景色其一。
  • 默认值（暗色模式）： #21252E

• --dark-bg-2 — 暗色模式中所有元素的背景色其二。
  • 默认值（暗色模式）： #2F333C

• --dark-txt-color — 暗色模式中的基础文本颜色。
  • 默认值（暗色模式）： #EDEDED

+ 字体

字体

• --head-font — 用在页眉及页面标题处的字体。
  • 默认值： Lexend

• --page-font — 用在页面内容处的字体。
  • 默认值： verdana

• --ui-font — 用在页面内容外的界面处的字体。
  • 默认值： Sofia Sans

• --mono-font — 在查看与编辑页面源代码时使用的字体。
  • 默认值： 'JetBrains Mono', 幼圆

• --base-font-size — 页面内容外界面的字体大小。
  • 默认值： 0.9rem

• --page-font-size — 页面内容的字体大小。
  • 默认值： 1rem

元素

---

Div

由此版式包含或修改的 div 块。

[[div class="blockquote"]]

[[div class="modal"]]

[[div class="jotting"]]

[[div class="paper"]]

[[div class="notation"]]

着色

许多元素都可以通过将其包裹在一个类为 tableX 的 div 内而着色。

table1 对应着绿色，
table2 对应着蓝色，
table3 对应着黄色，
table4 对应着橙色
table5 对应着红色
而 table6 对应着紫色。

普通表格
这里是文本
这里是文本
这里是文本

带有 table2 类的表格
这里是文本
这里是文本
这里是文本

带有 table5 类的表格
这里是文本
这里是文本
这里是文本

普通引用块

带有 table1 类的引用块

带有 table3 类的引用块

附加

一点额外提示。

• 折叠在此版式中被大量修改，可以通过被包裹在类为 default-col 的 div 内将其还原至其原来的外观。

+ 展开

占位用

• 几乎所有元素都可以通过被包裹在类为 round 的 div 内从而变成圆角。

原引用块

圆角引用块

• 应用 hidetitle=a 设置可以移除页面标题。

• 应用 wide=a 设置可以扩展页面的宽度——不过这可能会损坏现有的侧边框（sidebox，本版式内置支持此扩展）。

• 应用 verdana=a 设置可将页面主要内容的字体变更为Verdana。