Add section for publication

README.md

@@ -69,6 +69,7 @@
 ✓ [Certification Section](#certifications)  
 ✓ [Education Section](#education)  
 ✓ [Projects Section](#projects)  
+✓ [Publication Section](#publications)  
 ✓ [Blog Posts Section](#blog-posts)
 
 To view a live example, **[click here](https://arifszn.github.io/gitprofile)**.
@@ -282,6 +283,17 @@ const CONFIG = {
       to: '2014',
     },
   ],
+  publications: [
+    {
+      title: 'Publication Title',
+      conferenceName: 'Conference Name',
+      journalName: 'Journal Name',
+      authors: 'John Doe, Jane Smith',
+      link: 'https://example.com',
+      description:
+        'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed euismod, nunc ut.',
+    },
+  ],
   // Display articles from your medium or dev account. (Optional)
   blog: {
     source: 'dev', // medium | dev
@@ -660,6 +672,30 @@ const CONFIG = {
 };
 ```
 
+### Publications
+
+Provide your academic publishing in `publications`.
+
+```ts
+// gitprofile.config.ts
+const CONFIG = {
+  // ...
+  publications: [
+    {
+      title: 'Publication Title',
+      conferenceName: 'Conference Name',
+      journalName: 'Journal Name',
+      authors: 'John Doe, Jane Smith',
+      link: 'https://example.com',
+      description:
+        'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed euismod, nunc ut.',
+    },
+  ],
+};
+```
+
+Empty array will hide the publications section.
+
 ### Blog Posts
 
 If you have [medium](https://medium.com) or [dev](https://dev.to) account, you can show your recent blog posts in here just by providing your medium/dev username. You can limit how many posts to display (Max is `10`).

gitprofile.config.ts

@@ -132,6 +132,26 @@ const CONFIG = {
       to: '2014',
     },
   ],
+  publications: [
+    {
+      title: 'Publication Title',
+      conferenceName: '',
+      journalName: 'Journal Name',
+      authors: 'John Doe, Jane Smith',
+      link: 'https://example.com',
+      description:
+        'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.',
+    },
+    {
+      title: 'Publication Title',
+      conferenceName: 'Conference Name',
+      journalName: '',
+      authors: 'John Doe, Jane Smith',
+      link: 'https://example.com',
+      description:
+        'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.',
+    },
+  ],
   // Display articles from your medium or dev account. (Optional)
   blog: {
     source: 'dev', // medium | dev

global.d.ts

@@ -217,6 +217,15 @@ interface Education {
   to: string;
 }
 
+interface Publication {
+  title: string;
+  conferenceName?: string;
+  journalName?: string;
+  authors?: string;
+  link?: string;
+  description?: string;
+}
+
 interface GoogleAnalytics {
   /**
    * GA3 tracking id/GA4 tag id UA-XXXXXXXXX-X | G-XXXXXXXXXX
@@ -370,6 +379,11 @@ interface Config {
    */
   educations?: Array<Education>;
 
+  /**
+   * Publication list
+   */
+  publications?: Array<Publication>;
+
   /**
    * Resume
    */

src/components/blog-card/index.tsx

@@ -132,7 +132,7 @@ const BlogCard = ({
               <div className="w-full">
                 <div className="flex items-start px-4">
                   <div className="text-center md:text-left w-full">
-                    <h2 className="font-semibold text-base-content opacity-60">
+                    <h2 className="font-medium text-base-content opacity-60">
                       {article.title}
                     </h2>
                     <p className="text-base-content opacity-50 text-xs">

src/components/certification-card/index.tsx

@@ -19,7 +19,7 @@ const ListItem = ({
       style={{ left: '-4.5px' }}
     ></div>
     <div className="my-0.5 text-xs">{year}</div>
-    <div className="font-semibold">
+    <div className="font-medium">
       <a href={link} target="_blank" rel="noreferrer">
         {name}
       </a>
@@ -78,22 +78,15 @@ const CertificationCard = ({
               renderSkeleton()
             ) : (
               <>
-                {certifications
-                  .filter(
-                    (certification) =>
-                      certification.year ||
-                      certification.name ||
-                      certification.body,
-                  )
-                  .map((certification, index) => (
-                    <ListItem
-                      key={index}
-                      year={certification.year}
-                      name={certification.name}
-                      body={certification.body}
-                      link={certification.link}
-                    />
-                  ))}
+                {certifications.map((certification, index) => (
+                  <ListItem
+                    key={index}
+                    year={certification.year}
+                    name={certification.name}
+                    body={certification.body}
+                    link={certification.link}
+                  />
+                ))}
               </>
             )}
           </ol>

src/components/education-card/index.tsx

@@ -70,19 +70,14 @@ const EducationCard = ({
               renderSkeleton()
             ) : (
               <>
-                {educations
-                  .filter(
-                    (item) =>
-                      item.institution || item.degree || item.from || item.to,
-                  )
-                  .map((item, index) => (
-                    <ListItem
-                      key={index}
-                      time={`${item.from} - ${item.to}`}
-                      degree={item.degree}
-                      institution={item.institution}
-                    />
-                  ))}
+                {educations.map((item, index) => (
+                  <ListItem
+                    key={index}
+                    time={`${item.from} - ${item.to}`}
+                    degree={item.degree}
+                    institution={item.institution}
+                  />
+                ))}
               </>
             )}
           </ol>

src/components/experience-card/index.tsx

@@ -75,27 +75,19 @@ const ExperienceCard = ({
               renderSkeleton()
             ) : (
               <Fragment>
-                {experiences
-                  .filter(
-                    (experience) =>
-                      experience.company ||
-                      experience.position ||
-                      experience.from ||
-                      experience.to,
-                  )
-                  .map((experience, index) => (
-                    <ListItem
-                      key={index}
-                      time={`${experience.from} - ${experience.to}`}
-                      position={experience.position}
-                      company={experience.company}
-                      companyLink={
-                        experience.companyLink
-                          ? experience.companyLink
-                          : undefined
-                      }
-                    />
-                  ))}
+                {experiences.map((experience, index) => (
+                  <ListItem
+                    key={index}
+                    time={`${experience.from} - ${experience.to}`}
+                    position={experience.position}
+                    company={experience.company}
+                    companyLink={
+                      experience.companyLink
+                        ? experience.companyLink
+                        : undefined
+                    }
+                  />
+                ))}
               </Fragment>
             )}
           </ol>

src/components/external-project-card/index.tsx

@@ -93,7 +93,7 @@ const ExternalProjectCard = ({
             <div className="w-full">
               <div className="px-4">
                 <div className="text-center w-full">
-                  <h2 className="font-semibold text-lg tracking-wide text-center opacity-60 mb-2">
+                  <h2 className="font-medium text-lg text-center opacity-60 mb-2">
                     {item.title}
                   </h2>
                   {item.imageUrl && (

src/components/gitprofile.tsx

@@ -29,6 +29,7 @@ import GithubProjectCard from './github-project-card';
 import ExternalProjectCard from './external-project-card';
 import BlogCard from './blog-card';
 import Footer from './footer';
+import PublicationCard from './publication-card';
 
 /**
  * Renders the GitProfile component.
@@ -255,6 +256,12 @@ const GitProfile = ({ config }: { config: Config }) => {
                         googleAnalyticsId={sanitizedConfig.googleAnalytics.id}
                       />
                     )}
+                    {sanitizedConfig.publications.length !== 0 && (
+                      <PublicationCard
+                        loading={loading}
+                        publications={sanitizedConfig.publications}
+                      />
+                    )}
                     {sanitizedConfig.projects.external.projects.length !==
                       0 && (
                       <ExternalProjectCard