examproctor-eyetrack / styles.css
Drew4564's picture
can you make the exam page have like this border red because in this app we will have eye tracker use and that red border is the edge and make tghis on exam pc layout
78282a4 verified
/* Base Styles */
body {
font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
-webkit-tap-highlight-color: transparent;
}
/* Custom scrollbar */
::-webkit-scrollbar {
width: 6px;
height: 6px;
}
::-webkit-scrollbar-track {
background: #f1f1f1;
}
::-webkit-scrollbar-thumb {
background: #c1c1c1;
border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
background: #a1a1a1;
}
/* Animation classes */
.fade-in {
animation: fadeIn 0.3s ease-in-out;
}
@keyframes fadeIn {
from { opacity: 0; }
to { opacity: 1; }
}
.slide-up {
animation: slideUp 0.3s ease-out;
}
@keyframes slideUp {
from { transform: translateY(20px); opacity: 0; }
to { transform: translateY(0); opacity: 1; }
}
/* Question styles */
.question-card {
transition: all 0.2s ease;
}
.question-card:hover {
transform: translateY(-2px);
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}
/* Anti-cheat warnings */
.warning-flash {
animation: warningFlash 0.5s ease 3;
}
@keyframes warningFlash {
0%, 100% { background-color: transparent; }
50% { background-color: rgba(239, 68, 68, 0.2); }
}
/* Exam timer urgent state */
.timer-urgent {
animation: pulse 1s infinite;
}
@keyframes pulse {
0%, 100% { opacity: 1; }
50% { opacity: 0.7; }
}