Codex/fix blog tagscodex

README.md

@@ -1,87 +1,12 @@
----
-title: "About"
-permalink: "/about/"
-layout: page
----
+# Asim Raza Portfolio
 
-## Github Pages
+This repository contains my GitHub Pages portfolio site built with Jekyll.
 
-Just fork this [repository](https://github.com/niklasbuschmann/contrast) to `your_username.github.io` and adjust the `_config.yml` to use with [Github Pages](https://pages.github.com/) and your page is done.
+Live site:
+- https://asim-raza665.github.io
 
-## Features
-
- - dark mode
- - [KaTeX](https://katex.org) included
- - no external ressources
- - optional sidebar
- - archive page
- - syntax highlighting
- - supports comments via [disqus](https://disqus.com/) or [isso](http://posativ.org/isso/)
-
-## Installation
-
-To run locally [install Ruby](https://www.ruby-lang.org/en/documentation/installation/) and then run:
-
-```
-git clone https://github.com/niklasbuschmann/contrast.git
-cd contrast
-gem install bundler jekyll jekyll-feed
-bundle exec jekyll serve
-```
-
-## Config
-
-Your `_config.yml` could for example look like this:
-
-```yaml
-title: "Blog Title"
-author: "Blog Author"
-description: "My blog"
-permalink: /:title/
-lang: "en"
-excerpt_separator: "\n\n\n"
-date_format: "%B %d, %Y"
-
-# Layout
-
-show_excerpts: true             # show article excerpts instead of archive list on the home page
-show_frame: true                # display a grey frame on large screens
-show_sidebar: false             # show a sidebar instead of the usual header
-show_minimal: false             # remove all clutter
-
-# Menu                          # for available icons see https://fontawesome.com/v5/icons/
-
-navigation:                     # accepts {file, title, url, icon, sidebaricon}
-  - {file: "archive.html", sidebaricon: home}
-  - {file: "README.md", sidebaricon: address-card}
-
-external:                       # accepts {file, title, url, icon, sidebaricon}
-  - {title: Mail, icon: envelope, url: "mailto:author@example.com"}
-  - {title: Github, icon: github, url: "https://github.com/"}
-  - {title: Subscribe, icon: rss, url: "/feed.xml"}
-
-comments:
-#  disqus_shortname: ""         # see https://disqus.com
-#  isso_domain: ""              # see https://isso-comments.de
-
-plugins:
- - jekyll-feed
-```
-
-## Math
-
-Contrast comes preinstalled with a leightweight alternative to MathJax called [KaTeX](https://katex.org/). To display equations in a post simply set `mathjax: true` in the article's front matter. [Jektex](https://github.com/yagarea/jektex) can be used to pre-render math on the server side.
-
-## License
-
-[public domain](http://unlicense.org/)
-
-## Screenshots
-
-![screenshot](https://github.com/user-attachments/assets/8f0ef4bc-f079-495e-8c31-5867b8ccd25c)
-
-![screenshot](https://github.com/user-attachments/assets/e5e6d189-3251-41f4-baba-ff42be65f666)
-
-![screenshot](https://github.com/user-attachments/assets/d31879ae-7113-42be-b580-1e96a2aedd29)
-
-![screenshot](https://github.com/user-attachments/assets/d524ce47-8d8c-473e-afc6-79b34fae63e8)
+Main sections:
+- Home
+- About
+- Contact
+- Blog

_config.yml

@@ -1,34 +1,35 @@
-title: "Blog Title"
-author: "Blog Author"
-description: "My blog"
-permalink: /:title/
+title: "Asim Raza"
+author: "Asim Raza"
+description: "Computer Engineering student documenting growth, resilience, projects, and long-term technical learning."
+permalink: /blog/:title/
 lang: "en"
-excerpt_separator: "\n\n\n"
 date_format: "%B %d, %Y"
+location: "Mandi Bahauddin, Punjab, Pakistan"
 
-# Layout
+show_excerpts: false
+show_frame: false
+show_sidebar: false
+show_minimal: false
 
-show_excerpts: true             # show article excerpts instead of archive list on the home page
-show_frame: true                # display a grey frame on large screens
-show_sidebar: false             # show a sidebar instead of the usual header
-show_minimal: false             # remove all clutter
+navigation:
+  - {file: "index.md", title: "Home"}
+  - {file: "about.md", title: "About"}
+  - {file: "blog.md", title: "Blog"}
+  - {file: "contact.md", title: "Contact"}
 
-#show_frame: "/assets/images/background.svg"
+external:
+  - {title: "Email", icon: envelope, url: "mailto:gondalasim665@gmail.com"}
+  - {title: "GitHub", icon: github, url: "https://github.com/asim-raza665"}
 
-# Menu                          # for available icons see https://fontawesome.com/v5/icons/
-
-navigation:                     # accepts {file, title, url, icon, sidebaricon}
-  - {file: "archive.html", sidebaricon: home}
-  - {file: "README.md", sidebaricon: address-card}
-
-external:                       # accepts {file, title, url, icon, sidebaricon}
-  - {title: Mail, icon: envelope, url: "mailto:author@example.com"}
-  - {title: Github, icon: github, url: "https://github.com/niklasbuschmann/contrast"}
-  - {title: Subscribe, icon: rss, url: "/feed.xml"}
+footer:
+  - {file: "about.md", title: "Journey"}
+  - {file: "blog.md", title: "Articles"}
+  - {title: "GitHub", url: "https://github.com/asim-raza665"}
 
 comments:
-#  disqus_shortname: ""         # see https://disqus.com
-#  isso_domain: ""              # see https://isso-comments.de
 
 plugins:
- - jekyll-feed
+  - jekyll-feed
+
+sass:
+  style: compressed

_data/stats.yml

@@ -0,0 +1,2 @@
+cgpa: "3.83"
+position: "3rd"

_includes/head.html

@@ -1,9 +1,29 @@
-<title>{% if page.title %}{{ page.title | escape }} | {% endif %}{{ site.title | escape }}</title>
+<title>{% if page.title and page.title != "Home" %}{{ page.title | escape }} | {% endif %}{{ site.title | escape }}</title>
 <meta charset="{{ site.encoding }}">
 <meta name="viewport" content="width=device-width, initial-scale=1">
-<meta name="color-scheme" content="light dark">
+<meta name="color-scheme" content="dark">
+<script>
+  (function() {
+    try {
+      var storedTheme = localStorage.getItem('site-theme');
+      if (storedTheme === 'light') {
+        document.documentElement.setAttribute('data-theme', 'light');
+        var colorSchemeMeta = document.querySelector('meta[name="color-scheme"]');
+        if (colorSchemeMeta) {
+          colorSchemeMeta.setAttribute('content', 'light');
+        }
+      } else {
+        document.documentElement.setAttribute('data-theme', 'dark');
+      }
+    } catch (error) {
+      document.documentElement.setAttribute('data-theme', 'dark');
+    }
+  })();
+</script>
 <meta name="author" content="{{ page.author | default: site.author | escape }}">
 <meta name="generator" content="Jekyll v{{ jekyll.version }}">
+<meta name="description" content="{{ page.description | default: site.description | escape }}">
+<meta name="theme-color" content="#0f2a3f">
 <link rel="canonical" href="{{ page.url | absolute_url }}">
 {%- if site.show_minimal -%}
 <link rel="stylesheet" href="{{ "/assets/css/minimal.css" | relative_url }}">
@@ -13,6 +33,7 @@
 <link rel="stylesheet" href="{{ "/assets/css/index.css" | relative_url }}">
 {%- endif -%}
 <link rel="stylesheet" href="{{ "/assets/PT-Sans/index.css" | relative_url }}">
+<link rel="stylesheet" href="{{ "/assets/css/portfolio.css" | relative_url }}">
 {%- if site.plugins contains "jekyll-feed" -%}
 <link rel="alternate" href="{{ site.feed.path | default: "/feed.xml" | relative_url }}" type="application/atom+xml" title="{{ site.title }}">
 {%- endif -%}
@@ -29,4 +50,5 @@
 {%- if site.comments.isso_domain and page.layout == "post" -%}
 <script data-isso="http://{{ site.comments.isso_domain }}" src="//{{ site.comments.isso_domain }}/js/embed.min.js"></script>
 {%- endif -%}
-{%- if site.show_sidebar %}{% include sidebar.html %}{% endif %}
+<script defer src="{{ "/assets/js/toggle-color.js" | relative_url }}"></script>
+{%- if site.show_sidebar %}{% include sidebar.html %}{% endif %}

_includes/menu.html

@@ -4,7 +4,7 @@
   {%- assign node = site.pages | where: "name", item.file | first -%}
   {%- assign url = item.url | default: node.url -%}
   {%- assign title = item.title | default: node.title -%}
-  <a href="{{ url | relative_url }}">
+  <a href="{{ url | relative_url }}"{% if node and page.url == node.url %} class="is-active"{% endif %}>
     {%- if item.icon -%}
       <svg aria-label="{{ title }}" width="1em" height="1em"><use xlink:href="{{ "/assets/fontawesome/icons.svg" | relative_url }}#{{ item.icon }}"></use></svg>
     {%- else -%}

_layouts/default.html

@@ -1,23 +1,33 @@
 <!DOCTYPE html>
 <html lang="{{ page.lang | default: site.lang }}">
+<head>
+  {% include head.html %}
+</head>
+<body class="{{ page.layout }}{% if page.body_class %} {{ page.body_class }}{% endif %}">
+  <header class="site-header hover smooth">
+    {% unless site.show_minimal and site.navigation and site.external %}
+      <div class="site-header__brand">
+        <h1 {% if site.navigation and site.external %}class="full"{% endif %}>
+          <a href="{{ "/" | relative_url }}">{{ site.title | escape }}</a>
+        </h1>
+        <p class="site-header__tagline">Computer Engineering Portfolio</p>
+      </div>
+    {% endunless %}
+    {% include menu.html menu=site.navigation %}
+    {% include menu.html menu=site.external %}
+    <button class="theme-toggle" type="button" data-theme-toggle aria-label="Toggle dark and light theme">
+      <span class="icon-moon">🌙</span>
+      <span class="icon-sun">☀️</span>
+    </button>
+  </header>
 
-{% include head.html %}
-
-<header class="hover smooth">
-  {% unless site.show_minimal and site.navigation and site.external %}
-    <h1 {% if site.navigation and site.external %}class="full"{% endif %}><a href="{{ "/" | relative_url }}">{{ site.title | escape }}</a></h1>
-  {% endunless %}
-  {% include menu.html menu=site.navigation %}
-  {% include menu.html menu=site.external %}
-</header>
-
-{{ content }}
-
-{%- if site.footer -%}
-<footer class="hover">
-  <div>{{ site.description }}</div>
-  {% include menu.html menu=site.footer %}
-</footer>
-{%- endif -%}
+  {{ content }}
 
+  {%- if site.footer -%}
+  <footer class="site-footer hover">
+    <div>{{ site.description }}</div>
+    {% include menu.html menu=site.footer %}
+  </footer>
+  {%- endif -%}
+</body>
 </html>

_layouts/page.html

@@ -1,7 +1,13 @@
 ---
 layout: default
 ---
-<article>
-  {% include meta.html post=page %}
+<article class="page-card{% if page.body_class %} {{ page.body_class }}{% endif %}">
+  {% if page.title and page.title != "Home" %}
+  <header class="page-hero">
+    <p class="eyebrow">Portfolio Section</p>
+    <h1>{{ page.title }}</h1>
+    {% if page.description %}<p class="page-lead">{{ page.description }}</p>{% endif %}
+  </header>
+  {% endif %}
   {{ content }}
 </article>

_layouts/post.html

@@ -2,22 +2,59 @@
 layout: default
 ---
 
-<article>
-  {% include meta.html post=page %}
-  {{ content }}
-  {% if site.comments.isso_domain or site.comments.disqus_shortname %}
-    <hr>
-    {% if site.comments.isso_domain %}<div id="isso-thread"></div>{% endif %}
-    {% if site.comments.disqus_shortname %}<div id="disqus_thread"></div>{% endif %}
-    <noscript>Please enable JavaScript to view comments.</noscript>
-  {% endif %}
+<article class="post-card">
+  <header class="post-hero">
+    {% if page.image %}<img src="{{ page.image }}" alt="{{ page.title }}" class="post-hero-image">{% endif %}
+    {% if page.phase %}<p class="eyebrow">{{ page.phase }}</p>{% endif %}
+    <h1>{{ page.title }}</h1>
+    {% if page.summary %}<p class="post-lead">{{ page.summary }}</p>{% endif %}
+    <div class="post-meta-row">
+      {% if page.journey_stage %}<span>{{ page.journey_stage }}</span>{% endif %}
+      {% if page.read_time %}<span>{{ page.read_time }} read</span>{% endif %}
+      {% if page.sequence %}<span>Article {{ page.sequence }}</span>{% endif %}
+    </div>
+    {% if page.tags %}
+    <div class="post-tags" aria-label="Article tags">
+      {% for tag in page.tags %}
+      <a class="post-tag" href="{{ "/blog/" | relative_url }}?tag={{ tag | slugify }}">{{ tag }}</a>
+      {% endfor %}
+    </div>
+    {% endif %}
+  </header>
+
+  <div class="prose">
+    {{ content }}
+  </div>
 </article>
 
-{% unless site.show_minimal or site.footer  %}
-{% if page.next.url or page.previous.url %}
-<footer class="nowrap {% if site.show_frame %}dark{% else %}smooth{% endif %}">
-  {% if page.next.url %}<a href="{{ page.next.url | relative_url }}">« {{ page.next.title }}</a> {% endif %}
-  {% if page.previous.url %} <a href="{{ page.previous.url | relative_url }}">{{ page.previous.title }} »</a>{% endif %}
-</footer>
-{% endif %}
-{% endunless %}
+<div class="post-footer-stack">
+  <footer class="post-return smooth">
+    <a href="{{ "/blog/" | relative_url }}">Back to the blog</a>
+  </footer>
+
+  <nav class="post-navigation" aria-label="Article navigation">
+    {% if page.previous %}
+    <a class="post-navigation__link" href="{{ page.previous.url | relative_url }}">
+      <span class="post-navigation__label">Previous Article</span>
+      <strong>{{ page.previous.title }}</strong>
+    </a>
+    {% else %}
+    <span class="post-navigation__link post-navigation__link--empty">
+      <span class="post-navigation__label">Previous Article</span>
+      <strong>No earlier article</strong>
+    </span>
+    {% endif %}
+
+    {% if page.next %}
+    <a class="post-navigation__link post-navigation__link--next" href="{{ page.next.url | relative_url }}">
+      <span class="post-navigation__label">Next Article</span>
+      <strong>{{ page.next.title }}</strong>
+    </a>
+    {% else %}
+    <span class="post-navigation__link post-navigation__link--empty post-navigation__link--next">
+      <span class="post-navigation__label">Next Article</span>
+      <strong>No newer article</strong>
+    </span>
+    {% endif %}
+  </nav>
+</div>