XeNote/public/scripts/jobs.js

79 lines
2.2 KiB
JavaScript

(() => {
class Job {
logo;
name;
details;
code;
dateFrom;
dateTo;
constructor(logo, name, details, dateFrom, dateTo) {
this.logo = logo
this.name = name
this.details = details
this.dateFrom = dateFrom
this.dateTo = dateTo
}
_build() {
return `
<img src="${this.logo}" class="w-10 h-10 rounded-full" />
<div class="flex flex-col flex-1">
<div class="flex justify-between">
<span class="block text-sm font-bold text-gray-900">${this.name}</span>
<span class="block text-xs font-bold text-gray-500">${this.dateFrom} - ${this.dateTo}</span>
</div>
<span class="block text-xs text-gray-700">${this.details}</span>
</div>
`
}
show() {
const container = document.createElement('div')
container.classList = "flex items-center gap-x-3 border rounded-xl w-full p-2 bg-gray-200"
container.innerHTML = this._build()
return container
}
}
// details
const data = [
{
logo: 'https://ventrahealth.com/wp-content/uploads/2023/08/cropped-Ventra-Health-favicon-circle-192x192.png',
name: 'Ventra Health',
details: 'Maintaining and iterating on an internal web application',
dateFrom: "May 2023",
dateTo: "Present"
}, {
logo: 'https://www.randstadusa.com/themes/custom/bluex/favicon.ico',
name: 'Randstad Technologies',
details: 'Built Web Applications for external clients',
dateFrom: "May 2022",
dateTo: "May 2023"
}, {
logo: 'https://img1.wsimg.com/isteam/ip/9ba626a3-41c9-4092-90b5-cb351983b726/favicon/a8beec51-e35d-4cca-8e88-befa12f687b0.png/:/rs=w:64,h:64,m',
name: 'Damiano Global Corporation',
details: 'Built Web Applications for external clients',
dateFrom: "July 2020",
dateTo: "Nov 2021"
}, {
logo: '#',
name: 'Makers Ladder LLC',
details: 'Did some thangs',
dateFrom: "Dec 2019",
dateTo: "Apr 2022"
},
]
// Showings
const jobsSection = document.getElementById('jobs')
data.forEach(job => {
const j = new Job(job.logo, job.name, job.details, job.dateFrom, job.dateTo)
jobsSection.appendChild(j.show())
})
})()