Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

ツールバーのカスタマイズダイアログのリデザイン #2201

Merged
merged 15 commits into from
Aug 11, 2024

Conversation

takusea
Copy link
Contributor

@takusea takusea commented Aug 5, 2024

内容

ツールバーのカスタマイズダイアログを新デザインに変更します。具体的に以下のことを行います。

  • BaseSwitch, BaseTooltipコンポーネントを追加
  • 表示するボタンのリスト部分のコンポーネントを置き換え
    • (ヘッダー部分はHelpDialogと同様置き換えていません)
  • ヘッダーボタンのツールチップを置き換え
  • Tooltipの振る舞いをグローバルに制御するためのTooltipProviderコンポーネントをApp.vueに追加

関連 Issue

ref VOICEVOX/voicevox_project#40

スクリーンショット・動画など

image

@takusea takusea requested a review from a team as a code owner August 5, 2024 12:26
@takusea takusea requested review from Hiroshiba and removed request for a team August 5, 2024 12:26
Copy link
Member

@Hiroshiba Hiroshiba left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

とりあえず眺めさせていただきました!!
横幅も狭まって見やすいですし、コントラスト比も上がって読みやすくなっていい感じに思いました!!

重要度が高くないコメントを一応してみた感じなので、なんかずれてそうなとこあったら遠慮なく言っていただければ!!

src/components/Base/BaseSwitch.vue Outdated Show resolved Hide resolved
@@ -0,0 +1,71 @@
<template>
<div class="root">
<div class="label">{{ checked ? onLabel : offLabel }}</div>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

(ただのコメントです)

ここのラベル、たぶん表示しないモードも需要がある気がしますね!
まあでも今は必ず表示なので、このままで良さそう!

src/components/Base/BaseTooltip.vue Outdated Show resolved Hide resolved
src/components/Base/BaseTooltip.vue Show resolved Hide resolved
src/components/Base/BaseTooltip.vue Outdated Show resolved Hide resolved
src/components/App.vue Show resolved Hide resolved
Copy link
Member

@Hiroshiba Hiroshiba left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ほぼLGTMです!!

もしかしたらちょっと下寄りに見えなくはないのですが、どうでしょう・・・?
image
(margin -1pxの影響?)

@takusea
Copy link
Contributor Author

takusea commented Aug 11, 2024

中のテキストですかね?だとしたらmarginの影響ではなく、フォント自体が下寄りがちなのが理由っぽそうです。

@Hiroshiba
Copy link
Member

すみません、改めて確認してみたらまた拡大率違いでの問題ぽかったです。。
デフォルトの拡大率に戻したらちゃんと中央に表示されてそうでした!! 🙇
image

@Hiroshiba
Copy link
Member

失礼しました!! マージします!!

@Hiroshiba Hiroshiba merged commit 46d4635 into VOICEVOX:main Aug 11, 2024
9 checks passed
@takusea takusea deleted the redesign-toolbar-custom-dialog branch August 22, 2024 00:27
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants