Hugging Face's logo

Spaces:
kasramojallal
/
application-tracker
Running

App Files Community
kasramojallal commited on
Commit
222ca64
·
verified ·
1 Parent(s): 369ca04

Add 3 files

Browse files
Files changed (3) hide show
  1. README.md +7 -5
  2. index.html +219 -19
  3. prompts.txt +0 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Application Tracker
3
- emoji: 🏃
4
- colorFrom: green
5
- colorTo: purple
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: application-tracker
3
+ emoji: 🐳
4
+ colorFrom: blue
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,219 @@
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>Job Application Tracker</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
9
+ <style>
10
+ .fade-in {
11
+ animation: fadeIn 0.3s ease-in-out;
12
+ }
13
+ @keyframes fadeIn {
14
+ from { opacity: 0; transform: translateY(10px); }
15
+ to { opacity: 1; transform: translateY(0); }
16
+ }
17
+ .pulse {
18
+ animation: pulse 2s infinite;
19
+ }
20
+ @keyframes pulse {
21
+ 0% { transform: scale(1); }
22
+ 50% { transform: scale(1.05); }
23
+ 100% { transform: scale(1); }
24
+ }
25
+ </style>
26
+ </head>
27
+ <body class="bg-gradient-to-br from-blue-50 to-indigo-100 min-h-screen">
28
+ <div class="container mx-auto px-4 py-8 max-w-3xl">
29
+ <header class="text-center mb-8">
30
+ <h1 class="text-4xl font-bold text-indigo-800 mb-2">Job Application Tracker</h1>
31
+ <p class="text-indigo-600">Keep track of your job search progress</p>
32
+ </header>
33
+
34
+ <div class="bg-white rounded-xl shadow-lg p-6 mb-8">
35
+ <div class="flex flex-col md:flex-row justify-between items-center mb-6">
36
+ <div class="text-center md:text-left mb-4 md:mb-0">
37
+ <h2 class="text-2xl font-semibold text-gray-800">Today's Applications</h2>
38
+ <p class="text-gray-500" id="today-date">Loading date...</p>
39
+ </div>
40
+ <div class="flex items-center space-x-4">
41
+ <div class="bg-indigo-100 rounded-full p-4">
42
+ <span class="text-3xl font-bold text-indigo-800" id="today-count">0</span>
43
+ </div>
44
+ <button id="add-btn" class="bg-indigo-600 hover:bg-indigo-700 text-white rounded-full w-14 h-14 flex items-center justify-center shadow-md transition-all transform hover:scale-105">
45
+ <i class="fas fa-plus text-2xl"></i>
46
+ </button>
47
+ </div>
48
+ </div>
49
+
50
+ <div class="border-t pt-4">
51
+ <div class="flex justify-between items-center mb-2">
52
+ <h3 class="font-medium text-gray-700">Total Applications</h3>
53
+ <span class="text-xl font-bold text-indigo-800" id="total-count">0</span>
54
+ </div>
55
+ </div>
56
+ </div>
57
+
58
+ <div class="bg-white rounded-xl shadow-lg p-6">
59
+ <div class="flex justify-between items-center mb-4">
60
+ <h2 class="text-2xl font-semibold text-gray-800">Application History</h2>
61
+ <button id="clear-btn" class="text-red-500 hover:text-red-700 flex items-center">
62
+ <i class="fas fa-trash-alt mr-1"></i>
63
+ <span>Clear All</span>
64
+ </button>
65
+ </div>
66
+
67
+ <div id="history-list" class="space-y-3">
68
+ <div class="text-center py-8 text-gray-400" id="empty-state">
69
+ <i class="fas fa-clipboard-list text-4xl mb-2"></i>
70
+ <p>No applications recorded yet</p>
71
+ </div>
72
+ <!-- History items will be added here dynamically -->
73
+ </div>
74
+ </div>
75
+
76
+ <div class="mt-6 text-center text-sm text-gray-500">
77
+ <p>Keep applying! Every application brings you closer to your dream job.</p>
78
+ </div>
79
+ </div>
80
+
81
+ <script>
82
+ document.addEventListener('DOMContentLoaded', function() {
83
+ // Get elements
84
+ const addBtn = document.getElementById('add-btn');
85
+ const todayCountEl = document.getElementById('today-count');
86
+ const totalCountEl = document.getElementById('total-count');
87
+ const historyList = document.getElementById('history-list');
88
+ const emptyState = document.getElementById('empty-state');
89
+ const clearBtn = document.getElementById('clear-btn');
90
+ const todayDateEl = document.getElementById('today-date');
91
+
92
+ // Format today's date
93
+ const today = new Date();
94
+ const formattedDate = today.toLocaleDateString('en-US', {
95
+ weekday: 'long',
96
+ year: 'numeric',
97
+ month: 'long',
98
+ day: 'numeric'
99
+ });
100
+ todayDateEl.textContent = formattedDate;
101
+
102
+ // Initialize data from localStorage or create new
103
+ let appData = JSON.parse(localStorage.getItem('jobAppData')) || {
104
+ total: 0,
105
+ history: []
106
+ };
107
+
108
+ // Check if today's date exists in history
109
+ const todayKey = today.toISOString().split('T')[0];
110
+ let todayEntry = appData.history.find(entry => entry.date === todayKey);
111
+
112
+ if (!todayEntry) {
113
+ todayEntry = { date: todayKey, count: 0 };
114
+ appData.history.unshift(todayEntry);
115
+ saveData();
116
+ }
117
+
118
+ // Update UI
119
+ updateCounts();
120
+ renderHistory();
121
+
122
+ // Add button click handler
123
+ addBtn.addEventListener('click', function() {
124
+ todayEntry.count++;
125
+ appData.total++;
126
+
127
+ // Add animation effect
128
+ this.classList.add('pulse');
129
+ setTimeout(() => this.classList.remove('pulse'), 2000);
130
+
131
+ saveData();
132
+ updateCounts();
133
+ renderHistory();
134
+ });
135
+
136
+ // Clear button click handler
137
+ clearBtn.addEventListener('click', function() {
138
+ if (confirm('Are you sure you want to clear all application history?')) {
139
+ appData = {
140
+ total: 0,
141
+ history: []
142
+ };
143
+ todayEntry = { date: todayKey, count: 0 };
144
+ appData.history.unshift(todayEntry);
145
+
146
+ saveData();
147
+ updateCounts();
148
+ renderHistory();
149
+ }
150
+ });
151
+
152
+ // Update count displays
153
+ function updateCounts() {
154
+ todayCountEl.textContent = todayEntry.count;
155
+ totalCountEl.textContent = appData.total;
156
+
157
+ // Add animation when count changes
158
+ todayCountEl.classList.add('fade-in');
159
+ totalCountEl.classList.add('fade-in');
160
+ setTimeout(() => {
161
+ todayCountEl.classList.remove('fade-in');
162
+ totalCountEl.classList.remove('fade-in');
163
+ }, 300);
164
+ }
165
+
166
+ // Render history list
167
+ function renderHistory() {
168
+ if (appData.history.length === 0 || (appData.history.length === 1 && appData.history[0].count === 0)) {
169
+ emptyState.style.display = 'block';
170
+ return;
171
+ }
172
+
173
+ emptyState.style.display = 'none';
174
+ historyList.innerHTML = '';
175
+
176
+ appData.history.forEach(entry => {
177
+ if (entry.count === 0 && entry.date === todayKey) return;
178
+
179
+ const entryDate = new Date(entry.date);
180
+ const isToday = entry.date === todayKey;
181
+
182
+ const formattedEntryDate = entryDate.toLocaleDateString('en-US', {
183
+ weekday: 'short',
184
+ month: 'short',
185
+ day: 'numeric',
186
+ year: 'numeric'
187
+ });
188
+
189
+ const historyItem = document.createElement('div');
190
+ historyItem.className = 'flex justify-between items-center p-3 bg-gray-50 rounded-lg fade-in';
191
+ if (isToday) {
192
+ historyItem.classList.add('border-l-4', 'border-indigo-500');
193
+ }
194
+
195
+ historyItem.innerHTML = `
196
+ <div class="flex items-center">
197
+ <div class="w-10 h-10 rounded-full bg-indigo-100 flex items-center justify-center mr-3">
198
+ <i class="fas fa-briefcase text-indigo-600"></i>
199
+ </div>
200
+ <div>
201
+ <p class="font-medium ${isToday ? 'text-indigo-800' : 'text-gray-800'}">${formattedEntryDate}</p>
202
+ <p class="text-xs text-gray-500">${isToday ? 'Today' : ''}</p>
203
+ </div>
204
+ </div>
205
+ <span class="text-lg font-bold ${isToday ? 'text-indigo-800' : 'text-gray-700'}">${entry.count}</span>
206
+ `;
207
+
208
+ historyList.appendChild(historyItem);
209
+ });
210
+ }
211
+
212
+ // Save data to localStorage
213
+ function saveData() {
214
+ localStorage.setItem('jobAppData', JSON.stringify(appData));
215
+ }
216
+ });
217
+ </script>
218
+ <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=kasramojallal/application-tracker" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
219
+ </html>
prompts.txt ADDED
File without changes