refactor: Improve voice and response modals UX

- Center both modals with dark backdrop and blur effect
- Make voice modal larger (420px) with bigger record button
- Make response modal larger (540px) with bigger text (18px)
- Remove auto-dismiss from bubbles - manual dismiss only
- Add backdrop click to close response modal
- Remove unused bottom sheet code from FloatingVoice
- Add touch protection CSS to prevent text selection
- Clean up mobile-specific variables no longer needed
This commit is contained in:
2026-02-14 05:07:27 -06:00
parent f9b5ad3db6
commit 2133e2d057
4 changed files with 182 additions and 384 deletions

View File

@@ -308,9 +308,6 @@ onMounted(async () => {
},
getMessages: () => {
return responseRef.value?.getMessages() || []
},
move: (x: number, y: number) => {
responseRef.value?.move(x, y)
}
})
@@ -624,6 +621,11 @@ watch(() => route.name, (newPage) => {
z-index: 9998;
overflow: visible;
backdrop-filter: blur(10px);
/* Prevent text selection and touch gestures */
-webkit-user-select: none;
user-select: none;
-webkit-touch-callout: none;
touch-action: manipulation;
}
.terminal-fab::before {
@@ -976,6 +978,11 @@ watch(() => route.name, (newPage) => {
box-shadow: 0 6px 20px rgba(16, 185, 129, 0.4);
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
z-index: 9998;
/* Prevent text selection and touch gestures */
-webkit-user-select: none;
user-select: none;
-webkit-touch-callout: none;
touch-action: manipulation;
}
.voice-fab:hover {