fixed minor navigation issues #3

Merged
Jatus merged 1 commits from develop into main 2023-05-28 12:23:35 +02:00
4 changed files with 52 additions and 16 deletions

View File

@ -1,12 +1,15 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<link rel="icon" href="%sveltekit.assets%/favicon.png" />
<meta name="viewport" content="width=device-width" />
%sveltekit.head%
</head>
<body data-sveltekit-preload-data="hover">
<div style="display: contents">%sveltekit.body%</div>
</body>
<html lang="it">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%sveltekit.assets%/favicon.png" />
<meta name="viewport" content="width=device-width" />
%sveltekit.head%
</head>
<body data-sveltekit-preload-data="hover">
<div style="display: contents">%sveltekit.body%</div>
</body>
</html>

View File

@ -32,10 +32,17 @@
const globeLookup: svgCore.IconLookup = { prefix: 'fas', iconName: 'globe-europe' };
const globeDefinition: svgCore.IconDefinition = svgCore.findIconDefinition(globeLookup);
const buttonLabel: { [key: CurrentLanguage[number]]: string } = {
it: 'seleziona la lingua',
en: 'select language'
};
</script>
<div class="language-selector">
<button on:click={setOpen}> <FontAwesomeIcon icon={globeDefinition} size="2x" /> </button>
<button on:click={setOpen}>
<FontAwesomeIcon icon={globeDefinition} size="2x" /><span>{buttonLabel[currentLanguage]}</span
></button
>
<div class="button-container" bind:this={langSelect}>
<button
class="custom-button {currentLanguage == 'it' ? 'custom-button-active' : ''}"
@ -76,6 +83,16 @@
border: none;
width: 60px;
height: 50px;
span {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}
}
.custom-button {
width: 100px;

View File

@ -52,18 +52,22 @@
<!-- svelte-ignore a11y-invalid-attribute -->
<LanguageSelector bind:currentLanguage />
<Menu {currentLanguage} />
<div id="home" class="default">
<div class="default">
<span id="home" class="anchor" />
<AboutMe {currentLanguage} />
</div>
<div id="jobs" class="default">
<div class="default">
<span id="jobs" class="anchor" />
<h2>{titles.job[currentLanguage]}</h2>
<Jobs {jobs} {currentLanguage} />
</div>
<div id="training" class="default">
<div class="default">
<span id="training" class="anchor" />
<h2>{titles.school[currentLanguage]}</h2>
<Training {currentLanguage} />
</div>
<div id="portfolio" class="default">
<div class="default">
<span id="portfolio" class="anchor" />
<h2>{titles.portfolio[currentLanguage]}</h2>
<Jobs jobs={portfolio} {currentLanguage} />
</div>
@ -77,4 +81,14 @@
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>

View File

@ -5,4 +5,6 @@ const config: UserConfig = {
plugins: [sveltekit()]
};
config.server = { port: 80, origin: 'pettinato.eu' };
export default config;