updates
This commit is contained in:
Tben
parent
d29620ffaa
commit
425b93acb9
@ -1,7 +1,7 @@
|
||||
"use client";
|
||||
|
||||
import React from "react";
|
||||
import TextShuffler from "../../components/actions/TextShuffler";
|
||||
// import TextShuffler from "../../components/actions/TextShuffler";
|
||||
import { about, genericScroll } from "../(utils)/animate";
|
||||
|
||||
export default function AboutSection() {
|
||||
@ -29,7 +29,8 @@ export default function AboutSection() {
|
||||
<div className="flex flex-col xl:flex-row w-full gap-8">
|
||||
<div className="w-full xl:w-[40%]">
|
||||
<h2>
|
||||
<TextShuffler textInput="About Me" />
|
||||
About Me
|
||||
{/* <TextShuffler textInput="About Me" /> */}
|
||||
</h2>
|
||||
|
||||
<div className="flex flex-col-reverse xl:flex-col items-start gap-4">
|
||||
@ -52,10 +53,11 @@ export default function AboutSection() {
|
||||
</div>
|
||||
</div>
|
||||
<span className="hero-sub-text">
|
||||
<TextShuffler
|
||||
Quick learner, adaptable, problem solver, curious. I strive to know the system, rather than the status quo. My credo is: no problem too great, no knowledge too vast, no logic too complex. I thrive in difficult situations and complex hurdles: problem solving is now second nature to me: if you can think it, it can be done.
|
||||
{/* <TextShuffler
|
||||
textInput="Quick learner, adaptable, problem solver, curious. I strive to know the system, rather than the status quo. My credo is: no problem too great, no knowledge too vast, no logic too complex. I thrive in difficult situations and complex hurdles: problem solving is now second nature to me: if you can think it, it can be done."
|
||||
delay={500}
|
||||
/>
|
||||
/> */}
|
||||
</span>
|
||||
|
||||
<a
|
||||
@ -70,7 +72,8 @@ export default function AboutSection() {
|
||||
<div className="w-full xl:w-[60%] bg-[#343680] px-4 md:px-6 py-2">
|
||||
<section>
|
||||
<h3>
|
||||
<TextShuffler textInput={targetStack?.match(/dev/i) ? "Web Dev Tech Stack" : "UI/UX tech stack"} />
|
||||
{targetStack?.match(/dev/i) ? "Web Dev Tech Stack" : "UI/UX tech stack"}
|
||||
{/* <TextShuffler textInput={targetStack?.match(/dev/i) ? "Web Dev Tech Stack" : "UI/UX tech stack"} /> */}
|
||||
</h3>
|
||||
<hr />
|
||||
<ul style={{ maxWidth: "800px" }}>
|
||||
@ -82,10 +85,12 @@ export default function AboutSection() {
|
||||
className="mb-4"
|
||||
>
|
||||
<h4 className="m-0">
|
||||
<TextShuffler textInput={item.title} />
|
||||
{item.title}
|
||||
{/* <TextShuffler textInput={item.title} /> */}
|
||||
</h4>
|
||||
<span className="opacity-80">
|
||||
<TextShuffler textInput={item.description} />
|
||||
{item.description}
|
||||
{/* <TextShuffler textInput={item.description} /> */}
|
||||
</span>
|
||||
</li>
|
||||
))}
|
||||
@ -98,10 +103,12 @@ export default function AboutSection() {
|
||||
className="mb-4"
|
||||
>
|
||||
<h4 className="m-0">
|
||||
<TextShuffler textInput={item.title} />
|
||||
{item.title}
|
||||
{/* <TextShuffler textInput={item.title} /> */}
|
||||
</h4>
|
||||
<span className="opacity-80">
|
||||
<TextShuffler textInput={item.description} />
|
||||
{item.description}
|
||||
{/* <TextShuffler textInput={item.description} /> */}
|
||||
</span>
|
||||
</li>
|
||||
))}
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
|
||||
import React from "react";
|
||||
import Image from "next/image";
|
||||
import TextShuffler from "../../components/actions/TextShuffler";
|
||||
// import TextShuffler from "../../components/actions/TextShuffler";
|
||||
import { hero } from "../(utils)/animate";
|
||||
|
||||
export default function Hero() {
|
||||
@ -10,7 +10,7 @@ export default function Hero() {
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div className="flex flex-col xl:flex-row items-center gap-0 justify-center -mt-[120px] xl:-mt-[160px] w-full relative pt-[450px] md:pt-0">
|
||||
<div className="flex flex-col xl:flex-row items-center gap-0 justify-center -mt-[80px] xl:-mt-[160px] w-full relative pt-[500px] md:pt-0">
|
||||
<div
|
||||
className="rounded-full max-w-[450px] absolute md:relative top-0 flex items-center md:items-start justify-center mr-0 xl:-mr-14 bg-[#3e3f9c] overflow-hidden"
|
||||
id="main-image"
|
||||
@ -31,29 +31,29 @@ export default function Hero() {
|
||||
id="hero-text-section"
|
||||
>
|
||||
<h1
|
||||
className="text-5xl leading-snug"
|
||||
className="text-4xl md:text-5xl leading-snug"
|
||||
id="hero-text"
|
||||
>
|
||||
{/* Hi */}
|
||||
I'm Benjamin Toby, a Software Engineer and UI/UX expert
|
||||
{/* Fullstack developer, UI/UX designer, Software Engineer, welcome */}
|
||||
<TextShuffler
|
||||
{/* <TextShuffler
|
||||
textInput="I'm Benjamin Toby, a Software Engineer and UI/UX expert"
|
||||
delay={500}
|
||||
/>
|
||||
/> */}
|
||||
</h1>
|
||||
|
||||
<div className="gap-4 flex items-center">
|
||||
<div className="gap-4 flex items-center flex-wrap">
|
||||
<a
|
||||
href="/documents/Resume-Benjamin-Toby-Linkedin.pdf"
|
||||
download={true}
|
||||
className="button"
|
||||
className="button grow"
|
||||
>
|
||||
See my resume
|
||||
</a>
|
||||
<a
|
||||
href="https://www.linkedin.com/in/benjamin-toby/"
|
||||
target="_blank"
|
||||
className="button"
|
||||
className="button grow"
|
||||
>
|
||||
Linkedin
|
||||
</a>
|
||||
@ -64,7 +64,7 @@ export default function Hero() {
|
||||
color: "white",
|
||||
border: "2px solid white",
|
||||
}}
|
||||
className="button"
|
||||
className="button grow"
|
||||
>
|
||||
Contact Me
|
||||
</a>
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
"use client";
|
||||
|
||||
import React from "react";
|
||||
import TextShuffler from "../../../components/actions/TextShuffler";
|
||||
// import TextShuffler from "../../../components/actions/TextShuffler";
|
||||
import { appear, genericScroll } from "../../(utils)/animate";
|
||||
|
||||
export default function Hero() {
|
||||
@ -15,19 +15,22 @@ export default function Hero() {
|
||||
// id="hero-text-section"
|
||||
>
|
||||
<span className="text-primary-light text-lg">
|
||||
<TextShuffler textInput="About Me" />
|
||||
About Me
|
||||
{/* <TextShuffler textInput="About Me" /> */}
|
||||
</span>
|
||||
<h1
|
||||
className="text-5xl leading-snug"
|
||||
id="hero-text"
|
||||
>
|
||||
<TextShuffler textInput="Ben of All Trade, Master of All" />
|
||||
Ben of All Trade, Master of All
|
||||
{/* <TextShuffler textInput="Ben of All Trade, Master of All" /> */}
|
||||
</h1>
|
||||
<span className="hero-sub-text">
|
||||
<TextShuffler
|
||||
Quick learner, adaptable, problem solver, curious. I strive to know the system, rather than the status quo. My credo is: no problem too great, no knowledge too vast, no logic too complex. I thrive in difficult situations and complex hurdles: problem solving is now second nature to me: if you can think it, it can be done.
|
||||
{/* <TextShuffler
|
||||
textInput="Quick learner, adaptable, problem solver, curious. I strive to know the system, rather than the status quo. My credo is: no problem too great, no knowledge too vast, no logic too complex. I thrive in difficult situations and complex hurdles: problem solving is now second nature to me: if you can think it, it can be done."
|
||||
delay={1000}
|
||||
/>
|
||||
/> */}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
"use client";
|
||||
|
||||
import React from "react";
|
||||
import TextShuffler from "../../../components/actions/TextShuffler";
|
||||
// import TextShuffler from "../../../components/actions/TextShuffler";
|
||||
import { appear, genericScroll } from "../../(utils)/animate";
|
||||
|
||||
export default function MoreAboutMe() {
|
||||
@ -23,7 +23,8 @@ export default function MoreAboutMe() {
|
||||
>
|
||||
<div className="w-full">
|
||||
<h2>
|
||||
<TextShuffler textInput="More About Me" />
|
||||
More About Me
|
||||
{/* <TextShuffler textInput="More About Me" /> */}
|
||||
</h2>
|
||||
|
||||
<div className="flex flex-col items-start gap-4">
|
||||
@ -51,7 +52,8 @@ export default function MoreAboutMe() {
|
||||
<div className="w-full bg-[#343680] px-4 md:px-6 py-2">
|
||||
<section>
|
||||
<h3>
|
||||
<TextShuffler textInput={targetStack?.match(/dev/i) ? "Web Dev Tech Stack" : "UI/UX tech stack"} />
|
||||
{targetStack?.match(/dev/i) ? "Web Dev Tech Stack" : "UI/UX tech stack"}
|
||||
{/* <TextShuffler textInput={targetStack?.match(/dev/i) ? "Web Dev Tech Stack" : "UI/UX tech stack"} /> */}
|
||||
</h3>
|
||||
<hr />
|
||||
<ul style={{ maxWidth: "800px" }}>
|
||||
@ -63,10 +65,12 @@ export default function MoreAboutMe() {
|
||||
className="mb-4"
|
||||
>
|
||||
<h4 className="m-0">
|
||||
<TextShuffler textInput={item.title} />
|
||||
{item.title}
|
||||
{/* <TextShuffler textInput={item.title} /> */}
|
||||
</h4>
|
||||
<span className="opacity-80">
|
||||
<TextShuffler textInput={item.description} />
|
||||
{item.description}
|
||||
{/* <TextShuffler textInput={item.description} /> */}
|
||||
</span>
|
||||
</li>
|
||||
))}
|
||||
@ -79,10 +83,12 @@ export default function MoreAboutMe() {
|
||||
className="mb-4"
|
||||
>
|
||||
<h4 className="m-0">
|
||||
<TextShuffler textInput={item.title} />
|
||||
{item.title}
|
||||
{/* <TextShuffler textInput={item.title} /> */}
|
||||
</h4>
|
||||
<span className="opacity-80">
|
||||
<TextShuffler textInput={item.description} />
|
||||
{item.description}
|
||||
{/* <TextShuffler textInput={item.description} /> */}
|
||||
</span>
|
||||
</li>
|
||||
))}
|
||||
|
||||
@ -178,6 +178,10 @@
|
||||
margin-top: 1rem
|
||||
}
|
||||
|
||||
.-mt-\[80px\] {
|
||||
margin-top: -80px
|
||||
}
|
||||
|
||||
.flex {
|
||||
display: flex
|
||||
}
|
||||
@ -365,6 +369,14 @@
|
||||
padding-top: 450px
|
||||
}
|
||||
|
||||
.pt-\[480px\] {
|
||||
padding-top: 480px
|
||||
}
|
||||
|
||||
.pt-\[500px\] {
|
||||
padding-top: 500px
|
||||
}
|
||||
|
||||
.text-5xl {
|
||||
font-size: 3rem;
|
||||
line-height: 1
|
||||
@ -398,6 +410,11 @@
|
||||
line-height: 1.75rem
|
||||
}
|
||||
|
||||
.text-4xl {
|
||||
font-size: 2.25rem;
|
||||
line-height: 2.5rem
|
||||
}
|
||||
|
||||
.uppercase {
|
||||
text-transform: uppercase
|
||||
}
|
||||
@ -492,6 +509,11 @@
|
||||
.md\:pt-0 {
|
||||
padding-top: 0px
|
||||
}
|
||||
|
||||
.md\:text-5xl {
|
||||
font-size: 3rem;
|
||||
line-height: 1
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user