Skip to content

Commit

Permalink
Fix(UI): Improve Metrics Suggest
Browse files Browse the repository at this point in the history
  • Loading branch information
@Ikram-Maulana
Ikram-Maulana committed Oct 3, 2022
1 parent 120fc50 commit bb6395f
Show file tree
Hide file tree
Showing 3 changed files with 75 additions and 50 deletions.
5 changes: 5 additions & 0 deletions components/FooTer.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,7 @@ const FooTer = () => {
target="_blank"
rel="noopener noreferrer"
className="text-white"
aria-label="Instagram"
>
<Footer.Icon icon={BsInstagram} />
</a>
Expand All @@ -35,6 +36,7 @@ const FooTer = () => {
target="_blank"
rel="noopener noreferrer"
className="text-white"
aria-label="Github"
>
<Footer.Icon icon={BsGithub} />
</a>
Expand All @@ -44,6 +46,7 @@ const FooTer = () => {
target="_blank"
rel="noopener noreferrer"
className="text-white"
aria-label="LinkedIn"
>
<Footer.Icon icon={BsLinkedin} />
</a>
Expand All @@ -53,6 +56,7 @@ const FooTer = () => {
target="_blank"
rel="noopener noreferrer"
className="text-white"
aria-label="Dribbble"
>
<Footer.Icon icon={BsDribbble} />
</a>
Expand All @@ -62,6 +66,7 @@ const FooTer = () => {
target="_blank"
rel="noopener noreferrer"
className="text-white"
aria-label="E-mail"
>
<Footer.Icon icon={BsEnvelope} />
</a>
Expand Down
116 changes: 68 additions & 48 deletions components/Header.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,66 +1,86 @@
import { Navbar } from "flowbite-react";
import { useRouter } from "next/router";
import ProgressBar from "react-progressbar-on-scroll";
import { Link } from "react-scroll/modules";

const Header = () => {
return (
<>
<ProgressBar color="#388CF0" gradient={true} gradientColor="#1DB4D2" />
<ProgressBar
color="#388CF0"
gradient={true}
gradientColor="#1DB4D2"
height={5}
/>
<header className="h-20 py-5">
<div className="max-w-5xl mx-auto">
<Navbar fluid={true} rounded={true}>
<Navbar.Brand>
<Link
activeClass="active"
to="hero"
spy={true}
smooth={true}
offset={-100}
duration={100}
className="cursor-pointer flex items-center"
>
<span className="self-center whitespace-nowrap text-xl font-bold dark:text-white">
Ikram Maulana.
</span>
</Navbar.Brand>
</Link>
<Navbar.Toggle />
<Navbar.Collapse>
<Link
activeClass="active"
to="hero"
spy={true}
smooth={true}
offset={-100}
duration={100}
className="cursor-pointer block py-2 pr-4 pl-3 md:p-0 border-b border-gray-100 text-gray-700 hover:bg-gray-50 dark:border-gray-700 dark:hover:bg-gray-700 dark:hover:text-white md:border-0 md:hover:bg-transparent md:hover:text-blue-700 md:dark:hover:bg-transparent md:dark:hover:text-white dark:text-gray-400"
>
Home
</Link>
<Link
activeClass="active"
to="about"
spy={true}
smooth={true}
offset={-100}
duration={100}
className="cursor-pointer block py-2 pr-4 pl-3 md:p-0 border-b border-gray-100 text-gray-700 hover:bg-gray-50 dark:border-gray-700 dark:hover:bg-gray-700 dark:hover:text-white md:border-0 md:hover:bg-transparent md:hover:text-blue-700 md:dark:hover:bg-transparent md:dark:hover:text-white dark:text-gray-400"
>
About
</Link>
<Link
activeClass="active"
to="project"
spy={true}
smooth={true}
offset={-100}
duration={100}
className="cursor-pointer block py-2 pr-4 pl-3 md:p-0 border-b border-gray-100 text-gray-700 hover:bg-gray-50 dark:border-gray-700 dark:hover:bg-gray-700 dark:hover:text-white md:border-0 md:hover:bg-transparent md:hover:text-blue-700 md:dark:hover:bg-transparent md:dark:hover:text-white dark:text-gray-400"
>
Project
</Link>
<Link
activeClass="active"
to="experience"
spy={true}
smooth={true}
offset={-100}
duration={100}
className="cursor-pointer block py-2 pr-4 pl-3 md:p-0 border-b border-gray-100 text-gray-700 hover:bg-gray-50 dark:border-gray-700 dark:hover:bg-gray-700 dark:hover:text-white md:border-0 md:hover:bg-transparent md:hover:text-blue-700 md:dark:hover:bg-transparent md:dark:hover:text-white dark:text-gray-400"
>
Experience
</Link>
<li>
<Link
activeClass="active"
to="hero"
spy={true}
smooth={true}
offset={-100}
duration={100}
className="cursor-pointer block py-2 pr-4 pl-3 md:p-0 border-b border-gray-100 text-gray-700 hover:bg-gray-50 dark:border-gray-700 dark:hover:bg-gray-700 dark:hover:text-white md:border-0 md:hover:bg-transparent md:hover:text-blue-700 md:dark:hover:bg-transparent md:dark:hover:text-white dark:text-gray-400"
>
Home
</Link>
</li>
<li>
<Link
activeClass="active"
to="about"
spy={true}
smooth={true}
offset={-100}
duration={100}
className="cursor-pointer block py-2 pr-4 pl-3 md:p-0 border-b border-gray-100 text-gray-700 hover:bg-gray-50 dark:border-gray-700 dark:hover:bg-gray-700 dark:hover:text-white md:border-0 md:hover:bg-transparent md:hover:text-blue-700 md:dark:hover:bg-transparent md:dark:hover:text-white dark:text-gray-400"
>
About
</Link>
</li>
<li>
<Link
activeClass="active"
to="project"
spy={true}
smooth={true}
offset={-100}
duration={100}
className="cursor-pointer block py-2 pr-4 pl-3 md:p-0 border-b border-gray-100 text-gray-700 hover:bg-gray-50 dark:border-gray-700 dark:hover:bg-gray-700 dark:hover:text-white md:border-0 md:hover:bg-transparent md:hover:text-blue-700 md:dark:hover:bg-transparent md:dark:hover:text-white dark:text-gray-400"
>
Project
</Link>
</li>
<li>
<Link
activeClass="active"
to="experience"
spy={true}
smooth={true}
offset={-100}
duration={100}
className="cursor-pointer block py-2 pr-4 pl-3 md:p-0 border-b border-gray-100 text-gray-700 hover:bg-gray-50 dark:border-gray-700 dark:hover:bg-gray-700 dark:hover:text-white md:border-0 md:hover:bg-transparent md:hover:text-blue-700 md:dark:hover:bg-transparent md:dark:hover:text-white dark:text-gray-400"
>
Experience
</Link>
</li>
</Navbar.Collapse>
</Navbar>
</div>
Expand Down
4 changes: 2 additions & 2 deletions components/Projects.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,9 +29,9 @@ const Projects = ({
className="object-cover rounded-md image-projects"
unoptimized={true}
/>
<h5 className="mt-3 mb-2.5 text-2xl font-bold tracking-tight text-gray-900 dark:text-white">
<h2 className="mt-3 mb-2.5 text-2xl font-bold tracking-tight text-gray-900 dark:text-white">
{name}
</h5>
</h2>
<p className="font-normal text-gray-700 dark:text-gray-400">
{description.length > 83
? description.slice(0, 83) + "..."
Expand Down

1 comment on commit bb6395f

@vercel
Copy link

@vercel vercel bot commented on bb6395f Oct 3, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

portfolio-web – ./

ikrammaulana.vercel.app
portfolio-web-git-main-ikrammaulana.vercel.app
portfolio-web-ikrammaulana.vercel.app

Please sign in to comment.