jekyll-theme-zer0 0.20.2 → 0.20.3

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 19c84811dcc56b5cb437c118f6a66ce6895db10702f4011be545003bc9d6f134
-  data.tar.gz: 61f3707a93a6ac230276cb64fb007c7e2531fa23e940f9039db05fab061b99ee
+  metadata.gz: 9a016d0fb4fa27f203571798256f468d7a19a71100ad551bd69e799c6b9797f3
+  data.tar.gz: 458cc17ae4e8ea22eea496b213d4e4e6c496c128600ce1010d9f0d2f26bd9c45
 SHA512:
-  metadata.gz: 87b0384c193e4f0ae8c75268e7a784f3c0bb90e99fdfdb4113edee8425682eb59cb9888ad8d1c28d77e4ec62c6d00e81e1f3f01d9a0e1dce278011f48cd6dfbb
-  data.tar.gz: f5bff135bbf740f16cbc0eb487568d633bffe37e5cdd5b23e33626cba98f091784c10036eababf6428f516c2618ee3956b677d8b9fde944b608d1d91947a3123
+  metadata.gz: 0f36f8cb07f2d8d426d6b8e9f441c38e8dbe82a07b502f1117f52ed97a9affc180e135c5df47b0c3e23f06fa8f3489395c84d30dc94882d3b9f735dd1645e952
+  data.tar.gz: 0ef53bfa08a6fbc498c25e6d4776fed5b343e2a49e9d8d70cfea2361f1a62dc62fa052dc6ccf27bd06356a8bdd7d06896223cfdd4a9aa3795ecfa80fe84b664d

data/CHANGELOG.md

@@ -1,5 +1,27 @@
 # Changelog
 
+## [0.20.3] - 2026-02-01
+
+### Added
+- **Notes Collection**: 5 new developer reference notes
+  - `bash-shortcuts.md` - Essential terminal keyboard shortcuts
+  - `docker-commands.md` - Docker and Docker Compose command reference
+  - `git-cheatsheet.md` - Git commands quick reference
+  - `jekyll-front-matter.md` - Jekyll front matter variables guide
+  - `markdown-tips.md` - Advanced Markdown formatting tricks
+- **Python Statistics Notebook**: New `python-statistics.ipynb` Jupyter notebook with scipy, pandas, and statistical analysis examples
+- **Enhanced Notes page**: Added tag filtering and improved card-based layout
+- **Enhanced Notebooks page**: Added difficulty filtering and improved card-based layout with download links
+
+### Changed
+- **Layout Standardization**: Updated all posts from `layout: journals` to `layout: article` for consistency
+- **Section Index Pages**: Updated category index pages to use `layout: section` with proper section_style settings
+- **News URL Structure**: Changed permalinks from `/posts/` to `/news/` across all news sections
+- **Removed**: Deleted unused `pages/blog.md` page
+
+### Fixed
+- **Layout consistency**: Standardized layouts across Business, Development, Science, Technology, Tutorial, and World news sections
+
 ## [0.20.2] - 2026-01-30
 
 ### Added

data/_data/navigation/main.yml

@@ -14,17 +14,49 @@
     - title: GitHub Setup
       url: /quickstart/github-setup/
 
-- title: Blog
-  icon: bi-journal-text
-  url: /blog/
+- title: News
+  icon: bi-newspaper
+  url: /news/
   children:
-    - title: All Posts
-      url: /posts/
+    - title: All News
+      url: /news/
     - title: Categories
       url: /categories/
     - title: Tags
       url: /tags/
 
+- title: Notes
+  icon: bi-journal-text
+  url: /notes/
+  children:
+    - title: All Notes
+      url: /notes/
+    - title: Git Cheatsheet
+      url: /notes/git-cheatsheet/
+    - title: Docker Commands
+      url: /notes/docker-commands/
+    - title: Jekyll Front Matter
+      url: /notes/jekyll-front-matter/
+    - title: Markdown Tips
+      url: /notes/markdown-tips/
+    - title: Bash Shortcuts
+      url: /notes/bash-shortcuts/
+
+- title: Notebooks
+  icon: bi-journal-code
+  url: /notebooks/
+  children:
+    - title: All Notebooks
+      url: /notebooks/
+    - title: Pandas Data Analysis
+      url: /notebooks/pandas-data-analysis/
+    - title: Matplotlib Visualization
+      url: /notebooks/matplotlib-visualization/
+    - title: Python Statistics
+      url: /notebooks/python-statistics/
+    - title: API Requests
+      url: /notebooks/api-requests/
+
 - title: Docs
   icon: bi-journal-bookmark
   url: /docs/

data/_data/navigation/posts.yml

@@ -1,34 +1,34 @@
-# Posts/Blog Category Navigation Configuration
-# Used by: Blog layout, category pages, and post navigation
-# Purpose: Category-based navigation for blog posts
-# Note: Categories match folders in pages/_posts/
+# News Section Navigation Configuration
+# Used by: News layout, section pages, and article navigation
+# Purpose: Section-based navigation for news content
+# Note: Sections match folders in pages/_posts/
 
 - title: Development
   icon: bi-code-slash
-  url: /posts/development/
+  url: /news/development/
   description: "Software development, coding practices, and programming tutorials"
 
 - title: Technology
   icon: bi-cpu
-  url: /posts/technology/
+  url: /news/technology/
   description: "Tech news, tools, and emerging technologies"
 
 - title: Tutorial
   icon: bi-journal-code
-  url: /posts/tutorial/
+  url: /news/tutorial/
   description: "Step-by-step guides and how-to articles"
 
 - title: World
   icon: bi-globe
-  url: /posts/world/
+  url: /news/world/
   description: "Global trends, remote work, and industry insights"
 
 - title: Business
   icon: bi-briefcase
-  url: /posts/business/
+  url: /news/business/
   description: "Business strategies, startups, and entrepreneurship"
 
 - title: Science
   icon: bi-mortarboard
-  url: /posts/science/
+  url: /news/science/
   description: "Scientific discoveries, research, and innovation"

data/_includes/components/post-card.html

@@ -5,7 +5,7 @@
   
   File: post-card.html
   Path: _includes/components/post-card.html
-  Purpose: Consistent post card display across blog, category, and archive pages
+  Purpose: Consistent post card display across news, section, and archive pages
   
   Parameters:
   - post (required): The post object to display
@@ -13,6 +13,7 @@
   - show_excerpt (optional): Show post excerpt (default: true)
   - show_author (optional): Show author name (default: true)
   - show_reading_time (optional): Show reading time (default: true)
+  - show_post_type (optional): Show post_type badge (default: true)
   - card_class (optional): Additional CSS classes for the card
   
   Usage:
@@ -23,6 +24,7 @@
   Features:
   - Breaking news badge (red, top-left)
   - Featured badge (gold star, top-right)
+  - Post type badge (contextual colors)
   - Preview image with fallback
   - Category badge
   - Reading time calculation
@@ -33,6 +35,8 @@
   Dependencies:
   - Bootstrap 5 card components
   - Bootstrap Icons
+  - components/post-type-badge.html
+  - components/preview-image.html
   - site.public_folder for image paths
   - site.teaser for fallback image
   ===================================================================
@@ -43,6 +47,7 @@
 {% assign show_excerpt = include.show_excerpt | default: true %}
 {% assign show_author = include.show_author | default: true %}
 {% assign show_reading_time = include.show_reading_time | default: true %}
+{% assign show_post_type = include.show_post_type | default: true %}
 {% assign card_class = include.card_class | default: "" %}
 
 {% comment %} 
@@ -76,6 +81,13 @@
         </span>
       {% endif %}
       
+      <!-- Post Type Badge -->
+      {% if show_post_type and include.post.post_type and include.post.post_type != "standard" and include.post.post_type != "featured" and include.post.post_type != "breaking" %}
+        <span class="position-absolute bottom-0 start-0 m-2 z-1">
+          {% include components/post-type-badge.html post_type=include.post.post_type %}
+        </span>
+      {% endif %}
+      
       <!-- Preview Image -->
       <a href="{{ include.post.url | relative_url }}" class="text-decoration-none">
         {% assign card_img = include.post.preview | default: site.teaser %}
