Skip to content

Commit

Permalink
Merge pull request #1 from rrd108/main
Browse files Browse the repository at this point in the history 
update to nuxt 3
  • Loading branch information
@Karakrisz
Karakrisz committed Mar 27, 2024
2 parents 613faac + c98e30f commit c40b86c
Show file tree
Hide file tree
Showing 52 changed files with 14,372 additions and 14,492 deletions.
76 changes: 75 additions & 1 deletion README.md
View file
@@ -1 +1,75 @@
# biztosAlkuszApp
# Nuxt 3 Minimal Starter

Look at the [Nuxt 3 documentation](https://nuxt.com/docs/getting-started/introduction) to learn more.

## Setup

Make sure to install the dependencies:

```bash
# npm
npm install

# pnpm
pnpm install

# yarn
yarn install

# bun
bun install
```

## Development Server

Start the development server on `http://localhost:3000`:

```bash
# npm
npm run dev

# pnpm
pnpm run dev

# yarn
yarn dev

# bun
bun run dev
```

## Production

Build the application for production:

```bash
# npm
npm run build

# pnpm
pnpm run build

# yarn
yarn build

# bun
bun run build
```

Locally preview production build:

```bash
# npm
npm run preview

# pnpm
pnpm run preview

# yarn
yarn preview

# bun
bun run preview
```

Check out the [deployment documentation](https://nuxt.com/docs/getting-started/deployment) for more information.
7 changes: 7 additions & 0 deletions app.vue
View file
@@ -0,0 +1,7 @@
<template>
<div>
<AppHeader />
<NuxtPage />
<AppFooter />
</div>
</template>
0 static/css/app.css → assets/css/app.css
View file
File renamed without changes.
181 changes: 100 additions & 81 deletions components/AppFooter.vue
View file
@@ -1,86 +1,105 @@
<!-- components/Footer.vue -->
<script setup>
const links = [
{ name: 'Főoldal', path: '/' },
{ name: 'Partnerek', path: '/partnerek' },
{ name: 'Szolgáltatások', path: '/szolgaltatasok' },
{ name: 'Dokumentumok', path: '/dokumentumok' },
{ name: 'Ajánlatkérés', path: '/ajanlatkeres' },
{ name: 'Kapcsolat', path: '/kapcsolat' },
]
const form = ref({
firstname: '',
lastname: '',
email: '',
phonenumber: '',
message: '',
})
const sendEmail = () => console.log(form.value)
</script>

<template>
<footer>
<div class="footer-content">
<div class="footer-content__form bg-color-w">
<h5 class="text-transform-uppercase text-center">VEGYÜK FEL A KAPCSOLATOT!</h5>
<div class="contact-form">
<form @submit.prevent="sendEmail">
<div class="contact-form__grid-box grid-2">
<div class="form-group form-group--margin-right">
<input class="form-group__input" placeholder="Vezetéknév *" type="text" id="firstname"
v-model="form.firstname" required>
</div>
<div class="form-group form-group--margin-left">
<input class="form-group__input" placeholder="Keresztnév *" type="text" id="lastname"
v-model="form.lastname" required>
</div>
</div>
<div class="contact-form__grid-box grid-2">
<div class="form-group form-group--margin-right">
<input class="form-group__input" placeholder="E-mail cím *" type="email" id="email"
v-model="form.email" required>
</div>
<div class="form-group form-group--margin-left">
<input class="form-group__input" placeholder="Telefonszám" type="text" id="phonenumber"
v-model="form.phonenumber" required>
</div>
</div>
<div class="form-group">
<textarea class="form-group__textarea" placeholder="Milyen segítségre volna szüksége?"
id="message" v-model="form.message" required></textarea>
</div>
<div class="contact-form__btn-box t-end">
<button class="page-btn text-color-w" type="submit">Küldés
<img class="page-btn__img position-relative" src="/img/btn-arrow.svg"
alt="Biztos Alkuszom"></button>
</div>
</form>
</div>
<footer>
<div class="footer-content">
<div class="footer-content__form bg-color-w">
<h5 class="text-transform-uppercase text-center">VEGYÜK FEL A KAPCSOLATOT!</h5>
<div class="contact-form">
<form @submit.prevent="sendEmail">
<div class="contact-form__grid-box grid-2">
<div class="form-group form-group--margin-right">
<input
class="form-group__input"
placeholder="Vezetéknév *"
type="text"
id="firstname"
v-model="form.firstname"
required
/>
</div>
<div class="form-group form-group--margin-left">
<input
class="form-group__input"
placeholder="Keresztnév *"
type="text"
id="lastname"
v-model="form.lastname"
required
/>
</div>
</div>
<div class="contact-form__grid-box grid-2">
<div class="form-group form-group--margin-right">
<input
class="form-group__input"
placeholder="E-mail cím *"
type="email"
id="email"
v-model="form.email"
required
/>
</div>
<div class="form-group form-group--margin-left">
<input
class="form-group__input"
placeholder="Telefonszám"
type="text"
id="phonenumber"
v-model="form.phonenumber"
required
/>
</div>
</div>
<div class="form-group">
<textarea
class="form-group__textarea"
placeholder="Milyen segítségre volna szüksége?"
id="message"
v-model="form.message"
required
></textarea>
</div>
<div class="footer-content__link-box text-center">
<img src="/img/footer/logo.svg" alt="Biztos Alkuszom" class="footer-content__link-box__img">
<div class="footer-content__link-box__links">
<NuxtLink v-for="link in footerLinks" :key="link.path" :to="link.path" class="footer-link">
{{ link.name }}
</NuxtLink>
</div>
<div class="footer-content__link-box__DigitalSeed bg-color-w">
<NuxtLink class="footer-content__link-box__DigitalSeed__Nuxtlink text-transform-uppercase" to="/">
DIGITAL SEED STUDIO - 2024</NuxtLink>
</div>
<div class="contact-form__btn-box t-end">
<button class="page-btn text-color-w" type="submit">
Küldés <img class="page-btn__img position-relative" src="/img/btn-arrow.svg" alt="Biztos Alkuszom" />
</button>
</div>
</form>
</div>
</footer>
</div>
<div class="footer-content__link-box text-center">
<img src="/img/footer/logo.svg" alt="Biztos Alkuszom" class="footer-content__link-box__img" />
<div class="footer-content__link-box__links">
<NuxtLink v-for="link in links" :key="link.path" :to="link.path" class="footer-link">
{{ link.name }}
</NuxtLink>
</div>
<div class="footer-content__link-box__DigitalSeed bg-color-w">
<NuxtLink class="footer-content__link-box__DigitalSeed__Nuxtlink text-transform-uppercase" to="/">
DIGITAL SEED STUDIO - 2024</NuxtLink
>
</div>
</div>
</div>
</footer>
</template>


<script>
import axios from 'axios';
import { Footerlinks } from '~/utils/js/links';
export default {
data() {
return {
footerLinks: Footerlinks,
form: {
firstname: '',
lastname: '',
email: '',
phonenumber: '',
message: ''
}
};
},
methods: {
async sendEmail() {
try {
await axios.post('/send-email', this.form);
console.log('Email sikeresen elküldve');
} catch (error) {
console.error('Hiba történt az email küldésekor:', error);
}
}
}
};
</script>
125 changes: 66 additions & 59 deletions components/AppHeader.vue
View file
@@ -1,61 +1,68 @@
<script setup>
const links = [
{ name: 'Főoldal', path: '/' },
{ name: 'Partnerek', path: '/partnerek' },
{ name: 'Szolgáltatások', path: '/szolgaltatasok' },
{ name: 'Dokumentumok', path: '/dokumentumok' },
{ name: 'Ajánlatkérés', path: '/ajanlatkeres' },
{ name: 'Kapcsolat', path: '/kapcsolat' },
{ name: 'Facebook', path: '/logo', imagePath: '/img/header/facebook.svg' },
]
</script>

<template>
<header class="header">
<div class="header-content d-flex">
<div class="logo-box header-content__logo-box">
<a href="/" class="header-content__logo-box__link">
<img src="/img/header/logo.svg" alt="Biztos Alkuszom" class="header-content__logo-box__link__img">
</a>
</div>
<div class="nav-box header-content__nav-box">
<nav class="menu">
<ul id="menu__list" class="menu__list d-flex">
<li v-for="link in links" :key="link.path" class="menu__list__li">
<NuxtLink :to="link.path"
:class="['menu__item text-color text-transform-uppercase', { 'menu__item--border-left': link.path === '/' }]">
<template v-if="link.imagePath">
<img :src="link.imagePath" :alt="link.name">
</template>
<template v-else>
{{ link.name }}
</template>
</NuxtLink>
</li>
</ul>
</nav>
</div>
</div>
<div class="header-bottom d-flex">
<div class="header-bottom__div">
<h1 class="header-bottom__div__h1 text-color-w text-transform-uppercase">
ÁGOSTON GÁBOR -
<span class="header-bottom__div__span">Az Ön alkusza</span>
</h1>
</div>
<div class="header-bottom__div header-bottom__div-linkbox">
<a href="tel:+36302345866" class="header-bottom__div-linkbox__link text-color-w">
<img src="/img/header/mobile.svg" alt="Biztos Alkuszom"
class="header-bottom__div-linkbox__link__img position-relative">
06 30 234 5866
</a>
<a href="mailto:biztos@alkuszom.info" class="header-bottom__div-linkbox__link text-color-w">
<img src="/img/header/mail.svg" alt="Biztos Alkuszom"
class="header-bottom__div-linkbox__link__img header-bottom__div-linkbox__link__img--margin-left position-relative">
biztos@alkuszom.info
</a>
</div>
</div>
</header>
<header class="header">
<div class="header-content d-flex">
<div class="logo-box header-content__logo-box">
<a href="/" class="header-content__logo-box__link">
<img src="/img/header/logo.svg" alt="Biztos Alkuszom" class="header-content__logo-box__link__img" />
</a>
</div>
<div class="nav-box header-content__nav-box">
<nav class="menu">
<ul id="menu__list" class="menu__list d-flex">
<li v-for="link in links" :key="link.path" class="menu__list__li">
<NuxtLink
:to="link.path"
:class="['menu__item text-color text-transform-uppercase', { 'menu__item--border-left': link.path === '/' }]"
>
<template v-if="link.imagePath">
<img :src="link.imagePath" :alt="link.name" />
</template>
<template v-else>
{{ link.name }}
</template>
</NuxtLink>
</li>
</ul>
</nav>
</div>
</div>
<div class="header-bottom d-flex">
<div class="header-bottom__div">
<h1 class="header-bottom__div__h1 text-color-w text-transform-uppercase">
ÁGOSTON GÁBOR -
<span class="header-bottom__div__span">Az Ön alkusza</span>
</h1>
</div>
<div class="header-bottom__div header-bottom__div-linkbox">
<a href="tel:+36302345866" class="header-bottom__div-linkbox__link text-color-w">
<img
src="/img/header/mobile.svg"
alt="Biztos Alkuszom"
class="header-bottom__div-linkbox__link__img position-relative"
/>
06 30 234 5866
</a>
<a href="mailto:biztos@alkuszom.info" class="header-bottom__div-linkbox__link text-color-w">
<img
src="/img/header/mail.svg"
alt="Biztos Alkuszom"
class="header-bottom__div-linkbox__link__img header-bottom__div-linkbox__link__img--margin-left position-relative"
/>
biztos@alkuszom.info
</a>
</div>
</div>
</header>
</template>

<script>
import { links } from '~/utils/js/links';
export default {
data() {
return {
links,
};
},
};
</script>
Empty file removed components/NuxtLogo.vue
View file
Empty file.

0 comments on commit c40b86c

Please sign in to comment.