Add Kontakt Page

This commit is contained in:
stefan080106
2022-05-17 13:35:26 +02:00
parent 12dfc520c7
commit 3f12415e6a
7 changed files with 53 additions and 0 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 KiB

BIN
assets/icons/Email_Icon.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 27 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 24 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 34 KiB

36
pages/Kontakt.js Normal file
View File

@@ -0,0 +1,36 @@
import Head from "next/head";
import Image from "next/image";
import StandardStyles from "../styles/Home.module.css";
import styles from "../styles/Kontakt.module.css";
import EmailIcon from "../assets/icons/Email_Icon.png";
import DiscordIcon from "../assets/icons/Discord_Icon.png";
import FacebookIcon from "../assets/icons/Facebook_Icon.png";
import InstagramIcon from "../assets/icons/Instagram_Icon.png";
export default function Home() {
return (
<main className={StandardStyles.main}>
<Head>
<title>AGS IT Solutions | Kontakt</title>
</Head>
<h1>Kontakformular Folgt...</h1>
<h1>Social-Media</h1>
{/* Social-Media*/}
<div className={styles.SocialMediaContainer}>
<a href="mailto:solutionsagsit@gmail.com">
<Image height={100} width={100} src={EmailIcon} alt="E-Mail" />
</a>
<a href="https://www.instagram.com/ags_it_solutions/">
<Image height={100} width={100} src={InstagramIcon} alt="Instagram" />
</a>
<a href="https://www.facebook.com/AGS-It-Solutions-106590378715946">
<Image height={100} width={100} src={FacebookIcon} alt="Facebook" />
</a>
<a href="https://discord.gg/cgq2NA2sdd">
<Image height={100} width={100} src={DiscordIcon} alt="Discord" />
</a>
</div>
</main>
);
}

View File

@@ -0,0 +1 @@
.SocialMediaContainer{width:80%;display:flex;justify-content:space-around;align-items:center}.SocialMediaContainer a span{transition:all .5s}.SocialMediaContainer a :hover{transform:scale(1.05)}

View File

@@ -0,0 +1,16 @@
.SocialMediaContainer {
width: 80%;
display: flex;
justify-content: space-around;
align-items: center;
a {
span {
transition: all 0.5s;
}
:hover {
transform: scale(1.05);
}
}
}