diff options
Diffstat (limited to 'packages/frontend/src/pages/settings')
21 files changed, 136 insertions, 136 deletions
diff --git a/packages/frontend/src/pages/settings/2fa.vue b/packages/frontend/src/pages/settings/2fa.vue index e9ff770938..e6ef09668c 100644 --- a/packages/frontend/src/pages/settings/2fa.vue +++ b/packages/frontend/src/pages/settings/2fa.vue @@ -70,7 +70,7 @@ import { hostname } from '@/config'; import { byteify, hexify, stringify } from '@/scripts/2fa'; import MkButton from '@/components/MkButton.vue'; import MkInfo from '@/components/MkInfo.vue'; -import MkInput from '@/components/form/input.vue'; +import MkInput from '@/components/MkInput.vue'; import MkSwitch from '@/components/MkSwitch.vue'; import * as os from '@/os'; import { $i } from '@/account'; diff --git a/packages/frontend/src/pages/settings/custom-css.vue b/packages/frontend/src/pages/settings/custom-css.vue index be2ec32ac2..456c3742c5 100644 --- a/packages/frontend/src/pages/settings/custom-css.vue +++ b/packages/frontend/src/pages/settings/custom-css.vue @@ -2,15 +2,15 @@ <div class="_gaps_m"> <FormInfo warn>{{ i18n.ts.customCssWarn }}</FormInfo> - <FormTextarea v-model="localCustomCss" manual-save tall class="_monospace" style="tab-size: 2;"> + <MkTextarea v-model="localCustomCss" manual-save tall class="_monospace" style="tab-size: 2;"> <template #label>CSS</template> - </FormTextarea> + </MkTextarea> </div> </template> <script lang="ts" setup> import { ref, watch } from 'vue'; -import FormTextarea from '@/components/form/textarea.vue'; +import MkTextarea from '@/components/MkTextarea.vue'; import FormInfo from '@/components/MkInfo.vue'; import * as os from '@/os'; import { unisonReload } from '@/scripts/unison-reload'; diff --git a/packages/frontend/src/pages/settings/deck.vue b/packages/frontend/src/pages/settings/deck.vue index 1437e3097e..3f1f2820f0 100644 --- a/packages/frontend/src/pages/settings/deck.vue +++ b/packages/frontend/src/pages/settings/deck.vue @@ -4,11 +4,11 @@ <MkSwitch v-model="alwaysShowMainColumn">{{ i18n.ts._deck.alwaysShowMainColumn }}</MkSwitch> - <FormRadios v-model="columnAlign"> + <MkRadios v-model="columnAlign"> <template #label>{{ i18n.ts._deck.columnAlign }}</template> <option value="left">{{ i18n.ts.left }}</option> <option value="center">{{ i18n.ts.center }}</option> - </FormRadios> + </MkRadios> </div> </template> @@ -16,8 +16,8 @@ import { computed, watch } from 'vue'; import MkSwitch from '@/components/MkSwitch.vue'; import FormLink from '@/components/form/link.vue'; -import FormRadios from '@/components/form/radios.vue'; -import FormInput from '@/components/form/input.vue'; +import MkRadios from '@/components/MkRadios.vue'; +import MkInput from '@/components/MkInput.vue'; import { deckStore } from '@/ui/deck/deck-store'; import * as os from '@/os'; import { unisonReload } from '@/scripts/unison-reload'; diff --git a/packages/frontend/src/pages/settings/email.vue b/packages/frontend/src/pages/settings/email.vue index bb885f7b1f..57b07b1cc1 100644 --- a/packages/frontend/src/pages/settings/email.vue +++ b/packages/frontend/src/pages/settings/email.vue @@ -2,11 +2,11 @@ <div class="_gaps_m"> <FormSection first> <template #label>{{ i18n.ts.emailAddress }}</template> - <FormInput v-model="emailAddress" type="email" manual-save> + <MkInput v-model="emailAddress" type="email" manual-save> <template #prefix><i class="ti ti-mail"></i></template> <template v-if="$i.email && !$i.emailVerified" #caption>{{ i18n.ts.verificationEmailSent }}</template> <template v-else-if="emailAddress === $i.email && $i.emailVerified" #caption><i class="ti ti-check" style="color: var(--success);"></i> {{ i18n.ts.emailVerified }}</template> - </FormInput> + </MkInput> </FormSection> <FormSection> @@ -45,7 +45,7 @@ <script lang="ts" setup> import { onMounted, ref, watch } from 'vue'; import FormSection from '@/components/form/section.vue'; -import FormInput from '@/components/form/input.vue'; +import MkInput from '@/components/MkInput.vue'; import MkSwitch from '@/components/MkSwitch.vue'; import * as os from '@/os'; import { $i } from '@/account'; diff --git a/packages/frontend/src/pages/settings/general.vue b/packages/frontend/src/pages/settings/general.vue index 32bc79b819..0ce66b065f 100644 --- a/packages/frontend/src/pages/settings/general.vue +++ b/packages/frontend/src/pages/settings/general.vue @@ -1,6 +1,6 @@ <template> <div class="_gaps_m"> - <FormSelect v-model="lang"> + <MkSelect v-model="lang"> <template #label>{{ i18n.ts.uiLanguage }}</template> <option v-for="x in langs" :key="x[0]" :value="x[0]">{{ x[1] }}</option> <template #caption> @@ -10,15 +10,15 @@ </template> </I18n> </template> - </FormSelect> + </MkSelect> - <FormRadios v-model="overridedDeviceKind"> + <MkRadios v-model="overridedDeviceKind"> <template #label>{{ i18n.ts.overridedDeviceKind }}</template> <option :value="null">{{ i18n.ts.auto }}</option> <option value="smartphone"><i class="ti ti-device-mobile"/> {{ i18n.ts.smartphone }}</option> <option value="tablet"><i class="ti ti-device-tablet"/> {{ i18n.ts.tablet }}</option> <option value="desktop"><i class="ti ti-device-desktop"/> {{ i18n.ts.desktop }}</option> - </FormRadios> + </MkRadios> <MkSwitch v-model="showFixedPostForm">{{ i18n.ts.showFixedPostForm }}</MkSwitch> @@ -31,12 +31,12 @@ <MkSwitch v-model="enableInfiniteScroll">{{ i18n.ts.enableInfiniteScroll }}</MkSwitch> <MkSwitch v-model="useReactionPickerForContextMenu">{{ i18n.ts.useReactionPickerForContextMenu }}</MkSwitch> </div> - <FormSelect v-model="serverDisconnectedBehavior"> + <MkSelect v-model="serverDisconnectedBehavior"> <template #label>{{ i18n.ts.whenServerDisconnected }}</template> <option value="reload">{{ i18n.ts._serverDisconnectedBehavior.reload }}</option> <option value="dialog">{{ i18n.ts._serverDisconnectedBehavior.dialog }}</option> <option value="quiet">{{ i18n.ts._serverDisconnectedBehavior.quiet }}</option> - </FormSelect> + </MkSelect> </div> </FormSection> @@ -57,22 +57,22 @@ <MkSwitch v-model="disableDrawer">{{ i18n.ts.disableDrawer }}</MkSwitch> </div> <div> - <FormRadios v-model="emojiStyle"> + <MkRadios v-model="emojiStyle"> <template #label>{{ i18n.ts.emojiStyle }}</template> <option value="native">{{ i18n.ts.native }}</option> <option value="fluentEmoji">Fluent Emoji</option> <option value="twemoji">Twemoji</option> - </FormRadios> + </MkRadios> <div style="margin: 8px 0 0 0; font-size: 1.5em;"><Mfm :key="emojiStyle" text="๐ฎ๐ฆ๐ญ๐ฉ๐ฐ๐ซ๐ฌ๐ฅ๐ช"/></div> </div> - <FormRadios v-model="fontSize"> + <MkRadios v-model="fontSize"> <template #label>{{ i18n.ts.fontSize }}</template> <option :value="null"><span style="font-size: 14px;">Aa</span></option> <option value="1"><span style="font-size: 15px;">Aa</span></option> <option value="2"><span style="font-size: 16px;">Aa</span></option> <option value="3"><span style="font-size: 17px;">Aa</span></option> - </FormRadios> + </MkRadios> </div> </FormSection> @@ -80,24 +80,24 @@ <MkSwitch v-model="aiChanMode">{{ i18n.ts.aiChanMode }}</MkSwitch> </FormSection> - <FormSelect v-model="instanceTicker"> + <MkSelect v-model="instanceTicker"> <template #label>{{ i18n.ts.instanceTicker }}</template> <option value="none">{{ i18n.ts._instanceTicker.none }}</option> <option value="remote">{{ i18n.ts._instanceTicker.remote }}</option> <option value="always">{{ i18n.ts._instanceTicker.always }}</option> - </FormSelect> + </MkSelect> - <FormSelect v-model="nsfw"> + <MkSelect v-model="nsfw"> <template #label>{{ i18n.ts.nsfw }}</template> <option value="respect">{{ i18n.ts._nsfw.respect }}</option> <option value="ignore">{{ i18n.ts._nsfw.ignore }}</option> <option value="force">{{ i18n.ts._nsfw.force }}</option> - </FormSelect> + </MkSelect> - <FormRange v-model="numberOfPageCache" :min="1" :max="10" :step="1" easing> + <MkRange v-model="numberOfPageCache" :min="1" :max="10" :step="1" easing> <template #label>{{ i18n.ts.numberOfPageCache }}</template> <template #caption>{{ i18n.ts.numberOfPageCacheDescription }}</template> - </FormRange> + </MkRange> <FormLink to="/settings/deck">{{ i18n.ts.deck }}</FormLink> @@ -108,9 +108,9 @@ <script lang="ts" setup> import { computed, ref, watch } from 'vue'; import MkSwitch from '@/components/MkSwitch.vue'; -import FormSelect from '@/components/form/select.vue'; -import FormRadios from '@/components/form/radios.vue'; -import FormRange from '@/components/form/range.vue'; +import MkSelect from '@/components/MkSelect.vue'; +import MkRadios from '@/components/MkRadios.vue'; +import MkRange from '@/components/MkRange.vue'; import FormSection from '@/components/form/section.vue'; import FormLink from '@/components/form/link.vue'; import MkLink from '@/components/MkLink.vue'; diff --git a/packages/frontend/src/pages/settings/instance-mute.vue b/packages/frontend/src/pages/settings/instance-mute.vue index ccfbc89b87..a3f65b753f 100644 --- a/packages/frontend/src/pages/settings/instance-mute.vue +++ b/packages/frontend/src/pages/settings/instance-mute.vue @@ -1,17 +1,17 @@ <template> <div class="_gaps_m"> <MkInfo>{{ i18n.ts._instanceMute.title }}</MkInfo> - <FormTextarea v-model="instanceMutes"> + <MkTextarea v-model="instanceMutes"> <template #label>{{ i18n.ts._instanceMute.heading }}</template> <template #caption>{{ i18n.ts._instanceMute.instanceMuteDescription }}<br>{{ i18n.ts._instanceMute.instanceMuteDescription2 }}</template> - </FormTextarea> + </MkTextarea> <MkButton primary :disabled="!changed" @click="save()"><i class="ti ti-device-floppy"></i> {{ i18n.ts.save }}</MkButton> </div> </template> <script lang="ts" setup> import { ref, watch } from 'vue'; -import FormTextarea from '@/components/form/textarea.vue'; +import MkTextarea from '@/components/MkTextarea.vue'; import MkInfo from '@/components/MkInfo.vue'; import MkButton from '@/components/MkButton.vue'; import * as os from '@/os'; diff --git a/packages/frontend/src/pages/settings/navbar.vue b/packages/frontend/src/pages/settings/navbar.vue index 0492f2e8af..ead551e7c4 100644 --- a/packages/frontend/src/pages/settings/navbar.vue +++ b/packages/frontend/src/pages/settings/navbar.vue @@ -1,17 +1,17 @@ <template> <div class="_gaps_m"> - <FormTextarea v-model="items" tall manual-save> + <MkTextarea v-model="items" tall manual-save> <template #label>{{ i18n.ts.navbar }}</template> <template #caption><button class="_textButton" @click="addItem">{{ i18n.ts.addItem }}</button></template> - </FormTextarea> + </MkTextarea> - <FormRadios v-model="menuDisplay"> + <MkRadios v-model="menuDisplay"> <template #label>{{ i18n.ts.display }}</template> <option value="sideFull">{{ i18n.ts._menuDisplay.sideFull }}</option> <option value="sideIcon">{{ i18n.ts._menuDisplay.sideIcon }}</option> <option value="top">{{ i18n.ts._menuDisplay.top }}</option> <!-- <MkRadio v-model="menuDisplay" value="hide" disabled>{{ i18n.ts._menuDisplay.hide }}</MkRadio>--> <!-- TODO: ใตใคใใใผใๅฎๅ
จใซ้ ใใใใใซใใใจใๅฅ้ใใณใใผใฌใผใใฟใณใฎใใใชใใฎใUIใซ่กจ็คบใใๅฟ
่ฆใใใ้ขๅ --> - </FormRadios> + </MkRadios> <MkButton danger @click="reset()"><i class="ti ti-reload"></i> {{ i18n.ts.default }}</MkButton> </div> @@ -19,8 +19,8 @@ <script lang="ts" setup> import { computed, ref, watch } from 'vue'; -import FormTextarea from '@/components/form/textarea.vue'; -import FormRadios from '@/components/form/radios.vue'; +import MkTextarea from '@/components/MkTextarea.vue'; +import MkRadios from '@/components/MkRadios.vue'; import MkButton from '@/components/MkButton.vue'; import * as os from '@/os'; import { navbarItemDef } from '@/navbar'; diff --git a/packages/frontend/src/pages/settings/plugin.install.vue b/packages/frontend/src/pages/settings/plugin.install.vue index 09bd9dd9e1..f23a338179 100644 --- a/packages/frontend/src/pages/settings/plugin.install.vue +++ b/packages/frontend/src/pages/settings/plugin.install.vue @@ -2,9 +2,9 @@ <div class="_gaps_m"> <FormInfo warn>{{ i18n.ts._plugin.installWarn }}</FormInfo> - <FormTextarea v-model="code" tall> + <MkTextarea v-model="code" tall> <template #label>{{ i18n.ts.code }}</template> - </FormTextarea> + </MkTextarea> <div> <MkButton :disabled="code == null" primary inline @click="install"><i class="ti ti-check"></i> {{ i18n.ts.install }}</MkButton> @@ -16,7 +16,7 @@ import { defineAsyncComponent, nextTick, ref } from 'vue'; import { Interpreter, Parser, utils } from '@syuilo/aiscript'; import { v4 as uuid } from 'uuid'; -import FormTextarea from '@/components/form/textarea.vue'; +import MkTextarea from '@/components/MkTextarea.vue'; import MkButton from '@/components/MkButton.vue'; import FormInfo from '@/components/MkInfo.vue'; import * as os from '@/os'; diff --git a/packages/frontend/src/pages/settings/privacy.vue b/packages/frontend/src/pages/settings/privacy.vue index 5094638556..9ed53931b8 100644 --- a/packages/frontend/src/pages/settings/privacy.vue +++ b/packages/frontend/src/pages/settings/privacy.vue @@ -8,13 +8,13 @@ <template #caption>{{ i18n.ts.makeReactionsPublicDescription }}</template> </MkSwitch> - <FormSelect v-model="ffVisibility" @update:model-value="save()"> + <MkSelect v-model="ffVisibility" @update:model-value="save()"> <template #label>{{ i18n.ts.ffVisibility }}</template> <option value="public">{{ i18n.ts._ffVisibility.public }}</option> <option value="followers">{{ i18n.ts._ffVisibility.followers }}</option> <option value="private">{{ i18n.ts._ffVisibility.private }}</option> <template #caption>{{ i18n.ts.ffVisibilityDescription }}</template> - </FormSelect> + </MkSelect> <MkSwitch v-model="hideOnlineStatus" @update:model-value="save()"> {{ i18n.ts.hideOnlineStatus }} @@ -40,12 +40,12 @@ <template v-else-if="defaultNoteVisibility === 'specified'" #suffix>{{ i18n.ts._visibility.specified }}</template> <div class="_gaps_m"> - <FormSelect v-model="defaultNoteVisibility"> + <MkSelect v-model="defaultNoteVisibility"> <option value="public">{{ i18n.ts._visibility.public }}</option> <option value="home">{{ i18n.ts._visibility.home }}</option> <option value="followers">{{ i18n.ts._visibility.followers }}</option> <option value="specified">{{ i18n.ts._visibility.specified }}</option> - </FormSelect> + </MkSelect> <MkSwitch v-model="defaultNoteLocalOnly">{{ i18n.ts._visibility.localOnly }}</MkSwitch> </div> </FormFolder> @@ -59,7 +59,7 @@ <script lang="ts" setup> import { } from 'vue'; import MkSwitch from '@/components/MkSwitch.vue'; -import FormSelect from '@/components/form/select.vue'; +import MkSelect from '@/components/MkSelect.vue'; import FormSection from '@/components/form/section.vue'; import FormFolder from '@/components/form/folder.vue'; import * as os from '@/os'; diff --git a/packages/frontend/src/pages/settings/profile.vue b/packages/frontend/src/pages/settings/profile.vue index f7a2feb199..eb4b929c6f 100644 --- a/packages/frontend/src/pages/settings/profile.vue +++ b/packages/frontend/src/pages/settings/profile.vue @@ -8,29 +8,29 @@ <MkButton primary rounded class="bannerEdit" @click="changeBanner">{{ i18n.ts._profile.changeBanner }}</MkButton> </div> - <FormInput v-model="profile.name" :max="30" manual-save> + <MkInput v-model="profile.name" :max="30" manual-save> <template #label>{{ i18n.ts._profile.name }}</template> - </FormInput> + </MkInput> - <FormTextarea v-model="profile.description" :max="500" tall manual-save> + <MkTextarea v-model="profile.description" :max="500" tall manual-save> <template #label>{{ i18n.ts._profile.description }}</template> <template #caption>{{ i18n.ts._profile.youCanIncludeHashtags }}</template> - </FormTextarea> + </MkTextarea> - <FormInput v-model="profile.location" manual-save> + <MkInput v-model="profile.location" manual-save> <template #label>{{ i18n.ts.location }}</template> <template #prefix><i class="ti ti-map-pin"></i></template> - </FormInput> + </MkInput> - <FormInput v-model="profile.birthday" type="date" manual-save> + <MkInput v-model="profile.birthday" type="date" manual-save> <template #label>{{ i18n.ts.birthday }}</template> <template #prefix><i class="ti ti-cake"></i></template> - </FormInput> + </MkInput> - <FormSelect v-model="profile.lang"> + <MkSelect v-model="profile.lang"> <template #label>{{ i18n.ts.language }}</template> <option v-for="x in Object.keys(langmap)" :key="x" :value="x">{{ langmap[x].nativeName }}</option> - </FormSelect> + </MkSelect> <FormSlot> <FormFolder> @@ -39,12 +39,12 @@ <div class="_gaps_m"> <FormSplit v-for="(record, i) in fields" :min-width="250"> - <FormInput v-model="record.name" small> + <MkInput v-model="record.name" small> <template #label>{{ i18n.ts._profile.metadataLabel }} #{{ i + 1 }}</template> - </FormInput> - <FormInput v-model="record.value" small> + </MkInput> + <MkInput v-model="record.value" small> <template #label>{{ i18n.ts._profile.metadataContent }} #{{ i + 1 }}</template> - </FormInput> + </MkInput> </FormSplit> <div> <MkButton :disabled="fields.length >= 16" inline style="margin-right: 8px;" @click="addField"><i class="ti ti-plus"></i> {{ i18n.ts.add }}</MkButton> @@ -71,10 +71,10 @@ <script lang="ts" setup> import { reactive, watch } from 'vue'; import MkButton from '@/components/MkButton.vue'; -import FormInput from '@/components/form/input.vue'; -import FormTextarea from '@/components/form/textarea.vue'; +import MkInput from '@/components/MkInput.vue'; +import MkTextarea from '@/components/MkTextarea.vue'; import MkSwitch from '@/components/MkSwitch.vue'; -import FormSelect from '@/components/form/select.vue'; +import MkSelect from '@/components/MkSelect.vue'; import FormSplit from '@/components/form/split.vue'; import FormFolder from '@/components/form/folder.vue'; import FormSlot from '@/components/form/slot.vue'; diff --git a/packages/frontend/src/pages/settings/reaction.vue b/packages/frontend/src/pages/settings/reaction.vue index 696a56dee5..e307abe2d4 100644 --- a/packages/frontend/src/pages/settings/reaction.vue +++ b/packages/frontend/src/pages/settings/reaction.vue @@ -17,27 +17,27 @@ <template #caption>{{ i18n.ts.reactionSettingDescription2 }} <button class="_textButton" @click="preview">{{ i18n.ts.preview }}</button></template> </FromSlot> - <FormRadios v-model="reactionPickerSize"> + <MkRadios v-model="reactionPickerSize"> <template #label>{{ i18n.ts.size }}</template> <option :value="1">{{ i18n.ts.small }}</option> <option :value="2">{{ i18n.ts.medium }}</option> <option :value="3">{{ i18n.ts.large }}</option> - </FormRadios> - <FormRadios v-model="reactionPickerWidth"> + </MkRadios> + <MkRadios v-model="reactionPickerWidth"> <template #label>{{ i18n.ts.numberOfColumn }}</template> <option :value="1">5</option> <option :value="2">6</option> <option :value="3">7</option> <option :value="4">8</option> <option :value="5">9</option> - </FormRadios> - <FormRadios v-model="reactionPickerHeight"> + </MkRadios> + <MkRadios v-model="reactionPickerHeight"> <template #label>{{ i18n.ts.height }}</template> <option :value="1">{{ i18n.ts.small }}</option> <option :value="2">{{ i18n.ts.medium }}</option> <option :value="3">{{ i18n.ts.large }}</option> <option :value="4">{{ i18n.ts.large }}+</option> - </FormRadios> + </MkRadios> <MkSwitch v-model="reactionPickerUseDrawerForMobile"> {{ i18n.ts.useDrawerReactionPickerForMobile }} @@ -56,8 +56,8 @@ <script lang="ts" setup> import { defineAsyncComponent, watch } from 'vue'; import Sortable from 'vuedraggable'; -import FormInput from '@/components/form/input.vue'; -import FormRadios from '@/components/form/radios.vue'; +import MkInput from '@/components/MkInput.vue'; +import MkRadios from '@/components/MkRadios.vue'; import FromSlot from '@/components/form/slot.vue'; import MkButton from '@/components/MkButton.vue'; import FormSection from '@/components/form/section.vue'; diff --git a/packages/frontend/src/pages/settings/sounds.sound.vue b/packages/frontend/src/pages/settings/sounds.sound.vue index 23ecea86cc..aa9f528006 100644 --- a/packages/frontend/src/pages/settings/sounds.sound.vue +++ b/packages/frontend/src/pages/settings/sounds.sound.vue @@ -1,12 +1,12 @@ <template> <div class="_gaps_m"> - <FormSelect v-model="type"> + <MkSelect v-model="type"> <template #label>{{ i18n.ts.sound }}</template> <option v-for="x in soundsTypes" :key="x" :value="x">{{ x == null ? i18n.ts.none : x }}</option> - </FormSelect> - <FormRange v-model="volume" :min="0" :max="1" :step="0.05" :text-converter="(v) => `${Math.floor(v * 100)}%`"> + </MkSelect> + <MkRange v-model="volume" :min="0" :max="1" :step="0.05" :text-converter="(v) => `${Math.floor(v * 100)}%`"> <template #label>{{ i18n.ts.volume }}</template> - </FormRange> + </MkRange> <div class="_buttons"> <MkButton inline @click="listen"><i class="ti ti-player-play"></i> {{ i18n.ts.listen }}</MkButton> @@ -17,9 +17,9 @@ <script lang="ts" setup> import { } from 'vue'; -import FormSelect from '@/components/form/select.vue'; +import MkSelect from '@/components/MkSelect.vue'; import MkButton from '@/components/MkButton.vue'; -import FormRange from '@/components/form/range.vue'; +import MkRange from '@/components/MkRange.vue'; import { i18n } from '@/i18n'; import { playFile, soundsTypes } from '@/scripts/sound'; diff --git a/packages/frontend/src/pages/settings/sounds.vue b/packages/frontend/src/pages/settings/sounds.vue index dae6ad3037..d93bdc2b1f 100644 --- a/packages/frontend/src/pages/settings/sounds.vue +++ b/packages/frontend/src/pages/settings/sounds.vue @@ -1,8 +1,8 @@ <template> <div class="_gaps_m"> - <FormRange v-model="masterVolume" :min="0" :max="1" :step="0.05" :text-converter="(v) => `${Math.floor(v * 100)}%`"> + <MkRange v-model="masterVolume" :min="0" :max="1" :step="0.05" :text-converter="(v) => `${Math.floor(v * 100)}%`"> <template #label>{{ i18n.ts.masterVolume }}</template> - </FormRange> + </MkRange> <FormSection> <template #label>{{ i18n.ts.sounds }}</template> @@ -23,7 +23,7 @@ <script lang="ts" setup> import { computed, ref } from 'vue'; import XSound from './sounds.sound.vue'; -import FormRange from '@/components/form/range.vue'; +import MkRange from '@/components/MkRange.vue'; import MkButton from '@/components/MkButton.vue'; import FormLink from '@/components/form/link.vue'; import FormSection from '@/components/form/section.vue'; diff --git a/packages/frontend/src/pages/settings/statusbar.statusbar.vue b/packages/frontend/src/pages/settings/statusbar.statusbar.vue index ab62d40f31..eee65e0e95 100644 --- a/packages/frontend/src/pages/settings/statusbar.statusbar.vue +++ b/packages/frontend/src/pages/settings/statusbar.statusbar.vue @@ -1,11 +1,11 @@ <template> <div class="_gaps_m"> - <FormSelect v-model="statusbar.type" placeholder="Please select"> + <MkSelect v-model="statusbar.type" placeholder="Please select"> <template #label>{{ i18n.ts.type }}</template> <option value="rss">RSS</option> <option value="federation">Federation</option> <option value="userList">User list timeline</option> - </FormSelect> + </MkSelect> <MkInput v-model="statusbar.name" manual-save> <template #label>{{ i18n.ts.label }}</template> @@ -15,14 +15,14 @@ <template #label>Black</template> </MkSwitch> - <FormRadios v-model="statusbar.size"> + <MkRadios v-model="statusbar.size"> <template #label>{{ i18n.ts.size }}</template> <option value="verySmall">{{ i18n.ts.small }}+</option> <option value="small">{{ i18n.ts.small }}</option> <option value="medium">{{ i18n.ts.medium }}</option> <option value="large">{{ i18n.ts.large }}</option> <option value="veryLarge">{{ i18n.ts.large }}+</option> - </FormRadios> + </MkRadios> <template v-if="statusbar.type === 'rss'"> <MkInput v-model="statusbar.props.url" manual-save type="url"> @@ -34,10 +34,10 @@ <MkInput v-model="statusbar.props.refreshIntervalSec" manual-save type="number"> <template #label>{{ i18n.ts.refreshInterval }}</template> </MkInput> - <FormRange v-model="statusbar.props.marqueeDuration" :min="5" :max="150" :step="1"> + <MkRange v-model="statusbar.props.marqueeDuration" :min="5" :max="150" :step="1"> <template #label>{{ i18n.ts.speed }}</template> <template #caption>{{ i18n.ts.fast }} <-> {{ i18n.ts.slow }}</template> - </FormRange> + </MkRange> <MkSwitch v-model="statusbar.props.marqueeReverse"> <template #label>{{ i18n.ts.reverse }}</template> </MkSwitch> @@ -46,10 +46,10 @@ <MkInput v-model="statusbar.props.refreshIntervalSec" manual-save type="number"> <template #label>{{ i18n.ts.refreshInterval }}</template> </MkInput> - <FormRange v-model="statusbar.props.marqueeDuration" :min="5" :max="150" :step="1"> + <MkRange v-model="statusbar.props.marqueeDuration" :min="5" :max="150" :step="1"> <template #label>{{ i18n.ts.speed }}</template> <template #caption>{{ i18n.ts.fast }} <-> {{ i18n.ts.slow }}</template> - </FormRange> + </MkRange> <MkSwitch v-model="statusbar.props.marqueeReverse"> <template #label>{{ i18n.ts.reverse }}</template> </MkSwitch> @@ -58,17 +58,17 @@ </MkSwitch> </template> <template v-else-if="statusbar.type === 'userList' && userLists != null"> - <FormSelect v-model="statusbar.props.userListId"> + <MkSelect v-model="statusbar.props.userListId"> <template #label>{{ i18n.ts.userList }}</template> <option v-for="list in userLists" :value="list.id">{{ list.name }}</option> - </FormSelect> + </MkSelect> <MkInput v-model="statusbar.props.refreshIntervalSec" manual-save type="number"> <template #label>{{ i18n.ts.refreshInterval }}</template> </MkInput> - <FormRange v-model="statusbar.props.marqueeDuration" :min="5" :max="150" :step="1"> + <MkRange v-model="statusbar.props.marqueeDuration" :min="5" :max="150" :step="1"> <template #label>{{ i18n.ts.speed }}</template> <template #caption>{{ i18n.ts.fast }} <-> {{ i18n.ts.slow }}</template> - </FormRange> + </MkRange> <MkSwitch v-model="statusbar.props.marqueeReverse"> <template #label>{{ i18n.ts.reverse }}</template> </MkSwitch> @@ -82,12 +82,12 @@ <script lang="ts" setup> import { computed, reactive, ref, watch } from 'vue'; -import FormSelect from '@/components/form/select.vue'; -import MkInput from '@/components/form/input.vue'; +import MkSelect from '@/components/MkSelect.vue'; +import MkInput from '@/components/MkInput.vue'; import MkSwitch from '@/components/MkSwitch.vue'; -import FormRadios from '@/components/form/radios.vue'; +import MkRadios from '@/components/MkRadios.vue'; import MkButton from '@/components/MkButton.vue'; -import FormRange from '@/components/form/range.vue'; +import MkRange from '@/components/MkRange.vue'; import * as os from '@/os'; import { defaultStore } from '@/store'; import { i18n } from '@/i18n'; diff --git a/packages/frontend/src/pages/settings/statusbar.vue b/packages/frontend/src/pages/settings/statusbar.vue index 26cb75e938..37dd701fc8 100644 --- a/packages/frontend/src/pages/settings/statusbar.vue +++ b/packages/frontend/src/pages/settings/statusbar.vue @@ -13,7 +13,7 @@ import { computed, onMounted, ref, watch } from 'vue'; import { v4 as uuid } from 'uuid'; import XStatusbar from './statusbar.statusbar.vue'; -import FormRadios from '@/components/form/radios.vue'; +import MkRadios from '@/components/MkRadios.vue'; import FormFolder from '@/components/form/folder.vue'; import MkButton from '@/components/MkButton.vue'; import * as os from '@/os'; diff --git a/packages/frontend/src/pages/settings/theme.install.vue b/packages/frontend/src/pages/settings/theme.install.vue index 633792195b..416464ceca 100644 --- a/packages/frontend/src/pages/settings/theme.install.vue +++ b/packages/frontend/src/pages/settings/theme.install.vue @@ -1,8 +1,8 @@ <template> <div class="_gaps_m"> - <FormTextarea v-model="installThemeCode"> + <MkTextarea v-model="installThemeCode"> <template #label>{{ i18n.ts._theme.code }}</template> - </FormTextarea> + </MkTextarea> <div class="_buttons"> <MkButton :disabled="installThemeCode == null" inline @click="() => preview(installThemeCode)"><i class="ti ti-eye"></i> {{ i18n.ts.preview }}</MkButton> @@ -14,7 +14,7 @@ <script lang="ts" setup> import { } from 'vue'; import JSON5 from 'json5'; -import FormTextarea from '@/components/form/textarea.vue'; +import MkTextarea from '@/components/MkTextarea.vue'; import MkButton from '@/components/MkButton.vue'; import { applyTheme, validateTheme } from '@/scripts/theme'; import * as os from '@/os'; diff --git a/packages/frontend/src/pages/settings/theme.manage.vue b/packages/frontend/src/pages/settings/theme.manage.vue index 215482065a..d1821a00d4 100644 --- a/packages/frontend/src/pages/settings/theme.manage.vue +++ b/packages/frontend/src/pages/settings/theme.manage.vue @@ -1,6 +1,6 @@ <template> <div class="_gaps_m"> - <FormSelect v-model="selectedThemeId"> + <MkSelect v-model="selectedThemeId"> <template #label>{{ i18n.ts.theme }}</template> <optgroup :label="i18n.ts._theme.installedThemes"> <option v-for="x in installedThemes" :key="x.id" :value="x.id">{{ x.name }}</option> @@ -8,18 +8,18 @@ <optgroup :label="i18n.ts._theme.builtinThemes"> <option v-for="x in builtinThemes" :key="x.id" :value="x.id">{{ x.name }}</option> </optgroup> - </FormSelect> + </MkSelect> <template v-if="selectedTheme"> - <FormInput readonly :model-value="selectedTheme.author"> + <MkInput readonly :model-value="selectedTheme.author"> <template #label>{{ i18n.ts.author }}</template> - </FormInput> - <FormTextarea v-if="selectedTheme.desc" readonly :model-value="selectedTheme.desc"> + </MkInput> + <MkTextarea v-if="selectedTheme.desc" readonly :model-value="selectedTheme.desc"> <template #label>{{ i18n.ts._theme.description }}</template> - </FormTextarea> - <FormTextarea readonly tall :model-value="selectedThemeCode"> + </MkTextarea> + <MkTextarea readonly tall :model-value="selectedThemeCode"> <template #label>{{ i18n.ts._theme.code }}</template> <template #caption><button class="_textButton" @click="copyThemeCode()">{{ i18n.ts.copy }}</button></template> - </FormTextarea> + </MkTextarea> <MkButton v-if="!builtinThemes.some(t => t.id == selectedTheme.id)" danger @click="uninstall()"><i class="ti ti-trash"></i> {{ i18n.ts.uninstall }}</MkButton> </template> </div> @@ -28,9 +28,9 @@ <script lang="ts" setup> import { computed, ref } from 'vue'; import JSON5 from 'json5'; -import FormTextarea from '@/components/form/textarea.vue'; -import FormSelect from '@/components/form/select.vue'; -import FormInput from '@/components/form/input.vue'; +import MkTextarea from '@/components/MkTextarea.vue'; +import MkSelect from '@/components/MkSelect.vue'; +import MkInput from '@/components/MkInput.vue'; import MkButton from '@/components/MkButton.vue'; import { Theme, getBuiltinThemesRef } from '@/scripts/theme'; import copyToClipboard from '@/scripts/copy-to-clipboard'; diff --git a/packages/frontend/src/pages/settings/theme.vue b/packages/frontend/src/pages/settings/theme.vue index ab674b461c..aec92c2d1d 100644 --- a/packages/frontend/src/pages/settings/theme.vue +++ b/packages/frontend/src/pages/settings/theme.vue @@ -27,7 +27,7 @@ </div> <div class="selects"> - <FormSelect v-model="lightThemeId" large class="select"> + <MkSelect v-model="lightThemeId" large class="select"> <template #label>{{ i18n.ts.themeForLightMode }}</template> <template #prefix><i class="ti ti-sun"></i></template> <option v-if="instanceLightTheme" :key="'instance:' + instanceLightTheme.id" :value="instanceLightTheme.id">{{ instanceLightTheme.name }}</option> @@ -37,8 +37,8 @@ <optgroup :label="i18n.ts._theme.builtinThemes"> <option v-for="x in builtinLightThemes" :key="'builtin:' + x.id" :value="x.id">{{ x.name }}</option> </optgroup> - </FormSelect> - <FormSelect v-model="darkThemeId" large class="select"> + </MkSelect> + <MkSelect v-model="darkThemeId" large class="select"> <template #label>{{ i18n.ts.themeForDarkMode }}</template> <template #prefix><i class="ti ti-moon"></i></template> <option v-if="instanceDarkTheme" :key="'instance:' + instanceDarkTheme.id" :value="instanceDarkTheme.id">{{ instanceDarkTheme.name }}</option> @@ -48,7 +48,7 @@ <optgroup :label="i18n.ts._theme.builtinThemes"> <option v-for="x in builtinDarkThemes" :key="'builtin:' + x.id" :value="x.id">{{ x.name }}</option> </optgroup> - </FormSelect> + </MkSelect> </div> <FormSection> @@ -69,7 +69,7 @@ import { computed, onActivated, ref, watch } from 'vue'; import JSON5 from 'json5'; import MkSwitch from '@/components/MkSwitch.vue'; -import FormSelect from '@/components/form/select.vue'; +import MkSelect from '@/components/MkSelect.vue'; import FormSection from '@/components/form/section.vue'; import FormLink from '@/components/form/link.vue'; import MkButton from '@/components/MkButton.vue'; diff --git a/packages/frontend/src/pages/settings/webhook.edit.vue b/packages/frontend/src/pages/settings/webhook.edit.vue index 828018b5aa..7a819eb9f0 100644 --- a/packages/frontend/src/pages/settings/webhook.edit.vue +++ b/packages/frontend/src/pages/settings/webhook.edit.vue @@ -1,17 +1,17 @@ <template> <div class="_gaps_m"> - <FormInput v-model="name"> + <MkInput v-model="name"> <template #label>Name</template> - </FormInput> + </MkInput> - <FormInput v-model="url" type="url"> + <MkInput v-model="url" type="url"> <template #label>URL</template> - </FormInput> + </MkInput> - <FormInput v-model="secret"> + <MkInput v-model="secret"> <template #prefix><i class="ti ti-lock"></i></template> <template #label>Secret</template> - </FormInput> + </MkInput> <FormSection> <template #label>Events</template> @@ -37,7 +37,7 @@ <script lang="ts" setup> import { } from 'vue'; -import FormInput from '@/components/form/input.vue'; +import MkInput from '@/components/MkInput.vue'; import FormSection from '@/components/form/section.vue'; import MkSwitch from '@/components/MkSwitch.vue'; import MkButton from '@/components/MkButton.vue'; diff --git a/packages/frontend/src/pages/settings/webhook.new.vue b/packages/frontend/src/pages/settings/webhook.new.vue index 56e1dddc99..45ab5722c3 100644 --- a/packages/frontend/src/pages/settings/webhook.new.vue +++ b/packages/frontend/src/pages/settings/webhook.new.vue @@ -1,17 +1,17 @@ <template> <div class="_gaps_m"> - <FormInput v-model="name"> + <MkInput v-model="name"> <template #label>Name</template> - </FormInput> + </MkInput> - <FormInput v-model="url" type="url"> + <MkInput v-model="url" type="url"> <template #label>URL</template> - </FormInput> + </MkInput> - <FormInput v-model="secret"> + <MkInput v-model="secret"> <template #prefix><i class="ti ti-lock"></i></template> <template #label>Secret</template> - </FormInput> + </MkInput> <FormSection> <template #label>Events</template> @@ -35,7 +35,7 @@ <script lang="ts" setup> import { } from 'vue'; -import FormInput from '@/components/form/input.vue'; +import MkInput from '@/components/MkInput.vue'; import FormSection from '@/components/form/section.vue'; import MkSwitch from '@/components/MkSwitch.vue'; import MkButton from '@/components/MkButton.vue'; diff --git a/packages/frontend/src/pages/settings/word-mute.vue b/packages/frontend/src/pages/settings/word-mute.vue index d3242f30bf..576e6c828b 100644 --- a/packages/frontend/src/pages/settings/word-mute.vue +++ b/packages/frontend/src/pages/settings/word-mute.vue @@ -7,17 +7,17 @@ <div> <div v-show="tab === 'soft'" class="_gaps_m"> <MkInfo>{{ i18n.ts._wordMute.softDescription }}</MkInfo> - <FormTextarea v-model="softMutedWords"> + <MkTextarea v-model="softMutedWords"> <span>{{ i18n.ts._wordMute.muteWords }}</span> <template #caption>{{ i18n.ts._wordMute.muteWordsDescription }}<br>{{ i18n.ts._wordMute.muteWordsDescription2 }}</template> - </FormTextarea> + </MkTextarea> </div> <div v-show="tab === 'hard'" class="_gaps_m"> <MkInfo>{{ i18n.ts._wordMute.hardDescription }} {{ i18n.ts.reflectMayTakeTime }}</MkInfo> - <FormTextarea v-model="hardMutedWords"> + <MkTextarea v-model="hardMutedWords"> <span>{{ i18n.ts._wordMute.muteWords }}</span> <template #caption>{{ i18n.ts._wordMute.muteWordsDescription }}<br>{{ i18n.ts._wordMute.muteWordsDescription2 }}</template> - </FormTextarea> + </MkTextarea> <MkKeyValue v-if="hardWordMutedNotesCount != null"> <template #key>{{ i18n.ts._wordMute.mutedNotes }}</template> <template #value>{{ number(hardWordMutedNotesCount) }}</template> @@ -30,7 +30,7 @@ <script lang="ts" setup> import { ref, watch } from 'vue'; -import FormTextarea from '@/components/form/textarea.vue'; +import MkTextarea from '@/components/MkTextarea.vue'; import MkKeyValue from '@/components/MkKeyValue.vue'; import MkButton from '@/components/MkButton.vue'; import MkInfo from '@/components/MkInfo.vue'; |