fix: Hall of Chaos quality fixes -- timer cleanup, aria-live, reduced-motion
- onUnmounted clears blooperHoldTimer to prevent stale callback after component teardown - HallOfChaosView loading state gains aria-live="polite" so state transitions are announced to screen readers - CommunityFeedPanel reduced-motion block resets toast translateY offset to avoid flash-of-offset-position on slow paint cycles
This commit is contained in:
parent
9246935fd7
commit
d7bfc083e7
2 changed files with 14 additions and 2 deletions
|
|
@ -116,7 +116,7 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted } from 'vue'
|
||||
import { ref, onMounted, onUnmounted } from 'vue'
|
||||
import { useCommunityStore } from '../stores/community'
|
||||
import CommunityPostCard from './CommunityPostCard.vue'
|
||||
import PublishPlanModal from './PublishPlanModal.vue'
|
||||
|
|
@ -217,6 +217,13 @@ onMounted(async () => {
|
|||
await store.fetchPosts()
|
||||
}
|
||||
})
|
||||
|
||||
onUnmounted(() => {
|
||||
if (blooperHoldTimer !== null) {
|
||||
clearTimeout(blooperHoldTimer)
|
||||
blooperHoldTimer = null
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
|
@ -320,5 +327,10 @@ onMounted(async () => {
|
|||
.toast-fade-leave-active {
|
||||
transition: none;
|
||||
}
|
||||
|
||||
.toast-fade-enter-from,
|
||||
.toast-fade-leave-to {
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@
|
|||
</div>
|
||||
|
||||
<!-- Loading -->
|
||||
<div v-if="loading" class="chaos-loading text-center text-secondary" aria-busy="true">
|
||||
<div v-if="loading" class="chaos-loading text-center text-secondary" aria-live="polite" aria-busy="true">
|
||||
Assembling the chaos...
|
||||
</div>
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue