updated future roadwork section in readme file

Author: GoJo-Rika

README.md

@@ -96,12 +96,12 @@ This project is a continuous work in progress. Here are some of the features and
 
 *   `[ ]` **Integrate a CSS Framework (e.g., Bootstrap):** To further improve the responsive design and accelerate the addition of new UI components, I plan to refactor the custom CSS to use a professional framework. This will involve updating the HTML templates to use the framework's class system.
 
-*   `[ ]` **Implement a Direct Contact Form:** To provide an alternative to the `mailto:` link, I plan to integrate a third-party service (like Formspree) to handle direct message submissions from a form on the contact page. This will require setting up the service and adding a `<form>` element to the `contact_template.html`.
+*   `[ ]` **Implement a Direct Contact Form:** To provide an alternative to the `mailto:` link, I plan to integrate a third-party service (like Formspree) to handle direct message submissions from a form on the contact page. This will require setting up the service and adding a `<form>` element to the [`contact_template.html`](contact_template.html).
 
 *   `[x]` **Add Search Functionality:** Implemented a client-side search feature using vanilla JavaScript. A search index is auto-generated at build time and a floating search button (with ⌘K shortcut) opens a modal overlay to search across all blog post titles, summaries, and tags.
 
 *   `[ ]` **Content Expansion:**
-    *   Add more projects to the `json` file.
+    *   Add more projects to the [`json`](portfolio-mit_v1.json) file.
     *   Write more technical blog posts.
     *   Continue to expand and refine the `tech_stack` with new skills.
 
@@ -115,24 +115,39 @@ This project is a continuous work in progress. Here are some of the features and
 
 *   `[ ]` **Organise data inside `json` file:**
     *   Keep the data in a structured format so there are no duplicates.
-    *   The data for a project/blog must be together (`project_db`) to make it easier to edit details like Github URLs, blog images, project card thumbnail, blog home page summary, etc, etc, etc.
-    *   Follow the structure given in `update-data.json` and `project_db.json` in `future-work/` folder.
+    *   The data for a project/blog must be together ([`project_db`](future-work/project_db.json)) to make it easier to edit details like Github URLs, blog images, project card thumbnail, blog home page summary, etc, etc, etc.
+    *   Follow the structure given in [`update-data.json`](future-work/updated-data.json) and [`project_db.json`](future-work/project_db.json) in [`future-work`](future-work/) folder.
 
 *   `[ ]` **Add read story section in project page:**
     *   In the project page, under the given project card, add a link to read the blog along with viewing it on github.
     *   The blog will be redirected to the 1st blog in the series.
 
 *   `[ ]` **Keep 3 projects columns:**
-    *   Need to make changes in `project_template` to make sure it includes 3 project cards in each row. (see `future-work/images/project-page.png`)
+    *   Need to make changes in [`project_template`](projects_template.html) to make sure it includes 3 project cards in each row. (see [`future-work/images/project-page.png`](future-work/images/project-page.png))
 
 *   `[ ]` **Add heading sections inside blog post page:**
     *   In the blog post page, add page headings and links for easy scrolling and navigating through the page. 
     *   This also helps in giving a brief of the blog post page.
-    *   See `future-work/images/blog-post-page.png` for reference and `future-work/images/reference-sample.png`
+    *   See [`future-work/images/blog-post-page.png`](future-work/images/blog-post-page.png) for reference and [`future-work/images/reference-sample.png`](future-work/images/reference-sample.png)
 
 *   `[ ]` **Architecture diagram and video or a gif:**
     *   Add architecture diagram of the project or the blog or create a video doing a walkthrough of the project or a gif of the working ui.
 
 *   `[x]` **Add horizontal progress scroll bar:**
     *   Add horizontal progress scroll bar to the top of the page to make it easier for users to navigate the page.
 
+* `[ ]` **Add dynamic pagination for blog page:**
+    *   Add dynamic pagination for blog page to make it easier for users to navigate through the blog posts. --> `Load More Posts` button at the end of the blog page. (see [`future-work/images/dynamic-pagination.png`](future-work/images/dynamic-pagination.png))
+
+* `[ ]` **Add table of contents in posts page:**
+    *   Add table of contents in posts page to make it easier for users to navigate through the blog posts. (see [`future-work/images/table-of-content-2.png`](future-work/images/table-of-content-2.png) and [`future-work/images/table-of-content-3.png`](future-work/images/table-of-content-3.png))
+
+* `[ ]` **Add a section in blog page to show the number of posts:**
+    *   Add a section in blog page to show the number of posts. (see `future-work/images/number-of-posts.png`)
+
+* `[ ]` **Clean individual html files by removing extra white space:**
+    *   Remove extra white space from individual html files to make them more readable. (see [`future-work/images/unclean-html-code-block.png`](future-work/images/unclean-html-code-block.png))
+
+* `[ ]` **Modify the code such that the sidebar is fixed in the page while scrolling down (sticky positioning):**
+    *   where the sidebar (or an element) remains fixed in place while the rest of the page scrolls—is called "sticky positioning" in web design. (see [`future-work/images/sticky-positioning-highlight-01.png`](future-work/images/sticky-positioning-highlight-01.png) and [`future-work/images/sticky-positioning-highlight-02.png`](future-work/images/sticky-positioning-highlight-02.png))
+