{"size": 990, "ext": "js", "max_stars_repo_path": "js/constants.js", "max_stars_repo_name": "alianza/portfolio", "max_stars_repo_stars_event_min_datetime": "2021-10-05T14:20:02.000Z", "max_stars_repo_stars_event_max_datetime": "2021-12-07T10:47:50.000Z", "max_issues_repo_path": "js/constants.js", "max_issues_repo_name": "alianza/portfolio", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "js/constants.js", "max_forks_repo_name": "alianza/portfolio", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": 2, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 29.1176470588, "max_line_length": 126, "alphanum_fraction": 0.6525252525}
// Variables
const topOffsetBig = 80
const topOffsetSmall = 48
const smallWidth = 480
const mediumWidth = 768
const largeWidth = 900

// Elements
const navBar = document.getElementById('navbar')
const dialog = document.getElementById('dialog')
const dialogContent = document.getElementById('dialog-content')
const logo = document.getElementById('logo')

const projectFragment = (name, project, index) => {
    return `<div class="col clickable ${index > 5 ? 'hidden' : ''}" onclick="onProjectClick(this.dataset.name)" 
                 data-name="${name}" data-team="${project.team}" data-tech="${project.tech}">
             <img class="img" alt="${name} project" src="../projects/${name}/${name}.webp" onerror="this.src='../tile.webp'"/>
             <h1>${project.name} - ${project.suffix}</h1>
          </div>`
}

export {
    topOffsetBig,
    topOffsetSmall,
    smallWidth,
    mediumWidth,
    largeWidth,
    navBar,
    dialog,
    dialogContent,
    logo,
    projectFragment
}
