版式:紫晶 V2
评分: +4+x

评分: +4+x

在任何页面内加入以下内容即可使用该版式:

[[include :g2lighter:theme:amethyst-v2]]

概述

紫晶 V2(Amethyst V2)由G2LighterG2Lighter开发,是一个不基于任何前置版式的纯美学版式。更多内容另见本版式在SCP基金会的发布版本


自定义/属性声明

由于作者的个人原因,本版式的内置配色方案可能效果稍欠1。若有需求,可对照以下代码块内容进行修改:

:root {
--theme-color: #8969ff; /* 主题色 */
--accent-color: #2d2d2df0; /* 版头颜色-次主题色 */
--background-color: #1f1e1e; /* 背景 */
--text-color: #e5e5e5; /* 文字 */
--highlight-color: #fefefe; /* 高亮元素 */
--visited-color: #6943f4; /* 已访问链接 */
--unexist-color: #999; /* 失效链接 */
--shadow-color: #000; /* header阴影 */
/* 兼容变量,用于兼容V1,请尽量避免使用 */
--reverse-text-color: var(--highlight-color);
--special-text-color: var(--highlight-color);
--dark-theme-color: var(--light-theme-color);
--header-color: var(--accent-color);
--light-theme-color: #41317e;
--dim-text-color: #999;
/* ---- */
--green: #44ae44; /* 提示色 */
--error-color: #b33939; /* 警告色 */
--header-height: 50px; /* 顶栏高度 */
--sidebar-width: 17em; /* 侧栏宽度 */
--footer-height: var(--header-height); /* 底栏高度 */
--scroll-width: 0.3em; /* 滚动条宽度 */
--scroll-height: 0.5em; /* 滚动条高度 */
--title: "G2Lighter个人站"; /* 网页标题 */
--subtitle: "仅仅是个人站?"; /* 网页副标题 */
--logo: url(https://g2lighter.wdfiles.com/local--files/theme%3Aamethyst/G2Lighter_resized.png); /* Logo */
--search: url(data:image/svg+xml;charset=utf-8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPHN2ZyB2aWV3Qm94PSIwIDAgMjQgMjQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTAgNUM3LjIzODU4IDUgNSA3LjIzODU4IDUgMTBDNSAxMi43NjE0IDcuMjM4NTggMTUgMTAgMTVDMTEuMzgxIDE1IDEyLjYyOTYgMTQuNDQxNSAxMy41MzU1IDEzLjUzNTVDMTQuNDQxNSAxMi42Mjk2IDE1IDExLjM4MSAxNSAxMEMxNSA3LjIzODU4IDEyLjc2MTQgNSAxMCA1Wk0zIDEwQzMgNi4xMzQwMSA2LjEzNDAxIDMgMTAgM0MxMy44NjYgMyAxNyA2LjEzNDAxIDE3IDEwQzE3IDExLjU3MTkgMTYuNDgxIDEzLjAyMzkgMTUuNjA2MyAxNC4xOTIxTDIwLjcwNzEgMTkuMjkyOUMyMS4wOTc2IDE5LjY4MzQgMjEuMDk3NiAyMC4zMTY2IDIwLjcwNzEgMjAuNzA3MUMyMC4zMTY2IDIxLjA5NzYgMTkuNjgzNCAyMS4wOTc2IDE5LjI5MjkgMjAuNzA3MUwxNC4xOTIxIDE1LjYwNjNDMTMuMDIzOSAxNi40ODEgMTEuNTcxOSAxNyAxMCAxN0M2LjEzNDAxIDE3IDMgMTMuODY2IDMgMTBaIiBmaWxsPSIjMDAwMDAwIi8+Cjwvc3ZnPg==); /* 搜索图标 */
--sidebar: url(data:image/svg+xml;charset=utf-8;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI4MDBweCIgaGVpZ2h0PSI4MDBweCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIj4KPHBhdGggZD0iTTIwIDlMNCA5IiBzdHJva2U9IiMxQzI3NEMiIHN0cm9rZS13aWR0aD0iMSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+CjxwYXRoIGQ9Ik0xNSAxNUg0IiBzdHJva2U9IiMxQzI3NEMiIHN0cm9rZS13aWR0aD0iMSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+Cjwvc3ZnPg==);—login: url(data:image/svg+xml;charset=utf-8;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0idHJ1ZSIgaGVpZ2h0PSJ0cnVlIiB2aWV3Qm94PSIwIDAgNTEyIDUxMiIgZmlsbD0ibm9uZSIgY2xhc3M9ImgtZnVsbCB3LWZ1bGwiIGlkPSJpY29uV2l0aEJhY2tncm91bmQiPjxyZWN0IGlkPSJyNCIgd2lkdGg9IjUxMiIgaGVpZ2h0PSI1MTIiIHg9IjAiIHk9IjAiIHJ4PSI4MCIgZmlsbD0iI2ZmZmZmZjAwIiBzdHJva2U9IiMwMDAwMDAiIHN0cm9rZS13aWR0aD0iMCIgc3Ryb2tlLW9wYWNpdHk9IjEwMCUiIHBhaW50LW9yZGVyPSJzdHJva2UiLz48ZGVmcz48bGluZWFyR3JhZGllbnQgaWQ9ImxpbmVhckdyYWRpZW50LWljb25XaXRoQmFja2dyb3VuZCIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIGdyYWRpZW50VHJhbnNmb3JtPSJyb3RhdGUoMCkiIHN0eWxlPSJ0cmFuc2Zvcm0tb3JpZ2luOmNlbnRlciBjZW50ZXIiPjxzdG9wIHN0b3AtY29sb3I9IiM4MDgwODAwMCIvPjxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iIzgwODA4MDAwIi8+PC9saW5lYXJHcmFkaWVudD48cmFkaWFsR3JhZGllbnQgaWQ9ImdsYXJlIiBjeD0iMCIgY3k9IjAiIHI9IjEiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiBncmFkaWVudFRyYW5zZm9ybT0idHJhbnNsYXRlKDI1Nikgcm90YXRlKDkwKSBzY2FsZSg1MTIpIj48c3RvcCBzdG9wLWNvbG9yPSJ3aGl0ZSIvPjxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0id2hpdGUiIHN0b3Atb3BhY2l0eT0iMCIvPjwvcmFkaWFsR3JhZGllbnQ+PGNsaXBQYXRoIGlkPSJjbGlwIj48dXNlIHhsaW5rOmhyZWY9IiNyNCIvPjwvY2xpcFBhdGg+PC9kZWZzPjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMzQwIiBoZWlnaHQ9IjM0MCIgdmlld0JveD0iMCAwIDE0IDE0IiB4PSI4NiIgeT0iODYiPjxnIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzAwMDAwMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48Y2lyY2xlIGN4PSI3IiBjeT0iMy43NSIgcj0iMy4yNSIvPjxwYXRoIGQ9Ik0xMy4xOCAxMy41YTYuNDkgNi40OSAwIDAgMC0xMi4zNiAwWiIvPjwvZz48L3N2Zz48L3N2Zz4=); /* 侧栏图标 */
}

一般来说,若希望调色,仅需修改以下属性:

  • --theme-color:主题色,一般设置为较明亮的颜色
  • --light-theme-color:部分区域边框色调,一般比主题色深沉很多
  • --visited-color:已访问链接显示色,一般比主题色稍暗

或亦可以信任作者的调色能力,尝试内置配色!


部分内置类

本版式提供了一些基础类,也许可以提升创作体验。
内置类使用方式 快捷使用 示例效果
[[span class="folder"]]文件夹[[/span]] ##e folder|内容## 文件夹
[[span class="heimu"]]黑幕效果一[[/span]] ##e heimu|内容## 黑幕效果一
[[span class="dblock"]]黑幕效果二[[/span]] ##e dblock|内容## 黑幕效果二
[[span class="colorful"]]变色文字[[/span]] ##e colorful|内容## 变色文字
[[span class="appear"]]自动浮现[[/span]] ##e appear|内容## 自动浮现
[[span class="blur"]]模糊文本[[/span]] ##e blur|内容## 模糊文本
[[span class="mono"]]黑白文本[[/span]] ##e mono|内容## 黑白文本
[[span class="dim"]]黯淡文本[[/span]] ##e dim|内容## 黯淡文本
[[span class="reverse"]]反转内容[[/span]] ##e reverse|内容## 反转内容
[[span class="ruby"]]底部文字[[span class="rt"]]上层注释[[/span]][[/span]] 底部文字上层注释
[[span class="colortext"]]彩色文本[[/span]] ##e colortext|内容## 彩色文本
[[span class="keycap"]]按键文本[[/span]] ##e keycap|内容## 按键文本
[[span class="flip"]]浮现文本[[/span]] ##e flip|内容## 浮现文本
[[span class="任意类型 hovershow"]]hover去除遮罩[[/span]] ##e 类型 hovershow|内容## hover去除遮罩

快捷使用说明


基础格式:##e 效果名|内容##,效果名即为内置类名称,不同效果名间可插入空格分隔,亦可直接相连。
示例:

  • ##e blur hovershow|内容##
  • ##e dblock folder|内容##

注意事项:

  • 开头的"e"不能省略,位置亦不可改变
  • 快捷使用仅在行内生效,不可跨行使用
  • 快捷使用不可嵌套

开发历史


计划列表:

  • 更多模块适配
  • 修复未登录显示问题
  • 亮暗色适配
  • 现代化顶栏(可选)
  • 简化CSS
  • 更多动画
  • 移动端适配
  • 评分模块适配
  • 优化编辑区显示方式
  • 表格优化
  • 编辑区列表优化
  • 更多自定义元素

版式效果预览


新回复
登入为 Wikidot 用户
(将不会发布)
- +
除非特别注明,本页内容采用以下授权方式: Creative Commons Attribution-ShareAlike 3.0 License