y2007k/codelockpro-secure-coding-exams
0
1<!DOCTYPE html>2<html lang="en" class="dark">3<head>4 <meta charset="UTF-8">5 <meta name="viewport" content="width=device-width, initial-scale=1.0">6 <title>CodeLock - Secure C Coding Exams</title>7 <script src="https://cdn.tailwindcss.com"></script>8 <script src="https://unpkg.com/feather-icons"></script>9 <script src="https://cdn.jsdelivr.net/npm/vanta@latest/dist/vanta.globe.min.js"></script>10 <style>11 #vanta-bg {12 position: fixed;13 top: 0;14 right: 0;15 bottom: 0;16 left: 0;17 z-index: -1;18 }19 .code-editor {20 font-family: 'Courier New', monospace;21 }22 .gradient-bg {23 background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);24 }25 26 /* Dark mode styles */27 .dark body {28 background-color: #111827;29 color: #f3f4f6;30 }31 .dark nav {32 background-color: #1f2937;33 }34 .dark .bg-white {35 background-color: #1f2937 !important;36 border-color: #374151 !important;37 }38 .dark .text-gray-900 {39 color: #f3f4f6 !important;40 }41 .dark .text-gray-600 {42 color: #d1d5db !important;43 }44 .dark .shadow-md {45 box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.5) !important;46 }47 .dark .bg-gray-50 {48 background-color: #111827 !important;49 }50 </style>51</head>52<body class="bg-gray-50">53 <div id="vanta-bg"></div>54 55 <!-- Navigation -->56 <nav class="bg-white bg-opacity-90 shadow-sm">57 <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">58 <div class="flex justify-between h-16">59 <div class="flex items-center">60 <div class="flex-shrink-0 flex items-center">61 <i data-feather="lock" class="text-indigo-600 h-8 w-8"></i>62 <span class="ml-2 text-xl font-bold text-indigo-600">CodeLock</span>63 </div>64 </div>65 <div class="flex items-center space-x-4">66 <a href="teacher_dashboard.html" class="text-gray-700 hover:text-indigo-600 px-3 py-2 rounded-md text-sm font-medium dark:text-gray-300 dark:hover:text-indigo-400">For Teachers</a>67 <a href="#" class="text-gray-700 hover:text-indigo-600 px-3 py-2 rounded-md text-sm font-medium dark:text-gray-300 dark:hover:text-indigo-400">Documentation</a>68 <a href="teacher_dashboard.html" class="bg-indigo-600 text-white px-4 py-2 rounded-md text-sm font-medium hover:bg-indigo-700 transition">Teacher Login</a>69 <button onclick="toggleDarkMode()" class="p-2 rounded-full hover:bg-gray-200 dark:hover:bg-gray-700 transition">70 <i data-feather="moon" class="dark:hidden"></i>71 <i data-feather="sun" class="hidden dark:block"></i>72 </button>73 </div>74</div>75 </div>76 </nav>77 78 <!-- Hero Section -->79 <div class="relative">80 <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-24 md:py-32">81 <div class="text-center">82 <h1 class="text-4xl md:text-6xl font-extrabold tracking-tight text-gray-900">83 Secure <span class="text-indigo-600">C Coding</span> Exams84 </h1>85 <p class="mt-6 max-w-3xl mx-auto text-xl text-gray-600">86 Anti-cheat programming tests with auto-grading. Perfect for computer science exams.87 </p>88 <div class="mt-10 flex justify-center gap-4">89 <a href="exam.html" class="gradient-bg text-white px-8 py-4 rounded-lg text-lg font-medium shadow-lg hover:shadow-xl transition">Start Exam</a>90<a href="teacher_dashboard.html" class="bg-white dark:bg-gray-800 text-indigo-600 dark:text-indigo-400 px-8 py-4 rounded-lg text-lg font-medium border border-indigo-200 hover:bg-indigo-50 dark:hover:bg-gray-700 transition">Teacher Dashboard</a>91</div>92 </div>93 </div>94 </div>95 96 <!-- Features Section -->97 <div class="bg-white py-16">98 <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">99 <div class="text-center">100 <h2 class="text-3xl font-extrabold text-gray-900">How It Works</h2>101 <p class="mt-4 max-w-3xl mx-auto text-xl text-gray-600">102 From creation to grading - all in one secure platform103 </p>104 </div>105 <div class="mt-16 grid grid-cols-1 gap-8 md:grid-cols-3">106 <!-- Feature 1 -->107 <div class="bg-white p-6 rounded-xl shadow-md border border-gray-100">108 <div class="flex justify-center">109 <div class="gradient-bg p-3 rounded-lg">110 <i data-feather="edit" class="text-white h-6 w-6"></i>111 </div>112 </div>113 <h3 class="mt-4 text-lg font-medium text-center text-gray-900">Create Exams</h3>114 <p class="mt-2 text-gray-600 text-center">115 Teachers build C programming tasks with test cases and time limits116 </p>117 </div>118 <!-- Feature 2 -->119 <div class="bg-white p-6 rounded-xl shadow-md border border-gray-100">120 <div class="flex justify-center">121 <div class="gradient-bg p-3 rounded-lg">122 <i data-feather="code" class="text-white h-6 w-6"></i>123 </div>124 </div>125 <h3 class="mt-4 text-lg font-medium text-center text-gray-900">Secure Coding</h3>126 <p class="mt-2 text-gray-600 text-center">127 Students code in a locked browser with syntax highlighting128 </p>129 </div>130 <!-- Feature 3 -->131 <div class="bg-white p-6 rounded-xl shadow-md border border-gray-100">132 <div class="flex justify-center">133 <div class="gradient-bg p-3 rounded-lg">134 <i data-feather="check-circle" class="text-white h-6 w-6"></i>135 </div>136 </div>137 <h3 class="mt-4 text-lg font-medium text-center text-gray-900">Auto-Grading</h3>138 <p class="mt-2 text-gray-600 text-center">139 Instant results with Docker sandbox execution and plagiarism checks140 </p>141 </div>142 </div>143 </div>144 </div>145 146 <!-- Demo Editor -->147 <div class="bg-gray-50 py-16">148 <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">149 <div class="bg-white rounded-xl shadow-lg overflow-hidden">150 <div class="bg-gray-900 px-4 py-3 flex justify-between items-center">151 <div class="flex space-x-2">152 <div class="h-3 w-3 rounded-full bg-red-500"></div>153 <div class="h-3 w-3 rounded-full bg-yellow-500"></div>154 <div class="h-3 w-3 rounded-full bg-green-500"></div>155 </div>156 <div class="text-sm text-gray-300">main.c</div>157 <div class="h-6 w-6 flex items-center justify-center">158 <i data-feather="maximize-2" class="text-gray-400 h-4 w-4"></i>159 </div>160 </div>161 <div class="p-4">162 <div class="code-editor bg-gray-900 text-gray-200 p-4 rounded-lg overflow-auto">163 <pre class="text-sm"><code class="block whitespace-pre"><span class="text-purple-400">#include</span> <span class="text-yellow-300"><stdio.h></span>164 165<span class="text-blue-400">int</span> <span class="text-green-400">fibonacci</span>(<span class="text-blue-400">int</span> n) {166 <span class="text-blue-400">if</span> (n <= <span class="text-orange-400">1</span>)167 <span class="text-blue-400">return</span> n;168 <span class="text-blue-400">return</span> fibonacci(n-<span class="text-orange-400">1</span>) + fibonacci(n-<span class="text-orange-400">2</span>);169}170 171<span class="text-blue-400">int</span> <span class="text-green-400">main</span>() {172 <span class="text-blue-400">int</span> n;173 printf(<span class="text-yellow-300">"Enter number: "</span>);174 scanf(<span class="text-yellow-300">"%d"</span>, &n);175 printf(<span class="text-yellow-300">"Fibonacci: %d\n"</span>, fibonacci(n));176 <span class="text-blue-400">return</span> <span class="text-orange-400">0</span>;177}</code></pre>178 </div>179 </div>180 <div class="bg-gray-100 px-4 py-3 flex justify-between items-center">181 <div class="text-sm text-gray-600">Compile time: 0.23s | Memory: 1.2MB</div>182 <div class="flex space-x-2">183 <button class="bg-indigo-600 text-white px-4 py-1 rounded text-sm hover:bg-indigo-700 transition">Run Tests</button>184 <button class="bg-green-600 text-white px-4 py-1 rounded text-sm hover:bg-green-700 transition">Submit</button>185 </div>186 </div>187 </div>188 </div>189 </div>190 191 <!-- Testimonials -->192 <div class="bg-white py-16">193 <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">194 <div class="text-center">195 <h2 class="text-3xl font-extrabold text-gray-900">Trusted by Educators</h2>196 </div>197 <div class="mt-12 grid grid-cols-1 gap-8 md:grid-cols-3">198 <!-- Testimonial 1 -->199 <div class="bg-gray-50 p-6 rounded-xl shadow-sm">200 <div class="flex items-center">201 <div class="h-12 w-12 rounded-full bg-indigo-100 flex items-center justify-center">202 <i{"ok":false,"message":"terminated"}203</body>204</html>