feat: improve UX for toggling timeline layer enabled state, #609

webfansplz · webfansplz · commit 44eb9099536e · 2024-10-24T21:19:23.000+08:00
diff --git a/packages/client/src/components/timeline/TimelineLayers.vue b/packages/client/src/components/timeline/TimelineLayers.vue
@@ -79,7 +79,7 @@ function toggleTimelineLayerEnabled(id: string) {
       <li
         v-for="item in data" :key="item.id"
         class="group relative selectable-item"
-        :class="{ active: item.id === selected }"
+        :class="{ active: item.id === selected, op60: !getTimelineLayerEnabled(item.id) }"
         @click="select(item.id)"
       >
         {{ item.label }}

Original file line number	Diff line number	Diff line change
`@@ -79,7 +79,7 @@ function toggleTimelineLayerEnabled(id: string) {`
`79`	`79`	`<li`
`80`	`80`	`v-for="item in data" :key="item.id"`
`81`	`81`	`class="group relative selectable-item"`
`82`		`- :class="{ active: item.id === selected }"`
	`82`	`+ :class="{ active: item.id === selected, op60: !getTimelineLayerEnabled(item.id) }"`
`83`	`83`	`@click="select(item.id)"`
`84`	`84`	`>`
`85`	`85`	`{{ item.label }}`