diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml index de5826b21b..49cce121d1 100644 --- a/locales/ja-JP.yml +++ b/locales/ja-JP.yml @@ -869,6 +869,14 @@ logoutConfirm: "ログアウトしますか?" lastActiveDate: "最終利用日時" statusbar: "ステータスバー" pleaseSelect: "選択してください" +reverse: "反転" +colored: "色付き" +refreshInterval: "更新間隔" +label: "ラベル" +type: "タイプ" +speed: "速度" +slow: "遅い" +fast: "速い" _emailUnavailable: used: "既に使用されています" diff --git a/packages/client/src/components/form/range.vue b/packages/client/src/components/form/range.vue index f87b92183d..ebec482d84 100644 --- a/packages/client/src/components/form/range.vue +++ b/packages/client/src/components/form/range.vue @@ -198,7 +198,7 @@ const onMousedown = (ev: MouseEvent | TouchEvent) => { height: 100%; background: var(--accent); opacity: 0.5; - transition: width 0.2s cubic-bezier(0,0,0,1); + //transition: width 0.2s cubic-bezier(0,0,0,1); } } @@ -231,7 +231,7 @@ const onMousedown = (ev: MouseEvent | TouchEvent) => { cursor: grab; background: var(--accent); border-radius: 999px; - transition: left 0.2s cubic-bezier(0,0,0,1); + //transition: left 0.2s cubic-bezier(0,0,0,1); &:hover { background: var(--accentLighten); diff --git a/packages/client/src/pages/settings/statusbars.statusbar.vue b/packages/client/src/pages/settings/statusbars.statusbar.vue index 6b03ad46e6..206979925e 100644 --- a/packages/client/src/pages/settings/statusbars.statusbar.vue +++ b/packages/client/src/pages/settings/statusbars.statusbar.vue @@ -8,7 +8,7 @@ </FormSelect> <MkInput v-model="statusbar.name" manual-save class="_formBlock"> - <template #label>Name</template> + <template #label>{{ i18n.ts.label }}</template> </MkInput> <MkSwitch v-model="statusbar.black" class="_formBlock"> @@ -16,7 +16,7 @@ </MkSwitch> <FormRadios v-model="statusbar.size" class="_formBlock"> - <template #label>Size</template> + <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> @@ -29,27 +29,29 @@ <template #label>URL</template> </MkInput> <MkInput v-model="statusbar.props.refreshIntervalSec" manual-save class="_formBlock" type="number"> - <template #label>Refresh interval</template> - </MkInput> - <MkInput v-model="statusbar.props.marqueeDuration" manual-save class="_formBlock" type="number"> - <template #label>Duration</template> + <template #label>{{ i18n.ts.refreshInterval }}</template> </MkInput> + <FormRange v-model="statusbar.props.marqueeDuration" :min="5" :max="150" :step="1" class="_formBlock"> + <template #label>{{ i18n.ts.speed }}</template> + <template #caption>{{ i18n.ts.fast }} <-> {{ i18n.ts.slow }}</template> + </FormRange> <MkSwitch v-model="statusbar.props.marqueeReverse" class="_formBlock"> - <template #label>Reverse</template> + <template #label>{{ i18n.ts.reverse }}</template> </MkSwitch> </template> <template v-else-if="statusbar.type === 'federation'"> <MkInput v-model="statusbar.props.refreshIntervalSec" manual-save class="_formBlock" type="number"> - <template #label>Refresh interval</template> - </MkInput> - <MkInput v-model="statusbar.props.marqueeDuration" manual-save class="_formBlock" type="number"> - <template #label>Duration</template> + <template #label>{{ i18n.ts.refreshInterval }}</template> </MkInput> + <FormRange v-model="statusbar.props.marqueeDuration" :min="5" :max="150" :step="1" class="_formBlock"> + <template #label>{{ i18n.ts.speed }}</template> + <template #caption>{{ i18n.ts.fast }} <-> {{ i18n.ts.slow }}</template> + </FormRange> <MkSwitch v-model="statusbar.props.marqueeReverse" class="_formBlock"> - <template #label>Reverse</template> + <template #label>{{ i18n.ts.reverse }}</template> </MkSwitch> <MkSwitch v-model="statusbar.props.colored" class="_formBlock"> - <template #label>Colored</template> + <template #label>{{ i18n.ts.colored }}</template> </MkSwitch> </template> <template v-else-if="statusbar.type === 'userList' && userLists != null"> @@ -58,18 +60,19 @@ <option v-for="list in userLists" :value="list.id">{{ list.name }}</option> </FormSelect> <MkInput v-model="statusbar.props.refreshIntervalSec" manual-save class="_formBlock" type="number"> - <template #label>Refresh interval</template> - </MkInput> - <MkInput v-model="statusbar.props.marqueeDuration" manual-save class="_formBlock" type="number"> - <template #label>Duration</template> + <template #label>{{ i18n.ts.refreshInterval }}</template> </MkInput> + <FormRange v-model="statusbar.props.marqueeDuration" :min="5" :max="150" :step="1" class="_formBlock"> + <template #label>{{ i18n.ts.speed }}</template> + <template #caption>{{ i18n.ts.fast }} <-> {{ i18n.ts.slow }}</template> + </FormRange> <MkSwitch v-model="statusbar.props.marqueeReverse" class="_formBlock"> - <template #label>Reverse</template> + <template #label>{{ i18n.ts.reverse }}</template> </MkSwitch> </template> <div style="display: flex; gap: var(--margin); flex-wrap: wrap;"> - <FormButton danger @click="del">Delete</FormButton> + <FormButton danger @click="del">{{ i18n.ts.remove }}</FormButton> </div> </div> </template> @@ -81,6 +84,7 @@ import MkInput from '@/components/form/input.vue'; import MkSwitch from '@/components/form/switch.vue'; import FormRadios from '@/components/form/radios.vue'; import FormButton from '@/components/ui/button.vue'; +import FormRange from '@/components/form/range.vue'; import * as os from '@/os'; import { menuDef } from '@/menu'; import { defaultStore } from '@/store'; diff --git a/packages/client/src/pages/settings/statusbars.vue b/packages/client/src/pages/settings/statusbars.vue index bcfff1652f..c81bd7fbdf 100644 --- a/packages/client/src/pages/settings/statusbars.vue +++ b/packages/client/src/pages/settings/statusbars.vue @@ -5,7 +5,7 @@ <template #suffix>{{ x.name }}</template> <XStatusbar :_id="x.id" :user-lists="userLists"/> </FormFolder> - <FormButton @click="add">add</FormButton> + <FormButton primary @click="add">{{ i18n.ts.add }}</FormButton> </div> </template>