feat: refactor stack and tools
This commit is contained in:
parent
9cb798e730
commit
9304e282bd
3 changed files with 58 additions and 88 deletions
28
app/about/(skills)/stack.jsx
Normal file
28
app/about/(skills)/stack.jsx
Normal file
|
|
@ -0,0 +1,28 @@
|
||||||
|
export default function Stack() {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<h2 className="text-2xl md:text-xl font-normal mb-3 md:tracking-[.3rem] lg:tracking-[.5rem] uppercase ">
|
||||||
|
Language & Framework
|
||||||
|
</h2>
|
||||||
|
<p className="text-gray-500 text-center tracking-widest md:px-5">
|
||||||
|
<span className="text-black font-bold">HTML</span> |{" "}
|
||||||
|
<span className="text-black font-bold">CSS</span> |{" "}
|
||||||
|
<span className="text-black font-bold">Javascript</span> |{" "}
|
||||||
|
<span className="text-black font-bold">Typescript</span> |{" "}
|
||||||
|
<span className="text-black font-bold">React</span> |{" "}
|
||||||
|
<span className="text-black font-bold">NextJS</span> |{" "}
|
||||||
|
<span className="text-black font-bold">TailwindCSS</span> |{" "}
|
||||||
|
<span className="text-black font-bold">Bootstrap</span> |{" "}
|
||||||
|
<span className="text-black font-medium">NodeJS</span> |{" "}
|
||||||
|
<span className="text-black font-medium">ExpressJS</span> |{" "}
|
||||||
|
<span className="text-black font-bold">MySQL</span> |{" "}
|
||||||
|
<span className="text-black font-bold">PostgreSQL</span> |{" "}
|
||||||
|
<span className="text-black font-medium">MongoDB</span> |{" "}
|
||||||
|
<span className="text-black font-medium">Firebase</span> |{" "}
|
||||||
|
<span className="text-black font-medium">PHP</span> |{" "}
|
||||||
|
<span className="text-black font-bold">Laravel</span> |{" "}
|
||||||
|
<span className="text-black font-medium">Python</span>
|
||||||
|
</p>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
26
app/about/(skills)/tools.jsx
Normal file
26
app/about/(skills)/tools.jsx
Normal file
|
|
@ -0,0 +1,26 @@
|
||||||
|
export default function Tools() {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<h2 className="text-2xl md:text-xl font-normal mb-3 md:tracking-[.3rem] lg:tracking-[.5rem] uppercase">
|
||||||
|
Tools
|
||||||
|
</h2>
|
||||||
|
<p className="text-gray-500 text-center tracking-wider md:px-">
|
||||||
|
<span className="text-black font-bold">Visual Studio Code</span>{" "}
|
||||||
|
| <span className="text-black font-medium">Jet Brains</span> |{" "}
|
||||||
|
<span className="text-black font-bold">Git</span> |{" "}
|
||||||
|
<span className="text-black font-bold">Github</span> |{" "}
|
||||||
|
<span className="text-black font-medium">Figma</span> |{" "}
|
||||||
|
<span className="text-black font-medium">Adobe Photoshop</span>{" "}
|
||||||
|
|{" "}
|
||||||
|
<span className="text-black font-medium">
|
||||||
|
Adobe Premiere Pro
|
||||||
|
</span>{" "}
|
||||||
|
|{" "}
|
||||||
|
<span className="text-black font-medium">
|
||||||
|
Adobe After Effect
|
||||||
|
</span>{" "}
|
||||||
|
|{" "}
|
||||||
|
</p>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
@ -10,6 +10,8 @@ import { faChevronLeft } from "@fortawesome/free-solid-svg-icons";
|
||||||
import Card from "./(spotify)/card.jsx";
|
import Card from "./(spotify)/card.jsx";
|
||||||
import Quote from "./(quote)/quote.jsx";
|
import Quote from "./(quote)/quote.jsx";
|
||||||
import Skills from "./(skills)/skills.jsx";
|
import Skills from "./(skills)/skills.jsx";
|
||||||
|
import Tools from "./(skills)/tools.jsx";
|
||||||
|
import Stack from "./(skills)/stack.jsx";
|
||||||
|
|
||||||
// images
|
// images
|
||||||
import Me1 from "@/public/img/me1.jpg";
|
import Me1 from "@/public/img/me1.jpg";
|
||||||
|
|
@ -249,62 +251,7 @@ export default function Page() {
|
||||||
|
|
||||||
type: "spring",
|
type: "spring",
|
||||||
}}>
|
}}>
|
||||||
<h2 className="text-2xl md:text-xl font-normal mb-3 md:tracking-[.3rem] lg:tracking-[.5rem] uppercase ">
|
<Stack/>
|
||||||
Language & Framework
|
|
||||||
</h2>
|
|
||||||
<p className="text-gray-500 text-center tracking-widest md:px-5">
|
|
||||||
<span className="text-black font-bold">HTML</span> |{" "}
|
|
||||||
<span className="text-black font-bold">CSS</span> |{" "}
|
|
||||||
<span className="text-black font-bold">
|
|
||||||
Javascript
|
|
||||||
</span>{" "}
|
|
||||||
|{" "}
|
|
||||||
<span className="text-black font-medium">
|
|
||||||
Typescript
|
|
||||||
</span>{" "}
|
|
||||||
|{" "}
|
|
||||||
<span className="text-black font-bold">React</span>{" "}
|
|
||||||
|{" "}
|
|
||||||
<span className="text-black font-medium">
|
|
||||||
NextJS
|
|
||||||
</span>{" "}
|
|
||||||
|{" "}
|
|
||||||
<span className="text-black font-bold">
|
|
||||||
TailwindCSS
|
|
||||||
</span>{" "}
|
|
||||||
|{" "}
|
|
||||||
<span className="text-black font-bold">
|
|
||||||
Bootstrap
|
|
||||||
</span>{" "}
|
|
||||||
|{" "}
|
|
||||||
<span className="text-black font-medium">
|
|
||||||
NodeJS
|
|
||||||
</span>{" "}
|
|
||||||
|{" "}
|
|
||||||
<span className="text-black font-medium">
|
|
||||||
ExpressJS
|
|
||||||
</span>{" "}
|
|
||||||
|{" "}
|
|
||||||
<span className="text-black font-medium">
|
|
||||||
MongoDB
|
|
||||||
</span>{" "}
|
|
||||||
|{" "}
|
|
||||||
<span className="text-black font-bold">MySQL</span>{" "}
|
|
||||||
|{" "}
|
|
||||||
<span className="text-black font-medium">
|
|
||||||
Firebase
|
|
||||||
</span>{" "}
|
|
||||||
|{" "}
|
|
||||||
<span className="text-black font-medium">PHP</span>{" "}
|
|
||||||
|{" "}
|
|
||||||
<span className="text-black font-bold">
|
|
||||||
Laravel
|
|
||||||
</span>{" "}
|
|
||||||
|{" "}
|
|
||||||
<span className="text-black font-medium">
|
|
||||||
Python
|
|
||||||
</span>
|
|
||||||
</p>
|
|
||||||
</motion.div>
|
</motion.div>
|
||||||
<motion.div
|
<motion.div
|
||||||
className="flex justify-start items-center flex-col mb-5 "
|
className="flex justify-start items-center flex-col mb-5 "
|
||||||
|
|
@ -321,38 +268,7 @@ export default function Page() {
|
||||||
|
|
||||||
type: "spring",
|
type: "spring",
|
||||||
}}>
|
}}>
|
||||||
<h2 className="text-2xl md:text-xl font-normal mb-3 md:tracking-[.3rem] lg:tracking-[.5rem] uppercase">
|
<Tools/>
|
||||||
Tools
|
|
||||||
</h2>
|
|
||||||
<p className="text-gray-500 text-center tracking-wider md:px-">
|
|
||||||
<span className="text-black font-bold">
|
|
||||||
Visual Studio Code
|
|
||||||
</span>{" "}
|
|
||||||
|{" "}
|
|
||||||
<span className="text-black font-medium">
|
|
||||||
Jet Brains
|
|
||||||
</span>{" "}
|
|
||||||
| <span className="text-black font-bold">Git</span>{" "}
|
|
||||||
|{" "}
|
|
||||||
<span className="text-black font-bold">Github</span>{" "}
|
|
||||||
|{" "}
|
|
||||||
<span className="text-black font-medium">
|
|
||||||
Figma
|
|
||||||
</span>{" "}
|
|
||||||
|{" "}
|
|
||||||
<span className="text-black font-medium">
|
|
||||||
Adobe Photoshop
|
|
||||||
</span>{" "}
|
|
||||||
|{" "}
|
|
||||||
<span className="text-black font-medium">
|
|
||||||
Adobe Premiere Pro
|
|
||||||
</span>{" "}
|
|
||||||
|{" "}
|
|
||||||
<span className="text-black font-medium">
|
|
||||||
Adobe After Effect
|
|
||||||
</span>{" "}
|
|
||||||
|{" "}
|
|
||||||
</p>
|
|
||||||
</motion.div>
|
</motion.div>
|
||||||
</div>
|
</div>
|
||||||
<div className="mt-16 flex flex-col justify-start items-center w-full pl-10 md:pl-32">
|
<div className="mt-16 flex flex-col justify-start items-center w-full pl-10 md:pl-32">
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue