Hugging Face's logo

Spaces:
cahuenca36
/
visavoyage-workforce-gateway
Running

App Files Community
cahuenca36 commited on
Commit
0248e41
·
verified ·
1 Parent(s): 103b2bf

Create a website where I can have a catalog of people from Mexico who held a H2 A visa or H2 B in the past as well as new ones the whole idea is to provide the service for hiring seasonal employees through these programs, and I will manage the logistics and paperwork to get them here For a price so create all that for me I need a section where they can upload a 30 second video proving that they can jump they can bend down, and they can pick up a bucket of water. Also, another section where they can upload their past visas and an ass exception to let us know in what type of job related to the H2 H2B Visas

Browse files
Files changed (5) hide show
  1. README.md +9 -5
  2. about.html +130 -0
  3. candidates.html +160 -0
  4. employers.html +199 -0
  5. index.html +88 -19
README.md CHANGED
@@ -1,10 +1,14 @@
1
  ---
2
- title: Visavoyage Workforce Gateway
3
- emoji: 📈
4
- colorFrom: green
5
- colorTo: yellow
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: VisaVoyage Workforce Gateway 🌐
3
+ colorFrom: purple
4
+ colorTo: blue
5
+ emoji: 🐳
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite-v3
10
  ---
11
 
12
+ # Welcome to your new DeepSite project!
13
+ This project was created with [DeepSite](https://deepsite.hf.co).
14
+
about.html ADDED
@@ -0,0 +1,130 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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>About Us | VisaVoyage Workforce Gateway</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/feather-icons/dist/feather.min.js"></script>
10
+ </head>
11
+ <body class="bg-gray-50">
12
+ <!-- Navigation (same as index.html) -->
13
+ <nav class="bg-white shadow-sm">
14
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
15
+ <div class="flex justify-between h-16">
16
+ <div class="flex items-center">
17
+ <div class="flex-shrink-0 flex items-center">
18
+ <i data-feather="globe" class="text-primary h-8 w-8"></i>
19
+ <span class="ml-2 text-xl font-bold text-gray-900">VisaVoyage</span>
20
+ </div>
21
+ </div>
22
+ <div class="hidden sm:ml-6 sm:flex sm:space-x-8">
23
+ <a href="index.html" class="border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">Home</a>
24
+ <a href="candidates.html" class="border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">Candidates</a>
25
+ <a href="employers.html" class="border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">Employers</a>
26
+ <a href="about.html" class="border-primary text-gray-900 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">About</a>
27
+ </div>
28
+ <div class="hidden sm:ml-6 sm:flex sm:items-center">
29
+ <button class="bg-primary hover:bg-blue-700 text-white px-4 py-2 rounded-md text-sm font-medium">Sign In</button>
30
+ </div>
31
+ </div>
32
+ </div>
33
+ </nav>
34
+
35
+ <main class="max-w-7xl mx-auto py-12 px-4 sm:px-6 lg:px-8">
36
+ <div class="text-center mb-12">
37
+ <h1 class="text-3xl font-bold text-gray-900 mb-4">About VisaVoyage</h1>
38
+ <p class="max-w-2xl mx-auto text-gray-600">Connecting Mexican workers with US seasonal opportunities since 2018</p>
39
+ </div>
40
+
41
+ <div class="bg-white rounded-lg shadow-md overflow-hidden mb-12">
42
+ <div class="md:flex">
43
+ <div class="md:w-1/2 p-8 md:p-12">
44
+ <h2 class="text-2xl font-bold text-gray-900 mb-4">Our Mission</h2>
45
+ <p class="text-gray-600 mb-4">VisaVoyage was founded to streamline the complex process of seasonal worker visas while ensuring fair treatment and good opportunities for Mexican workers.</p>
46
+ <p class="text-gray-600 mb-6">We believe in creating win-win solutions where US employers get reliable, vetted workers and Mexican workers gain access to lawful, well-paying seasonal jobs.</p>
47
+ <div class="grid grid-cols-2 gap-4">
48
+ <div class="bg-gray-50 p-4 rounded-lg">
49
+ <div class="text-primary text-3xl font-bold mb-1">2,500+</div>
50
+ <div class="text-sm text-gray-600">Workers Placed</div>
51
+ </div>
52
+ <div class="bg-gray-50 p-4 rounded-lg">
53
+ <div class="text-primary text-3xl font-bold mb-1">95%</div>
54
+ <div class="text-sm text-gray-600">Visa Approval Rate</div>
55
+ </div>
56
+ <div class="bg-gray-50 p-4 rounded-lg">
57
+ <div class="text-primary text-3xl font-bold mb-1">150+</div>
58
+ <div class="text-sm text-gray-600">Employer Partners</div>
59
+ </div>
60
+ <div class="bg-gray-50 p-4 rounded-lg">
61
+ <div class="text-primary text-3xl font-bold mb-1">$15M+</div>
62
+ <div class="text-sm text-gray-600">Earned by Workers</div>
63
+ </div>
64
+ </div>
65
+ </div>
66
+ <div class="md:w-1/2 bg-gray-100 flex items-center justify-center p-8">
67
+ <img src="http://static.photos/office/640x360/1" alt="Our team at work" class="rounded-lg shadow-md">
68
+ </div>
69
+ </div>
70
+ </div>
71
+
72
+ <div class="mb-12">
73
+ <h2 class="text-2xl font-bold text-gray-900 mb-6 text-center">How It Works</h2>
74
+ <div class="grid md:grid-cols-3 gap-8">
75
+ <div class="bg-white p-6 rounded-lg shadow-sm">
76
+ <div class="bg-primary bg-opacity-10 w-12 h-12 rounded-full flex items-center justify-center mb-4">
77
+ <span class="text-primary font-bold">1</span>
78
+ </div>
79
+ <h3 class="text-lg font-semibold text-gray-900 mb-2">Worker Registration</h3>
80
+ <p class="text-gray-600">Workers complete our thorough application including physical capability videos, work history, and visa documentation.</p>
81
+ </div>
82
+ <div class="bg-white p-6 rounded-lg shadow-sm">
83
+ <div class="bg-primary bg-opacity-10 w-12 h-12 rounded-full flex items-center justify-center mb-4">
84
+ <span class="text-primary font-bold">2</span>
85
+ </div>
86
+ <h3 class="text-lg font-semibold text-gray-900 mb-2">Employer Matching</h3>
87
+ <p class="text-gray-600">US employers browse our catalog of vetted candidates and select workers for their seasonal needs.</p>
88
+ </div>
89
+ <div class="bg-white p-6 rounded-lg shadow-sm">
90
+ <div class="bg-primary bg-opacity-10 w-12 h-12 rounded-full flex items-center justify-center mb-4">
91
+ <span class="text-primary font-bold">3</span>
92
+ </div>
93
+ <h3 class="text-lg font-semibold text-gray-900 mb-2">Visa Processing</h3>
94
+ <p class="text-gray-600">We handle all visa paperwork, interviews, and logistics to get workers to their job sites on time.</p>
95
+ </div>
96
+ </div>
97
+ </div>
98
+
99
+ <div class="bg-white rounded-lg shadow-md overflow-hidden">
100
+ <div class="p-8 md:p-12">
101
+ <h2 class="text-2xl font-bold text-gray-900 mb-6 text-center">Meet the Team</h2>
102
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
103
+ <div class="text-center">
104
+ <img src="http://static.photos/people/200x200/1" alt="Founder" class="w-32 h-32 rounded-full mx-auto mb-4 shadow-md">
105
+ <h3 class="text-lg font-semibold text-gray-900">Alejandro Morales</h3>
106
+ <p class="text-gray-600 mb-2">Founder & CEO</p>
107
+ <p class="text-sm text-gray-500">Former agricultural worker turned immigration advocate</p>
108
+ </div>
109
+ <div class="text-center">
110
+ <img src="http://static.photos/people/200x200/2" alt="Legal Director" class="w-32 h-32 rounded-full mx-auto mb-4 shadow-md">
111
+ <h3 class="text-lg font-semibold text-gray-900">Sofia Ramos</h3>
112
+ <p class="text-gray-600 mb-2">Legal Director</p>
113
+ <p class="text-sm text-gray-500">Immigration attorney with 10+ years of visa experience</p>
114
+ </div>
115
+ <div class="text-center">
116
+ <img src="http://static.photos/people/200x200/3" alt="Operations Manager" class="w-32 h-32 rounded-full mx-auto mb-4 shadow-md">
117
+ <h3 class="text-lg font-semibold text-gray-900">Ricardo Juarez</h3>
118
+ <p class="text-gray-600 mb-2">Operations Manager</p>
119
+ <p class="text-sm text-gray-500">Logistics expert ensuring smooth worker transportation</p>
120
+ </div>
121
+ </div>
122
+ </div>
123
+ </div>
124
+ </main>
125
+
126
+ <script>
127
+ feather.replace();
128
+ </script>
129
+ </body>
130
+ </html>
candidates.html ADDED
@@ -0,0 +1,160 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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>Candidate Catalog | VisaVoyage Workforce Gateway</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/feather-icons/dist/feather.min.js"></script>
10
+ <style>
11
+ .candidate-card:hover {
12
+ transform: translateY(-5px);
13
+ box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
14
+ }
15
+ .video-thumbnail {
16
+ aspect-ratio: 16/9;
17
+ }
18
+ </style>
19
+ </head>
20
+ <body class="bg-gray-50">
21
+ <!-- Navigation (same as index.html) -->
22
+ <nav class="bg-white shadow-sm">
23
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
24
+ <div class="flex justify-between h-16">
25
+ <div class="flex items-center">
26
+ <div class="flex-shrink-0 flex items-center">
27
+ <i data-feather="globe" class="text-primary h-8 w-8"></i>
28
+ <span class="ml-2 text-xl font-bold text-gray-900">VisaVoyage</span>
29
+ </div>
30
+ </div>
31
+ <div class="hidden sm:ml-6 sm:flex sm:space-x-8">
32
+ <a href="index.html" class="border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">Home</a>
33
+ <a href="candidates.html" class="border-primary text-gray-900 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">Candidates</a>
34
+ <a href="employers.html" class="border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">Employers</a>
35
+ <a href="about.html" class="border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">About</a>
36
+ </div>
37
+ <div class="hidden sm:ml-6 sm:flex sm:items-center">
38
+ <button class="bg-primary hover:bg-blue-700 text-white px-4 py-2 rounded-md text-sm font-medium">Sign In</button>
39
+ </div>
40
+ </div>
41
+ </div>
42
+ </nav>
43
+
44
+ <main class="max-w-7xl mx-auto py-8 px-4 sm:px-6 lg:px-8">
45
+ <div class="flex justify-between items-center mb-8">
46
+ <h1 class="text-3xl font-bold text-gray-900">Candidate Catalog</h1>
47
+ <div class="flex space-x-4">
48
+ <div class="relative">
49
+ <select class="block appearance-none bg-white border border-gray-300 text-gray-700 py-2 px-4 pr-8 rounded leading-tight focus:outline-none focus:ring-2 focus:ring-primary">
50
+ <option>Filter by Visa Type</option>
51
+ <option>H2A - Agricultural</option>
52
+ <option>H2B - Non-Agricultural</option>
53
+ </select>
54
+ </div>
55
+ <div class="relative">
56
+ <select class="block appearance-none bg-white border border-gray-300 text-gray-700 py-2 px-4 pr-8 rounded leading-tight focus:outline-none focus:ring-2 focus:ring-primary">
57
+ <option>Filter by Experience</option>
58
+ <option>Has Previous Visa</option>
59
+ <option>New Candidate</option>
60
+ </select>
61
+ </div>
62
+ </div>
63
+ </div>
64
+
65
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
66
+ <!-- Candidate Card 1 -->
67
+ <div class="bg-white rounded-lg shadow-md overflow-hidden transition-all duration-300 candidate-card">
68
+ <div class="relative video-thumbnail bg-gray-200">
69
+ <video poster="http://static.photos/people/640x360/1" controls class="w-full h-full object-cover">
70
+ <source src="#" type="video/mp4">
71
+ </video>
72
+ <div class="absolute bottom-2 left-2 bg-primary text-white text-xs px-2 py-1 rounded">Verified</div>
73
+ </div>
74
+ <div class="p-4">
75
+ <div class="flex justify-between items-start">
76
+ <div>
77
+ <h3 class="text-lg font-semibold text-gray-900">Juan Martinez</h3>
78
+ <p class="text-sm text-gray-500">32 years old</p>
79
+ </div>
80
+ <span class="bg-green-100 text-green-800 text-xs px-2 py-1 rounded-full">H2A</span>
81
+ </div>
82
+ <div class="mt-3">
83
+ <p class="text-sm text-gray-600"><span class="font-medium">Experience:</span> 5 seasons in apple harvesting</p>
84
+ <p class="text-sm text-gray-600"><span class="font-medium">Last Visa:</span> H2A 2022 (verified)</p>
85
+ <p class="text-sm text-gray-600"><span class="font-medium">Skills:</span> Orchard work, equipment operation</p>
86
+ </div>
87
+ <div class="mt-4 flex space-x-2">
88
+ <button class="flex-1 bg-primary hover:bg-blue-700 text-white px-3 py-2 rounded text-sm font-medium">View Profile</button>
89
+ <button class="flex-1 bg-secondary hover:bg-green-600 text-white px-3 py-2 rounded text-sm font-medium">Contact</button>
90
+ </div>
91
+ </div>
92
+ </div>
93
+
94
+ <!-- Candidate Card 2 -->
95
+ <div class="bg-white rounded-lg shadow-md overflow-hidden transition-all duration-300 candidate-card">
96
+ <div class="relative video-thumbnail bg-gray-200">
97
+ <video poster="http://static.photos/people/640x360/2" controls class="w-full h-full object-cover">
98
+ <source src="#" type="video/mp4">
99
+ </video>
100
+ <div class="absolute bottom-2 left-2 bg-yellow-500 text-white text-xs px-2 py-1 rounded">New</div>
101
+ </div>
102
+ <div class="p-4">
103
+ <div class="flex justify-between items-start">
104
+ <div>
105
+ <h3 class="text-lg font-semibold text-gray-900">Maria Gutierrez</h3>
106
+ <p class="text-sm text-gray-500">28 years old</p>
107
+ </div>
108
+ <span class="bg-blue-100 text-blue-800 text-xs px-2 py-1 rounded-full">H2B</span>
109
+ </div>
110
+ <div class="mt-3">
111
+ <p class="text-sm text-gray-600"><span class="font-medium">Experience:</span> Restaurant kitchen staff</p>
112
+ <p class="text-sm text-gray-600"><span class="font-medium">Last Visa:</span> None (new candidate)</p>
113
+ <p class="text-sm text-gray-600"><span class="font-medium">Skills:</span> Food prep, cleaning, customer service</p>
114
+ </div>
115
+ <div class="mt-4 flex space-x-2">
116
+ <button class="flex-1 bg-primary hover:bg-blue-700 text-white px-3 py-2 rounded text-sm font-medium">View Profile</button>
117
+ <button class="flex-1 bg-secondary hover:bg-green-600 text-white px-3 py-2 rounded text-sm font-medium">Contact</button>
118
+ </div>
119
+ </div>
120
+ </div>
121
+
122
+ <!-- Candidate Card 3 -->
123
+ <div class="bg-white rounded-lg shadow-md overflow-hidden transition-all duration-300 candidate-card">
124
+ <div class="relative video-thumbnail bg-gray-200">
125
+ <video poster="http://static.photos/people/640x360/3" controls class="w-full h-full object-cover">
126
+ <source src="#" type="video/mp4">
127
+ </video>
128
+ <div class="absolute bottom-2 left-2 bg-primary text-white text-xs px-2 py-1 rounded">Verified</div>
129
+ </div>
130
+ <div class="p-4">
131
+ <div class="flex justify-between items-start">
132
+ <div>
133
+ <h3 class="text-lg font-semibold text-gray-900">Carlos Rodriguez</h3>
134
+ <p class="text-sm text-gray-500">35 years old</p>
135
+ </div>
136
+ <span class="bg-green-100 text-green-800 text-xs px-2 py-1 rounded-full">H2A</span>
137
+ </div>
138
+ <div class="mt-3">
139
+ <p class="text-sm text-gray-600"><span class="font-medium">Experience:</span> 8 seasons in vineyard work</p>
140
+ <p class="text-sm text-gray-600"><span class="font-medium">Last Visa:</span> H2A 2021, 2022 (verified)</p>
141
+ <p class="text-sm text-gray-600"><span class="font-medium">Skills:</span> Pruning, harvesting, irrigation</p>
142
+ </div>
143
+ <div class="mt-4 flex space-x-2">
144
+ <button class="flex-1 bg-primary hover:bg-blue-700 text-white px-3 py-2 rounded text-sm font-medium">View Profile</button>
145
+ <button class="flex-1 bg-secondary hover:bg-green-600 text-white px-3 py-2 rounded text-sm font-medium">Contact</button>
146
+ </div>
147
+ </div>
148
+ </div>
149
+ </div>
150
+
151
+ <div class="mt-10 flex justify-center">
152
+ <button class="bg-white border border-gray-300 text-gray-700 px-6 py-3 rounded-md text-sm font-medium hover:bg-gray-50">Load More Candidates</button>
153
+ </div>
154
+ </main>
155
+
156
+ <script>
157
+ feather.replace();
158
+ </script>
159
+ </body>
160
+ </html>
employers.html ADDED
@@ -0,0 +1,199 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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>Employer Services | VisaVoyage Workforce Gateway</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/feather-icons/dist/feather.min.js"></script>
10
+ <style>
11
+ .service-card:hover {
12
+ transform: translateY(-5px);
13
+ box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
14
+ }
15
+ </style>
16
+ </head>
17
+ <body class="bg-gray-50">
18
+ <!-- Navigation (same as index.html) -->
19
+ <nav class="bg-white shadow-sm">
20
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
21
+ <div class="flex justify-between h-16">
22
+ <div class="flex items-center">
23
+ <div class="flex-shrink-0 flex items-center">
24
+ <i data-feather="globe" class="text-primary h-8 w-8"></i>
25
+ <span class="ml-2 text-xl font-bold text-gray-900">VisaVoyage</span>
26
+ </div>
27
+ </div>
28
+ <div class="hidden sm:ml-6 sm:flex sm:space-x-8">
29
+ <a href="index.html" class="border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">Home</a>
30
+ <a href="candidates.html" class="border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">Candidates</a>
31
+ <a href="employers.html" class="border-primary text-gray-900 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">Employers</a>
32
+ <a href="about.html" class="border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">About</a>
33
+ </div>
34
+ <div class="hidden sm:ml-6 sm:flex sm:items-center">
35
+ <button class="bg-primary hover:bg-blue-700 text-white px-4 py-2 rounded-md text-sm font-medium">Sign In</button>
36
+ </div>
37
+ </div>
38
+ </div>
39
+ </nav>
40
+
41
+ <main class="max-w-7xl mx-auto py-8 px-4 sm:px-6 lg:px-8">
42
+ <div class="text-center mb-12">
43
+ <h1 class="text-3xl font-bold text-gray-900 mb-4">Employer Services</h1>
44
+ <p class="max-w-2xl mx-auto text-gray-600">We handle all the logistics and paperwork to bring qualified seasonal workers to your business through H2A and H2B visa programs.</p>
45
+ </div>
46
+
47
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8 mb-12">
48
+ <!-- Service Card 1 -->
49
+ <div class="bg-white p-6 rounded-lg shadow-md transition-all duration-300 service-card">
50
+ <div class="flex items-center mb-4">
51
+ <div class="bg-primary bg-opacity-10 p-3 rounded-full mr-4">
52
+ <i data-feather="user-check" class="text-primary h-6 w-6"></i>
53
+ </div>
54
+ <h3 class="text-lg font-semibold text-gray-900">Candidate Matching</h3>
55
+ </div>
56
+ <p class="text-gray-600 mb-4">Access our pre-vetted database of workers with verified visa histories and physical capability videos.</p>
57
+ <a href="#" class="text-primary text-sm font-medium inline-flex items-center">Browse candidates <i data-feather="arrow-right" class="ml-1 h-4 w-4"></i></a>
58
+ </div>
59
+
60
+ <!-- Service Card 2 -->
61
+ <div class="bg-white p-6 rounded-lg shadow-md transition-all duration-300 service-card">
62
+ <div class="flex items-center mb-4">
63
+ <div class="bg-secondary bg-opacity-10 p-3 rounded-full mr-4">
64
+ <i data-feather="file-text" class="text-secondary h-6 w-6"></i>
65
+ </div>
66
+ <h3 class="text-lg font-semibold text-gray-900">Visa Processing</h3>
67
+ </div>
68
+ <p class="text-gray-600 mb-4">Full-service handling of all H2A/H2B paperwork including petitions, certifications, and embassy coordination.</p>
69
+ <a href="#" class="text-secondary text-sm font-medium inline-flex items-center">Learn more <i data-feather="arrow-right" class="ml-1 h-4 w-4"></i></a>
70
+ </div>
71
+
72
+ <!-- Service Card 3 -->
73
+ <div class="bg-white p-6 rounded-lg shadow-md transition-all duration-300 service-card">
74
+ <div class="flex items-center mb-4">
75
+ <div class="bg-yellow-500 bg-opacity-10 p-3 rounded-full mr-4">
76
+ <i data-feather="truck" class="text-yellow-500 h-6 w-6"></i>
77
+ </div>
78
+ <h3 class="text-lg font-semibold text-gray-900">Logistics Support</h3>
79
+ </div>
80
+ <p class="text-gray-600 mb-4">Comprehensive transportation, housing, and onboarding support for your seasonal workers.</p>
81
+ <a href="#" class="text-yellow-600 text-sm font-medium inline-flex items-center">View options <i data-feather="arrow-right" class="ml-1 h-4 w-4"></i></a>
82
+ </div>
83
+ </div>
84
+
85
+ <div class="bg-white rounded-lg shadow-md overflow-hidden">
86
+ <div class="p-8">
87
+ <h2 class="text-2xl font-bold text-gray-900 mb-4">Pricing Packages</h2>
88
+ <div class="overflow-x-auto">
89
+ <table class="min-w-full divide-y divide-gray-200">
90
+ <thead class="bg-gray-50">
91
+ <tr>
92
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Service</th>
93
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Basic</th>
94
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Standard</th>
95
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Premium</th>
96
+ </tr>
97
+ </thead>
98
+ <tbody class="bg-white divide-y divide-gray-200">
99
+ <tr>
100
+ <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">Candidate Matching</td>
101
+ <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">✓</td>
102
+ <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">✓</td>
103
+ <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">✓</td>
104
+ </tr>
105
+ <tr>
106
+ <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">Visa Processing</td>
107
+ <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">Basic</td>
108
+ <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">Full</td>
109
+ <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">Full + Expedited</td>
110
+ </tr>
111
+ <tr>
112
+ <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">Transportation</td>
113
+ <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">-</td>
114
+ <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">To work site</td>
115
+ <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">Door-to-door</td>
116
+ </tr>
117
+ <tr>
118
+ <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">Housing Assistance</td>
119
+ <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">-</td>
120
+ <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">✓</td>
121
+ <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">✓ + Furnished</td>
122
+ </tr>
123
+ <tr>
124
+ <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">Price per Worker</td>
125
+ <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">$500</td>
126
+ <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">$950</td>
127
+ <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">$1,500</td>
128
+ </tr>
129
+ </tbody>
130
+ </table>
131
+ </div>
132
+ </div>
133
+ </div>
134
+
135
+ <div class="mt-12 bg-white rounded-lg shadow-md overflow-hidden">
136
+ <div class="md:flex">
137
+ <div class="md:flex-1 p-8 md:p-12">
138
+ <h2 class="text-2xl font-bold text-gray-900 mb-4">Ready to Get Started?</h2>
139
+ <p class="text-gray-600 mb-6">Fill out our employer application form and we'll contact you within 24 hours to discuss your seasonal workforce needs.</p>
140
+ <form>
141
+ <div class="mb-4">
142
+ <label for="name" class="block text-sm font-medium text-gray-700 mb-1">Full Name</label>
143
+ <input type="text" id="name" class="w-full px-4 py-2 border border-gray-300 rounded-md focus:ring-primary focus:border-primary">
144
+ </div>
145
+ <div class="mb-4">
146
+ <label for="company" class="block text-sm font-medium text-gray-700 mb-1">Company Name</label>
147
+ <input type="text" id="company" class="w-full px-4 py-2 border border-gray-300 rounded-md focus:ring-primary focus:border-primary">
148
+ </div>
149
+ <div class="mb-4">
150
+ <label for="email" class="block text-sm font-medium text-gray-700 mb-1">Email</label>
151
+ <input type="email" id="email" class="w-full px-4 py-2 border border-gray-300 rounded-md focus:ring-primary focus:border-primary">
152
+ </div>
153
+ <div class="mb-4">
154
+ <label for="workers" class="block text-sm font-medium text-gray-700 mb-1">Number of Workers Needed</label>
155
+ <input type="number" id="workers" class="w-full px-4 py-2 border border-gray-300 rounded-md focus:ring-primary focus:border-primary">
156
+ </div>
157
+ <div class="mb-4">
158
+ <label for="visa" class="block text-sm font-medium text-gray-700 mb-1">Visa Type Needed</label>
159
+ <select id="visa" class="w-full px-4 py-2 border border-gray-300 rounded-md focus:ring-primary focus:border-primary">
160
+ <option>H2A - Agricultural</option>
161
+ <option>H2B - Non-Agricultural</option>
162
+ <option>Not sure</option>
163
+ </select>
164
+ </div>
165
+ <button type="submit" class="w-full bg-primary hover:bg-blue-700 text-white py-2 px-4 rounded-md font-medium">Submit Application</button>
166
+ </form>
167
+ </div>
168
+ <div class="md:flex-1 bg-gray-50 p-8 md:p-12 flex items-center justify-center">
169
+ <div class="max-w-md">
170
+ <h3 class="text-xl font-semibold text-gray-900 mb-4">Why Choose VisaVoyage?</h3>
171
+ <ul class="space-y-4">
172
+ <li class="flex items-start">
173
+ <i data-feather="check-circle" class="text-green-500 mr-3 flex-shrink-0"></i>
174
+ <span class="text-gray-600">Pre-vetted workers with verified physical capabilities</span>
175
+ </li>
176
+ <li class="flex items-start">
177
+ <i data-feather="check-circle" class="text-green-500 mr-3 flex-shrink-0"></i>
178
+ <span class="text-gray-600">95% visa approval rate for our clients</span>
179
+ </li>
180
+ <li class="flex items-start">
181
+ <i data-feather="check-circle" class="text-green-500 mr-3 flex-shrink-0"></i>
182
+ <span class="text-gray-600">Average time savings of 40 hours per worker on paperwork</span>
183
+ </li>
184
+ <li class="flex items-start">
185
+ <i data-feather="check-circle" class="text-green-500 mr-3 flex-shrink-0"></i>
186
+ <span class="text-gray-600">24/7 support during the entire season</span>
187
+ </li>
188
+ </ul>
189
+ </div>
190
+ </div>
191
+ </div>
192
+ </div>
193
+ </main>
194
+
195
+ <script>
196
+ feather.replace();
197
+ </script>
198
+ </body>
199
+ </html>
index.html CHANGED
@@ -1,19 +1,88 @@
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>AmigoWork - Seasonal Visa Hiring Solutions</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/feather-icons/dist/feather.min.js"></script>
10
+ <script src="https://cdn.jsdelivr.net/npm/vanta@latest/dist/vanta.net.min.js"></script>
11
+ <script>
12
+ tailwind.config = {
13
+ theme: {
14
+ extend: {
15
+ colors: {
16
+ primary: '#3B82F6',
17
+ secondary: '#10B981',
18
+ }
19
+ }
20
+ }
21
+ }
22
+ </script>
23
+ <style>
24
+ .video-container {
25
+ aspect-ratio: 16/9;
26
+ }
27
+ .file-upload {
28
+ border: 2px dashed #d1d5db;
29
+ transition: all 0.3s ease;
30
+ }
31
+ .file-upload:hover {
32
+ border-color: #3B82F6;
33
+ background-color: #f8fafc;
34
+ }
35
+ </style>
36
+ </head>
37
+ <body class="bg-gray-50">
38
+ <div id="vanta-bg" class="fixed inset-0 -z-10"></div>
39
+
40
+ <!-- Navigation -->
41
+ <nav class="bg-white shadow-sm">
42
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
43
+ <div class="flex justify-between h-16">
44
+ <div class="flex items-center">
45
+ <div class="flex-shrink-0 flex items-center">
46
+ <i data-feather="globe" class="text-primary h-8 w-8"></i>
47
+ <span class="ml-2 text-xl font-bold text-gray-900">AmigoWork</span>
48
+ </div>
49
+ </div>
50
+ <div class="hidden sm:ml-6 sm:flex sm:space-x-8">
51
+ <a href="#" class="border-primary text-gray-900 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">Home</a>
52
+ <a href="candidates.html" class="border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">Candidates</a>
53
+ <a href="employers.html" class="border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">Employers</a>
54
+ <a href="about.html" class="border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">About</a>
55
+ </div>
56
+ <div class="hidden sm:ml-6 sm:flex sm:items-center">
57
+ <button class="bg-primary hover:bg-blue-700 text-white px-4 py-2 rounded-md text-sm font-medium">Sign In</button>
58
+ </div>
59
+ <div class="-mr-2 flex items-center sm:hidden">
60
+ <button type="button" class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-primary">
61
+ <i data-feather="menu"></i>
62
+ </button>
63
+ </div>
64
+ </div>
65
+ </div>
66
+ </nav>
67
+
68
+ <!-- Hero Section -->
69
+ <div class="relative bg-white overflow-hidden">
70
+ <div class="max-w-7xl mx-auto">
71
+ <div class="relative z-10 pb-8 bg-white sm:pb-16 md:pb-20 lg:max-w-2xl lg:w-full lg:pb-28 xl:pb-32">
72
+ <main class="mt-10 mx-auto max-w-7xl px-4 sm:mt-12 sm:px-6 lg:mt-16 lg:px-8 xl:mt-20">
73
+ <div class="sm:text-center lg:text-left">
74
+ <h1 class="text-4xl tracking-tight font-extrabold text-gray-900 sm:text-5xl md:text-6xl">
75
+ <span class="block">Connecting Mexican</span>
76
+ <span class="block text-primary">Workers with US</span>
77
+ <span class="block">Seasonal Opportunities</span>
78
+ </h1>
79
+ <p class="mt-3 text-base text-gray-500 sm:mt-5 sm:text-lg sm:max-w-xl sm:mx-auto md:mt-5 md:text-xl lg:mx-0">
80
+ Streamlined H2A and H2B visa processing with full logistics support for employers and qualified workers.
81
+ </p>
82
+ <div class="flex flex-col sm:flex-row gap-4 mt-6">
83
+ <a href="candidates.html" class="bg-primary hover:bg-blue-700 text-white px-6 py-3 rounded-md text-sm font-medium">Browse Candidates</a>
84
+ <a href="employers.html" class="bg-secondary hover:bg-green-600 text-white px-6 py-3 rounded-md text-sm font-medium">Employer Services</a>
85
+ </div>
86
+ <div class="mt-5 sm:mt-
87
+ </body>
88
+ </html>