Merge pull request #184 from inderharrysingh/fix/navbar-position

Fix/searchbar position

Author: max-programming

components/Card.tsx

@@ -37,7 +37,9 @@ function Card({ repo }: Props) {
             </h2>
           </div>
 
-          <h6 className="my-5 text-2023-manga-2 text-lg">{emojify(repo.description)}</h6>
+          <h6 className="my-5 text-2023-manga-2 text-lg">
+            {emojify(repo.description)}
+          </h6>
 
           <div className="card-actions gap-y-3">
             {repo.topics.map((topic: string) => (
@@ -86,7 +88,9 @@ function Card({ repo }: Props) {
           >
             <GoRepoForked className="text-yellow-200 text-2xl" />
             <div className="flex flex-col">
-              <div className="text-lg xl:text-2xl font-semibold mb-0.5">{repo.forks}</div>
+              <div className="text-lg xl:text-2xl font-semibold mb-0.5">
+                {repo.forks}
+              </div>
               <div className="text-neutral-300 text-xs lg:text-sm">Forks</div>
             </div>
             <div

components/Header.tsx

@@ -28,10 +28,10 @@ function Header() {
 
           <SearchBar searchBarWrapperStyles="hidden sm:inline-flex flex-1 max-w-md px-6" />
 
-          <div className="flex-none">
+          <div className="flex-none lg:ml-40  md:10">
             <Link
               href="/contributors"
-              className="btn btn-square btn-ghost umami--click--contributors-button"
+              className="btn btn-square btn-ghost umami--click--contributors-button "
             >
               <BsPeopleFill size="1.5rem" color='white' title="Contributors" />
             </Link>
@@ -40,7 +40,7 @@ function Header() {
               href="https://github.com/max-programming/hacktoberfest-projects"
               target="_blank"
               rel="noreferrer"
-              className="btn btn-square btn-ghost umami--click--github-button"
+              className="btn btn-square btn-ghost umami--click--github-button ml-"
             >
               <IoLogoGithub size="1.5rem" color='white' title="GitHub" />
             </a>
@@ -53,4 +53,4 @@ function Header() {
   );
 }
 
-export default Header;
+export default Header;

components/Sort.tsx

@@ -25,38 +25,37 @@ export default function Sort() {
 
   const navigationItems = [
     {
-      name: "Best match",
+      name: 'Best match',
       href: { query: { ...router.query } }
     },
     {
-      name: "Most stars",
+      name: 'Most stars',
       href: { query: { ...router.query, s: 'stars', o: 'desc' } }
     },
     {
-      name: "Fewest stars",
+      name: 'Fewest stars',
       href: { query: { ...router.query, s: 'stars', o: 'asc' } }
     },
     {
-      name: "Most forks",
+      name: 'Most forks',
       href: { query: { ...router.query, s: 'forks', o: 'desc' } }
     },
     {
-      name: "Fewest forks",
+      name: 'Fewest forks',
       href: { query: { ...router.query, s: 'forks', o: 'asc' } }
     },
     {
-      name: "Most help wanted issues",
+      name: 'Most help wanted issues',
       href: { query: { ...router.query, s: 'help-wanted-issues', o: 'desc' } }
     },
     {
-      name: "Recently updated",
+      name: 'Recently updated',
       href: { query: { ...router.query, s: 'updated', o: 'desc' } }
     },
     {
-      name: "Least recently updated",
+      name: 'Least recently updated',
       href: { query: { ...router.query, s: 'updated', o: 'asc' } }
-    },
-
+    }
   ];
 
   const selectedSort = (): SortTypes => {
@@ -110,9 +109,7 @@ export default function Sort() {
           <ul tabIndex={0} className="menu menu-vertical">
             {navigationItems.map((item, index) => (
               <li key={index}>
-                <Link href={{ query: item.href.query }}>
-                  {item.name}
-                </Link>
+                <Link href={{ query: item.href.query }}>{item.name}</Link>
               </li>
             ))}
           </ul>

components/StarsFilter.tsx

@@ -79,7 +79,10 @@ export default function StarsFilter() {
           control={control}
         />
 
-        <button className="btn btn-ghost ml-2 text-2023-manga-2 ring-1 ring-2023-manga-2" type="submit">
+        <button
+          className="btn btn-ghost ml-2 text-2023-manga-2 ring-1 ring-2023-manga-2"
+          type="submit"
+        >
           Search
         </button>
       </div>

package.json

@@ -41,4 +41,4 @@
     "tailwindcss": "^3.3.3",
     "typescript": "5.2.2"
   }
-}
+}

pages/contributors.tsx

@@ -34,7 +34,9 @@ export default function Contrubutors({ contributors }: Props) {
     <div>
       <Header />
       <div className="container mx-auto mb-5">
-        <h1 className="my-5 text-neutral-100 text-5xl font-bold text-center">Contributors ✨</h1>
+        <h1 className="my-5 text-neutral-100 text-5xl font-bold text-center">
+          Contributors ✨
+        </h1>
         <div className="grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-4">
           {contributors.map(contributor => (
             <ContributorCard