cv-site/src/lib/elements/Jobs.svelte

45 lines
947 B
Svelte

<script lang="ts">
import type { Job } from '$lib/model/job';
import type { CurrentLanguage } from '$lib/types';
import JobElement from './JobElement.svelte';
export let currentLanguage: CurrentLanguage = 'it';
export let jobs: Job[] = [];
</script>
<div class="jobs-container">
{#each jobs as job}
<div class="job-card"><JobElement {job} {currentLanguage} /></div>
{/each}
{#if jobs.length % 2 !== 0}
<div class="job-card hide" />
{/if}
</div>
<style lang="scss">
@import '../../app.scss';
.jobs-container {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.job-card {
background-color: $basecolor2;
border-radius: $default-border-radius;
padding: 25pt 25pt;
margin-top: 1%;
margin-bottom: 1%;
@media (min-width: $min-desktop) {
width: 41%;
}
@media (min-width: 1333px) {
// width: 420px;
width: 42.5%;
}
display: inline;
}
.hide {
background: transparent;
}
</style>