theme description

This commit is contained in:
syuilo 2021-04-14 16:24:07 +09:00
parent fbc5b8ceb7
commit a3687dd653
3 changed files with 17 additions and 0 deletions

View file

@ -716,6 +716,7 @@ goBack: "戻る"
unlikeConfirm: "いいね解除しますか?" unlikeConfirm: "いいね解除しますか?"
fullView: "フルビュー" fullView: "フルビュー"
quitFullView: "フルビュー解除" quitFullView: "フルビュー解除"
addDescription: "説明を追加"
_email: _email:
_follow: _follow:
@ -884,6 +885,7 @@ _theme:
install: "テーマのインストール" install: "テーマのインストール"
manage: "テーマの管理" manage: "テーマの管理"
code: "テーマコード" code: "テーマコード"
description: "説明"
installed: "{name}をインストールしました" installed: "{name}をインストールしました"
installedThemes: "インストールされたテーマ" installedThemes: "インストールされたテーマ"
builtinThemes: "標準のテーマ" builtinThemes: "標準のテーマ"

View file

@ -13,6 +13,9 @@
<FormInput readonly :value="selectedTheme.author"> <FormInput readonly :value="selectedTheme.author">
<span>{{ $ts.author }}</span> <span>{{ $ts.author }}</span>
</FormInput> </FormInput>
<FormTextarea readonly :value="selectedTheme.desc" v-if="selectedTheme.desc">
<span>{{ $ts._theme.description }}</span>
</FormTextarea>
<FormTextarea readonly tall :value="selectedThemeCode"> <FormTextarea readonly tall :value="selectedThemeCode">
<span>{{ $ts._theme.code }}</span> <span>{{ $ts._theme.code }}</span>
<template #desc><button @click="copyThemeCode()" class="_textButton">{{ $ts.copy }}</button></template> <template #desc><button @click="copyThemeCode()" class="_textButton">{{ $ts.copy }}</button></template>

View file

@ -35,6 +35,7 @@
</div> </div>
</div> </div>
</div> </div>
<FormGroup v-if="codeEnabled"> <FormGroup v-if="codeEnabled">
<FormTextarea v-model:value="themeCode" tall> <FormTextarea v-model:value="themeCode" tall>
<span>{{ $ts._theme.code }}</span> <span>{{ $ts._theme.code }}</span>
@ -42,6 +43,14 @@
<FormButton @click="applyThemeCode" primary>{{ $ts.apply }}</FormButton> <FormButton @click="applyThemeCode" primary>{{ $ts.apply }}</FormButton>
</FormGroup> </FormGroup>
<FormButton v-else @click="codeEnabled = true"><Fa :icon="faCode"/> {{ $ts.editCode }}</FormButton> <FormButton v-else @click="codeEnabled = true"><Fa :icon="faCode"/> {{ $ts.editCode }}</FormButton>
<FormGroup v-if="descriptionEnabled">
<FormTextarea v-model:value="description">
<span>{{ $ts._theme.description }}</span>
</FormTextarea>
</FormGroup>
<FormButton v-else @click="descriptionEnabled = true">{{ $ts.addDescription }}</FormButton>
<FormGroup> <FormGroup>
<FormButton @click="showPreview"><Fa :icon="faEye"/> {{ $ts.preview }}</FormButton> <FormButton @click="showPreview"><Fa :icon="faEye"/> {{ $ts.preview }}</FormButton>
<FormButton @click="saveAs" primary><Fa :icon="faSave"/> {{ $ts.saveAs }}</FormButton> <FormButton @click="saveAs" primary><Fa :icon="faSave"/> {{ $ts.saveAs }}</FormButton>
@ -88,6 +97,8 @@ export default defineComponent({
props: lightTheme.props props: lightTheme.props
} as Theme, } as Theme,
codeEnabled: false, codeEnabled: false,
descriptionEnabled: false,
description: null,
themeCode: null, themeCode: null,
bgColors: [ bgColors: [
{ color: '#f5f5f5', kind: 'light', forPreview: '#f5f5f5' }, { color: '#f5f5f5', kind: 'light', forPreview: '#f5f5f5' },
@ -218,6 +229,7 @@ export default defineComponent({
this.theme.id = uuid(); this.theme.id = uuid();
this.theme.name = name; this.theme.name = name;
this.theme.author = `@${this.$i.username}@${toUnicode(host)}`; this.theme.author = `@${this.$i.username}@${toUnicode(host)}`;
if (this.description) this.theme.desc = this.description;
addTheme(this.theme); addTheme(this.theme);
applyTheme(this.theme); applyTheme(this.theme);
if (this.$store.state.darkMode) { if (this.$store.state.darkMode) {