diff --git a/components/status/StatusActionButton.vue b/components/status/StatusActionButton.vue index f67b8dd0..a1a8561c 100644 --- a/components/status/StatusActionButton.vue +++ b/components/status/StatusActionButton.vue @@ -9,6 +9,7 @@ const { as = 'button', command, disabled, content, icon } = defineProps<{ color: string icon: string activeIcon?: string + inactiveIcon?: string hover: string elkGroupHover: string active?: boolean @@ -54,7 +55,7 @@ useCommand({ :hover=" !disabled ? hover : undefined" focus:outline-none :focus-visible="hover" - :class="active ? color : 'text-secondary'" + :class="active ? color : (disabled ? 'op25 pointer-events-none' : 'text-secondary')" :aria-label="content" :disabled="disabled" > @@ -67,7 +68,7 @@ useCommand({ 'group-focus-visible:ring': '2 current', }" > -
+
diff --git a/components/status/StatusActions.vue b/components/status/StatusActions.vue index eb75e707..dc8b67a3 100644 --- a/components/status/StatusActions.vue +++ b/components/status/StatusActions.vue @@ -60,6 +60,7 @@ function reply() { color="text-green" hover="text-green" elk-group-hover="bg-green/10" icon="i-ri:repeat-line" active-icon="i-ri:repeat-fill" + inactive-icon="i-tabler:repeat-off" :active="!!status.reblogged" :disabled="isLoading.reblogged || !canReblog" :command="command"