Files
AGS_IT_Solutions_Website/pages/index.js
2022-05-27 15:11:50 +02:00

61 lines
2.1 KiB
JavaScript

//Import Style
import HomeStyles from "../styles/Home.module.css";
import styles from "../styles/LandingPage.module.css";
//Import Components
import FadeIn from "react-fade-in";
import Image from "next/image";
import Head from "next/head";
//Import Images
import HeadsetIcon from "../assets/icons/Headset_Icon.png";
import ClipboardIcon from "../assets/icons/Clipboard_Icon.png";
import BusinessCommunicationIcon from "../assets/icons/BusinessCommunication_Icon.png";
import UnserLeistungenContainer from "../components/UnserLeistungen-Container";
export default function Home() {
return (
<main className={HomeStyles.main}>
<Head>
<title>AGS IT Solutions | Start</title>
</Head>
<div className={styles.welcomeContainer}>
<FadeIn transitionDuration={500} childTag={"h1"}>
Herzlich Willkommen auf Unserer Website
</FadeIn>
<FadeIn delay={300} transitionDuration={600} childTag={"p"}>
Wir sind ihr Unternehmen für IT-Dienstleistungen im Schwerpunkt Web- und
Software Entwicklung und dem Einrichten von Computer- und Netzwerktechnik
</FadeIn>
</div>
<FadeIn delay={300} transitionDuration={600} childTag={"h1"}>
Unsere Leistungen
</FadeIn>
<UnserLeistungenContainer />
{/* <FadeIn delay={300} transitionDuration={1500} className={styles.treeContainerLayout}>
<div className={styles.container}>
<Image
src={BusinessCommunicationIcon}
alt="Business communication icon"
height={100}
width={100}
/>
<h3>Beratung</h3>
<p>Wir beraten sie und finden mit Ihnen die Perfekte Lösung für ihr vorhaben</p>
</div>
<div className={styles.container}>
<Image src={ClipboardIcon} alt="Clipboard icon" height={100} width={100} />
<h3>Planung</h3>
<p>
Wir Planen Ihre Projekte von Anfang bis ende mit Ihnen durch so dass, das
endergebniss ihren vorstellungen endspricht
</p>
</div>
<div className={styles.container}>
<Image src={HeadsetIcon} alt="Support icon" height={100} width={100} />
<h3>Support</h3>
<p>Wir Stellen ihn Professionellen Support bei allen IT-Problemen</p>
</div>
</FadeIn> */}
</main>
);
}