Skip to content

Commit 2e57144

Browse files
simpaticohrsimpaticohr
authored
Update job.html
1 parent 3732c18 commit 2e57144

1 file changed

Lines changed: 171 additions & 0 deletions

File tree

‎job/job.html‎

Lines changed: 171 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1 +1,172 @@
11

2+
<!doctype html>
3+
<html lang="en">
4+
<head>
5+
<meta charset="utf-8">
6+
<title>Job Details – Simpatico HR Consultancy</title>
7+
<meta name="viewport" content="width=device-width,initial-scale=1">
8+
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600&display=swap" rel="stylesheet">
9+
<style>
10+
*{box-sizing:border-box;margin:0;padding:0}
11+
body{font-family:'Poppins',sans-serif;background:#f8fafc;color:#0b1220;line-height:1.5}
12+
.wrap{max-width:900px;margin:40px auto;padding:16px}
13+
a{color:#0063b2;text-decoration:none}
14+
header{margin-bottom:24px;display:flex;justify-content:space-between;align-items:center}
15+
.card{background:#fff;border-radius:12px;padding:20px;border:1px solid #e5e7eb;box-shadow:0 10px 30px rgba(15,23,42,0.06)}
16+
.tag-row{margin:10px 0;display:flex;flex-wrap:wrap;gap:8px;font-size:13px}
17+
.tag{padding:4px 8px;border-radius:999px;background:#e5f2ff;color:#0369a1}
18+
.muted{color:#6b7280}
19+
.btn{display:inline-block;margin-top:16px;padding:10px 14px;border-radius:10px;background:#ffcc00;color:#111;font-weight:600}
20+
.btn-outline{display:inline-block;margin-top:16px;margin-left:8px;padding:9px 13px;border-radius:10px;border:1px solid #d1d5db;font-weight:500}
21+
</style>
22+
</head>
23+
<body>
24+
<div class="wrap">
25+
<header>
26+
<div>
27+
<a href="index.html">&larr; Back to Jobs</a>
28+
<h1 style="margin-top:8px;font-size:22px">Job details</h1>
29+
</div>
30+
<div class="muted" style="font-size:13px">Simpatico HR Consultancy</div>
31+
</header>
32+
33+
<div id="jobCard" class="card">
34+
<!-- filled by JS -->
35+
</div>
36+
</div>
37+
38+
<script>
39+
// same jobsData IDs as on index.html
40+
const jobsData = [
41+
{
42+
id: 1,
43+
title: 'Backend Developer',
44+
company: 'NovaTech',
45+
location: 'Kochi',
46+
type: 'Full-time',
47+
exp: '2-5 yrs',
48+
salary: '₹8L – ₹14L / year',
49+
desc: 'Work on scalable APIs and microservices in a cloud-native environment.',
50+
responsibilities: [
51+
'Design and develop RESTful APIs',
52+
'Work with relational and NoSQL databases',
53+
'Collaborate with frontend and product teams',
54+
'Write unit/integration tests'
55+
],
56+
requirements: [
57+
'2+ years of backend development experience',
58+
'Experience with Node.js / Java / .NET (any one)',
59+
'Good understanding of SQL and Git',
60+
'Strong problem-solving skills'
61+
]
62+
},
63+
{
64+
id: 2,
65+
title: 'Frontend Engineer',
66+
company: 'Finlytics',
67+
location: 'Bengaluru',
68+
type: 'Full-time',
69+
exp: '1-4 yrs',
70+
salary: '₹6L – ₹12L / year',
71+
desc: 'Develop modern dashboards and web apps using React.',
72+
responsibilities: [
73+
'Implement responsive UI components',
74+
'Work closely with designers and backend team',
75+
'Optimize performance and accessibility',
76+
'Write clean, maintainable code'
77+
],
78+
requirements: [
79+
'1+ year with React or similar framework',
80+
'Good grasp of HTML, CSS, JavaScript',
81+
'Experience with REST APIs',
82+
'Attention to detail in UI/UX'
83+
]
84+
},
85+
{
86+
id: 3,
87+
title: 'Data Analyst',
88+
company: 'MarketIQ',
89+
location: 'Remote',
90+
type: 'Contract',
91+
exp: '2+ yrs',
92+
salary: '₹30K – ₹80K / month (contract)',
93+
desc: 'Analyse business data and build dashboards for stakeholders.',
94+
responsibilities: [
95+
'Build and maintain dashboards',
96+
'Work with SQL and spreadsheets',
97+
'Create ad-hoc reports',
98+
'Communicate insights to business teams'
99+
],
100+
requirements: [
101+
'2+ years of data analysis experience',
102+
'Strong SQL and Excel / Google Sheets',
103+
'Experience with any BI tool (Power BI, Tableau, etc.)',
104+
'Good communication skills'
105+
]
106+
},
107+
{
108+
id: 4,
109+
title: 'HR Operations Intern',
110+
company: 'Simpatico HR Consultancy',
111+
location: 'Perinthalmanna',
112+
type: 'Internship',
113+
exp: '0-1 yrs',
114+
salary: 'Stipend',
115+
desc: 'Support daily HR and recruitment activities at Simpatico.',
116+
responsibilities: [
117+
'Assist in sourcing and screening resumes',
118+
'Coordinate interviews with candidates',
119+
'Maintain candidate database / tracker',
120+
'Support onboarding and documentation'
121+
],
122+
requirements: [
123+
'Graduate / final year student',
124+
'Interest in HR / recruitment',
125+
'Good communication and MS Office skills',
126+
'Ability to multi-task and learn quickly'
127+
]
128+
}
129+
];
130+
131+
// read ?id= from URL
132+
const params = new URLSearchParams(window.location.search);
133+
const idParam = params.get('id');
134+
const jobId = idParam ? parseInt(idParam, 10) : null;
135+
const job = jobsData.find(j => j.id === jobId) || jobsData[0];
136+
137+
const card = document.getElementById('jobCard');
138+
139+
const respList = job.responsibilities.map(li => `<li>${li}</li>`).join('');
140+
const reqList = job.requirements.map(li => `<li>${li}</li>`).join('');
141+
142+
card.innerHTML = `
143+
<h2 style="margin-bottom:4px">${job.title}</h2>
144+
<div class="muted" style="margin-bottom:10px">
145+
${job.company} • ${job.location} • ${job.exp} • ${job.type}
146+
</div>
147+
<div class="tag-row">
148+
<span class="tag">${job.location}</span>
149+
<span class="tag">${job.type}</span>
150+
<span class="tag">${job.exp}</span>
151+
<span class="tag">${job.salary}</span>
152+
</div>
153+
<p class="muted" style="margin-top:10px">${job.desc}</p>
154+
155+
<h3 style="margin-top:18px;font-size:16px">Responsibilities</h3>
156+
<ul class="muted" style="margin-left:18px;margin-top:6px">${respList}</ul>
157+
158+
<h3 style="margin-top:18px;font-size:16px">Requirements</h3>
159+
<ul class="muted" style="margin-left:18px;margin-top:6px">${reqList}</ul>
160+
161+
<a class="btn" href="mailto:simpaticohrconsultancy@gmail.com?subject=Application%20for%20${encodeURIComponent(job.title)}">
162+
Apply via Email
163+
</a>
164+
<a class="btn-outline" href="https://wa.me/919544842260?text=I%20want%20to%20apply%20for%20${encodeURIComponent(job.title)}" target="_blank">
165+
Apply via WhatsApp
166+
</a>
167+
`;
168+
</script>
169+
</body>
170+
</html>
171+
172+

0 commit comments

Comments
 (0)