Skip to content

Commit

Permalink
fix(counter): increment section heading and nav item numbering through
Browse files Browse the repository at this point in the history
css counter
Phurb-a committed Sep 26, 2024
1 parent 137fbd3 commit 75a6f69
Showing 6 changed files with 19 additions and 8 deletions.
17 changes: 14 additions & 3 deletions app/globals.css
Original file line number Diff line number Diff line change
@@ -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 {
2 changes: 1 addition & 1 deletion components/partials/About.tsx
Original file line number Diff line number Diff line change
@@ -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
2 changes: 1 addition & 1 deletion components/partials/Experience.tsx
Original file line number Diff line number Diff line change
@@ -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"]}
2 changes: 1 addition & 1 deletion components/partials/Nav.tsx
Original file line number Diff line number Diff line change
@@ -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>
);
2 changes: 1 addition & 1 deletion components/partials/Projects.tsx
Original file line number Diff line number Diff line change
@@ -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 },
2 changes: 1 addition & 1 deletion next.config.mjs
Original file line number Diff line number Diff line change
@@ -7,7 +7,7 @@ const nextConfig = {
ignoreBuildErrors: true,
},
output: "export",
basePath: "/v3",
basePath: "",
};

export default nextConfig;

0 comments on commit 75a6f69

Please sign in to comment.