@@ -92,7 +104,7 @@
       {% if show_category and include.post.categories.size > 0 %}
         <div class="mb-2">
           {% assign primary_category = include.post.categories | first %}
-          <a href="{{ site.baseurl }}/posts/{{ primary_category | slugify }}/" 
+          <a href="{{ site.baseurl }}/news/{{ primary_category | slugify }}/" 
              class="badge bg-primary text-decoration-none">
             {{ primary_category }}
           </a>

data/_includes/components/post-type-badge.html

@@ -0,0 +1,74 @@
+<!--
+  ===================================================================
+  POST TYPE BADGE COMPONENT - Visual indicator for article types
+  ===================================================================
+  
+  File: post-type-badge.html
+  Path: _includes/components/post-type-badge.html
+  Purpose: Display Bootstrap badge based on post_type front matter
+  
+  Parameters:
+  - post_type (required): The type of post to display badge for
+  
+  Supported post_type values:
+  - standard: No badge (default behavior)
+  - featured: Gold star badge (bg-warning)
+  - breaking: Red urgent badge (bg-danger)
+  - opinion: Gray editorial badge (bg-secondary)
+  - review: Blue review badge (bg-info)
+  - tutorial: Green learning badge (bg-success)
+  - listicle: Primary list badge (bg-primary)
+  - interview: Dark Q&A badge (bg-dark)
+  
+  Usage:
+    {% include components/post-type-badge.html post_type=page.post_type %}
+    {% include components/post-type-badge.html post_type=post.post_type %}
+  
+  Dependencies:
+  - Bootstrap 5 badge component
+  - Bootstrap Icons
+  ===================================================================
+-->
+
+{% assign type = include.post_type | default: "standard" %}
+
+{% case type %}
+  {% when "featured" %}
+    <span class="badge bg-warning text-dark">
+      <i class="bi bi-star-fill me-1"></i>Featured
+    </span>
+  
+  {% when "breaking" %}
+    <span class="badge bg-danger">
+      <i class="bi bi-lightning-fill me-1"></i>Breaking
+    </span>
+  
+  {% when "opinion" %}
+    <span class="badge bg-secondary">
+      <i class="bi bi-pencil-square me-1"></i>Opinion
+    </span>
+  
+  {% when "review" %}
+    <span class="badge bg-info text-dark">
+      <i class="bi bi-star-half me-1"></i>Review
+    </span>
+  
+  {% when "tutorial" %}
+    <span class="badge bg-success">
+      <i class="bi bi-book me-1"></i>Tutorial
+    </span>
+  
+  {% when "listicle" %}
+    <span class="badge bg-primary">
+      <i class="bi bi-list-ol me-1"></i>Listicle
+    </span>
+  
+  {% when "interview" %}
+    <span class="badge bg-dark">
+      <i class="bi bi-mic me-1"></i>Interview
+    </span>
+  
+  {% when "standard" %}
+    {% comment %} No badge for standard posts {% endcomment %}
+  
+{% endcase %}

data/_includes/navigation/section-sidebar.html

