Hugging Face's logo

Spaces:
akhaliq
/
light-app-78
Running

App Files Community
akhaliq HF Staff commited on
Commit
eb0fac6
·
verified ·
1 Parent(s): ddaf4d6

Upload index.html with huggingface_hub

Browse files
Files changed (1) hide show
  1. index.html +89 -19
index.html CHANGED
@@ -1,19 +1,89 @@
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>Todo App - Stay Organized</title>
7
+ <meta name="description" content="A simple, elegant todo app to keep you organized and productive">
8
+ <link rel="stylesheet" href="assets/css/styles.css">
9
+ </head>
10
+ <body>
11
+ <div class="container">
12
+ <header class="header">
13
+ <h1>Todo App</h1>
14
+ <p>Stay organized and get things done</p>
15
+ <a href="https://huggingface.co/spaces/akhaliq/anycoder" target="_blank" rel="noopener" class="brand-link">Built with anycoder</a>
16
+ </header>
17
+
18
+ <main class="main-content">
19
+ <div class="todo-input-section">
20
+ <form id="todoForm" class="todo-form">
21
+ <div class="input-group">
22
+ <input
23
+ type="text"
24
+ id="todoInput"
25
+ placeholder="What needs to be done?"
26
+ class="todo-input"
27
+ autocomplete="off"
28
+ maxlength="200"
29
+ >
30
+ <button type="submit" class="add-btn" aria-label="Add todo">
31
+ <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
32
+ <line x1="12" y1="5" x2="12" y2="19"></line>
33
+ <line x1="5" y1="12" x2="19" y2="12"></line>
34
+ </svg>
35
+ </button>
36
+ </div>
37
+ </form>
38
+ </div>
39
+
40
+ <div class="todo-stats" id="todoStats">
41
+ <div class="stats-item">
42
+ <span class="stats-label">Total:</span>
43
+ <span class="stats-value" id="totalCount">0</span>
44
+ </div>
45
+ <div class="stats-item">
46
+ <span class="stats-label">Active:</span>
47
+ <span class="stats-value" id="activeCount">0</span>
48
+ </div>
49
+ <div class="stats-item">
50
+ <span class="stats-label">Completed:</span>
51
+ <span class="stats-value" id="completedCount">0</span>
52
+ </div>
53
+ </div>
54
+
55
+ <div class="todo-controls">
56
+ <div class="filter-buttons">
57
+ <button class="filter-btn active" data-filter="all">All</button>
58
+ <button class="filter-btn" data-filter="active">Active</button>
59
+ <button class="filter-btn" data-filter="completed">Completed</button>
60
+ </div>
61
+ <button class="clear-completed-btn" id="clearCompleted" style="display: none;">
62
+ Clear Completed
63
+ </button>
64
+ </div>
65
+
66
+ <div class="todo-list-container">
67
+ <ul class="todo-list" id="todoList">
68
+ <!-- Todo items will be dynamically added here -->
69
+ </ul>
70
+ <div class="empty-state" id="emptyState" style="display: none;">
71
+ <div class="empty-icon">📝</div>
72
+ <h3>No todos yet</h3>
73
+ <p>Add your first todo to get started!</p>
74
+ </div>
75
+ </div>
76
+ </main>
77
+
78
+ <footer class="footer">
79
+ <p>&copy; 2024 Todo App. Stay productive! ✨</p>
80
+ </footer>
81
+ </div>
82
+
83
+ <div class="toast" id="toast">
84
+ <span class="toast-message" id="toastMessage"></span>
85
+ </div>
86
+
87
+ <script src="assets/js/app.js"></script>
88
+ </body>
89
+ </html>