adilchbada commited on
Commit
baa3915
·
verified ·
1 Parent(s): 48471b2

improve the ui - Initial Deployment

Browse files
Files changed (3) hide show
  1. README.md +7 -5
  2. index.html +553 -18
  3. prompts.txt +2 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Only A Test
3
- emoji: 📈
4
- colorFrom: purple
5
- colorTo: green
6
  sdk: static
7
  pinned: false
 
 
8
  ---
9
 
10
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
1
  ---
2
+ title: only-a-test
3
+ emoji: 🐳
4
+ colorFrom: yellow
5
+ colorTo: gray
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite
10
  ---
11
 
12
+ Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
index.html CHANGED
@@ -1,19 +1,554 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
19
  </html>
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Sudoku Master</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">
9
+ <script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
10
+ <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
11
+ <script src="https://unpkg.com/feather-icons"></script>
12
+ <style>
13
+ .sudoku-cell {
14
+ width: 100%;
15
+ height: 100%;
16
+ text-align: center;
17
+ font-size: 1.5rem;
18
+ font-weight: bold;
19
+ border: none;
20
+ outline: none;
21
+ background-color: white;
22
+ transition: all 0.2s ease;
23
+ }
24
+ .sudoku-cell:focus {
25
+ background-color: rgba(59, 130, 246, 0.1);
26
+ box-shadow: inset 0 0 0 2px #3b82f6;
27
+ z-index: 10;
28
+ }
29
+ .sudoku-grid {
30
+ display: grid;
31
+ grid-template-columns: repeat(9, 1fr);
32
+ grid-template-rows: repeat(9, 1fr);
33
+ gap: 1px;
34
+ width: 450px;
35
+ height: 450px;
36
+ border: 2px solid #1e40af;
37
+ }
38
+ .sudoku-cell:nth-child(3n) {
39
+ border-right: 3px solid #1e40af;
40
+ }
41
+ .sudoku-cell:nth-child(9n) {
42
+ border-right: none;
43
+ }
44
+ .sudoku-row:nth-child(3n) {
45
+ border-bottom: 3px solid #1e40af;
46
+ }
47
+ .sudoku-row:last-child {
48
+ border-bottom: none;
49
+ }
50
+ .fixed-number {
51
+ color: #1e40af;
52
+ font-weight: 800;
53
+ }
54
+ .error {
55
+ color: #ef4444;
56
+ background-color: #fee2e2;
57
+ animation: shake 0.5s;
58
+ }
59
+
60
+ @keyframes shake {
61
+ 0%, 100% { transform: translateX(0); }
62
+ 25% { transform: translateX(-5px); }
63
+ 75% { transform: translateX(5px); }
64
+ }
65
+ @media (max-width: 640px) {
66
+ .sudoku-grid {
67
+ width: 90vw;
68
+ height: 90vw;
69
+ }
70
+ .sudoku-cell {
71
+ font-size: 1rem;
72
+ }
73
+ }
74
+ </style>
75
+ </head>
76
+ <body class="bg-gradient-to-br from-blue-50 to-indigo-50 min-h-screen flex flex-col items-center justify-center p-4">
77
+ <div class="max-w-4xl w-full">
78
+ <header class="text-center mb-8" data-aos="fade-down">
79
+ <h1 class="text-5xl font-bold bg-gradient-to-r from-blue-600 to-indigo-600 bg-clip-text text-transparent mb-2">Sudoku Master</h1>
80
+ <p class="text-gray-600 text-lg">Challenge your mind with this classic puzzle game</p>
81
+ </header>
82
+
83
+ <div class="flex flex-col lg:flex-row items-center justify-center gap-8">
84
+ <div class="bg-white rounded-2xl shadow-2xl p-6 border-2 border-blue-100" data-aos="zoom-in">
85
+ <div class="sudoku-grid bg-gray-200">
86
+ <!-- Sudoku grid will be generated by JavaScript -->
87
+ </div>
88
+ </div>
89
+
90
+ <div class="bg-white rounded-2xl shadow-2xl p-8 w-full max-w-md border-2 border-blue-100" data-aos="fade-left">
91
+ <div class="flex justify-between items-center mb-6">
92
+ <div>
93
+ <h2 class="text-xl font-semibold text-gray-800">Game Controls</h2>
94
+ <p class="text-gray-500 text-sm">Difficulty: <span id="difficulty-level" class="font-medium">Medium</span></p>
95
+ </div>
96
+ <div class="flex items-center space-x-2">
97
+ <span id="timer" class="text-lg font-mono bg-gray-100 px-3 py-1 rounded">00:00</span>
98
+ <button id="pause-btn" class="p-2 rounded-full bg-gray-100 hover:bg-gray-200">
99
+ <i data-feather="pause"></i>
100
+ </button>
101
+ </div>
102
+ </div>
103
+
104
+ <div class="grid grid-cols-3 gap-3 mb-6">
105
+ <button id="easy-btn" class="btn-difficulty py-3 px-4 rounded-xl bg-green-50 text-green-700 hover:bg-green-100 border-2 border-green-200 font-medium transition-all" data-level="easy">Easy</button>
106
+ <button id="medium-btn" class="btn-difficulty py-3 px-4 rounded-xl bg-blue-50 text-blue-700 hover:bg-blue-100 border-2 border-blue-200 font-medium transition-all" data-level="medium">Medium</button>
107
+ <button id="hard-btn" class="btn-difficulty py-3 px-4 rounded-xl bg-red-50 text-red-700 hover:bg-red-100 border-2 border-red-200 font-medium transition-all" data-level="hard">Hard</button>
108
+ </div>
109
+
110
+ <div class="grid grid-cols-3 gap-3 mb-6">
111
+ <button id="new-game-btn" class="col-span-2 py-3 px-6 rounded-xl bg-indigo-600 hover:bg-indigo-700 text-white flex items-center justify-center shadow-md hover:shadow-lg transition-all">
112
+ <i data-feather="refresh-cw" class="mr-2"></i> New Game
113
+ </button>
114
+ <button id="hint-btn" class="py-3 px-6 rounded-xl bg-amber-500 hover:bg-amber-600 text-white flex items-center justify-center shadow-md hover:shadow-lg transition-all">
115
+ <i data-feather="help-circle" class="mr-2"></i> Hint
116
+ </button>
117
+ </div>
118
+
119
+ <div class="grid grid-cols-2 gap-3">
120
+ <button id="check-btn" class="py-3 px-6 rounded-xl bg-gray-800 hover:bg-gray-900 text-white flex items-center justify-center shadow-md hover:shadow-lg transition-all">
121
+ <i data-feather="check" class="mr-2"></i> Check
122
+ </button>
123
+ <button id="solve-btn" class="py-3 px-6 rounded-xl bg-purple-600 hover:bg-purple-700 text-white flex items-center justify-center shadow-md hover:shadow-lg transition-all">
124
+ <i data-feather="eye" class="mr-2"></i> Solution
125
+ </button>
126
+ </div>
127
+ </div>
128
+ </div>
129
+
130
+ <div class="mt-8 text-center text-gray-500 text-sm" data-aos="fade-up">
131
+ <p>Use numbers 1-9 to fill the grid. Each row, column, and 3x3 box must contain all digits from 1 to 9.</p>
132
+ </div>
133
+ </div>
134
+
135
+ <script>
136
+ // Initialize AOS animations
137
+ AOS.init({
138
+ duration: 800,
139
+ once: true
140
+ });
141
+
142
+ // Initialize feather icons
143
+ feather.replace();
144
+
145
+ // Sudoku game logic
146
+ document.addEventListener('DOMContentLoaded', function() {
147
+ const sudokuGrid = document.querySelector('.sudoku-grid');
148
+ const newGameBtn = document.getElementById('new-game-btn');
149
+ const hintBtn = document.getElementById('hint-btn');
150
+ const checkBtn = document.getElementById('check-btn');
151
+ const solveBtn = document.getElementById('solve-btn');
152
+ const difficultyBtns = document.querySelectorAll('.btn-difficulty');
153
+ const difficultyLevel = document.getElementById('difficulty-level');
154
+ const timerElement = document.getElementById('timer');
155
+ const pauseBtn = document.getElementById('pause-btn');
156
+
157
+ let board = Array(9).fill().map(() => Array(9).fill(0));
158
+ let solution = Array(9).fill().map(() => Array(9).fill(0));
159
+ let fixedCells = Array(9).fill().map(() => Array(9).fill(false));
160
+ let selectedCell = null;
161
+ let timerInterval;
162
+ let seconds = 0;
163
+ let isPaused = false;
164
+ let currentDifficulty = 'medium';
165
+
166
+ // Initialize the game
167
+ function initGame() {
168
+ createGrid();
169
+ generatePuzzle(currentDifficulty);
170
+ startTimer();
171
+ addEventListeners();
172
+ }
173
+
174
+ // Create the Sudoku grid
175
+ function createGrid() {
176
+ sudokuGrid.innerHTML = '';
177
+ for (let i = 0; i < 9; i++) {
178
+ for (let j = 0; j < 9; j++) {
179
+ const cell = document.createElement('input');
180
+ cell.type = 'text';
181
+ cell.maxLength = 1;
182
+ cell.className = 'sudoku-cell';
183
+ cell.dataset.row = i;
184
+ cell.dataset.col = j;
185
+ sudokuGrid.appendChild(cell);
186
+ }
187
+ }
188
+ }
189
+
190
+ // Generate a Sudoku puzzle
191
+ function generatePuzzle(difficulty) {
192
+ // Reset the board
193
+ board = Array(9).fill().map(() => Array(9).fill(0));
194
+ fixedCells = Array(9).fill().map(() => Array(9).fill(false));
195
+
196
+ // Generate a complete solution
197
+ generateSolution(0, 0);
198
+ solution = JSON.parse(JSON.stringify(board));
199
+
200
+ // Remove numbers based on difficulty
201
+ let cellsToRemove;
202
+ switch(difficulty) {
203
+ case 'easy':
204
+ cellsToRemove = 40;
205
+ break;
206
+ case 'hard':
207
+ cellsToRemove = 60;
208
+ break;
209
+ default: // medium
210
+ cellsToRemove = 50;
211
+ }
212
+
213
+ // Remove numbers while keeping the puzzle solvable
214
+ let cellsRemoved = 0;
215
+ while (cellsRemoved < cellsToRemove) {
216
+ const row = Math.floor(Math.random() * 9);
217
+ const col = Math.floor(Math.random() * 9);
218
+
219
+ if (board[row][col] !== 0) {
220
+ const temp = board[row][col];
221
+ board[row][col] = 0;
222
+
223
+ // Check if the puzzle still has a unique solution
224
+ const tempBoard = JSON.parse(JSON.stringify(board));
225
+ if (solveSudoku(tempBoard)) {
226
+ cellsRemoved++;
227
+ } else {
228
+ board[row][col] = temp;
229
+ }
230
+ }
231
+ }
232
+
233
+ // Mark fixed cells and update the UI
234
+ updateUI();
235
+ }
236
+
237
+ // Generate a complete Sudoku solution
238
+ function generateSolution(row, col) {
239
+ if (row === 9) {
240
+ return true;
241
+ }
242
+
243
+ if (col === 9) {
244
+ return generateSolution(row + 1, 0);
245
+ }
246
+
247
+ if (board[row][col] !== 0) {
248
+ return generateSolution(row, col + 1);
249
+ }
250
+
251
+ const nums = [1, 2, 3, 4, 5, 6, 7, 8, 9];
252
+ shuffleArray(nums);
253
+
254
+ for (let num of nums) {
255
+ if (isValidPlacement(row, col, num)) {
256
+ board[row][col] = num;
257
+
258
+ if (generateSolution(row, col + 1)) {
259
+ return true;
260
+ }
261
+
262
+ board[row][col] = 0;
263
+ }
264
+ }
265
+
266
+ return false;
267
+ }
268
+
269
+ // Shuffle an array
270
+ function shuffleArray(array) {
271
+ for (let i = array.length - 1; i > 0; i--) {
272
+ const j = Math.floor(Math.random() * (i + 1));
273
+ [array[i], array[j]] = [array[j], array[i]];
274
+ }
275
+ return array;
276
+ }
277
+
278
+ // Check if a number can be placed in a cell
279
+ function isValidPlacement(row, col, num) {
280
+ // Check row
281
+ for (let i = 0; i < 9; i++) {
282
+ if (board[row][i] === num) return false;
283
+ }
284
+
285
+ // Check column
286
+ for (let i = 0; i < 9; i++) {
287
+ if (board[i][col] === num) return false;
288
+ }
289
+
290
+ // Check 3x3 box
291
+ const boxRow = Math.floor(row / 3) * 3;
292
+ const boxCol = Math.floor(col / 3) * 3;
293
+
294
+ for (let i = 0; i < 3; i++) {
295
+ for (let j = 0; j < 3; j++) {
296
+ if (board[boxRow + i][boxCol + j] === num) return false;
297
+ }
298
+ }
299
+
300
+ return true;
301
+ }
302
+
303
+ // Update the UI based on the current board state
304
+ function updateUI() {
305
+ const cells = document.querySelectorAll('.sudoku-cell');
306
+ cells.forEach(cell => {
307
+ const row = parseInt(cell.dataset.row);
308
+ const col = parseInt(cell.dataset.col);
309
+
310
+ if (board[row][col] !== 0) {
311
+ cell.value = board[row][col];
312
+ if (fixedCells[row][col]) {
313
+ cell.classList.add('fixed-number');
314
+ cell.readOnly = true;
315
+ } else {
316
+ cell.classList.remove('fixed-number');
317
+ cell.readOnly = false;
318
+ }
319
+ } else {
320
+ cell.value = '';
321
+ cell.classList.remove('fixed-number');
322
+ cell.readOnly = false;
323
+ }
324
+
325
+ cell.classList.remove('error');
326
+ });
327
+ }
328
+
329
+ // Solve the Sudoku puzzle
330
+ function solveSudoku(grid) {
331
+ for (let row = 0; row < 9; row++) {
332
+ for (let col = 0; col < 9; col++) {
333
+ if (grid[row][col] === 0) {
334
+ for (let num = 1; num <= 9; num++) {
335
+ if (isValidPlacementForGrid(grid, row, col, num)) {
336
+ grid[row][col] = num;
337
+ if (solveSudoku(grid)) {
338
+ return true;
339
+ }
340
+ grid[row][col] = 0;
341
+ }
342
+ }
343
+ return false;
344
+ }
345
+ }
346
+ }
347
+ return true;
348
+ }
349
+
350
+ // Check if a number can be placed in a cell for a given grid
351
+ function isValidPlacementForGrid(grid, row, col, num) {
352
+ // Check row
353
+ for (let i = 0; i < 9; i++) {
354
+ if (grid[row][i] === num) return false;
355
+ }
356
+
357
+ // Check column
358
+ for (let i = 0; i < 9; i++) {
359
+ if (grid[i][col] === num) return false;
360
+ }
361
+
362
+ // Check 3x3 box
363
+ const boxRow = Math.floor(row / 3) * 3;
364
+ const boxCol = Math.floor(col / 3) * 3;
365
+
366
+ for (let i = 0; i < 3; i++) {
367
+ for (let j = 0; j < 3; j++) {
368
+ if (grid[boxRow + i][boxCol + j] === num) return false;
369
+ }
370
+ }
371
+
372
+ return true;
373
+ }
374
+
375
+ // Start the game timer
376
+ function startTimer() {
377
+ clearInterval(timerInterval);
378
+ seconds = 0;
379
+ updateTimerDisplay();
380
+ timerInterval = setInterval(() => {
381
+ if (!isPaused) {
382
+ seconds++;
383
+ updateTimerDisplay();
384
+ }
385
+ }, 1000);
386
+ }
387
+
388
+ // Update the timer display
389
+ function updateTimerDisplay() {
390
+ const minutes = Math.floor(seconds / 60);
391
+ const remainingSeconds = seconds % 60;
392
+ timerElement.textContent = `${minutes.toString().padStart(2, '0')}:${remainingSeconds.toString().padStart(2, '0')}`;
393
+ }
394
+
395
+ // Add event listeners
396
+ function addEventListeners() {
397
+ // Cell input
398
+ const cells = document.querySelectorAll('.sudoku-cell');
399
+ cells.forEach(cell => {
400
+ cell.addEventListener('input', function(e) {
401
+ const row = parseInt(this.dataset.row);
402
+ const col = parseInt(this.dataset.col);
403
+ const value = parseInt(this.value) || 0;
404
+
405
+ if (value >= 1 && value <= 9) {
406
+ board[row][col] = value;
407
+ this.classList.remove('error');
408
+ } else if (this.value === '') {
409
+ board[row][col] = 0;
410
+ this.classList.remove('error');
411
+ } else {
412
+ this.value = '';
413
+ }
414
+ });
415
+
416
+ cell.addEventListener('click', function() {
417
+ cells.forEach(c => c.classList.remove('bg-blue-100'));
418
+ this.classList.add('bg-blue-100');
419
+ selectedCell = this;
420
+ });
421
+
422
+ cell.addEventListener('keydown', function(e) {
423
+ if (e.key === 'ArrowUp' || e.key === 'ArrowDown' ||
424
+ e.key === 'ArrowLeft' || e.key === 'ArrowRight') {
425
+ e.preventDefault();
426
+ moveSelection(e.key);
427
+ }
428
+ });
429
+ });
430
+
431
+ // Keyboard number input
432
+ document.addEventListener('keydown', function(e) {
433
+ if (selectedCell && !selectedCell.readOnly && e.key >= '1' && e.key <= '9') {
434
+ selectedCell.value = e.key;
435
+ const row = parseInt(selectedCell.dataset.row);
436
+ const col = parseInt(selectedCell.dataset.col);
437
+ board[row][col] = parseInt(e.key);
438
+ selectedCell.classList.remove('error');
439
+ } else if (selectedCell && e.key === 'Backspace') {
440
+ selectedCell.value = '';
441
+ const row = parseInt(selectedCell.dataset.row);
442
+ const col = parseInt(selectedCell.dataset.col);
443
+ board[row][col] = 0;
444
+ selectedCell.classList.remove('error');
445
+ }
446
+ });
447
+
448
+ // New game button
449
+ newGameBtn.addEventListener('click', function() {
450
+ generatePuzzle(currentDifficulty);
451
+ startTimer();
452
+ });
453
+
454
+ // Hint button
455
+ hintBtn.addEventListener('click', function() {
456
+ if (selectedCell && selectedCell.value === '') {
457
+ const row = parseInt(selectedCell.dataset.row);
458
+ const col = parseInt(selectedCell.dataset.col);
459
+ selectedCell.value = solution[row][col];
460
+ board[row][col] = solution[row][col];
461
+ selectedCell.classList.add('fixed-number');
462
+ selectedCell.readOnly = true;
463
+ fixedCells[row][col] = true;
464
+ }
465
+ });
466
+
467
+ // Check button
468
+ checkBtn.addEventListener('click', function() {
469
+ const cells = document.querySelectorAll('.sudoku-cell');
470
+ let hasErrors = false;
471
+
472
+ cells.forEach(cell => {
473
+ if (!cell.readOnly && cell.value !== '') {
474
+ const row = parseInt(cell.dataset.row);
475
+ const col = parseInt(cell.dataset.col);
476
+ if (parseInt(cell.value) !== solution[row][col]) {
477
+ cell.classList.add('error');
478
+ hasErrors = true;
479
+ } else {
480
+ cell.classList.remove('error');
481
+ }
482
+ }
483
+ });
484
+
485
+ if (!hasErrors) {
486
+ alert('Congratulations! Your solution is correct!');
487
+ }
488
+ });
489
+
490
+ // Solve button
491
+ solveBtn.addEventListener('click', function() {
492
+ if (confirm('Are you sure you want to see the solution?')) {
493
+ board = JSON.parse(JSON.stringify(solution));
494
+ updateUI();
495
+ clearInterval(timerInterval);
496
+ }
497
+ });
498
+
499
+ // Difficulty buttons
500
+ difficultyBtns.forEach(btn => {
501
+ btn.addEventListener('click', function() {
502
+ currentDifficulty = this.dataset.level;
503
+ difficultyLevel.textContent = this.dataset.level.charAt(0).toUpperCase() + this.dataset.level.slice(1);
504
+ difficultyBtns.forEach(b => b.classList.remove('ring-2', 'ring-offset-2', 'ring-blue-500'));
505
+ this.classList.add('ring-2', 'ring-offset-2', 'ring-blue-500');
506
+ generatePuzzle(currentDifficulty);
507
+ startTimer();
508
+ });
509
+ });
510
+
511
+ // Pause button
512
+ pauseBtn.addEventListener('click', function() {
513
+ isPaused = !isPaused;
514
+ if (isPaused) {
515
+ this.innerHTML = feather.icons['play'].toSvg();
516
+ } else {
517
+ this.innerHTML = feather.icons['pause'].toSvg();
518
+ }
519
+ });
520
+ }
521
+
522
+ // Move selection with arrow keys
523
+ function moveSelection(direction) {
524
+ if (!selectedCell) return;
525
+
526
+ const row = parseInt(selectedCell.dataset.row);
527
+ const col = parseInt(selectedCell.dataset.col);
528
+ let newRow = row;
529
+ let newCol = col;
530
+
531
+ switch(direction) {
532
+ case 'ArrowUp': newRow = Math.max(0, row - 1); break;
533
+ case 'ArrowDown': newRow = Math.min(8, row + 1); break;
534
+ case 'ArrowLeft': newCol = Math.max(0, col - 1); break;
535
+ case 'ArrowRight': newCol = Math.min(8, col + 1); break;
536
+ }
537
+
538
+ if (newRow !== row || newCol !== col) {
539
+ const cells = document.querySelectorAll('.sudoku-cell');
540
+ cells.forEach(c => c.classList.remove('bg-blue-100'));
541
+
542
+ const newCell = document.querySelector(`.sudoku-cell[data-row="${newRow}"][data-col="${newCol}"]`);
543
+ newCell.classList.add('bg-blue-100');
544
+ newCell.focus();
545
+ selectedCell = newCell;
546
+ }
547
+ }
548
+
549
+ // Start the game
550
+ initGame();
551
+ });
552
+ </script>
553
+ </body>
554
  </html>
prompts.txt ADDED
@@ -0,0 +1,2 @@
 
 
 
1
+ sudoku game
2
+ improve the ui