@@ -0,0 +1,242 @@
+<!--
+  ===================================================================
+  SECTION SIDEBAR - Fixed Topic Navigation
+  ===================================================================
+  
+  File: section-sidebar.html
+  Path: _includes/navigation/section-sidebar.html
+  Purpose: Fixed sticky sidebar for section/topic navigation
+  
+  Parameters:
+  - section_posts: Array of posts in the current section
+  - sub_categories: Array of unique tags/topics from section posts
+  - page_title: Title of the current section
+  - sidebar_id: Unique ID for the sidebar (default: "sectionSidebar")
+  
+  Features:
+  - Desktop: Fixed sticky sidebar on the left
+  - Mobile: Offcanvas drawer
+  - Topic navigation with article counts
+  - Section statistics
+  - Smooth scroll to sections
+  
+  Dependencies:
+  - Bootstrap 5 offcanvas component
+  - Bootstrap Icons
+  ===================================================================
+-->
+
+{% assign sidebar_id = include.sidebar_id | default: "sectionSidebar" %}
+{% assign section_posts = include.section_posts %}
+{% assign sub_categories = include.sub_categories %}
+{% assign page_title = include.page_title | default: page.title %}
+
+<!-- ================================ -->
+<!-- DESKTOP SIDEBAR (Fixed Sticky)   -->
+<!-- ================================ -->
+<aside class="section-sidebar-desktop d-none d-lg-block">
+  <div class="position-sticky" style="top: 80px;">
+    
+    <!-- Topics Card -->
+    <div class="card border-0 shadow-sm">
+      <div class="card-header bg-primary text-white d-flex justify-content-between align-items-center">
+        <h5 class="mb-0">
+          <i class="bi bi-bookmark me-2"></i>Topics
+        </h5>
+        <span class="badge bg-light text-primary">{{ sub_categories.size }}</span>
+      </div>
+      <div class="card-body p-0">
+        <nav class="nav flex-column sidebar-nav">
+          <a class="nav-link active" href="#all-posts" data-section="all-posts">
+            <i class="bi bi-grid me-2"></i>
+            <span class="nav-text">All Articles</span>
+            <span class="badge bg-secondary ms-auto">{{ section_posts.size }}</span>
+          </a>
+          {% for subcat in sub_categories limit: 15 %}
+            {% assign subcat_posts = section_posts | where_exp: "post", "post.tags contains subcat" %}
+            {% if subcat_posts.size > 0 %}
+            <a class="nav-link" href="#{{ subcat | slugify }}" data-section="{{ subcat | slugify }}">
+              <i class="bi bi-tag me-2"></i>
+              <span class="nav-text">{{ subcat | capitalize }}</span>
+              <span class="badge bg-light text-dark ms-auto">{{ subcat_posts.size }}</span>
+            </a>
+            {% endif %}
+          {% endfor %}
+        </nav>
+      </div>
+      {% if sub_categories.size > 15 %}
+      <div class="card-footer bg-transparent">
+        <a href="{{ site.baseurl }}/tags/" class="btn btn-sm btn-outline-secondary w-100">
+          View All Tags <i class="bi bi-arrow-right ms-1"></i>
+        </a>
+      </div>
+      {% endif %}
+    </div>
+    
+    <!-- Section Stats -->
+    <div class="card border-0 shadow-sm mt-3">
+      <div class="card-body">
+        <h6 class="text-muted mb-3">
+          <i class="bi bi-graph-up me-2"></i>Section Stats
+        </h6>
+        <div class="d-flex justify-content-between mb-2">
+          <small class="text-muted">Total Articles</small>
+          <strong>{{ section_posts.size }}</strong>
+        </div>
+        <div class="d-flex justify-content-between mb-2">
+          <small class="text-muted">Topics</small>
+          <strong>{{ sub_categories.size }}</strong>
+        </div>
+        {% assign featured_count = section_posts | where: "featured", true | size %}
+        <div class="d-flex justify-content-between">
+          <small class="text-muted">Featured</small>
+          <strong>{{ featured_count }}</strong>
+        </div>
+      </div>
+    </div>
+  </div>
+</aside>
+
+<!-- ================================ -->
+<!-- MOBILE OFFCANVAS SIDEBAR         -->
+<!-- ================================ -->
+<div class="offcanvas offcanvas-start" tabindex="-1" id="{{ sidebar_id }}" aria-labelledby="{{ sidebar_id }}Label">
+  <div class="offcanvas-header bg-primary text-white">
+    <h5 class="offcanvas-title" id="{{ sidebar_id }}Label">
+      <i class="bi bi-bookmark me-2"></i>{{ page_title }} Topics
+    </h5>
+    <button type="button" class="btn-close btn-close-white" data-bs-dismiss="offcanvas" aria-label="Close"></button>
+  </div>
+  <div class="offcanvas-body p-0">
+    <nav class="nav flex-column">
+      <a class="nav-link active bg-light py-3 border-bottom" href="#all-posts" data-bs-dismiss="offcanvas">
+        <i class="bi bi-grid me-2"></i>All Articles
+        <span class="badge bg-secondary float-end">{{ section_posts.size }}</span>
+      </a>
+      {% for subcat in sub_categories %}
+        {% assign subcat_posts = section_posts | where_exp: "post", "post.tags contains subcat" %}
+        {% if subcat_posts.size > 0 %}
+        <a class="nav-link text-body-secondary py-3 border-bottom" href="#{{ subcat | slugify }}" data-bs-dismiss="offcanvas">
+          <i class="bi bi-tag me-2"></i>{{ subcat | capitalize }}
+          <span class="badge bg-light text-dark float-end">{{ subcat_posts.size }}</span>
+        </a>
+        {% endif %}
+      {% endfor %}
+    </nav>
+    <div class="p-3">
+      <a href="{{ site.baseurl }}/tags/" class="btn btn-outline-primary w-100">
+        <i class="bi bi-tags me-2"></i>Browse All Tags
+      </a>
+    </div>
+  </div>
+</div>
+
+<!-- ================================ -->
+<!-- SIDEBAR STYLES                   -->
+<!-- ================================ -->
+<style>
+  /* Sidebar Navigation */
+  .sidebar-nav .nav-link {
+    padding: 0.75rem 1rem;
+    border-left: 3px solid transparent;
+    transition: all 0.2s ease;
+    display: flex;
+    align-items: center;
+    color: var(--bs-body-color);
+  }
+  
+  .sidebar-nav .nav-link:hover {
+    background-color: rgba(var(--bs-primary-rgb), 0.1);
+    border-left-color: var(--bs-primary);
+  }
+  
+  .sidebar-nav .nav-link.active {
+    background-color: rgba(var(--bs-primary-rgb), 0.1);
+    border-left-color: var(--bs-primary);
+    font-weight: 500;
+  }
+  
+  .sidebar-nav .nav-text {
+    flex-grow: 1;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+  
+  /* Offcanvas mobile styling */
+  .offcanvas .nav-link {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+  }
+</style>
+
+<!-- ================================ -->
+<!-- SIDEBAR JAVASCRIPT               -->
+<!-- ================================ -->
+<script>
+(function() {
+  // Smooth scroll for sidebar links
+  function setupSmoothScroll() {
+    document.querySelectorAll('.sidebar-nav a[href^="#"], .offcanvas a[href^="#"]').forEach(anchor => {
+      anchor.addEventListener('click', function(e) {
+        const href = this.getAttribute('href');
+        if (href.length > 1) {
+          e.preventDefault();
+          const target = document.querySelector(href);
+          if (target) {
+            target.scrollIntoView({ behavior: 'smooth' });
+            
+            // Update active state in sidebar
+            document.querySelectorAll('.sidebar-nav .nav-link').forEach(link => {
+              link.classList.remove('active');
+            });
+            
+            // Find and activate the corresponding link in desktop sidebar
+            const desktopLink = document.querySelector(`.sidebar-nav a[href="${href}"]`);
+            if (desktopLink) {
+              desktopLink.classList.add('active');
+            }
+          }
+        }
+      });
+    });
+  }
+  
+  // Intersection Observer for active section highlighting
+  function setupScrollSpy() {
+    const sections = document.querySelectorAll('section[id]');
+    
+    if (sections.length === 0) return;
+    
+    const observer = new IntersectionObserver((entries) => {
+      entries.forEach(entry => {
+        if (entry.isIntersecting) {
+          const id = entry.target.getAttribute('id');
+          document.querySelectorAll('.sidebar-nav .nav-link').forEach(link => {
+            link.classList.remove('active');
+            if (link.getAttribute('href') === `#${id}`) {
+              link.classList.add('active');
+            }
+          });
+        }
+      });
+    }, {
+      rootMargin: '-20% 0px -80% 0px'
+    });
+    
+    sections.forEach(section => observer.observe(section));
+  }
+  
+  // Initialize when DOM is ready
+  if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', function() {
+      setupSmoothScroll();
+      setupScrollSpy();
+    });
+  } else {
+    setupSmoothScroll();
+    setupScrollSpy();
+  }
+})();
+</script>

