104 lines
2.7 KiB
Svelte
104 lines
2.7 KiB
Svelte
<script lang="ts">
|
|
import {} from 'svelte';
|
|
import { MetaTags } from 'svelte-meta-tags';
|
|
import type { CurrentLanguage } from '$lib/types';
|
|
import AboutMe from '$lib/elements/AboutMe.svelte';
|
|
import Jobs from '$lib/elements/Jobs.svelte';
|
|
import Menu from '$lib/elements/Menu.svelte';
|
|
import Training from '$lib/elements/Training.svelte';
|
|
import Data_jobs from '$lib/model/jobs.json';
|
|
import Data_portfolio from '$lib/model/portfolio.json';
|
|
import LanguageSelector from '$lib/elements/LanguageSelector.svelte';
|
|
import type { Job } from '$lib/model/job';
|
|
|
|
let jobs: Job[] = Data_jobs as Job[];
|
|
let portfolio: Job[] = Data_portfolio as Job[];
|
|
let currentLanguage: CurrentLanguage = 'it';
|
|
let titles = {
|
|
home: {
|
|
it: 'Gianmarco Pettinato',
|
|
en: 'Gianmarco Pettinato'
|
|
},
|
|
job: { it: 'Esperienze', en: 'Experiences' },
|
|
school: { it: 'Formazione', en: 'Training' },
|
|
contacts: { it: 'Contatti', en: 'Contacts' },
|
|
portfolio: { it: 'Portfolio', en: 'Portfolio' }
|
|
};
|
|
let modalOpen: boolean = false;
|
|
</script>
|
|
|
|
<MetaTags
|
|
title="Gianmarco Pettinato"
|
|
description="This is the Gianmarco's portfolio site"
|
|
canonical="https://pettinato.eu/"
|
|
openGraph={{
|
|
url: 'https://pettinato.eu/',
|
|
title: 'Gianmarco Pettinato',
|
|
description: "This is the Gianmarco's portfolio site",
|
|
images: [],
|
|
site_name: 'Gianmarco Pettinato Portfolio'
|
|
}}
|
|
twitter={{
|
|
handle: '@jatus_93',
|
|
site: '@jatus_93',
|
|
cardType: 'summary',
|
|
title: 'Gianmarco Pettinato Portfolio',
|
|
description: "This is the Gianmarco's portfolio site",
|
|
image: 'https://pettinato.eu/profile_pic.webp',
|
|
imageAlt: 'Gianmarco Photo'
|
|
}}
|
|
/>
|
|
|
|
<main lang={currentLanguage}>
|
|
<!-- svelte-ignore a11y-invalid-attribute -->
|
|
<LanguageSelector bind:currentLanguage />
|
|
<Menu {currentLanguage} />
|
|
<div
|
|
class="default"
|
|
on:scroll={(event) => {
|
|
if (modalOpen) {
|
|
event.preventDefault();
|
|
}
|
|
console.log(event);
|
|
}}
|
|
>
|
|
<span id="home" class="anchor" />
|
|
<AboutMe {currentLanguage} />
|
|
</div>
|
|
<div class="default">
|
|
<span id="jobs" class="anchor" />
|
|
<h2>{titles.job[currentLanguage]}</h2>
|
|
<Jobs {jobs} {currentLanguage} bind:modalOpen />
|
|
</div>
|
|
<div class="default">
|
|
<span id="training" class="anchor" />
|
|
<h2>{titles.school[currentLanguage]}</h2>
|
|
<Training {currentLanguage} />
|
|
</div>
|
|
<div class="default">
|
|
<span id="portfolio" class="anchor" />
|
|
<h2>{titles.portfolio[currentLanguage]}</h2>
|
|
<Jobs jobs={portfolio} {currentLanguage} bind:modalOpen />
|
|
</div>
|
|
</main>
|
|
|
|
<style lang="scss">
|
|
@import '../app.scss';
|
|
|
|
@media (max-width: $min-tablet) {
|
|
.custom-button {
|
|
font-size: large;
|
|
}
|
|
}
|
|
.anchor {
|
|
position: absolute;
|
|
margin-top: -150px;
|
|
@media (min-width: 460px) {
|
|
margin-top: -100px;
|
|
}
|
|
@media (min-width: $min-tablet) {
|
|
margin-top: -60px;
|
|
}
|
|
}
|
|
</style>
|