feat: インスタンスのテーマカラーを設定できるように

This commit is contained in:
syuilo 2022-02-09 21:25:48 +09:00
parent 624aef6979
commit 4ae1a65958
10 changed files with 57 additions and 2 deletions

View File

@ -10,6 +10,15 @@
You should also include the user name that made the change. You should also include the user name that made the change.
--> -->
## 12.x.x (unreleased)
### Improvements
- インスタンスのテーマカラーを設定できるように @syuilo
### Bugfixes
-
## 12.104.0 (2022/02/09) ## 12.104.0 (2022/02/09)
### Note ### Note

View File

@ -828,6 +828,7 @@ overridedDeviceKind: "デバイスタイプ"
smartphone: "スマートフォン" smartphone: "スマートフォン"
tablet: "タブレット" tablet: "タブレット"
auto: "自動" auto: "自動"
themeColor: "テーマカラー"
_emailUnavailable: _emailUnavailable:
used: "既に使用されています" used: "既に使用されています"

View File

@ -0,0 +1,13 @@
const { MigrationInterface, QueryRunner } = require("typeorm");
module.exports = class instanceThemeColor1644395759931 {
name = 'instanceThemeColor1644395759931'
async up(queryRunner) {
await queryRunner.query(`ALTER TABLE "meta" ADD "themeColor" character varying(512)`);
}
async down(queryRunner) {
await queryRunner.query(`ALTER TABLE "meta" DROP COLUMN "themeColor"`);
}
}

View File

@ -88,6 +88,12 @@ export class Meta {
}) })
public pinnedClipId: Clip['id'] | null; public pinnedClipId: Clip['id'] | null;
@Column('varchar', {
length: 512,
nullable: true,
})
public themeColor: string | null;
@Column('varchar', { @Column('varchar', {
length: 512, length: 512,
nullable: true, nullable: true,

View File

@ -41,6 +41,10 @@ export const meta = {
validator: $.optional.nullable.arr($.str), validator: $.optional.nullable.arr($.str),
}, },
themeColor: {
validator: $.optional.nullable.str,
},
mascotImageUrl: { mascotImageUrl: {
validator: $.optional.nullable.str, validator: $.optional.nullable.str,
}, },
@ -331,6 +335,10 @@ export default define(meta, async (ps, me) => {
set.blockedHosts = ps.blockedHosts.filter(Boolean); set.blockedHosts = ps.blockedHosts.filter(Boolean);
} }
if (ps.themeColor !== undefined) {
set.themeColor = ps.themeColor;
}
if (ps.mascotImageUrl !== undefined) { if (ps.mascotImageUrl !== undefined) {
set.mascotImageUrl = ps.mascotImageUrl; set.mascotImageUrl = ps.mascotImageUrl;
} }

View File

@ -499,6 +499,7 @@ export default define(meta, async (ps, me) => {
enableRecaptcha: instance.enableRecaptcha, enableRecaptcha: instance.enableRecaptcha,
recaptchaSiteKey: instance.recaptchaSiteKey, recaptchaSiteKey: instance.recaptchaSiteKey,
swPublickey: instance.swPublicKey, swPublickey: instance.swPublicKey,
themeColor: instance.themeColor,
mascotImageUrl: instance.mascotImageUrl, mascotImageUrl: instance.mascotImageUrl,
bannerUrl: instance.bannerUrl, bannerUrl: instance.bannerUrl,
errorImageUrl: instance.errorImageUrl, errorImageUrl: instance.errorImageUrl,

View File

@ -200,6 +200,7 @@ router.get(['/@:user', '/@:user/:sub'], async (ctx, next) => {
sub: ctx.params.sub, sub: ctx.params.sub,
instanceName: meta.name || 'Misskey', instanceName: meta.name || 'Misskey',
icon: meta.iconUrl, icon: meta.iconUrl,
themeColor: meta.themeColor,
}); });
ctx.set('Cache-Control', 'public, max-age=30'); ctx.set('Cache-Control', 'public, max-age=30');
} else { } else {
@ -239,6 +240,7 @@ router.get('/notes/:note', async (ctx, next) => {
summary: getNoteSummary(_note), summary: getNoteSummary(_note),
instanceName: meta.name || 'Misskey', instanceName: meta.name || 'Misskey',
icon: meta.iconUrl, icon: meta.iconUrl,
themeColor: meta.themeColor,
}); });
if (['public', 'home'].includes(note.visibility)) { if (['public', 'home'].includes(note.visibility)) {
@ -277,6 +279,7 @@ router.get('/@:user/pages/:page', async (ctx, next) => {
profile, profile,
instanceName: meta.name || 'Misskey', instanceName: meta.name || 'Misskey',
icon: meta.iconUrl, icon: meta.iconUrl,
themeColor: meta.themeColor,
}); });
if (['public'].includes(page.visibility)) { if (['public'].includes(page.visibility)) {
@ -307,6 +310,7 @@ router.get('/clips/:clip', async (ctx, next) => {
profile, profile,
instanceName: meta.name || 'Misskey', instanceName: meta.name || 'Misskey',
icon: meta.iconUrl, icon: meta.iconUrl,
themeColor: meta.themeColor,
}); });
ctx.set('Cache-Control', 'public, max-age=180'); ctx.set('Cache-Control', 'public, max-age=180');
@ -330,6 +334,7 @@ router.get('/gallery/:post', async (ctx, next) => {
profile, profile,
instanceName: meta.name || 'Misskey', instanceName: meta.name || 'Misskey',
icon: meta.iconUrl, icon: meta.iconUrl,
themeColor: meta.themeColor,
}); });
ctx.set('Cache-Control', 'public, max-age=180'); ctx.set('Cache-Control', 'public, max-age=180');
@ -353,6 +358,7 @@ router.get('/channels/:channel', async (ctx, next) => {
channel: _channel, channel: _channel,
instanceName: meta.name || 'Misskey', instanceName: meta.name || 'Misskey',
icon: meta.iconUrl, icon: meta.iconUrl,
themeColor: meta.themeColor,
}); });
ctx.set('Cache-Control', 'public, max-age=180'); ctx.set('Cache-Control', 'public, max-age=180');
@ -412,6 +418,7 @@ router.get('(.*)', async ctx => {
instanceName: meta.name || 'Misskey', instanceName: meta.name || 'Misskey',
desc: meta.description, desc: meta.description,
icon: meta.iconUrl, icon: meta.iconUrl,
themeColor: meta.themeColor,
}); });
ctx.set('Cache-Control', 'public, max-age=300'); ctx.set('Cache-Control', 'public, max-age=300');
}); });

