設定ダイアログのリデザイン (#2276)

* 不要な記述を削除 * スタイルの微調整 * ClickableでないBaseRowCardにフォーカスできないようにする * 幅が狭いときに要素を崩れずに折り返すように修正 * 不要な記述を削除 * ToolTipと共存できるようにCSSセレクタを変更 * BaseCheckboxコンポーネントを追加 * BaseSelect関連コンポーネントを追加 * BaseRowCardを使った実装に変更 * BaseRowCardとほぼ同一になったため削除 * SettingDialog内のコンポーネントを新コンポーネントに置き換え * BaseCheckboxのStoryファイルを追加 * testの内容を実装の変更に合わせて更新 * テキストカラーをより濃い色に変更 * 要素の折り返しをより幅が狭いときに行われるように変更 * テキストの見た目を調整 * 誤字を修正 * outputSamplingRateへの代入時の型を修正 * Checkbox間の間隔を空ける * setting-dialogのCSS記述の調整 * コメント付与 * radix-vueを更新 * z-indexをdata-radix-popper-content-wrapperで指定しないよう変更 * :globalを:deepに変更 * 不要な記述を削除 * disabled状態の追加 * SelectCellを追加 * BaseSelectのopen状態を外から変更できるように * Switchにdisabled状態を追加 * SelectCellの追加・disabledの修正 * 不要なクラス指定を削除 * ToggleCellのSwitchのラベルを削除 * つまみにチェックマークを追加 * コメントを付与 * ホバー・クリック時の色のアニメーションを削除 * 矢印を非表示に * [update snapshots] * 書き出しファイル名パターンのe2eテスト修正 * [update snapshots] * （スナップショットを更新） * test --------- Co-authored-by: Hiroshiba <[email protected]> Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
VOICEVOX · Oct 12, 2024 · 4dbc9a2 · 4dbc9a2
1 parent 84e87e5
commit 4dbc9a2
Show file tree

Hide file tree

Showing 29 changed files with 1,095 additions and 738 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -56,7 +56,7 @@
  "multistream": "4.1.0",
  "pixi.js": "7.4.0",
  "quasar": "2.11.6",
- "radix-vue": "1.2.3",
+ "radix-vue": "1.9.6",
  "rfdc": "1.4.1",
  "semver": "7.5.4",
  "shlex": "2.1.2",

diff --git a/src/components/Base/BaseButton.vue b/src/components/Base/BaseButton.vue
@@ -39,7 +39,6 @@ defineEmits<{
  padding: 0 vars.$padding-2;
  gap: vars.$gap-1;
  border: 1px solid;
- transition: background-color vars.$transition-duration;
  cursor: pointer;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
 

diff --git a/src/components/Base/BaseCheckbox.stories.ts b/src/components/Base/BaseCheckbox.stories.ts
@@ -0,0 +1,25 @@
+import type { Meta, StoryObj } from "@storybook/vue3";
+
+import BaseCheckbox from "./BaseCheckbox.vue";
+
+const meta: Meta<typeof BaseCheckbox> = {
+ component: BaseCheckbox,
+};
+
+export default meta;
+type Story = StoryObj<typeof BaseCheckbox>;
+
+export const Default: Story = {
+ args: {
+ label: "Default",
+ checked: false,
+ },
+};
+
+export const Checked: Story = {
+ ...Default,
+ args: {
+ label: "Checked",
+ checked: true,
+ },
+};