fix: feedback button visibility using inline styles

Root cause: Tailwind arbitrary value z-[9999] was not in compiled CSS
(tailwind.css last modified Oct 9, feedback.js modified Nov 3).

Solution: Use inline styles with !important for all critical properties:
- position: fixed
- bottom/right positioning
- z-index: 999999
- display: flex
- visibility: visible
- opacity: 1

This bypasses Tailwind compilation issues and ensures button is visible.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
TheFlow 2025-11-03 15:39:23 +13:00
parent edac97951d
commit 71689bbe97

View file

@ -65,8 +65,8 @@ class TractausFeedback {
renderFAB() {
const fabHTML = `
<button id="feedback-fab"
class="fixed bottom-6 right-6 z-[9999] bg-gradient-to-r from-blue-600 to-blue-700 text-white p-4 rounded-full shadow-lg hover:shadow-xl hover:scale-110 transition-all duration-200 group flex items-center gap-2"
style="z-index: 9999 !important;"
class="bg-gradient-to-r from-blue-600 to-blue-700 text-white p-4 rounded-full shadow-lg hover:shadow-xl hover:scale-110 transition-all duration-200 group flex items-center gap-2"
style="position: fixed !important; bottom: 1.5rem !important; right: 1.5rem !important; z-index: 999999 !important; display: flex !important; visibility: visible !important; opacity: 1 !important;"
aria-label="Give Feedback"
title="Give Feedback">
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">