mobile optimalizacia

This commit is contained in:
OLIMINATOR 2022-12-06 13:22:42 +01:00
parent 465cbf6f52
commit 68a7003713
2 changed files with 26 additions and 24 deletions

View file

@ -4,7 +4,12 @@ import { Image } from "@astrojs/image/components";
import logo from "../../assets/logo.png"; import logo from "../../assets/logo.png";
--- ---
<main class="mt-64 flex justify-center items-center"> <main
class="mt-24 md:mt-64 flex flex-col md:flex-row justify-center items-center"
>
<Image src={logo} width={200} height={200} alt="descriptive text" /> <Image src={logo} width={200} height={200} alt="descriptive text" />
<Socials /> <section class="md:ml-6 md:text-left text-center">
<h1 class="text-white font-extrabold text-6xl">xHyroM</h1>
<Socials />
</section>
</main> </main>

View file

@ -24,25 +24,22 @@ const socials = [
]; ];
--- ---
<section> <ul class="flex text-white my-5 md:justify-start justify-center">
<h1 class="text-white font-extrabold text-6xl">xHyroM</h1> {
<ul class="flex text-white my-5"> socials.map((social) => (
{ <li class="mr-4 ">
socials.map((social) => ( <a
<li class="mr-4 flex"> class="hover:-translate-y-1 transition-all w-10 h-10"
<a href={social.link}
class="hover:-translate-y-1 transition-all w-10 h-10" title={social.name}
href={social.link} >
title={social.name} <img
> class="w-8 h-8"
<img src={`/icons/${social.icon}.svg`}
class="w-8 h-8" alt={`${social.name} icon`}
src={`/icons/${social.icon}.svg`} />
alt={`${social.name} icon`} </a>
/> </li>
</a> ))
</li> }
)) </ul>
}
</ul>
</section>