✨ Add Kontakt Page
This commit is contained in:
BIN
assets/icons/Discord_Icon.png
Normal file
BIN
assets/icons/Discord_Icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 22 KiB |
BIN
assets/icons/Email_Icon.png
Normal file
BIN
assets/icons/Email_Icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 27 KiB |
BIN
assets/icons/Facebook_Icon.png
Normal file
BIN
assets/icons/Facebook_Icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
BIN
assets/icons/Instagram_Icon.png
Normal file
BIN
assets/icons/Instagram_Icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 34 KiB |
36
pages/Kontakt.js
Normal file
36
pages/Kontakt.js
Normal 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>
|
||||
);
|
||||
}
|
||||
1
styles/Kontakt.module.css
Normal file
1
styles/Kontakt.module.css
Normal 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)}
|
||||
16
styles/Kontakt.module.scss
Normal file
16
styles/Kontakt.module.scss
Normal 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);
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user