View File

@ -9,6 +9,7 @@ module.exports = async (ctx: Koa.Context) => {
json.short_name = instance.name || 'Misskey'; json.short_name = instance.name || 'Misskey';
json.name = instance.name || 'Misskey'; json.name = instance.name || 'Misskey';
if (instance.themeColor) json.theme_color = instance.themeColor;
ctx.set('Cache-Control', 'max-age=300'); ctx.set('Cache-Control', 'max-age=300');
ctx.body = json; ctx.body = json;

View File

@ -19,8 +19,8 @@ html
meta(charset='utf-8') meta(charset='utf-8')
meta(name='application-name' content='Misskey') meta(name='application-name' content='Misskey')
meta(name='referrer' content='origin') meta(name='referrer' content='origin')
meta(name='theme-color' content='#86b300') meta(name='theme-color' content= themeColor || '#86b300')
meta(name='theme-color-orig' content='#86b300') meta(name='theme-color-orig' content= themeColor || '#86b300')
meta(property='twitter:card' content='summary') meta(property='twitter:card' content='summary')
meta(property='og:site_name' content= instanceName || 'Misskey') meta(property='og:site_name' content= instanceName || 'Misskey')
meta(name='viewport' content='width=device-width, initial-scale=1') meta(name='viewport' content='width=device-width, initial-scale=1')

View File

@ -25,6 +25,12 @@
<template #label>{{ $ts.backgroundImageUrl }}</template> <template #label>{{ $ts.backgroundImageUrl }}</template>
</FormInput> </FormInput>
<FormInput v-model="themeColor" class="_formBlock">
<template #prefix><i class="fas fa-palette"></i></template>
<template #label>{{ $ts.themeColor }}</template>
<template #caption>#RRGGBB</template>
</FormInput>
<FormInput v-model="tosUrl" class="_formBlock"> <FormInput v-model="tosUrl" class="_formBlock">
<template #prefix><i class="fas fa-link"></i></template> <template #prefix><i class="fas fa-link"></i></template>
<template #label>{{ $ts.tosUrl }}</template> <template #label>{{ $ts.tosUrl }}</template>
@ -179,6 +185,7 @@ export default defineComponent({
iconUrl: null, iconUrl: null,
bannerUrl: null, bannerUrl: null,
backgroundImageUrl: null, backgroundImageUrl: null,
themeColor: null,
maxNoteTextLength: 0, maxNoteTextLength: 0,
enableLocalTimeline: false, enableLocalTimeline: false,
enableGlobalTimeline: false, enableGlobalTimeline: false,
@ -206,6 +213,7 @@ export default defineComponent({
this.iconUrl = meta.iconUrl; this.iconUrl = meta.iconUrl;
this.bannerUrl = meta.bannerUrl; this.bannerUrl = meta.bannerUrl;
this.backgroundImageUrl = meta.backgroundImageUrl; this.backgroundImageUrl = meta.backgroundImageUrl;
this.themeColor = meta.themeColor;
this.maintainerName = meta.maintainerName; this.maintainerName = meta.maintainerName;
this.maintainerEmail = meta.maintainerEmail; this.maintainerEmail = meta.maintainerEmail;
this.maxNoteTextLength = meta.maxNoteTextLength; this.maxNoteTextLength = meta.maxNoteTextLength;
@ -233,6 +241,7 @@ export default defineComponent({
iconUrl: this.iconUrl, iconUrl: this.iconUrl,
bannerUrl: this.bannerUrl, bannerUrl: this.bannerUrl,
backgroundImageUrl: this.backgroundImageUrl, backgroundImageUrl: this.backgroundImageUrl,
themeColor: this.themeColor === '' ? null : this.themeColor,
maintainerName: this.maintainerName, maintainerName: this.maintainerName,
maintainerEmail: this.maintainerEmail, maintainerEmail: this.maintainerEmail,
maxNoteTextLength: this.maxNoteTextLength, maxNoteTextLength: this.maxNoteTextLength,