[feat] populate project images
This commit is contained in:
parent
1980fb94ff
commit
fb466e1c15
36 changed files with 232 additions and 63 deletions
|
|
@ -270,7 +270,7 @@ const MyPage = () => {
|
|||
</div>
|
||||
<div className="section">
|
||||
<div className="relative md:h-screen w-screen gap-4 p-10 flex justify-center items-center flex-col">
|
||||
<div className="z-0 mb-48 md:mb-0 md:absolute top-1/4 md:right-[10%] md:-translate-y-16 ">
|
||||
<div className="z-0 mb-48 md:mb-0 md:absolute top-1/4 md:right-[10%] md:-translate-y-16 overflow-x-hidden">
|
||||
<motion.div
|
||||
className="bg-slate-300 rounded-sm h-[400px] md:h-[600px] w-[80vw] md:w-[30vw] grayscale hover:grayscale-0"
|
||||
initial={{
|
||||
|
|
@ -298,7 +298,7 @@ const MyPage = () => {
|
|||
</div>
|
||||
<div className="z-10 w-full absolute md:w-auto md:left-[10%] top-[60%] md:top-1/3 col-span-2 flex flex-col justify-center items-start md:items-start text-start px-10 overflow-hidden">
|
||||
<motion.h1
|
||||
className="bg-white lg:bg-transparent bg-opacity-50 px-3 md-px-0 text-black text-5xl md:text-8xl font-bold"
|
||||
className="bg-white lg:bg-transparent bg-opacity-50 px-3 md-px-0 text-black text-5xl md:text-8xl font-bold mb-3"
|
||||
initial={{ x: -100, opacity: 0 }}
|
||||
whileInView={{ x: 0, opacity: 1 }}
|
||||
transition={{
|
||||
|
|
@ -317,7 +317,9 @@ const MyPage = () => {
|
|||
type: "spring",
|
||||
}}>
|
||||
Feel free to contact me if you have any{" "}
|
||||
<span className="bg-transparent md:bg-gray-100 bg-opacity-50 xl:bg-transparent">questions or just want to say hi.</span>
|
||||
<span className="bg-transparent md:bg-gray-100 bg-opacity-50 xl:bg-transparent">
|
||||
questions or just want to say hi.
|
||||
</span>
|
||||
</motion.p>
|
||||
<motion.p
|
||||
className="title text-xl mt-4 tracking-wider text-gray-500 leading-[1.7rem] mb-5"
|
||||
|
|
@ -327,12 +329,14 @@ const MyPage = () => {
|
|||
delay: 0.3,
|
||||
type: "spring",
|
||||
}}>
|
||||
alvalen.shafel04@gmail.com
|
||||
<a href="mailto:Alvalen.shafel04@gmail.com?subject=Hello&body=Hello Alvalens,">
|
||||
alvalen.shafel04@gmail.com
|
||||
</a>
|
||||
</motion.p>
|
||||
{/* icons */}
|
||||
<div className="flex justify-center items-center space-x-4">
|
||||
<motion.a
|
||||
href="#"
|
||||
href="mailto:Alvalen.shafel04@gmail.com?subject=Hello&body=Hello Alvalens,"
|
||||
className="flex justify-center items-center bg-gray-500 w-14 h-14 rounded-full text-gray-100 hover:bg-gray-400 transition-all ease-in-out duration-300"
|
||||
initial={{ y: 40, opacity: 0 }}
|
||||
whileInView={{ y: 0, opacity: 1 }}
|
||||
|
|
@ -347,7 +351,9 @@ const MyPage = () => {
|
|||
</motion.a>
|
||||
|
||||
<motion.a
|
||||
href="#"
|
||||
href="https://github.com/Alvalens"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="flex justify-center items-center bg-gray-500 w-14 h-14 rounded-full text-gray-100 hover:bg-gray-400 transition-all ease-in-out duration-300"
|
||||
initial={{ opacity: 0, y: 40 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
|
|
@ -361,7 +367,9 @@ const MyPage = () => {
|
|||
/>
|
||||
</motion.a>
|
||||
<motion.a
|
||||
href="#"
|
||||
href="https://www.instagram.com/alvalens_/"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="flex justify-center items-center bg-gray-500 w-14 h-14 rounded-full text-gray-100 hover:bg-gray-400 transition-all ease-in-out duration-300"
|
||||
initial={{ opacity: 0, y: 40 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
|
|
@ -375,7 +383,9 @@ const MyPage = () => {
|
|||
/>
|
||||
</motion.a>
|
||||
<motion.a
|
||||
href="#"
|
||||
href="https://www.linkedin.com/in/alvalen-shafel-8a081a254/"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="flex justify-center items-center bg-gray-500 w-14 h-14 rounded-full text-gray-100 hover:bg-gray-400 transition-all ease-in-out duration-300"
|
||||
initial={{ opacity: 0, y: 40 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
|
|
@ -389,7 +399,9 @@ const MyPage = () => {
|
|||
/>
|
||||
</motion.a>
|
||||
<motion.a
|
||||
href="#"
|
||||
href="https://discordapp.com/users/bloody#6118"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="flex justify-center items-center bg-gray-500 w-14 h-14 rounded-full text-gray-100 hover:bg-gray-400 transition-all ease-in-out duration-300"
|
||||
initial={{ opacity: 0, y: 40 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue