From 75a6f6923e6040243e3ed35866e606d4aeb04fc6 Mon Sep 17 00:00:00 2001
From: wownepal <phurba.sherpa@wowfinstacknepal.com>
Date: Thu, 26 Sep 2024 08:13:34 +0545
Subject: [PATCH] fix(counter): increment  section heading and nav item
 numbering through css counter

---
 app/globals.css                    | 17 ++++++++++++++---
 components/partials/About.tsx      |  2 +-
 components/partials/Experience.tsx |  2 +-
 components/partials/Nav.tsx        |  2 +-
 components/partials/Projects.tsx   |  2 +-
 next.config.mjs                    |  2 +-
 6 files changed, 19 insertions(+), 8 deletions(-)

diff --git a/app/globals.css b/app/globals.css
index c9af279..48042db 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -134,6 +134,10 @@
     src: url(/fonts/SFMono/SFMono-Semibold.ttf) format("truetype");
   }
 
+  :root {
+    counter-reset: link;
+  }
+
   h1 {
   }
   h2 {
@@ -144,7 +148,8 @@
   }
   h4 {
   }
-  main {
+  body {
+    counter-reset: head;
   }
 }
 
@@ -176,8 +181,8 @@
 
   .head-numbering::before {
     @apply mr-1 md:mr-3 font-normal text-xl text-green font-mono bottom-1;
-    counter-increment: section 1;
-    content: "0" counter(section) ".";
+    counter-increment: head;
+    content: "0" counter(head) ".";
     position: relative;
   }
 
@@ -188,6 +193,12 @@
     width: 300px;
     height: 1px;
   }
+  .nav-link::before {
+    @apply text-green font-mono mr-1 text-xs;
+
+    counter-increment: link;
+    content: "0" counter(link) ".";
+  }
 
   @media (max-width: 760px) {
     .head-numbering::after {
diff --git a/components/partials/About.tsx b/components/partials/About.tsx
index 30b01d5..4015198 100644
--- a/components/partials/About.tsx
+++ b/components/partials/About.tsx
@@ -10,7 +10,7 @@ const recentSkillList = [
 export const About = () => {
   return (
     <section id="about" className="py-16 md:py-24 lg:w-[90%] mx-auto">
-      <h2 className="head-numbering">About Me</h2>
+      <h2 className="head-numbering title-about">About Me</h2>
       <p className="text-xl mb-4 max-w-[65ch]">
         Hello! I am Phurba Sherpa, a React Developer based in Pokhara, Nepal. I
         building the Front-end of Websites and Web Applications that leads to
diff --git a/components/partials/Experience.tsx b/components/partials/Experience.tsx
index 9fa3ae8..5a6b5e2 100644
--- a/components/partials/Experience.tsx
+++ b/components/partials/Experience.tsx
@@ -6,7 +6,7 @@ export const Experience = () => {
   const [tabIndex, setTabIndex] = useState(0);
   return (
     <section id="experience" className="py-16 md:py-24 lg:w-[90%] mx-auto">
-      <h2 className="head-numbering">Where I've Worked</h2>
+      <h2 className="head-numbering title-work">Where I've Worked</h2>
       <div className="flex flex-col md:flex-row">
         <Tabs
           tabs={["Wow Finstack", "IT Village"]}
diff --git a/components/partials/Nav.tsx b/components/partials/Nav.tsx
index ef8a1e8..0d9a299 100644
--- a/components/partials/Nav.tsx
+++ b/components/partials/Nav.tsx
@@ -54,7 +54,7 @@ export const Nav = () => {
 
 const NavItem = ({ label, link }) => {
   return (
-    <li className="before:content-['01.'] before:text-green font-mono text-slate-200 before:mr-1">
+    <li className="nav-link font-mono text-slate-200">
       <a href={link}>{label}</a>
     </li>
   );
diff --git a/components/partials/Projects.tsx b/components/partials/Projects.tsx
index 19d1ecc..07a1758 100644
--- a/components/partials/Projects.tsx
+++ b/components/partials/Projects.tsx
@@ -5,7 +5,7 @@ import { projects } from "@/data/projects";
 export const Projects = () => {
   return (
     <section id="work" className="py-16 md:py-24 lg:w-[90%] mx-auto">
-      <h2 className="head-numbering">Some Things I’ve Built</h2>
+      <h2 className="head-numbering title-project">Some Things I’ve Built</h2>
       {projects.map(
         (
           { imageUrl, techList, desc, title, codePreview, sitePreview },
diff --git a/next.config.mjs b/next.config.mjs
index ed35180..92a9437 100644
--- a/next.config.mjs
+++ b/next.config.mjs
@@ -7,7 +7,7 @@ const nextConfig = {
     ignoreBuildErrors: true,
   },
   output: "export",
-  basePath: "/v3",
+  basePath: "",
 };
 
 export default nextConfig;