diff --git a/README.md b/README.md
index a9dedf0..c4c0d46 100644
--- a/README.md
+++ b/README.md
@@ -30,4 +30,25 @@ Every commit in this branch will be built and tested automatically by Github Act
}
```
+ The above is required content, if you need more custom configuration, please skip to [Configuration](#Configuration).
* Activate the theme.
+
+### Configuration
+
+The Moegi theme is configured by declaring a `config` object in `Site Header`, for example:
+```js
+
+```
+
+| Name | Description |
+| ------ | ------ |
+| `api` | required |
+| `primaryColor` | Optional. Custom theme color, default is '#86B81B' (* Only HEX format supported) |
diff --git a/README_zh.md b/README_zh.md
index e895881..391e91b 100644
--- a/README_zh.md
+++ b/README_zh.md
@@ -28,4 +28,25 @@
}
```
-* 设置完成，启用主题
\ No newline at end of file
+ 以上为必填内容，如需更多自定义配置请跳转[配置项](#配置项)。
+* 设置完成，启用主题
+
+### 配置项
+
+Moegi 主题的配置方式为在 `Site Header`中声明`config`对象，例如：
+```js
+
+```
+
+| 配置项名称 | 说明 |
+| ------ | ------ |
+| `api` | 必填 |
+| `primaryColor` | 可选。自定义主题颜色，默认为 '#86B81B'（* 仅支持HEX格式） |
\ No newline at end of file
diff --git a/src/App.svelte b/src/App.svelte
index bc4c5c9..4b9af79 100644
--- a/src/App.svelte
+++ b/src/App.svelte
@@ -13,13 +13,28 @@
let loaded = false;
let customHeaderClass = '';
+ loadCustomConfig();
+
onMount(async () => {
const info = await api.settings.browse();
siteInfo.set(info);
console.log($siteInfo);
});
+
+ function loadCustomConfig () {
+ if (config.primaryColor) {
+ const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(config.primaryColor);
+ const rgbColor = result ? {
+ r: parseInt(result[1], 16),
+ g: parseInt(result[2], 16),
+ b: parseInt(result[3], 16)
+ } : {};
+ document.documentElement.style.setProperty('--color-primary', config.primaryColor);
+ document.documentElement.style.setProperty('--color-primary-rgb', `${rgbColor.r}, ${rgbColor.g}, ${rgbColor.b}`);
+ }
+ }
- function handleMessage(event) {
+ function handleMessage (event) {
const eventDetail = event.detail
switch (eventDetail.func) {
case 'setLoadStatus':
diff --git a/src/components/FeedItem.svelte b/src/components/FeedItem.svelte
index f5e11ec..54611a9 100644
--- a/src/components/FeedItem.svelte
+++ b/src/components/FeedItem.svelte
@@ -5,7 +5,6 @@