From 4f3074084db0583c29f55fa1dd3b51b1a7888703 Mon Sep 17 00:00:00 2001 From: Takusea Date: Sun, 29 Sep 2024 03:19:20 +0900 Subject: [PATCH 01/41] =?UTF-8?q?=E4=B8=8D=E8=A6=81=E3=81=AA=E8=A8=98?= =?UTF-8?q?=E8=BF=B0=E3=82=92=E5=89=8A=E9=99=A4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Base/BaseToggleGroup.vue | 3 --- 1 file changed, 3 deletions(-) diff --git a/src/components/Base/BaseToggleGroup.vue b/src/components/Base/BaseToggleGroup.vue index 0cfa4f5a80..404c773aa4 100644 --- a/src/components/Base/BaseToggleGroup.vue +++ b/src/components/Base/BaseToggleGroup.vue @@ -37,8 +37,5 @@ defineEmits<{ .ToggleGroup { display: inline-flex; - background-color: var(--mauve-6); - border-radius: 4px; - box-shadow: 0 2px 10px var(--black-a7); } From a1304009a9678c5b8fbcbb92fb0bc117324f44cf Mon Sep 17 00:00:00 2001 From: Takusea Date: Sun, 29 Sep 2024 03:20:29 +0900 Subject: [PATCH 02/41] =?UTF-8?q?=E3=82=B9=E3=82=BF=E3=82=A4=E3=83=AB?= =?UTF-8?q?=E3=81=AE=E5=BE=AE=E8=AA=BF=E6=95=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Base/BaseToggleGroupItem.vue | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/components/Base/BaseToggleGroupItem.vue b/src/components/Base/BaseToggleGroupItem.vue index af5f37d16c..f593e6c130 100644 --- a/src/components/Base/BaseToggleGroupItem.vue +++ b/src/components/Base/BaseToggleGroupItem.vue @@ -25,9 +25,8 @@ defineProps<{ align-items: center; height: vars.$size-control; border: 1px solid; - transition: - background-color vars.$transition-duration, - padding vars.$transition-duration; + transition-duration: vars.$transition-duration; + transition-property: background-color, color, padding, box-shadow; cursor: pointer; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05); @@ -54,6 +53,7 @@ defineProps<{ color: colors.$display; border-color: colors.$border; background-color: colors.$control; + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05); &:hover:not(:disabled) { background-color: colors.$control-hovered; From 558f1784b6ec32d0a3c2e37a1e0f8425d07b77fd Mon Sep 17 00:00:00 2001 From: Takusea Date: Sun, 29 Sep 2024 03:31:20 +0900 Subject: [PATCH 03/41] =?UTF-8?q?Clickable=E3=81=A7=E3=81=AA=E3=81=84BaseR?= =?UTF-8?q?owCard=E3=81=AB=E3=83=95=E3=82=A9=E3=83=BC=E3=82=AB=E3=82=B9?= =?UTF-8?q?=E3=81=A7=E3=81=8D=E3=81=AA=E3=81=84=E3=82=88=E3=81=86=E3=81=AB?= =?UTF-8?q?=E3=81=99=E3=82=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Base/BaseRowCard.vue | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/Base/BaseRowCard.vue b/src/components/Base/BaseRowCard.vue index cf9efe8f24..b807f36c45 100644 --- a/src/components/Base/BaseRowCard.vue +++ b/src/components/Base/BaseRowCard.vue @@ -3,6 +3,7 @@ class="row-card" :class="{ clickable: clickable }" role="listitem" + :tabindex="clickable ? 0 : -1" @click="(payload) => $emit('click', payload)" >
@@ -19,7 +20,7 @@ defineProps<{ title: string; description?: string; - clickable: boolean; + clickable?: boolean; }>(); defineEmits<{ From 0b3577a225a01420025fbca4acb66855515deaaf Mon Sep 17 00:00:00 2001 From: Takusea Date: Sun, 29 Sep 2024 03:32:04 +0900 Subject: [PATCH 04/41] =?UTF-8?q?=E5=B9=85=E3=81=8C=E7=8B=AD=E3=81=84?= =?UTF-8?q?=E3=81=A8=E3=81=8D=E3=81=AB=E8=A6=81=E7=B4=A0=E3=82=92=E5=B4=A9?= =?UTF-8?q?=E3=82=8C=E3=81=9A=E3=81=AB=E6=8A=98=E3=82=8A=E8=BF=94=E3=81=99?= =?UTF-8?q?=E3=82=88=E3=81=86=E3=81=AB=E4=BF=AE=E6=AD=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Base/BaseRowCard.vue | 13 +++++++++++-- 1 file changed, 11 insertions(+), 2 deletions(-) diff --git a/src/components/Base/BaseRowCard.vue b/src/components/Base/BaseRowCard.vue index b807f36c45..28aef651e3 100644 --- a/src/components/Base/BaseRowCard.vue +++ b/src/components/Base/BaseRowCard.vue @@ -34,8 +34,8 @@ defineEmits<{ @use "@/styles/v2/colors" as colors; .row-card { - display: grid; - grid-template-columns: 1fr auto; + display: flex; + flex-wrap: wrap; text-align: unset; align-items: center; border: 1px solid colors.$border; @@ -71,4 +71,13 @@ defineEmits<{ .description { font-size: 0.75rem; } + +.control { + display: flex; + flex-wrap: wrap; + justify-content: right; + align-items: center; + gap: vars.$gap-1; + margin-left: auto; +} From 5f94cc49acb3afe1c43fc06e8a562bdd46ab52ac Mon Sep 17 00:00:00 2001 From: Takusea Date: Sun, 29 Sep 2024 03:42:48 +0900 Subject: [PATCH 05/41] =?UTF-8?q?=E4=B8=8D=E8=A6=81=E3=81=AA=E8=A8=98?= =?UTF-8?q?=E8=BF=B0=E3=82=92=E5=89=8A=E9=99=A4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Base/BaseToggleGroupItem.vue | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/Base/BaseToggleGroupItem.vue b/src/components/Base/BaseToggleGroupItem.vue index f593e6c130..311b73f8bc 100644 --- a/src/components/Base/BaseToggleGroupItem.vue +++ b/src/components/Base/BaseToggleGroupItem.vue @@ -28,7 +28,6 @@ defineProps<{ transition-duration: vars.$transition-duration; transition-property: background-color, color, padding, box-shadow; cursor: pointer; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05); &:active:not(:disabled) { box-shadow: 0 0 0 transparent; From 1cd43ac944cf33fec195c7aecb27d4f637309f24 Mon Sep 17 00:00:00 2001 From: Takusea Date: Sun, 29 Sep 2024 03:43:22 +0900 Subject: [PATCH 06/41] =?UTF-8?q?ToolTip=E3=81=A8=E5=85=B1=E5=AD=98?= =?UTF-8?q?=E3=81=A7=E3=81=8D=E3=82=8B=E3=82=88=E3=81=86=E3=81=ABCSS?= =?UTF-8?q?=E3=82=BB=E3=83=AC=E3=82=AF=E3=82=BF=E3=82=92=E5=A4=89=E6=9B=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Base/BaseToggleGroupItem.vue | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/components/Base/BaseToggleGroupItem.vue b/src/components/Base/BaseToggleGroupItem.vue index 311b73f8bc..6eff7131b2 100644 --- a/src/components/Base/BaseToggleGroupItem.vue +++ b/src/components/Base/BaseToggleGroupItem.vue @@ -46,7 +46,7 @@ defineProps<{ border-bottom-right-radius: vars.$radius-1; } - &[data-state="off"] { + &[aria-pressed="false"] { padding: 0 calc(#{vars.$padding-1} + (#{vars.$size-icon} + #{vars.$gap-1}) / 2); color: colors.$display; @@ -63,7 +63,7 @@ defineProps<{ } } - &[data-state="on"] { + &[aria-pressed="true"] { padding: 0 vars.$padding-1; color: colors.$display-oncolor; border-color: colors.$border; @@ -90,7 +90,7 @@ defineProps<{ opacity vars.$transition-duration; } -[data-state="off"] > .check { +[aria-pressed="false"] > .check { width: 0; opacity: 0; margin-right: 0; From aedf758585d7e41a87e6af2a03897dbdc8ca55f5 Mon Sep 17 00:00:00 2001 From: Takusea Date: Sun, 29 Sep 2024 17:18:27 +0900 Subject: [PATCH 07/41] =?UTF-8?q?BaseCheckbox=E3=82=B3=E3=83=B3=E3=83=9D?= =?UTF-8?q?=E3=83=BC=E3=83=8D=E3=83=B3=E3=83=88=E3=82=92=E8=BF=BD=E5=8A=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Base/BaseCheckbox.vue | 56 ++++++++++++++++++++++++++++ 1 file changed, 56 insertions(+) create mode 100644 src/components/Base/BaseCheckbox.vue diff --git a/src/components/Base/BaseCheckbox.vue b/src/components/Base/BaseCheckbox.vue new file mode 100644 index 0000000000..4f2d632bf1 --- /dev/null +++ b/src/components/Base/BaseCheckbox.vue @@ -0,0 +1,56 @@ + + + + + From 29088c0df1f00a177d58f263d059b8ebea76b0b7 Mon Sep 17 00:00:00 2001 From: Takusea Date: Sun, 29 Sep 2024 17:18:49 +0900 Subject: [PATCH 08/41] =?UTF-8?q?BaseSelect=E9=96=A2=E9=80=A3=E3=82=B3?= =?UTF-8?q?=E3=83=B3=E3=83=9D=E3=83=BC=E3=83=8D=E3=83=B3=E3=83=88=E3=82=92?= =?UTF-8?q?=E8=BF=BD=E5=8A=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Base/BaseSelect.vue | 121 +++++++++++++++++++++++++ src/components/Base/BaseSelectItem.vue | 79 ++++++++++++++++ 2 files changed, 200 insertions(+) create mode 100644 src/components/Base/BaseSelect.vue create mode 100644 src/components/Base/BaseSelectItem.vue diff --git a/src/components/Base/BaseSelect.vue b/src/components/Base/BaseSelect.vue new file mode 100644 index 0000000000..e448318450 --- /dev/null +++ b/src/components/Base/BaseSelect.vue @@ -0,0 +1,121 @@ + + + + + diff --git a/src/components/Base/BaseSelectItem.vue b/src/components/Base/BaseSelectItem.vue new file mode 100644 index 0000000000..fb27875948 --- /dev/null +++ b/src/components/Base/BaseSelectItem.vue @@ -0,0 +1,79 @@ + + + + + From 3c06f19408f0ccfc17895a0a356c94d4d943b0c7 Mon Sep 17 00:00:00 2001 From: Takusea Date: Sun, 29 Sep 2024 17:44:26 +0900 Subject: [PATCH 09/41] =?UTF-8?q?BaseRowCard=E3=82=92=E4=BD=BF=E3=81=A3?= =?UTF-8?q?=E3=81=9F=E5=AE=9F=E8=A3=85=E3=81=AB=E5=A4=89=E6=9B=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Dialog/SettingDialog/ButtonToggleCell.vue | 76 +++++++------------ .../Dialog/SettingDialog/EditButtonCell.vue | 32 +++----- .../Dialog/SettingDialog/ToggleCell.vue | 43 ++++++----- 3 files changed, 65 insertions(+), 86 deletions(-) diff --git a/src/components/Dialog/SettingDialog/ButtonToggleCell.vue b/src/components/Dialog/SettingDialog/ButtonToggleCell.vue index fa4abf53fe..ef1d51e791 100644 --- a/src/components/Dialog/SettingDialog/ButtonToggleCell.vue +++ b/src/components/Dialog/SettingDialog/ButtonToggleCell.vue @@ -1,57 +1,37 @@ + - - -
- - - - - - -
実験的機能
-
- - - - - - - - 現在のプロジェクトに複数のトラックが存在するため、無効化できません。 - - -
- - -
データ収集
-
- -
+ + + + +
+ + + +
+
+ + + +
+
実験的機能
+ + + + + + + + 現在のプロジェクトに複数のトラックが存在するため、無効化できません。 + + +
+
+
データ収集
+ +
+ @@ -569,8 +493,13 @@ import { computed, ref, watchEffect } from "vue"; import FileNameTemplateDialog from "./FileNameTemplateDialog.vue"; import ToggleCell from "./ToggleCell.vue"; import ButtonToggleCell from "./ButtonToggleCell.vue"; -import BaseCell from "./BaseCell.vue"; import EditButtonCell from "./EditButtonCell.vue"; +import BaseRowCard from "@/components/Base/BaseRowCard.vue"; +import BaseButton from "@/components/Base/BaseButton.vue"; +import BaseScrollArea from "@/components/Base/BaseScrollArea.vue"; +import BaseSelect from "@/components/Base/BaseSelect.vue"; +import BaseSelectItem from "@/components/Base/BaseSelectItem.vue"; +import BaseCheckbox from "@/components/Base/BaseCheckbox.vue"; import { useStore } from "@/store"; import { DEFAULT_AUDIO_FILE_BASE_NAME_TEMPLATE, @@ -648,25 +577,16 @@ const isDefaultConfirmedTips = computed(() => { }); // ソング:元に戻すトラック操作 -type UndoableTrackOperation = - keyof RootMiscSettingType["undoableTrackOperations"]; -const undoableTrackOperationsLabels = [ - { value: "soloAndMute", label: "ミュート・ソロ" }, - { value: "panAndGain", label: "パン・音量" }, -]; +const undoableTrackOperationsLabels = { + soloAndMute: "ミュート・ソロ", + panAndGain: "パン・音量", +}; const undoableTrackOperations = computed({ - get: () => - Object.keys(store.state.undoableTrackOperations).filter( - (key) => - store.state.undoableTrackOperations[key as UndoableTrackOperation], - ) as UndoableTrackOperation[], - set: (undoableTrackOperations: UndoableTrackOperation[]) => { + get: () => store.state.undoableTrackOperations, + set: (undoableTrackOperations) => { void store.dispatch("SET_ROOT_MISC_SETTING", { key: "undoableTrackOperations", - value: { - soloAndMute: undoableTrackOperations.includes("soloAndMute"), - panAndGain: undoableTrackOperations.includes("panAndGain"), - }, + value: undoableTrackOperations, }); }, }); @@ -714,13 +634,7 @@ const [ const canSetAudioOutputDevice = computed(() => { return !!HTMLAudioElement.prototype.setSinkId; }); -const currentAudioOutputDeviceComputed = computed< - | { - key: string; - label: string; - } - | undefined ->({ +const currentAudioOutputDeviceComputed = computed({ get: () => { // 再生デバイスが見つからなかったらデフォルト値に戻す // FIXME: watchなどにしてgetter内で操作しないようにする @@ -728,7 +642,7 @@ const currentAudioOutputDeviceComputed = computed< (device) => device.key === store.state.savingSetting.audioOutputDevice, ); if (device) { - return device; + return device.key; } else if (store.state.savingSetting.audioOutputDevice !== "default") { handleSavingSettingChange("audioOutputDevice", "default"); } @@ -736,7 +650,7 @@ const currentAudioOutputDeviceComputed = computed< }, set: (device) => { if (device) { - handleSavingSettingChange("audioOutputDevice", device.key); + handleSavingSettingChange("audioOutputDevice", device); } }, }); @@ -821,8 +735,8 @@ const changeExperimentalSetting = async ( const savingSetting = computed(() => store.state.savingSetting); const engineUseGpuOptions = [ - { label: "CPU", value: false }, - { label: "GPU", value: true }, + { label: "CPU", value: "CPU" }, + { label: "GPU", value: "GPU" }, ]; const audioFileNamePattern = computed( @@ -961,15 +875,24 @@ const setMultiTrack = (enableMultiTrack: boolean) => { From 622a00b1fab94af473afdf984e3d5718af26d64c Mon Sep 17 00:00:00 2001 From: Takusea Date: Mon, 30 Sep 2024 01:41:10 +0900 Subject: [PATCH 12/41] =?UTF-8?q?BaseCheckbox=E3=81=AEStory=E3=83=95?= =?UTF-8?q?=E3=82=A1=E3=82=A4=E3=83=AB=E3=82=92=E8=BF=BD=E5=8A=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Base/BaseCheckbox.stories.ts | 25 +++++++++++++++++++++ 1 file changed, 25 insertions(+) create mode 100644 src/components/Base/BaseCheckbox.stories.ts diff --git a/src/components/Base/BaseCheckbox.stories.ts b/src/components/Base/BaseCheckbox.stories.ts new file mode 100644 index 0000000000..8fcde07257 --- /dev/null +++ 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 = { + component: BaseCheckbox, +}; + +export default meta; +type Story = StoryObj; + +export const Default: Story = { + args: { + label: "Default", + checked: false, + }, +}; + +export const Checked: Story = { + ...Default, + args: { + label: "Checked", + checked: true, + }, +}; From 04a075fda9a265f780cdfc65fb50c093b7e00add Mon Sep 17 00:00:00 2001 From: Takusea Date: Mon, 30 Sep 2024 01:42:25 +0900 Subject: [PATCH 13/41] =?UTF-8?q?test=E3=81=AE=E5=86=85=E5=AE=B9=E3=82=92?= =?UTF-8?q?=E5=AE=9F=E8=A3=85=E3=81=AE=E5=A4=89=E6=9B=B4=E3=81=AB=E5=90=88?= =?UTF-8?q?=E3=82=8F=E3=81=9B=E3=81=A6=E6=9B=B4=E6=96=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- tests/e2e/navigators.ts | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/tests/e2e/navigators.ts b/tests/e2e/navigators.ts index e923d25220..614a16e612 100644 --- a/tests/e2e/navigators.ts +++ b/tests/e2e/navigators.ts @@ -35,10 +35,9 @@ export async function toggleSetting(page: Page, settingName: string) { await page.getByText("オプション").click(); await page.waitForTimeout(100); await page - .locator(".q-card__actions", { + .locator(".row-card", { has: page.getByText(settingName), }) - .locator(".q-toggle") .click(); await page.waitForTimeout(100); await page.getByRole("button", { name: "設定を閉じる" }).click(); From d81ebb426376a596101f7360ab12fd2d93a6ec5b Mon Sep 17 00:00:00 2001 From: Takusea Date: Tue, 1 Oct 2024 22:32:26 +0900 Subject: [PATCH 14/41] =?UTF-8?q?=E3=83=86=E3=82=AD=E3=82=B9=E3=83=88?= =?UTF-8?q?=E3=82=AB=E3=83=A9=E3=83=BC=E3=82=92=E3=82=88=E3=82=8A=E6=BF=83?= =?UTF-8?q?=E3=81=84=E8=89=B2=E3=81=AB=E5=A4=89=E6=9B=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/styles/v2/colors.scss | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/styles/v2/colors.scss b/src/styles/v2/colors.scss index 0be6e9fc8c..d5e8a17e2a 100644 --- a/src/styles/v2/colors.scss +++ b/src/styles/v2/colors.scss @@ -17,8 +17,8 @@ $primitive-red: #d04756; --color-v2-border: #{rgba($primitive-black, 0.2)}; --color-v2-selected: #{rgba($primitive-primary, 0.3)}; - --color-v2-display: #{lighten($primitive-black, 10%)}; - --color-v2-display-oncolor: #{lighten($primitive-black, 10%)}; + --color-v2-display: #{$primitive-black}; + --color-v2-display-oncolor: #{$primitive-black}; --color-v2-display-sub: #{rgba($primitive-black, 0.5)}; --color-v2-display-link: #{$primitive-blue}; --color-v2-display-warning: #{$primitive-red}; From 0230e6025b951bee0c0edd73099d5d54bc8bc628 Mon Sep 17 00:00:00 2001 From: Takusea Date: Tue, 1 Oct 2024 22:34:19 +0900 Subject: [PATCH 15/41] =?UTF-8?q?=E8=A6=81=E7=B4=A0=E3=81=AE=E6=8A=98?= =?UTF-8?q?=E3=82=8A=E8=BF=94=E3=81=97=E3=82=92=E3=82=88=E3=82=8A=E5=B9=85?= =?UTF-8?q?=E3=81=8C=E7=8B=AD=E3=81=84=E3=81=A8=E3=81=8D=E3=81=AB=E8=A1=8C?= =?UTF-8?q?=E3=82=8F=E3=82=8C=E3=82=8B=E3=82=88=E3=81=86=E3=81=AB=E5=A4=89?= =?UTF-8?q?=E6=9B=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Base/BaseRowCard.vue | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/Base/BaseRowCard.vue b/src/components/Base/BaseRowCard.vue index 28aef651e3..7cc0bec3e7 100644 --- a/src/components/Base/BaseRowCard.vue +++ b/src/components/Base/BaseRowCard.vue @@ -65,7 +65,8 @@ defineEmits<{ } .text { - flex-grow: 1; + flex: 1; + min-width: 240px; } .description { From b731ca014a082b9d4fd4e7e324f388c08f92550b Mon Sep 17 00:00:00 2001 From: Takusea Date: Tue, 1 Oct 2024 22:34:47 +0900 Subject: [PATCH 16/41] =?UTF-8?q?=E3=83=86=E3=82=AD=E3=82=B9=E3=83=88?= =?UTF-8?q?=E3=81=AE=E8=A6=8B=E3=81=9F=E7=9B=AE=E3=82=92=E8=AA=BF=E6=95=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Base/BaseRowCard.vue | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/src/components/Base/BaseRowCard.vue b/src/components/Base/BaseRowCard.vue index 7cc0bec3e7..a9c23cd103 100644 --- a/src/components/Base/BaseRowCard.vue +++ b/src/components/Base/BaseRowCard.vue @@ -69,8 +69,14 @@ defineEmits<{ min-width: 240px; } +.title { + font-weight: 700; +} + .description { - font-size: 0.75rem; + // TODO: html要素のfont-size指定が16pxになり次第remでの指定に変更する + // font-size: 0.75rem; + font-size: 12px; } .control { From c95aff2d840ac077b2c9e9992138f53c54e280ae Mon Sep 17 00:00:00 2001 From: Takusea Date: Tue, 1 Oct 2024 23:26:46 +0900 Subject: [PATCH 17/41] =?UTF-8?q?=E8=AA=A4=E5=AD=97=E3=82=92=E4=BF=AE?= =?UTF-8?q?=E6=AD=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Dialog/SettingDialog/SettingDialog.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/Dialog/SettingDialog/SettingDialog.vue b/src/components/Dialog/SettingDialog/SettingDialog.vue index a71f3265e6..e3ea36393e 100644 --- a/src/components/Dialog/SettingDialog/SettingDialog.vue +++ b/src/components/Dialog/SettingDialog/SettingDialog.vue @@ -135,7 +135,7 @@ /> Date: Thu, 3 Oct 2024 23:26:18 +0900 Subject: [PATCH 19/41] =?UTF-8?q?Checkbox=E9=96=93=E3=81=AE=E9=96=93?= =?UTF-8?q?=E9=9A=94=E3=82=92=E7=A9=BA=E3=81=91=E3=82=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Dialog/SettingDialog/SettingDialog.vue | 33 +++++++++++-------- 1 file changed, 20 insertions(+), 13 deletions(-) diff --git a/src/components/Dialog/SettingDialog/SettingDialog.vue b/src/components/Dialog/SettingDialog/SettingDialog.vue index 7b6aae1b17..0789baa06f 100644 --- a/src/components/Dialog/SettingDialog/SettingDialog.vue +++ b/src/components/Dialog/SettingDialog/SettingDialog.vue @@ -398,19 +398,21 @@ title="ソング:元に戻すトラック操作" description="「元に戻す」機能の対象とするトラック操作を指定します。" > - +
+ +
@@ -941,4 +943,9 @@ const setMultiTrack = (enableMultiTrack: boolean) => { justify-content: space-between; gap: vars.$gap-1; } + +.checkbox-list { + display: flex; + gap: vars.$gap-2; +} From 32885e9ff63ac9acec3f2adfa44da900988aa24b Mon Sep 17 00:00:00 2001 From: Takusea Date: Thu, 3 Oct 2024 23:27:04 +0900 Subject: [PATCH 20/41] =?UTF-8?q?setting-dialog=E3=81=AECSS=E8=A8=98?= =?UTF-8?q?=E8=BF=B0=E3=81=AE=E8=AA=BF=E6=95=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Dialog/SettingDialog/SettingDialog.vue | 2 +- src/styles/v2/variables.scss | 6 +++--- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/src/components/Dialog/SettingDialog/SettingDialog.vue b/src/components/Dialog/SettingDialog/SettingDialog.vue index 0789baa06f..d72c259343 100644 --- a/src/components/Dialog/SettingDialog/SettingDialog.vue +++ b/src/components/Dialog/SettingDialog/SettingDialog.vue @@ -894,7 +894,7 @@ const setMultiTrack = (enableMultiTrack: boolean) => { } :global(.setting-dialog) { - z-index: 1000 !important; + z-index: vars.$z-index-fullscreen-dialog !important; } .help-hover-icon { diff --git a/src/styles/v2/variables.scss b/src/styles/v2/variables.scss index 6018a9a5f6..7c50a0b682 100644 --- a/src/styles/v2/variables.scss +++ b/src/styles/v2/variables.scss @@ -23,11 +23,11 @@ $radius-2: calc(var(--radius-basis) * 2); $transition-duration: 100ms; -$z-index-tooltip: 9999; - -$z-index-dropdown: 1000; +$z-index-fullscreen-dialog: 1000; +$z-index-dropdown: 1010; $z-index-fixed: 1020; $z-index-dialog: 1050; +$z-index-tooltip: 9999; $z-index-sing-background: 0; $z-index-sing-note: 10; From c52a723e80ea80564bbe1acaa23f13b3275ee5dc Mon Sep 17 00:00:00 2001 From: Takusea Date: Thu, 3 Oct 2024 23:27:18 +0900 Subject: [PATCH 21/41] =?UTF-8?q?=E3=82=B3=E3=83=A1=E3=83=B3=E3=83=88?= =?UTF-8?q?=E4=BB=98=E4=B8=8E?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Dialog/SettingDialog/SettingDialog.vue | 1 + 1 file changed, 1 insertion(+) diff --git a/src/components/Dialog/SettingDialog/SettingDialog.vue b/src/components/Dialog/SettingDialog/SettingDialog.vue index d72c259343..4c5806a346 100644 --- a/src/components/Dialog/SettingDialog/SettingDialog.vue +++ b/src/components/Dialog/SettingDialog/SettingDialog.vue @@ -893,6 +893,7 @@ const setMultiTrack = (enableMultiTrack: boolean) => { @include mixin.headline-2; } +// NOTE: なぜか:globalしないと効かない :global(.setting-dialog) { z-index: vars.$z-index-fullscreen-dialog !important; } From 226ec23c98f48a11779b16d187f99b17e0dec326 Mon Sep 17 00:00:00 2001 From: Takusea Date: Thu, 3 Oct 2024 23:28:21 +0900 Subject: [PATCH 22/41] =?UTF-8?q?radix-vue=E3=82=92=E6=9B=B4=E6=96=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package-lock.json | 222 +++++++++++++++++++++++++++++++++++++++------- package.json | 2 +- 2 files changed, 193 insertions(+), 31 deletions(-) diff --git a/package-lock.json b/package-lock.json index 4babfcee69..401288731f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -27,7 +27,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", @@ -3079,41 +3079,41 @@ "dev": true }, "node_modules/@floating-ui/core": { - "version": "1.6.3", - "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.6.3.tgz", - "integrity": "sha512-1ZpCvYf788/ZXOhRQGFxnYQOVgeU+pi0i+d0Ow34La7qjIXETi6RNswGVKkA6KcDO8/+Ysu2E/CeUmmeEBDvTg==", + "version": "1.6.8", + "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.6.8.tgz", + "integrity": "sha512-7XJ9cPU+yI2QeLS+FCSlqNFZJq8arvswefkZrYI1yQBbftw6FyrZOxYSh+9S7z7TpeWlRt9zJ5IhM1WIL334jA==", "dependencies": { - "@floating-ui/utils": "^0.2.3" + "@floating-ui/utils": "^0.2.8" } }, "node_modules/@floating-ui/dom": { - "version": "1.6.6", - "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.6.6.tgz", - "integrity": "sha512-qiTYajAnh3P+38kECeffMSQgbvXty2VB6rS+42iWR4FPIlZjLK84E9qtLnMTLIpPz2znD/TaFqaiavMUrS+Hcw==", + "version": "1.6.11", + "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.6.11.tgz", + "integrity": "sha512-qkMCxSR24v2vGkhYDo/UzxfJN3D4syqSjyuTFz6C7XcpU1pASPRieNI0Kj5VP3/503mOfYiGY891ugBX1GlABQ==", "dependencies": { - "@floating-ui/core": "^1.0.0", - "@floating-ui/utils": "^0.2.3" + "@floating-ui/core": "^1.6.0", + "@floating-ui/utils": "^0.2.8" } }, "node_modules/@floating-ui/utils": { - "version": "0.2.3", - "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.2.3.tgz", - "integrity": "sha512-XGndio0l5/Gvd6CLIABvsav9HHezgDFFhDfHk1bvLfr9ni8dojqLSvBbotJEjmIwNHL7vK4QzBJTdBRoB+c1ww==" + "version": "0.2.8", + "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.2.8.tgz", + "integrity": "sha512-kym7SodPp8/wloecOpcmSnWJsK7M0E5Wg8UcFA+uO4B9s5d0ywXOEro/8HM9x0rW+TljRzul/14UYz3TleT3ig==" }, "node_modules/@floating-ui/vue": { - "version": "1.0.7", - "resolved": "https://registry.npmjs.org/@floating-ui/vue/-/vue-1.0.7.tgz", - "integrity": "sha512-tm9aMT9IrMzoZfzPpsoZHP7j7ULZ0p9AzCJV6i2H8sAlKe36tAnwuQLHdm7vE0SnRkHJJXuMB/gNz4gFdHLNrg==", + "version": "1.1.5", + "resolved": "https://registry.npmjs.org/@floating-ui/vue/-/vue-1.1.5.tgz", + "integrity": "sha512-ynL1p5Z+woPVSwgMGqeDrx6HrJfGIDzFyESFkyqJKilGW1+h/8yVY29Khn0LaU6wHBRwZ13ntG6reiHWK6jyzw==", "dependencies": { "@floating-ui/dom": "^1.0.0", - "@floating-ui/utils": "^0.2.3", + "@floating-ui/utils": "^0.2.8", "vue-demi": ">=0.13.0" } }, "node_modules/@floating-ui/vue/node_modules/vue-demi": { - "version": "0.14.8", - "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.8.tgz", - "integrity": "sha512-Uuqnk9YE9SsWeReYqK2alDI5YzciATE0r2SkA6iMAtuXvNTMNACJLJEXNXaEy94ECuBe4Sk6RzRU80kjdbIo1Q==", + "version": "0.14.10", + "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.10.tgz", + "integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==", "hasInstallScript": true, "bin": { "vue-demi-fix": "bin/vue-demi-fix.js", @@ -3229,6 +3229,22 @@ "integrity": "sha512-93zYdMES/c1D69yZiKDBj0V24vqNzB/koF26KPaagAfd3P/4gUlh3Dys5ogAK+Exi9QyzlD8x/08Zt7wIKcDcA==", "dev": true }, + "node_modules/@internationalized/date": { + "version": "3.5.6", + "resolved": "https://registry.npmjs.org/@internationalized/date/-/date-3.5.6.tgz", + "integrity": "sha512-jLxQjefH9VI5P9UQuqB6qNKnvFt1Ky1TPIzHGsIlCi7sZZoMR8SdYbBGRvM0y+Jtb+ez4ieBzmiAUcpmPYpyOw==", + "dependencies": { + "@swc/helpers": "^0.5.0" + } + }, + "node_modules/@internationalized/number": { + "version": "3.5.4", + "resolved": "https://registry.npmjs.org/@internationalized/number/-/number-3.5.4.tgz", + "integrity": "sha512-h9huwWjNqYyE2FXZZewWqmCdkw1HeFds5q4Siuoms3hUQC5iPJK3aBmkFZoDSLN4UD0Bl8G22L/NdHpeOr+/7A==", + "dependencies": { + "@swc/helpers": "^0.5.0" + } + }, "node_modules/@isaacs/cliui": { "version": "8.0.2", "resolved": "https://registry.npmjs.org/@isaacs/cliui/-/cliui-8.0.2.tgz", @@ -7106,6 +7122,14 @@ "integrity": "sha512-e2BR4lsJkkRlKZ/qCHPw9ZaSxc0MVUd7gtbtaB7aMvHeJVYe8sOB8DBZkP2DtISHGSku9sCK6T6cnY0CtXrOCQ==", "dev": true }, + "node_modules/@swc/helpers": { + "version": "0.5.13", + "resolved": "https://registry.npmjs.org/@swc/helpers/-/helpers-0.5.13.tgz", + "integrity": "sha512-UoKGxQ3r5kYI9dALKJapMmuK+1zWM/H17Z1+iwnNmzcJRnfFuevZs375TA5rW31pu4BS4NoSy1fRsexDXfWn5w==", + "dependencies": { + "tslib": "^2.4.0" + } + }, "node_modules/@swc/jest": { "version": "0.2.36", "resolved": "https://registry.npmjs.org/@swc/jest/-/jest-0.2.36.tgz", @@ -7144,6 +7168,30 @@ "node": ">=10" } }, + "node_modules/@tanstack/virtual-core": { + "version": "3.10.8", + "resolved": "https://registry.npmjs.org/@tanstack/virtual-core/-/virtual-core-3.10.8.tgz", + "integrity": "sha512-PBu00mtt95jbKFi6Llk9aik8bnR3tR/oQP1o3TSi+iG//+Q2RTIzCEgKkHG8BB86kxMNW6O8wku+Lmi+QFR6jA==", + "funding": { + "type": "github", + "url": "https://github.com/sponsors/tannerlinsley" + } + }, + "node_modules/@tanstack/vue-virtual": { + "version": "3.10.8", + "resolved": "https://registry.npmjs.org/@tanstack/vue-virtual/-/vue-virtual-3.10.8.tgz", + "integrity": "sha512-DB5QA8c/LfqOqIUCpSs3RdOTVroRRdqeHMqBkYrcashSZtOzIv8xbiqHgg7RYxDfkH5F3Y+e0MkuuyGNDVB0BQ==", + "dependencies": { + "@tanstack/virtual-core": "3.10.8" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/tannerlinsley" + }, + "peerDependencies": { + "vue": "^2.7.0 || ^3.0.0" + } + }, "node_modules/@testing-library/dom": { "version": "9.3.4", "resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-9.3.4.tgz", @@ -7785,6 +7833,11 @@ "@types/node": "*" } }, + "node_modules/@types/web-bluetooth": { + "version": "0.0.20", + "resolved": "https://registry.npmjs.org/@types/web-bluetooth/-/web-bluetooth-0.0.20.tgz", + "integrity": "sha512-g9gZnnXVq7gM7v3tJCWV/qw7w+KeOlSHAhgF9RytFyifW6AF61hdT2ucrYhPq9hLs5JIryeupHV3qGk95dH9ow==" + }, "node_modules/@types/wicg-file-system-access": { "version": "2020.9.6", "resolved": "https://registry.npmjs.org/@types/wicg-file-system-access/-/wicg-file-system-access-2020.9.6.tgz", @@ -8360,6 +8413,89 @@ "vue-component-type-helpers": "^2.0.0" } }, + "node_modules/@vueuse/core": { + "version": "10.11.1", + "resolved": "https://registry.npmjs.org/@vueuse/core/-/core-10.11.1.tgz", + "integrity": "sha512-guoy26JQktXPcz+0n3GukWIy/JDNKti9v6VEMu6kV2sYBsWuGiTU8OWdg+ADfUbHg3/3DlqySDe7JmdHrktiww==", + "dependencies": { + "@types/web-bluetooth": "^0.0.20", + "@vueuse/metadata": "10.11.1", + "@vueuse/shared": "10.11.1", + "vue-demi": ">=0.14.8" + }, + "funding": { + "url": "https://github.com/sponsors/antfu" + } + }, + "node_modules/@vueuse/core/node_modules/vue-demi": { + "version": "0.14.10", + "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.10.tgz", + "integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==", + "hasInstallScript": true, + "bin": { + "vue-demi-fix": "bin/vue-demi-fix.js", + "vue-demi-switch": "bin/vue-demi-switch.js" + }, + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/sponsors/antfu" + }, + "peerDependencies": { + "@vue/composition-api": "^1.0.0-rc.1", + "vue": "^3.0.0-0 || ^2.6.0" + }, + "peerDependenciesMeta": { + "@vue/composition-api": { + "optional": true + } + } + }, + "node_modules/@vueuse/metadata": { + "version": "10.11.1", + "resolved": "https://registry.npmjs.org/@vueuse/metadata/-/metadata-10.11.1.tgz", + "integrity": "sha512-IGa5FXd003Ug1qAZmyE8wF3sJ81xGLSqTqtQ6jaVfkeZ4i5kS2mwQF61yhVqojRnenVew5PldLyRgvdl4YYuSw==", + "funding": { + "url": "https://github.com/sponsors/antfu" + } + }, + "node_modules/@vueuse/shared": { + "version": "10.11.1", + "resolved": "https://registry.npmjs.org/@vueuse/shared/-/shared-10.11.1.tgz", + "integrity": "sha512-LHpC8711VFZlDaYUXEBbFBCQ7GS3dVU9mjOhhMhXP6txTV4EhYQg/KGnQuvt/sPAtoUKq7VVUnL6mVtFoL42sA==", + "dependencies": { + "vue-demi": ">=0.14.8" + }, + "funding": { + "url": "https://github.com/sponsors/antfu" + } + }, + "node_modules/@vueuse/shared/node_modules/vue-demi": { + "version": "0.14.10", + "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.10.tgz", + "integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==", + "hasInstallScript": true, + "bin": { + "vue-demi-fix": "bin/vue-demi-fix.js", + "vue-demi-switch": "bin/vue-demi-switch.js" + }, + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/sponsors/antfu" + }, + "peerDependencies": { + "@vue/composition-api": "^1.0.0-rc.1", + "vue": "^3.0.0-0 || ^2.6.0" + }, + "peerDependenciesMeta": { + "@vue/composition-api": { + "optional": true + } + } + }, "node_modules/@xmldom/xmldom": { "version": "0.8.10", "resolved": "https://registry.npmjs.org/@xmldom/xmldom/-/xmldom-0.8.10.tgz", @@ -8834,7 +8970,6 @@ "version": "1.2.4", "resolved": "https://registry.npmjs.org/aria-hidden/-/aria-hidden-1.2.4.tgz", "integrity": "sha512-y+CcFFwelSXpLZk/7fMB2mUbGtX9lKycf1MWJ7CaTIERyitVlyQx6C+sxcROU2BAJ24OiZyK+8wj2i8AlBoS3A==", - "dev": true, "dependencies": { "tslib": "^2.0.0" }, @@ -19756,13 +19891,41 @@ } }, "node_modules/radix-vue": { - "version": "1.2.3", - "resolved": "https://registry.npmjs.org/radix-vue/-/radix-vue-1.2.3.tgz", - "integrity": "sha512-iR4D3SoIoCzKeCldxwxjLv0roGBZNSKAxE5/CgB8V1P7Mk7RtVhnFmOIWL/Z3XNzR9XfU03s8FZLIs+1LCEXnQ==", - "dependencies": { - "@floating-ui/dom": "^1.5.3", - "@floating-ui/vue": "^1.0.2", - "fast-deep-equal": "^3.1.3" + "version": "1.9.6", + "resolved": "https://registry.npmjs.org/radix-vue/-/radix-vue-1.9.6.tgz", + "integrity": "sha512-legrn9jHbEpbJS4QYrA0VmIafj1bmc4MSVzN55WZatGiXMJg3oFrQL5QxpiURJciS+OlATbKA2KAGkMuuLA0LA==", + "dependencies": { + "@floating-ui/dom": "^1.6.7", + "@floating-ui/vue": "^1.1.0", + "@internationalized/date": "^3.5.4", + "@internationalized/number": "^3.5.3", + "@tanstack/vue-virtual": "^3.8.1", + "@vueuse/core": "^10.11.0", + "@vueuse/shared": "^10.11.0", + "aria-hidden": "^1.2.4", + "defu": "^6.1.4", + "fast-deep-equal": "^3.1.3", + "nanoid": "^5.0.7" + }, + "peerDependencies": { + "vue": ">= 3.2.0" + } + }, + "node_modules/radix-vue/node_modules/nanoid": { + "version": "5.0.7", + "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-5.0.7.tgz", + "integrity": "sha512-oLxFY2gd2IqnjcYyOXD8XGCftpGtZP2AbHbOkthDkvRywH5ayNtPVy9YlOPcHckXzbLTCHpkb7FB+yuxKV13pQ==", + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/ai" + } + ], + "bin": { + "nanoid": "bin/nanoid.js" + }, + "engines": { + "node": "^18 || >=20" } }, "node_modules/ramda": { @@ -22273,8 +22436,7 @@ "node_modules/tslib": { "version": "2.6.2", "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz", - "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==", - "dev": true + "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==" }, "node_modules/tsutils": { "version": "3.21.0", diff --git a/package.json b/package.json index 75e20bc3cc..44a2116926 100644 --- 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", From 44bee2a52310ab52217a545b9ea5ce992bbfffbc Mon Sep 17 00:00:00 2001 From: Takusea Date: Thu, 3 Oct 2024 23:31:37 +0900 Subject: [PATCH 23/41] =?UTF-8?q?z-index=E3=82=92data-radix-popper-content?= =?UTF-8?q?-wrapper=E3=81=A7=E6=8C=87=E5=AE=9A=E3=81=97=E3=81=AA=E3=81=84?= =?UTF-8?q?=E3=82=88=E3=81=86=E5=A4=89=E6=9B=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Base/BaseSelect.vue | 5 +---- src/components/Base/BaseTooltip.vue | 5 +---- 2 files changed, 2 insertions(+), 8 deletions(-) diff --git a/src/components/Base/BaseSelect.vue b/src/components/Base/BaseSelect.vue index e448318450..12ea0adccc 100644 --- a/src/components/Base/BaseSelect.vue +++ b/src/components/Base/BaseSelect.vue @@ -95,10 +95,6 @@ const model = defineModel(); color: colors.$display; } -:global([data-radix-popper-content-wrapper]) { - z-index: vars.$z-index-dropdown !important; -} - :global(.SelectContent) { overflow: hidden; display: flex; @@ -111,6 +107,7 @@ const model = defineModel(); min-width: var(--radix-select-trigger-width); max-width: var(--radix-select-content-available-width); max-height: var(--radix-select-content-available-height); + z-index: vars.$z-index-dropdown; } :global(.SelectArrow) { diff --git a/src/components/Base/BaseTooltip.vue b/src/components/Base/BaseTooltip.vue index 620343d827..56819c558d 100644 --- a/src/components/Base/BaseTooltip.vue +++ b/src/components/Base/BaseTooltip.vue @@ -37,10 +37,6 @@ defineProps<{ @use "@/styles/v2/variables" as vars; @use "@/styles/v2/colors" as colors; -[data-radix-popper-content-wrapper] { - z-index: vars.$z-index-tooltip !important; -} - :deep(.TooltipContent) { display: flex; align-items: center; @@ -52,6 +48,7 @@ defineProps<{ border: 1px solid colors.$border; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05); user-select: none; + z-index: vars.$z-index-tooltip; } .v-enter-active, From bc605357271a8917512be4d2851661fdaca039fb Mon Sep 17 00:00:00 2001 From: Takusea Date: Thu, 3 Oct 2024 23:32:03 +0900 Subject: [PATCH 24/41] =?UTF-8?q?:global=E3=82=92:deep=E3=81=AB=E5=A4=89?= =?UTF-8?q?=E6=9B=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Base/BaseSelect.vue | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/Base/BaseSelect.vue b/src/components/Base/BaseSelect.vue index 12ea0adccc..3b6e74ef68 100644 --- a/src/components/Base/BaseSelect.vue +++ b/src/components/Base/BaseSelect.vue @@ -95,7 +95,7 @@ const model = defineModel(); color: colors.$display; } -:global(.SelectContent) { +:deep(.SelectContent) { overflow: hidden; display: flex; border-radius: vars.$radius-2; @@ -110,7 +110,7 @@ const model = defineModel(); z-index: vars.$z-index-dropdown; } -:global(.SelectArrow) { +:deep(.SelectArrow) { fill: colors.$background; margin-top: -1px; filter: drop-shadow(0 1px 0px colors.$border); From 687a4ae487434a0b2c3f9a671bcb5097a2d83c1d Mon Sep 17 00:00:00 2001 From: Takusea Date: Thu, 3 Oct 2024 23:32:10 +0900 Subject: [PATCH 25/41] =?UTF-8?q?=E4=B8=8D=E8=A6=81=E3=81=AA=E8=A8=98?= =?UTF-8?q?=E8=BF=B0=E3=82=92=E5=89=8A=E9=99=A4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Base/BaseSelect.vue | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/Base/BaseSelect.vue b/src/components/Base/BaseSelect.vue index 3b6e74ef68..52b0f9d4b0 100644 --- a/src/components/Base/BaseSelect.vue +++ b/src/components/Base/BaseSelect.vue @@ -97,7 +97,6 @@ const model = defineModel(); :deep(.SelectContent) { overflow: hidden; - display: flex; border-radius: vars.$radius-2; padding: vars.$padding-1; color: colors.$display; From 17e1be400f964b9f3fc7e1b42d5209cf3f3f75be Mon Sep 17 00:00:00 2001 From: Takusea Date: Fri, 4 Oct 2024 23:58:00 +0900 Subject: [PATCH 26/41] =?UTF-8?q?disabled=E7=8A=B6=E6=85=8B=E3=81=AE?= =?UTF-8?q?=E8=BF=BD=E5=8A=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Base/BaseRowCard.vue | 8 +++++++- src/components/Base/BaseSelect.vue | 7 ++----- src/components/Base/BaseTooltip.vue | 3 ++- src/components/Dialog/SettingDialog/ButtonToggleCell.vue | 2 +- src/components/Dialog/SettingDialog/ToggleCell.vue | 2 ++ 5 files changed, 14 insertions(+), 8 deletions(-) diff --git a/src/components/Base/BaseRowCard.vue b/src/components/Base/BaseRowCard.vue index a9c23cd103..c5d4622565 100644 --- a/src/components/Base/BaseRowCard.vue +++ b/src/components/Base/BaseRowCard.vue @@ -3,8 +3,9 @@ class="row-card" :class="{ clickable: clickable }" role="listitem" + :disabled :tabindex="clickable ? 0 : -1" - @click="(payload) => $emit('click', payload)" + @click="(payload) => !disabled && $emit('click', payload)" >
{{ title }}
@@ -21,6 +22,7 @@ defineProps<{ title: string; description?: string; clickable?: boolean; + disabled?: boolean; }>(); defineEmits<{ @@ -62,6 +64,10 @@ defineEmits<{ &:focus-visible { @include mixin.on-focus; } + + &:disabled { + opacity: 0.5; + } } .text { diff --git a/src/components/Base/BaseSelect.vue b/src/components/Base/BaseSelect.vue index 52b0f9d4b0..a672bb2ecf 100644 --- a/src/components/Base/BaseSelect.vue +++ b/src/components/Base/BaseSelect.vue @@ -70,15 +70,12 @@ const model = defineModel(); border-color: colors.$border; background-color: colors.$control; - &:hover:not(:disabled) { + &:hover:not([data-disabled]) { background-color: colors.$control-hovered; } - &:active:not(:disabled) { + &:active:not([data-disabled]) { background-color: colors.$control-pressed; - } - - &:active:not(:disabled) { box-shadow: 0 0 0 transparent; } diff --git a/src/components/Base/BaseTooltip.vue b/src/components/Base/BaseTooltip.vue index 56819c558d..c75efba56c 100644 --- a/src/components/Base/BaseTooltip.vue +++ b/src/components/Base/BaseTooltip.vue @@ -1,5 +1,5 @@