README

这是一个 Flarum 扩展。为用户头像/用户名/帖子/用户卡片添加装饰。

实际上，这个插件更可能被称为“基于用户的样式注入引擎”

注意

此代码使用一些激进的技巧来拦截所有头像/用户名的可能性。这可能会与其他插件的部分产生问题。如果出现问题，请在设置中禁用用户名/头像劫持。

此扩展与所有使用高亮辅助工具的扩展不兼容。目前我们支持 flarum/core 和 flarum/mentions。如果您发现某个地方用户名显示为空白，请在设置中禁用用户名/头像劫持，并报告给我们作为不兼容性问题。

要体验全部功能，您可能还需要安装 xypp/store

简介

此插件提供了一种使用 CSS 和其他特殊标记更改用户组件外观的方法。

管理员可以创建装饰并将其授予用户。用户可以看到他们被授予的装饰，并在个人主页上应用它们。装饰应在论坛的任何地方生效。

如果已安装 xypp/store，用户可以从商店购买装饰！

用法

添加装饰

使用管理员账户登录，转到用户页面，点击装饰按钮打开装饰页面。只需点击右上角的“添加装饰”按钮即可。

授予装饰

转到用户页面，点击右上角的控制按钮，然后点击“提供装饰”。

创建项目

转到商店页面，点击右上角的“添加项目”按钮。

填写基本信息后，选择产品提供商为 装饰。

产品加载后，选择要作为产品使用的装饰。

如果装饰有时间限制，只需填写 时间限制 即可。

如果不需要，请不要填写使用限制，这不会产生影响，但会导致用户从购买次数中扣除。

特殊 CSS 标记

使用 .base 选择装饰容器元素（即 .decoration-container 元素）。此元素将具有其原始对应元素的属性，并包装其内容。

使用 .element-aNameToBeFillThere[....] 创建新元素。以下是一个具体用例

/** Rules */
.element-<unique-id>[tag="<tag>"][parent="<parent selector>"][copy="<copy selector>"][after="<after selector>"][content="<content>"][ class="<class>"]

.element-test
/** Create a span element with the content Hello, located under container */
.element-test1[tag="span"][content="hello"]{....}
/** Create a div element under .Post-body */
.element-test1[tag="div"][parent="Post-body"]{....}
/** Create a span element with the content Hello, located under the first child of the first element */
.element-test1[tag="div"][parent="* *"]{....}
/** Copy the first img element and place under the container */
.element-test1[tag="#"][content="img"]{....}

上面的 <parent selector> 和 <copy selector> 支持匹配任何元素，使用 * 匹配，或使用字符串匹配 className 或 tagName。请注意，className 和 tagName 不需要以 . 或 # 前缀，并且它们是区分大小写的。使用空格分隔嵌套匹配。

Q&A

• 为什么样式选择与 QuerySelector 不兼容？

元素匹配不在 DOM 上运行，而是在 VNode 树上运行。

• 管理员能否删除自己的装饰？

关闭 查看全部 功能

• 装饰不起作用

打开控制台查看是否输出警告或错误。

安装

使用 composer 安装

composer require xypp/user-decoration:"*"

更新

composer update xypp/user-decoration:"*"
php flarum migrate
php flarum cache:clear

链接

• 包管理器
• 代码托管平台