62 lines
1.9 KiB
Vue
62 lines
1.9 KiB
Vue
<template>
|
||
<div class="min-h-screen bg-gray-950">
|
||
|
||
|
||
<main>
|
||
<nav class="fixed top-0 left-0 right-0 z-50 bg-gray-950/80 backdrop-blur-md border-b border-gray-800">
|
||
<div class="max-w-4xl mx-auto px-4 h-16 flex items-center justify-between">
|
||
<span class="text-white font-bold text-lg tracking-tight">
|
||
<span class="text-indigo-400"><</span>dev<span class="text-indigo-400">/></span>
|
||
</span>
|
||
<div class="hidden md:flex items-center gap-6">
|
||
<a
|
||
v-for="link in navLinks"
|
||
:key="link.href"
|
||
:href="link.href"
|
||
class="text-gray-400 hover:text-white transition-colors duration-200 text-sm font-medium"
|
||
>
|
||
{{ link.label }}
|
||
</a>
|
||
</div>
|
||
<UButton
|
||
size="sm"
|
||
color="primary"
|
||
variant="soft"
|
||
icon="i-heroicons-envelope"
|
||
@click="scrollToContact"
|
||
>
|
||
Контакт
|
||
</UButton>
|
||
</div>
|
||
</nav>
|
||
</main>
|
||
|
||
<footer class="py-8 px-4 border-t border-gray-800 text-center text-gray-600 text-sm">
|
||
<p>© {{ new Date().getFullYear() }} Алексей Разработчик. Все права защищены.</p>
|
||
</footer>
|
||
</div>
|
||
</template>
|
||
|
||
<script setup lang="ts">
|
||
const navLinks = [
|
||
{ href: '#about', label: 'О себе' },
|
||
{ href: '#skills', label: 'Навыки' },
|
||
{ href: '#projects', label: 'Проекты' },
|
||
{ href: '#contact', label: 'Контакт' },
|
||
];
|
||
|
||
function scrollToContact() {
|
||
document.querySelector('#contact')?.scrollIntoView({ behavior: 'smooth' });
|
||
}
|
||
|
||
useHead({
|
||
title: 'Алексей — Fullstack Developer',
|
||
meta: [
|
||
{
|
||
name: 'description',
|
||
content: 'Fullstack Developer специализирующийся на NestJS, Nuxt 3 и TypeScript. Открыт для новых проектов.',
|
||
},
|
||
],
|
||
});
|
||
</script>
|