#1755 オクターブ表示の変更

VOICEVOX · Jan 30, 2024 · 5c1e7c1 · 5c1e7c1
1 parent 2b4d470
commit 5c1e7c1
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 21 deletions.
diff --git a/public/themes/dark.json b/public/themes/dark.json
@@ -17,7 +17,7 @@
     "sequencer-whitekey-cell": "#393939",
     "sequencer-blackkey-cell": "#2D2D2D",
     "sequencer-main-divider": "#121212",
-    "sequencer-sub-divider": "#242424",
+    "sequencer-sub-divider": "#262626",
     "sequencer-white-key": "#EEEEEE",
     "sequencer-black-key": "#555555"
   }

diff --git a/src/components/Sing/ScoreSequencer.vue b/src/components/Sing/ScoreSequencer.vue
@@ -53,16 +53,17 @@
               :height="gridCellHeight"
               :class="`sequencer-grid-cell sequencer-grid-cell-${keyInfo.color}`"
             />
-            <line
-              v-for="octaveKeyIndex in octaveKeyIndexes"
-              :key="octaveKeyIndex"
-              x1="0"
-              x2="100%"
-              :y1="gridCellHeight * octaveKeyIndex + 0.5"
-              :y2="gridCellHeight * octaveKeyIndex + 0.5"
-              stroke-width="1"
-              class="sequencer-grid-octave-line"
-            />
+            <template v-for="(keyInfo, index) in keyInfos" :key="index">
+              <line
+                v-if="keyInfo.pitch === 'C'"
+                x1="0"
+                :x2="gridCellWidth"
+                :y1="gridCellHeight * (index + 1)"
+                :y2="gridCellHeight * (index + 1)"
+                stroke-width="1"
+                class="sequencer-grid-octave-line"
+              />
+            </template>
           </pattern>
           <pattern
             id="sequencer-grid-measure"
@@ -293,15 +294,6 @@ const gridWidth = computed(() => {
 const gridHeight = computed(() => {
   return gridCellHeight.value * keyInfos.length;
 });
-// オクターブ表示
-const octaveKeyIndexes = computed(() => {
-  return keyInfos.reduce((indexes, keyInfo, index) => {
-    if (keyInfo.pitch === "C") {
-      indexes.push(index + 1);
-    }
-    return indexes;
-  }, [] as number[]);
-});
 // スクロール位置
 const scrollX = ref(0);
 const scrollY = ref(0);

diff --git a/src/components/Sing/SequencerNote.vue b/src/components/Sing/SequencerNote.vue
@@ -210,7 +210,7 @@ const onLyricInputBlur = () => {
   min-width: 20px;
   padding: 0 1px 2px;
   background: white;
-  color: #000;
+  color: colors.$display-on-primary;
   border: 1px solid hsl(130, 0%, 91%);
   border-radius: 3px;
   font-size: 12px;