sim1222/test1
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

emojigen wip32

Browse Source
This commit is contained in:
こけっち 2022-05-07 12:04:56 +09:00
parent 562e4fd743
commit b4edc40fa8
No known key found for this signature in database
GPG Key ID: 21460619C5FC4DD1
1 changed files with 53 additions and 55 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

108
packages/client/src/pages/admin/emojigen.vue
View File

@ -1,70 +1,68 @@
<template> <template>
<MkSpacer :content-max="700" :margin-min="16" :margin-max="32"> <MkSpacer :content-max="700" :margin-min="16" :margin-max="32">
<FormSuspense> <div class="cwepdizn _formRoot">
<div class="cwepdizn _formRoot"> <FormInput v-model="emojiName" class="_formBlock">
<FormInput v-model="emojiName" class="_formBlock"> <template #label>{{ $ts.emojiName }}</template>
<template #label>{{ $ts.emojiName }}</template> </FormInput>
</FormInput>
<FormTextarea v-model="text" class="_formBlock"> <FormTextarea v-model="text" class="_formBlock">
<template #label>{{ $ts.text }}</template> <template #label>{{ $ts.text }}</template>
</FormTextarea> </FormTextarea>
<FormRadios v-model="emojiAlign" class="_formBlock"> <FormRadios v-model="emojiAlign" class="_formBlock">
<template #label>{{ $ts.emojiAlign }}</template> <template #label>{{ $ts.emojiAlign }}</template>
<option value="left"><i class="fa-solid fa-align-left"/></option> <option value="left"><i class="fa-solid fa-align-left"/></option>
<option value="center"><i class="fa-solid fa-align-center"></i></option> <option value="center"><i class="fa-solid fa-align-center"></i></option>
<option value="right"><i class="fa-solid fa-align-right"/></option> <option value="right"><i class="fa-solid fa-align-right"/></option>
</FormRadios> </FormRadios>
<FormSection> <FormSection>
<template #label>{{ $ts.emojiSizeSetting }}</template> <template #label>{{ $ts.emojiSizeSetting }}</template>
<FormSwitch v-model="emojiSizeFixed" class="_formBlock"> <FormSwitch v-model="emojiSizeFixed" class="_formBlock">
<template #label>{{ $ts.emojiSizeFixed }}</template> <template #label>{{ $ts.emojiSizeFixed }}</template>
</FormSwitch> </FormSwitch>
<FormSwitch v-model="emojiStretch" class="_formBlock"> <FormSwitch v-model="emojiStretch" class="_formBlock">
<template #label>{{ $ts.emojiStretch }}</template> <template #label>{{ $ts.emojiStretch }}</template>
</FormSwitch> </FormSwitch>
</FormSection> </FormSection>
<FormRadios v-model="font" class="_formBlock"> <FormRadios v-model="font" class="_formBlock">
<template #label>{{ $ts.font }}</template> <template #label>{{ $ts.font }}</template>
<option value="notosans-mono-bold">Noto Sans Mono CJK JP Bold</option> <option value="notosans-mono-bold">Noto Sans Mono CJK JP Bold</option>
<option value="mplus-1p-black">M+ 1p black</option> <option value="mplus-1p-black">M+ 1p black</option>
<option value="rounded-x-mplus-1p-black">Rounded M+ 1p black</option> <option value="rounded-x-mplus-1p-black">Rounded M+ 1p black</option>
<option value="ipamjm">IPAmj明朝</option> <option value="ipamjm">IPAmj明朝</option>
<option value="aoyagireisyoshimo">青柳隷書しも</option> <option value="aoyagireisyoshimo">青柳隷書しも</option>
<option value="LinLibertine_RBah">LinLibertine Bold</option> <option value="LinLibertine_RBah">LinLibertine Bold</option>
</FormRadios> </FormRadios>
<FormSection> <FormSection>
<template #label>{{ $ts.emojiColor }}</template> <template #label>{{ $ts.emojiColor }}</template>
<div class="cwepdizn-colors"> <div class="cwepdizn-colors">
<div class="row"> <div class="row">
<button v-for="color in accentColors" :key="color" class="color rounded _button" @click="setAccentColor(color)"> <button v-for="color in accentColors" :key="color" class="color rounded _button" @click="setAccentColor(color)">
<div class="preview" :style="{ background: color }"></div> <div class="preview" :style="{ background: color }"></div>
</button> </button>
</div>
</div> </div>
</div>
<FormInput v-model="emojiColor" class="_formBlock"> <FormInput v-model="emojiColor" class="_formBlock">
<template #prefix><i class="fas fa-palette"></i></template> <template #prefix><i class="fas fa-palette"></i></template>
<template #label>{{ $ts.emojiColor }}</template> <template #label>{{ $ts.emojiColor }}</template>
<template #caption>#RRGGBB</template> <template #caption>#RRGGBB</template>
</FormInput> </FormInput>
</FormSection> </FormSection>
<FormButton primary class="_formBlock" @click="emojiGenerate">{{ $ts.emojiGenerate }}</FormButton> <FormButton primary class="_formBlock" @click="emojiGenerate">{{ $ts.emojiGenerate }}</FormButton>
<FormSection> <FormSection>
<template #label>{{ $ts.preview }}</template> <template #label>{{ $ts.preview }}</template>
<img :src="emojiUrl" class="img" :alt="emojiName"/> <img :src="emojiUrl" class="img" :alt="emojiName"/>
<p>{{ emojiUrl }}</p> <a href="{{ emojiUrl }}"></a><p>{{ emojiUrl }}</p>
</FormSection> </FormSection>
<FormButton primary class="_formBlock" @click="emojiApproval">{{ $ts.emojiApproval }}</FormButton> <FormButton primary class="_formBlock" @click="emojiApproval">{{ $ts.emojiApproval }}</FormButton>
</div> </div>
</FormSuspense>
</MkSpacer> </MkSpacer>
</template> </template>