feat: make the icons rounded

keploy · Nov 6, 2024 · d989897 · d989897
1 parent b89fd04
commit d989897
Showing 1 changed file with 18 additions and 20 deletions.
diff --git a/components/ui/header.tsx b/components/ui/header.tsx
@@ -7,7 +7,7 @@ import Logo from "./logo";
 import MobileMenu from "./mobile-menu";
 import CountingNumbers from "../utils/countingNumbers";
 import { isTypeOfExpression } from "typescript";
-import NavItemWithSmallDropdown, {DropdowndataInterface,LinkDatainterface} from "@/components/nav/navItemWithSmallDropdown";
+import NavItemWithSmallDropdown, { DropdowndataInterface, LinkDatainterface } from "@/components/nav/navItemWithSmallDropdown";
 import { PillarPages } from "../utils/resources";
 import { StarIcon } from "@heroicons/react/24/solid";
 export default function Header() {
@@ -56,11 +56,10 @@ export default function Header() {
 
   return (
     <header
-      className={`fixed place-self-center z-30 bg-neutral-100 transition duration-300 ease-in-out ${
-        !top ? "bg-neutral-100 place-self-center backdrop-blur-sm my-5 shadow-lg rounded-full w-fit ease-in-out" : "w-full"
-      }`}
+      className={`fixed place-self-center z-30 bg-neutral-100 transition duration-300 ease-in-out ${!top ? "bg-neutral-100 place-self-center backdrop-blur-sm my-5 shadow-lg rounded-full w-fit ease-in-out" : "w-full"
+        }`}
     >
-{/* 
+      {/* 
 <header
       className={`fixed w-fit place-self-center shadow-lg my-5 z-30 bg-neutral-100 rounded-full transition duration-300 ease-in-out ${
         !top ? "bg-neutral-100 backdrop-blur-sm shadow-lg" : ""
@@ -76,7 +75,7 @@ export default function Header() {
           <nav className="hidden lg:flex  flex-grow-0 w-6/12">
             {/* Desktop privacy-policy in links */}
             <ul className="flex grow justify-end flex items-center">
-            <li>
+              <li>
                 <Link
                   target="_blank"
                   href="https://keploy.io/devscribe"
@@ -122,10 +121,9 @@ export default function Header() {
             </ul>
           </nav>
           <div className="header-btn-container flex-grow-0 w-4/12 justify-end hidden lg:flex">
-          <div className="border border-primary-400 rounded-md overflow-hidden p-2.5 border-opacity-40 relative transition-all  group">
+            <div className="border border-primary-400 rounded-full overflow-hidden p-2.5 border-opacity-40 relative transition-all  group">
               {/* Sliding effect span */}
               <span className="absolute right-0 -mt-12 h-32 w-8 translate-x-12 rotate-12 bg-orange-500 opacity-10 transition-transform duration-1000 ease-out group-hover:translate-x-[-400%]" />
-
               <Link
                 className="flex items-center gap-2 text-sm text-primary-400 font-extrabold transition-colors hover:text-primary-500"
                 target="_blank"
@@ -153,18 +151,18 @@ export default function Header() {
                 <span className="text-base flex gap-1"> <CountingNumbers className="" /></span>
               </Link>
             </div>
-          <div className="ml-3">
-            <Link
-              href="https://app.keploy.io/signin"
-              target="_blank"
-              className="btn-sm text-gray-200 bg-secondary-300 h-12 hover:text-primary-300 "
-            >
-              <span>Sign In</span>
-              {/*<svg className="w-3 h-3 fill-current   hover:text-primary-300 shrink-0 ml-2 -mr-1" viewBox="0 0 12 12" xmlns="http://www.w3.org/2000/svg">*/}
-              {/*  <path d="M11.707 5.293L7 .586 5.586 2l3 3H0v2h8.586l-3 3L7 11.414l4.707-4.707a1 1 0 000-1.414z" fillRule="nonzero" />*/}
-              {/*</svg>*/}
-            </Link>
-          </div>
+            <div className="rounded-full ml-3">
+              <Link
+                href="https://app.keploy.io/signin"
+                target="_blank"
+                className="btn-sm rounded-full text-gray-200 bg-secondary-300 h-12 hover:text-primary-300 "
+              >
+                <span>Sign In</span>
+                {/*<svg className="w-3 h-3 fill-current   hover:text-primary-300 shrink-0 ml-2 -mr-1" viewBox="0 0 12 12" xmlns="http://www.w3.org/2000/svg">*/}
+                {/*  <path d="M11.707 5.293L7 .586 5.586 2l3 3H0v2h8.586l-3 3L7 11.414l4.707-4.707a1 1 0 000-1.414z" fillRule="nonzero" />*/}
+                {/*</svg>*/}
+              </Link>
+            </div>
           </div>
 
           <MobileMenu starsCount={starsCount} />