data/_layouts/README.md

@@ -9,11 +9,12 @@ structure, and usage patterns.
 ```text
 root.html (base template)
 ├── default.html (sidebar layout)
-│   ├── journals.html (blog posts)
+│   ├── article.html (single articles/posts)
+│   ├── section.html (section index pages)
 │   ├── collection.html (collection pages)
 │   └── javascript.html (JavaScript demos)
 ├── home.html (homepage)
-├── blog.html (blog homepage)
+├── news.html (news homepage - magazine/grid/list styles)
 ├── landing.html (landing pages)
 ├── stats.html (statistics dashboard)
 └── index.html (search pages)
@@ -34,17 +35,37 @@ root.html (base template)
 
 - **Purpose**: Standard content layout with sidebars
 - **Features**: Three-column responsive layout, navigation, table of contents
+- **Features (Updated)**: Sidebar toggle via `page.sidebar: false` front matter
 - **Dependencies**: sidebar-left.html, intro.html, sidebar-right.html
 - **Usage**: Documentation pages, standard content
 
-### 📝 Content Layouts
+### 📰 News & Article Layouts
 
-#### `journals.html`
+#### `news.html`
 
-- **Purpose**: Blog post and article display
-- **Features**: Article structure, post navigation, comment system
-- **Dependencies**: giscus.html for comments
-- **Usage**: Individual blog posts and articles
+- **Purpose**: News homepage with multiple display styles
+- **Features**: Magazine, grid, and list layouts via `section_style` front matter
+- **Front Matter**: `section_style: magazine|grid|list` (required)
+- **Dependencies**: post-card.html, post-type-badge.html
+- **Usage**: Main news index at /news/
+
+#### `article.html`
+
+- **Purpose**: Single article display with post_type variations
+- **Features**: Conditional rendering based on `post_type` front matter
+- **Post Types**: standard, featured, breaking, opinion, review, tutorial, listicle, interview
+- **Dependencies**: post-type-badge.html, giscus.html for comments
+- **Usage**: Individual news articles and blog posts
+
+#### `section.html`
+
+- **Purpose**: Section index pages for content categories
+- **Features**: Path-based article discovery, multiple display styles
+- **Front Matter**: `section_style: magazine|grid|list` (required)
+- **Dependencies**: post-card.html, post-type-badge.html
+- **Usage**: Section landing pages (e.g., /news/technology/, /news/business/)
+
+### 📝 Collection Layouts
 
 #### `collection.html`
 
@@ -53,13 +74,6 @@ root.html (base template)
 - **Dependencies**: Bootstrap card components
 - **Usage**: Portfolio, projects, grouped content
 
-#### `blog.html`
-
-- **Purpose**: Magazine-style blog homepage
-- **Features**: Featured posts, sidebar, responsive design
-- **Dependencies**: sidebar-categories.html, navigation data
-- **Usage**: Blog index and homepage
-
 ### 🎯 Specialized Layouts
 
 #### `home.html`
@@ -97,6 +111,45 @@ root.html (base template)
 - **Dependencies**: Custom JavaScript functions
 - **Usage**: Tutorials, interactive demos
 
+## Front Matter Reference
+
+### Article Layout (`article.html`)
+
+```yaml
+layout: article
+post_type: standard|featured|breaking|opinion|review|tutorial|listicle|interview
+sidebar: true|false  # Optional, defaults to true (false for featured/breaking)
+```
+
+### Section/News Layouts (`section.html`, `news.html`)
+
+```yaml
+layout: section|news
+section_style: magazine|grid|list  # Required - no default
+index: true  # Marks page as index (excluded from listings)
+```
+
+### Display Styles
+
+| Style | Description |
+|-------|-------------|
+| `magazine` | Hero article + grid of remaining posts |
+| `grid` | 3-column card grid layout |
+| `list` | Horizontal row layout with thumbnails |
+
+### Post Types with Badge Colors
+
+| Type | Badge Color | Description |
+|------|-------------|-------------|
+| `featured` | Yellow (warning) | Featured/highlighted content |
+| `breaking` | Red (danger) | Breaking news |
+| `opinion` | Purple | Opinion/editorial pieces |
+| `review` | Cyan (info) | Product/service reviews |
+| `tutorial` | Green (success) | How-to guides |
+| `listicle` | Secondary | List-style articles |
+| `interview` | Dark | Interview content |
+| `standard` | Light | Default article type |
+
 ## Comment Organization Standards
 
 Each layout file now includes: