Add 2 files

index.html

@@ -15,13 +15,12 @@
             transition: all 0.3s ease;
             max-height: 0;
             overflow: hidden;
+            opacity: 0;
         }
         .hint.active {
             max-height: 200px;
             padding: 0.5rem 0;
-        }
-        input:focus + .hint-container .hint {
-            max-height: 200px;
+            opacity: 1;
         }
         .fade-in {
             animation: fadeIn 0.3s ease-in-out;
@@ -102,16 +101,16 @@
                         </div>
                         
                         <div class="mt-6">
-                            <label for="userAnswer" class="block text-sm font-medium text-gray-700 mb-1">Your Answer</label>
-                            <div class="relative">
-                                <input type="text" id="userAnswer" class="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 pr-10" placeholder="Enter the value of x">
-                                <div class="hint-container absolute right-3 top-1/2 transform -translate-y-1/2">
+                            <div class="flex items-center justify-between mb-1">
+                                <label for="userAnswer" class="block text-sm font-medium text-gray-700">Your Answer</label>
+                                <div class="relative">
                                     <i class="fas fa-lightbulb text-yellow-500 cursor-pointer hint-icon"></i>
-                                    <div class="hint absolute right-0 mt-2 w-64 bg-yellow-50 text-yellow-800 text-sm p-2 rounded-md shadow-lg z-10">
+                                    <div class="hint absolute right-0 top-full mt-1 w-64 bg-yellow-50 text-yellow-800 text-sm p-2 rounded-md shadow-lg z-10">
                                         Enter the numerical value only (e.g. 5 or -3)
                                     </div>
                                 </div>
                             </div>
+                            <input type="text" id="userAnswer" class="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500" placeholder="Enter the value of x">
                         </div>
                         
                         <button id="checkBtn" class="mt-4 w-full bg-green-600 hover:bg-green-700 text-white font-medium py-2 px-4 rounded-md transition duration-150 ease-in-out">
@@ -419,30 +418,16 @@
                 }
             });
             
-            // Show hint when focusing on input
+            // Show hint when hovering over icon
             const hintIcon = document.querySelector('.hint-icon');
             const hint = document.querySelector('.hint');
             
-            userAnswer.addEventListener('focus', function() {
-                hint.classList.add('active');
-            });
-            
-            userAnswer.addEventListener('blur', function() {
-                setTimeout(() => {
-                    if (document.activeElement !== hintIcon) {
-                        hint.classList.remove('active');
-                    }
-                }, 100);
-            });
-            
             hintIcon.addEventListener('mouseenter', function() {
                 hint.classList.add('active');
             });
             
             hintIcon.addEventListener('mouseleave', function() {
-                if (document.activeElement !== userAnswer) {
-                    hint.classList.remove('active');
-                }
+                hint.classList.remove('active');
             });
             
             // Generate first equation on load

prompts.txt

@@ -3,4 +3,5 @@
 генератор примеров линейных уравнений 
 добавь примеры с раскрытием скобок. корни всех примеров должны быть целыми числами
 все ответы во всех уравнениях должны быть целыми числами,
-сделай возможность выбора, чтобы решения были любые или только положительные
+сделай возможность выбора, чтобы решения были любые или только положительные
+кнопка "check answer" перекрывается всплывающей подсказкой, исправь