Hugging Face's logo

Spaces:
WebashalarForML
/
ResumeExtractor2
Running

App Files Community
WebashalarForML commited on
Commit
d141fbc
•
1 Parent(s): 66a15df

Update templates/result.html

Browse files
Files changed (1) hide show
  1. templates/result.html +142 -33
templates/result.html CHANGED
@@ -17,7 +17,11 @@
17
  color: #e5e5e7;
18
  text-align: center;
19
  }
20
-
 
 
 
 
21
  .cont {
22
  background-color: #2c2c2e;
23
  padding: 30px;
@@ -25,6 +29,13 @@
25
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.5);
26
  transition: 1s ease;
27
  }
 
 
 
 
 
 
 
28
 
29
  .section-title {
30
  color: #ff9f0a;
@@ -124,18 +135,68 @@
124
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
125
  transition: background-color 0.3s ease;
126
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
127
  </style>
128
  </head>
129
 
130
  <body>
131
- <div class="container">
132
- {% with messages = get_flashed_messages() %} {% if messages %}
133
  <div class="alert alert-success mt-4 " id="flash-message">
134
  {{ messages[0] }}
135
  </div>
136
- {% endif %} {% endwith %}
137
- <div class="container cont mt-5">
138
- {% if parsed_data %}
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
139
  <div class="d-flex align-items-center justify-content-between">
140
  <h1>Processed Data</h1>
141
  <!-- Reset Button -->
@@ -146,32 +207,12 @@
146
 
147
  <!-- PDF and Personal Information Section -->
148
  <section>
149
- <h3 class="section-title">Personal Information</h3>
150
  <div class="row">
151
- <!-- PDF Viewer Column -->
152
- <div class="col-md-6 file-container">
153
- {% if file_extension %}
154
- {% if file_extension in ['pdf'] %}
155
- <!-- Display PDF in an iframe -->
156
- <iframe src="{{ file_path }}" title="PDF Viewer" class="file-viewer"></iframe>
157
- {% elif file_extension in ['png', 'jpg', 'jpeg'] %}
158
- <!-- Display Image -->
159
- <img src="{{ file_url }}" alt="Processed Image" class="img-fluid file-viewer" />
160
- {% elif file_extension in ['docx', 'rsf', 'odt'] %}
161
- <!-- Provide Download Link for Non-Viewable Files -->
162
- <a href="{{ file_url }}" class="btn btn-primary" download>Download {{ file_extension | upper }}
163
- File</a>
164
- {% else %}
165
- <p>Can't Display This File Type.</p>
166
- {% endif %}
167
- {% else %}
168
- <p>No file uploaded or processed.</p>
169
- {% endif %}
170
- </div>
171
-
172
  <!-- Personal Information Column -->
173
 
174
- <div class="col-md-6">
 
175
  {% if parsed_data %}
176
  <div class="card">
177
  <div class="card-body">
@@ -241,6 +282,73 @@
241
  </div>
242
  {% endif %}
243
  </div>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
244
  </div>
245
  </section>
246
 
@@ -250,7 +358,7 @@
250
  <div class="row">
251
  <!-- Technical Skills -->
252
  {% if parsed_data.professional.technical_skills != 'Not found' %}
253
- <div class="col-md-6 col-lg-4 mb-4">
254
  <div class="card">
255
  <div class="card-body">
256
  <h5 class="card-title">Technical Skills:</h5>
@@ -271,7 +379,7 @@
271
  {% endif %}
272
  <!-- Tools -->
273
  {% if parsed_data.professional.tools != 'Not found' %}
274
- <div class="col-md-6 col-lg-4 mb-4">
275
  <div class="card">
276
  <div class="card-body">
277
  <h5 class="card-title">Tools:</h5>
@@ -291,7 +399,7 @@
291
  {% endif %}
292
  <!-- Soft Skills -->
293
  {% if parsed_data.professional.non_technical_skills != 'Not found' %}
294
- <div class="col-md-6 col-lg-4 mb-4">
295
  <div class="card">
296
  <div class="card-body">
297
  <h5 class="card-title">Soft Skills:</h5>
@@ -434,13 +542,14 @@
434
  {% else %}
435
  <p>No data available. Please process a file.</p>
436
  {% endif %}
 
437
  </div>
438
  </div>
439
 
440
  <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
441
  <script>
442
  setTimeout(function () {
443
- let flashMessage = document.getElementById("flash-message");
444
  if (flashMessage) {
445
  flashMessage.style.transition = "opacity 1s ease";
446
  flashMessage.style.opacity = 0;
 
17
  color: #e5e5e7;
18
  text-align: center;
19
  }
20
+ .container{
21
+ max-width: 1600px !important;
22
+ height: 100vh;
23
+ display: flex;
24
+ }
25
  .cont {
26
  background-color: #2c2c2e;
27
  padding: 30px;
 
29
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.5);
30
  transition: 1s ease;
31
  }
32
+ .file-container,
33
+ .processed-container {
34
+ flex: 1; /* Equal flex for both sections */
35
+ overflow-y: auto; /* Allow vertical scrolling */
36
+ height: 100%; /* Full height within the container */
37
+ padding: 15px;
38
+ }
39
 
40
  .section-title {
41
  color: #ff9f0a;
 
135
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
136
  transition: background-color 0.3s ease;
137
  }
138
+ .file-container::-webkit-scrollbar,
139
+ .processed-container::-webkit-scrollbar {
140
+ width: 10px; /* Width of the scrollbar */
141
+ }
142
+
143
+ .file-container::-webkit-scrollbar-track,
144
+ .processed-container::-webkit-scrollbar-track {
145
+ background-color: #3a3a3c; /* Track color */
146
+ border-radius: 10px;
147
+ }
148
+
149
+ .file-container::-webkit-scrollbar-thumb,
150
+ .processed-container::-webkit-scrollbar-thumb {
151
+ background-color: #ff9d0a57; /* Thumb (handle) color */
152
+ border-radius: 10px; /* Rounded edges for the scrollbar */
153
+ border: 2px solid #3a3a3c; /* Adds space around the scrollbar thumb */
154
+ }
155
+
156
+ .file-container::-webkit-scrollbar-thumb:hover,
157
+ .processed-container::-webkit-scrollbar-thumb:hover {
158
+ background-color: #ff7f0a; /* Darker shade on hover */
159
+ }
160
+
161
+ .file-container::-webkit-scrollbar-thumb:active,
162
+ .processed-container::-webkit-scrollbar-thumb:active {
163
+ background-color: #ff5f00; /* Even darker shade when active */
164
+ }
165
  </style>
166
  </head>
167
 
168
  <body>
169
+ <div class="container d-flex">
170
+ {% with messages = get_flashed_messages() %} {% if messages %}
171
  <div class="alert alert-success mt-4 " id="flash-message">
172
  {{ messages[0] }}
173
  </div>
174
+ {% endif %} {% endwith %}
175
+
176
+ <div class="col-md-6 file-container cont">
177
+ <h3 class="section-title">Uploaded File:</h3>
178
+ {% if file_extension %}
179
+ {% if file_extension in ['pdf'] %}
180
+ <!-- Display PDF in an iframe -->
181
+ <iframe src="{{ file_path }}" title="PDF Viewer" class="file-viewer"></iframe>
182
+ {% elif file_extension in ['png', 'jpg', 'jpeg'] %}
183
+ <!-- Display Image -->
184
+ <img src="{{ file_url }}" alt="Processed Image" class="img-fluid file-viewer" />
185
+ {% elif file_extension in ['docx', 'rsf', 'odt'] %}
186
+ <!-- Provide Download Link for Non-Viewable Files -->
187
+ <a href="{{ file_url }}" class="btn btn-primary" download>Download {{ file_extension | upper }}
188
+ File</a>
189
+ {% else %}
190
+ <p>Can't Display This File Type.</p>
191
+ {% endif %}
192
+ {% else %}
193
+ <p>No file uploaded or processed.</p>
194
+ {% endif %}
195
+ <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Molestias velit praesentium quibusdam quasi asperiores nobis corrupti accusamus? Recusandae beatae voluptas nostrum minima, enim qui fugiat aut illo quam quod omnis tempora harum incidunt laborum error voluptates ducimus. Nesciunt dolores sapiente, aut deserunt iste nihil asperiores obcaecati dicta? Accusamus dolor odit dolorum dolores consequuntur id? Deserunt minus dolore veritatis molestias, voluptate similique, autem dolorum temporibus consequuntur velit vero perferendis praesentium ex sed! Sapiente blanditiis labore pariatur minima quod? Blanditiis iste laborum, asperiores voluptas amet quis recusandae aliquid praesentium a facere harum ad delectus quo ex ullam! Modi illo temporibus recusandae optio!</p>
196
+ </div>
197
+ <div class="col-md-6 processed-container cont ">
198
+ <div>
199
+ <!-- {% if parsed_data %} -->
200
  <div class="d-flex align-items-center justify-content-between">
201
  <h1>Processed Data</h1>
202
  <!-- Reset Button -->
 
207
 
208
  <!-- PDF and Personal Information Section -->
209
  <section>
210
+ <!-- <h3 class="section-title">Personal Information</h3> -->
211
  <div class="row">
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
212
  <!-- Personal Information Column -->
213
 
214
+ <div class="col-md-12">
215
+ <h3 class="section-title">Personal Information</h3>
216
  {% if parsed_data %}
217
  <div class="card">
218
  <div class="card-body">
 
282
  </div>
283
  {% endif %}
284
  </div>
285
+
286
+ </div>
287
+ <h3 class="section-title">Professional Information</h3>
288
+ <div class="row">
289
+ <!-- Technical Skills -->
290
+ {% if parsed_data.professional.technical_skills != 'Not found' %}
291
+ <div class="col-md-6 col-lg-4 mb-4">
292
+ <div class="card">
293
+ <div class="card-body">
294
+ <h5 class="card-title">Technical Skills:</h5>
295
+ {% if parsed_data.professional.technical_skills and
296
+ parsed_data.professional.technical_skills is iterable and
297
+ parsed_data.professional.technical_skills is not string %}
298
+ <ul>
299
+ {% for skill in parsed_data.professional.technical_skills %}
300
+ <li>{{ skill }}</li>
301
+ {% endfor %}
302
+ </ul>
303
+ {% else %}
304
+ <p>No technical skills found</p>
305
+ {% endif %}
306
+ </div>
307
+ </div>
308
+ </div>
309
+ {% endif %}
310
+ <!-- Tools -->
311
+ {% if parsed_data.professional.tools != 'Not found' %}
312
+ <div class="col-md-6 col-lg-4 mb-4">
313
+ <div class="card">
314
+ <div class="card-body">
315
+ <h5 class="card-title">Tools:</h5>
316
+ {% if parsed_data.professional.tools and parsed_data.professional.tools is iterable and
317
+ parsed_data.professional.tools is not string %}
318
+ <ul>
319
+ {% for tool in parsed_data.professional.tools %}
320
+ <li>{{ tool }}</li>
321
+ {% endfor %}
322
+ </ul>
323
+ {% else %}
324
+ <p>No tools found</p>
325
+ {% endif %}
326
+ </div>
327
+ </div>
328
+ </div>
329
+ {% endif %}
330
+ <!-- Soft Skills -->
331
+ {% if parsed_data.professional.non_technical_skills != 'Not found' %}
332
+ <div class="col-md-6 col-lg-4 mb-4">
333
+ <div class="card">
334
+ <div class="card-body">
335
+ <h5 class="card-title">Soft Skills:</h5>
336
+ {% if parsed_data.professional.non_technical_skills and
337
+ parsed_data.professional.non_technical_skills is iterable and
338
+ parsed_data.professional.non_technical_skills is not string %}
339
+ <ul>
340
+ {% for skill in parsed_data.professional.non_technical_skills
341
+ %}
342
+ <li>{{ skill }}</li>
343
+ {% endfor %}
344
+ </ul>
345
+ {% else %}
346
+ <p>No soft skills found</p>
347
+ {% endif %}
348
+ </div>
349
+ </div>
350
+ </div>
351
+ {% endif %}
352
  </div>
353
  </section>
354
 
 
358
  <div class="row">
359
  <!-- Technical Skills -->
360
  {% if parsed_data.professional.technical_skills != 'Not found' %}
361
+ <div class="col-md-12 mb-4">
362
  <div class="card">
363
  <div class="card-body">
364
  <h5 class="card-title">Technical Skills:</h5>
 
379
  {% endif %}
380
  <!-- Tools -->
381
  {% if parsed_data.professional.tools != 'Not found' %}
382
+ <div class="col-md-12 mb-4">
383
  <div class="card">
384
  <div class="card-body">
385
  <h5 class="card-title">Tools:</h5>
 
399
  {% endif %}
400
  <!-- Soft Skills -->
401
  {% if parsed_data.professional.non_technical_skills != 'Not found' %}
402
+ <div class="col-md-12 mb-4">
403
  <div class="card">
404
  <div class="card-body">
405
  <h5 class="card-title">Soft Skills:</h5>
 
542
  {% else %}
543
  <p>No data available. Please process a file.</p>
544
  {% endif %}
545
+ </div>
546
  </div>
547
  </div>
548
 
549
  <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
550
  <script>
551
  setTimeout(function () {
552
+ let flashMessage = document.getElementById(" -message");
553
  if (flashMessage) {
554
  flashMessage.style.transition = "opacity 1s ease";
555
  flashMessage.style.opacity = 0;