jekyll-theme-manpage 0.1.0

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA256:
+  metadata.gz: bb5cb53e1adde0574281d3c8b1fb171253760abfe92ba4ac5ad03f288a65f81f
+  data.tar.gz: 6955c84eefa6f386f3c289262861f608896fb91e84fc8f72f36ece80b290fb30
+SHA512:
+  metadata.gz: 53e1cfb61ca31dff33ac66e6294f8c0379a975eec7009630f0d1abfda62faf1b7ff7815e88124c80777b4fec4ae50dfe41f09d277c068944d6bc5ebaea20c5f2
+  data.tar.gz: 2afdf5844b528b4ba34d0a60cc411fb8522112d9b116d296295d36ef00f2023041dbdecd898c4971c92d00f70a577304471ffab42cdff119cd36c68358008961

data/LICENSE.txt

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2025 Drshika Asher
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

data/README.md

@@ -0,0 +1,193 @@
+# 📇 Jekyll Theme Manpage
+
+> This theme is currently being beta tested and any feedback is greatly appreciated!
+
+[![Netlify Status](https://api.netlify.com/api/v1/badges/d2497628-6688-4ba9-909c-4680a22f2a72/deploy-status)](https://app.netlify.com/sites/jekyll-theme-manpage/deploys)
+
+A minimalist Jekyll theme inspired by Linux man pages. Perfect for personal websites, portfolios, and blogs with a technical focus.
+
+![Preview](assets/readme/preview.png)
+
+## Features
+
+- 🖥️ Linux man page inspired design
+- 📱 Fully responsive layout
+- 🌙 Automatic dark mode support
+- ✍️ Blog/writing section with:
+  - Full-text search
+  - Tag filtering
+  - Table of contents
+  - Reading Time
+- 📐 LaTeX support for mathematical expressions
+- 🎨 Multiple color themes with light/dark variants
+- 🚀 Fast and lightweight
+- 📱 Mobile-first approach
+- 🔍 SEO optimized
+- 📊 Sitemap generation
+- 💬 Giscus comments integration
+- 📡 RSS feed support
+
+## Installation
+
+### Local Installation
+
+Add this line to your Jekyll site's `Gemfile`:
+
+```ruby
+gem "jekyll-theme-manpage"
+```
+
+And add this line to your Jekyll site's `_config.yml`:
+
+```yaml
+theme: jekyll-theme-manpage
+```
+
+Then run
+
+```bash
+bundle install
+```
+
+### GitHub Pages Installation
+
+(NOT SUPPORTED YET) For GitHub Pages, add this to your site's `_config.yml`:
+
+```yaml
+remote_theme: drshika/jekyll-theme-manpage
+plugins:
+  - jekyll-remote-theme
+```
+
+Add `jekyll-remote-theme` to the Gemfile:
+
+```ruby:Gemfile
+gem 'jekyll-remote-theme'
+```
+
+## Usage
+
+### Basic Setup
+
+1. Create your site structure following Jekyll conventions
+2. Configure `_config.yml` with your settings
+3. Add content to `index.md` using the provided template
+
+### Writing Posts
+
+Create posts in `_posts` directory following this format:
+
+```markdown
+---
+layout: post
+title: Your Post Title
+description: Brief description
+tags: [tag1, tag2]
+toc: true # Optional table of contents
+---
+Your content here...
+```
+
+Make sure to name the file with the `YYYY-MM-DD-Title.md`. 
+
+
+### Customization
+
+#### Color Themes
+
+The theme comes with several preset color schemes. Currently changing the theme is only supported for local development. 
+
+### Light Themes
+| Theme | Preview |
+|-------|---------|
+| Purple | ![Purple Theme](assets/themes/purple.png) |
+| Tomorrow | ![Tomorrow Theme](assets/themes/tomorrow.png) |
+| GitHub | ![GitHub Theme](assets/themes/github.png) |
+| Dracula | ![Dracula Theme](assets/themes/dracula.png) |
+| Nord | ![Nord Theme](assets/themes/nord.png) |
+| Monokai | ![Monokai Theme](assets/themes/monokai.png) |
+
+### Dark Themes
+| Theme | Preview |
+|-------|---------|
+| Purple | ![Purple Dark Theme](assets/themes/purple_dark.png) |
+| Tomorrow | ![Tomorrow Dark Theme](assets/themes/tomorrow_dark.png) |
+| GitHub | ![GitHub Dark Theme](assets/themes/github_dark.png) |
+| Dracula | ![Dracula Dark Theme](assets/themes/dracula_dark.png) |
+| Nord | ![Nord Dark Theme](assets/themes/nord_dark.png) |
+| Monokai | ![Monokai Dark Theme](assets/themes/monokai_dark.png) |
+
+
+To use any of these themes, update your `_sass/variables.scss`:
+
+```scss
+// Theme selection
+$default-theme: 'nord';
+$default-mode: 'light';
+```
+
+#### Typography
+
+This theme uses Nitti as its default font. You can purchase Nitti from [Adobe Fonts](https://fonts.adobe.com/fonts/nitti). If you don't have Nitti, the theme will fallback to Fira Code.
+
+## Development
+
+(For local use only!) To set up your environment to develop this theme:
+
+1. Clone this repo
+2. Run `bundle install`
+3. Run `bundle exec jekyll serve`
+4. Visit `http://localhost:4000`
+
+## Optional Features
+
+Enable optional features in your `_config.yml`:
+
+```yaml
+features:
+  comments: true  # Set to true to enable Giscus comments
+  rss_feed: true  # Set to true to enable RSS feed
+  search: true  # Set to true to enable search
+  google_analytics: false  # Set to true to enable Google Analytics
+  tags: true  # Set to true to enable tags
+  read_time: true  # Set to true to enable read time
+  back_to_top: false  # Set to true to enable back to top button
+```
+
+### Comments
+
+To enable comments:
+
+1. Set `features.comments: true` in your `_config.yml`
+2. Get your Giscus script from [giscus.app](https://giscus.app)
+3. Paste the generated script into `_includes/comments.html`
+
+Disable comments for specific posts by adding `comments: false` to the post's front matter.
+
+### RSS Feed
+
+To enable RSS feed:
+
+1. Set `features.rss_feed: true` in your `_config.yml`
+
+Your feed will be available at `/feed.xml`.
+
+### RSS Feed
+
+To enable RSS feed:
+
+1. Set `features.rss_feed: true` in your `_config.yml`
+
+Your feed will be available at `/feed.xml`. See [Jekyll Feed documentation](https://github.com/jekyll/jekyll-feed) for additional configuration options.
+
+## Contributing
+
+Bug reports and pull requests are welcome on GitHub. This project is intended to be a safe, welcoming space for collaboration, and contributors are expected to adhere to the [Contributor Covenant](https://www.contributor-covenant.org/) code of conduct.
+
+## License
+
+The theme is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).
+
+## Credits
+
+Created with ❤️ by Drshika Asher

data/_includes/comments.html

@@ -0,0 +1,21 @@
+{% if site.features.comments %}
+  <div class="comments">
+    <h2>Comments</h2>
+      <script src="https://giscus.app/client.js"
+          data-repo="drshika/jekyll-theme-manpage"
+          data-repo-id="R_kgDONlmNQQ"
+          data-category="Announcements"
+          data-category-id="DIC_kwDONlmNQc4Clurt"
+          data-mapping="og:title"
+          data-strict="0"
+          data-reactions-enabled="1"
+          data-emit-metadata="1"
+          data-input-position="top"
+          data-theme="preferred_color_scheme"
+          data-lang="en"
+          data-loading="lazy"
+          crossorigin="anonymous"
+          async>
+      </script>
+  </div>
+{% endif %}

data/_includes/fun_facts.html

@@ -0,0 +1,9 @@
+<div class="fun-facts">
+    {% for fact in site.data.facts.facts %}
+      <div class="fact-item">
+        [{{ forloop.index0 }}] {{ fact }}
+        <div class="arrow">↓</div>
+      </div>
+    {% endfor %}
+    <div class="fact-item">nullptr</div>
+  </div>

data/_includes/head-custom-google-analytics.html

@@ -0,0 +1,10 @@
+{% if site.google_analytics %}
+  <script>
+    (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+            m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+        })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
+    ga('create', '{{ site.google_analytics }}', 'auto');
+    ga('send', 'pageview');
+  </script>
+{% endif %}

data/_includes/head-custom.html

@@ -0,0 +1,64 @@
+<!-- start custom head snippets -->
+
+<!-- Theme Switcher -->
+<script src="{{ '/assets/js/theme-switcher.js' | relative_url }}"></script>
+
+<!-- Common meta tags -->
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<link rel="preconnect" href="https://fonts.gstatic.com">
+
+<!-- KaTeX - only load if page.katex is true -->
+{% if page.katex %}
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.16.19/dist/katex.min.css"
+    integrity="sha384-7lU0muIg/i1plk7MgygDUp3/bNRA65orrBub4/OSWHECgwEsY83HaS1x3bljA/XV" crossorigin="anonymous">
+<!-- The loading of KaTeX is deferred to speed up page rendering -->
+<script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.19/dist/katex.min.js"
+    integrity="sha384-RdymN7NRJ+XoyeRY4185zXaxq9QWOOx3O7beyyrRK4KQZrPlCDQQpCu95FoCGPAE"
+    crossorigin="anonymous"></script>
+<!-- To automatically render math in text elements, include the auto-render extension: -->
+<script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.19/dist/contrib/auto-render.min.js"
+    integrity="sha384-hCXGrW6PitJEwbkoStFjeJxv+fSOOQKOPbJxSfM6G5sWZjAyWhXiTIIAmQqnlLlh" crossorigin="anonymous"
+    onload="renderMathInElement(document.body);"></script>
+<script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.19/dist/contrib/mhchem.min.js"
+    integrity="sha384-F2ptQFZqNJuqfGGl28mIXyQ5kXH48spn7rcoS0Y9psqIKAcZPLd1NzwFlm/bl1mH"
+    crossorigin="anonymous"></script>
+<script>
+    document.addEventListener("DOMContentLoaded", function () {
+        renderMathInElement(document.body, {
+            delimiters: [
+                { left: "$$", right: "$$", display: true },
+                { left: "\\[", right: "\\]", display: true },
+                { left: "$", right: "$", display: false },
+                { left: "\\(", right: "\\)", display: false }
+            ]
+
+        });
+    });
+</script>
+{% endif %}
+
+<!-- Favicons -->
+{% if site.favicon %}
+{% if site.favicon.svg %}
+<link rel="icon" type="image/svg+xml" href="{{ site.favicon.svg | relative_url }}">
+{% endif %}
+{% if site.favicon.ico %}
+<link rel="alternate icon" type="image/x-icon" href="{{ site.favicon.ico | relative_url }}">
+{% endif %}
+{% if site.favicon.png32 %}
+<link rel="alternate icon" type="image/png" sizes="32x32" href="{{ site.favicon.png32 | relative_url }}">
+{% endif %}
+{% if site.favicon.png16 %}
+<link rel="alternate icon" type="image/png" sizes="16x16" href="{{ site.favicon.png16 | relative_url }}">
+{% endif %}
+{% endif %}
+
+<!-- RSS Feed -->
+{% if site.features.rss_feed %}
+{% feed_meta %}
+{% endif %}
+
+<!-- Google Analytics -->
+{% include head-custom-google-analytics.html %}
+
+<!-- end custom head snippets -->

data/_includes/read_time.html

@@ -0,0 +1,11 @@
+<!-- Credits: https://carlosbecker.com/posts/jekyll-reading-time-without-plugins/ -->
+
+<span class="reading-time" title="Estimated read time">
+  {% assign words = content | number_of_words %}
+  {% if words < 360 %}
+    1 min read
+  {% else %}
+    {{ words | divided_by:180 }} min read
+  {% endif %}
+</span>
+

data/_includes/skin.html

@@ -0,0 +1,4 @@
+{% assign skin = site.skin %}
+<style>
+  {% include_relative _sass/skins/{{ site.skin }}.css %}
+</style>

data/_includes/social_links.html

@@ -0,0 +1,8 @@
+<div class="social-links">
+  <span class="link-group">
+    [<a href="{{ site.data.social_links.resume.url }}">{{ site.data.social_links.resume.text }}</a>][{{ site.data.social_links.email }}] 
+  </span>
+  <span class="link-group">
+    {% for link in site.data.social_links.social %}[{{ link.name | capitalize }}:<a href="{{ link.url }}">{{ link.text }}</a>]{% endfor %}
+  </span>
+</div>  

data/_layouts/default.html

@@ -0,0 +1,63 @@
+<!DOCTYPE html>
+<html lang="{{ site.lang | default: " en-US" }}">
+
+<head>
+  <meta charset="UTF-8">
+  {% seo %}
+  <link rel="stylesheet" href="{{ '/assets/css/style.css?v=' | append: site.github.build_revision | relative_url }}">
+  {% include head-custom.html %}
+</head>
+
+<body>
+  <header class="page-header">
+    <h1 class="project-name">{{ page.title | default: site.title | default: site.github.repository_name }}</h1>
+  </header>
+
+  <main id="content" class="main-content" role="main">
+    {{ content }}
+    <button id="scrollToTop" title="Go to top">↑</button>
+    <footer class="site-footer">
+
+      {% if page.layout == 'post' %}
+      <a href="/writing" class="back-link">← back to Writing</a>
+      {% else %}
+      <span class="site-footer-credits" style="text-align: center;">{{ site.author }}, 2025</span>
+      {% endif %}
+    </footer>
+  </main>
+  <script>
+    console.log({
+      'data-theme': document.documentElement.getAttribute('data-theme'),
+      'color-scheme': document.documentElement.getAttribute('color-scheme'),
+      'root-bg': getComputedStyle(document.documentElement).getPropertyValue('--bg-color'),
+      'root-color': getComputedStyle(document.documentElement).getPropertyValue('--text-color')
+    });
+  </script>
+  {% if site.features.back_to_top %}
+  <script>
+    document.addEventListener('DOMContentLoaded', function () {
+      // Get the button
+      const scrollButton = document.getElementById("scrollToTop");
+
+      if (scrollButton) {
+        // Show button when user scrolls down 20px from top
+        window.onscroll = function () {
+          if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
+            scrollButton.style.display = "block";
+          } else {
+            scrollButton.style.display = "none";
+          }
+        };
+
+        // Scroll to top when button is clicked
+        scrollButton.onclick = function () {
+          document.body.scrollTop = 0; // For Safari
+          document.documentElement.scrollTop = 0; // For Chrome, Firefox, IE and Opera
+        };
+      }
+    });
+  </script>
+  {% endif %}
+</body>
+
+</html>

data/_layouts/home.html

@@ -0,0 +1,19 @@
+---
+layout: default
+---
+<!-- Nav Links -->
+{% for item in site.data.navigation.pages %}
+{% if item.name == "Writing" %}
+  <a href="{{item.link}}" alt="{{item.name}}" style="text-transform: uppercase;">{{item.name}}</a>
+{% else %}
+  <a href="{{item.link}}" alt="{{item.name}}" style="text-transform: uppercase;">{{item.name}}</a> |
+{% endif %}
+{% endfor %}
+<!-- End Nav Links -->
+
+{{ content | replace: '<h2>NEWS</h2>', '<h2>NEWS</h2>
+<div class="news-section">' |
+  replace: '<h2>EXTRAS</h2>', '</div>
+<h2>EXTRAS</h2>' |
+replace: '<ul>', '<ul class="linked-list">' |
+    replace: '<p><strong>', '<p class="role"><strong class="title">' }}

data/_layouts/post.html

@@ -0,0 +1,29 @@
+---
+layout: default
+---
+<div class="post-meta">
+  <span class="post-date">{{ page.date | date_to_string: "ordinal", "US" }}</span>
+  {% if page.tags %}
+  <div class="post-tags">
+    {% for tag in page.tags %}
+    <span class="tag">{{ tag }}</span>
+    {% endfor %}
+  </div>
+  {% endif %}
+
+  {% if site.features.read_time %}
+  {% include read_time.html %}
+  {% endif %}
+
+  {% if page.toc %}
+  <div class="toc">
+    <h2>Table of Contents</h2>
+    {% toc %}
+  </div>
+  {% endif %}
+
+</div>
+
+{{ content }}
+
+{% include comments.html %}

data/_layouts/writing.html

@@ -0,0 +1,173 @@
+<!DOCTYPE html>
+<html lang="{{ site.lang | default: " en-US" }}">
+
+<head>
+  <meta charset="UTF-8">
+  {% seo %}
+  <link rel="preconnect" href="https://fonts.gstatic.com">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <link rel="stylesheet" href="{{ '/assets/css/style.css?v=' | append: site.github.build_revision | relative_url }}">
+  <title>{{ page.title }}</title>
+  {% include head-custom.html %}
+</head>
+
+<body>
+  <header class="page-header">
+    <h1 class="project-name">→ ~ ls -lt /writing</h1>
+
+    <!-- Search bar -->
+    <div class="search-container" {% unless site.features.search %}style="display: none;" {% endunless %}>
+      <input type="text" id="search-input" placeholder="Search posts...">
+    </div>
+
+    <!-- Tag filter -->
+    <div class="tag-container" {% unless site.features.tags %}style="display: none;" {% endunless %}>
+      {% capture tags_string %}{% for tag in site.tags %}{{ tag | first }}:{{ tag | last | size }}|{% endfor %}{% endcapture %}
+      {% assign tags = tags_string | split: '|' | pop | sort | reverse %}
+      {% for tag_info in tags %}
+        {% assign tag_parts = tag_info | split: ':' %}
+        {% assign tag_name = tag_parts[0] | strip %}
+        {% assign tag_count = tag_parts[1] | strip %}
+        <button class="tag-button" data-tag="{{ tag_name }}">
+          {{ tag_name }} ({{ tag_count }})
+        </button>
+      {% endfor %}
+    </div>
+  </header>
+
+  <main id="content" class="main-content" role="main">
+    <!-- Post listing -->
+    <div class="posts-container">
+      {% for post in site.posts %}
+      <article class="post-preview" data-tags="{{ post.tags | join: ' ' }}">
+        <h2>
+          <span class="post-date">{{ post.date | date: "%Y-%m-%d" }}</span>
+          <a href="{{ post.url }}">{{ post.title }}</a>
+        </h2>
+        {% if post.tags %}
+        <div class="post-tags">
+          {% for tag in post.tags %}
+          <span class="tag">{{ tag }}</span>
+          {% endfor %}
+        </div>
+        {% endif %}
+        <div class="post-excerpt">
+          {{ post.excerpt | strip_html | truncatewords:25 }}
+        </div>
+      </article>
+      {% endfor %}
+    </div>
+
+    <!-- No results message -->
+    <div id="no-results" class="hidden">
+      No posts found matching your criteria.
+    </div>
+
+    <footer class="site-footer">
+      <a href="/" class="back-link">← back to Home</a>
+    </footer>
+  </main>
+
+<!-- ... existing code ... -->
+
+<!-- Search and filter script -->
+<script>
+  document.addEventListener('DOMContentLoaded', function () {
+    const searchInput = document.getElementById('search-input')
+    const postsContainer = document.querySelector('.posts-container')
+    const noResults = document.getElementById('no-results')
+    const tagButtons = document.querySelectorAll('.tag-button')
+    const activeTags = new Set()
+    let searchIndex = null
+
+    // Load and cache search index
+    async function loadSearchIndex() {
+      if (searchIndex) return searchIndex
+      
+      try {
+        const response = await fetch('/search_index.json')
+        searchIndex = await response.json()
+        return searchIndex
+      } catch (error) {
+        console.error('Error loading search index:', error)
+        return { posts: [] }
+      }
+    }
+
+    function renderPost(post) {
+      return `
+        <article class="post-preview" data-tags="${post.tags.join(' ')}">
+          <h2>
+            <span class="post-date">${post.date}</span>
+            <a href="${post.url}">${post.title}</a>
+          </h2>
+          ${post.tags.length ? `
+            <div class="post-tags">
+              ${post.tags.map(tag => `<span class="tag">${tag}</span>`).join('')}
+            </div>
+          ` : ''}
+          <div class="post-excerpt">
+            ${post.excerpt}
+          </div>
+        </article>
+      `
+    }
+
+    async function filterPosts() {
+      const searchTerm = searchInput.value.toLowerCase()
+      const data = await loadSearchIndex()
+      
+      const filteredPosts = data.posts.filter(post => {
+        const matchesSearch = searchTerm === '' || 
+          post.title.toLowerCase().includes(searchTerm) ||
+          post.content.toLowerCase().includes(searchTerm)
+
+        const postTags = new Set(post.tags)
+        const matchesTags = activeTags.size === 0 ||
+          Array.from(activeTags).every(tag => postTags.has(tag))
+
+        return matchesSearch && matchesTags
+      })
+
+      postsContainer.innerHTML = filteredPosts.map(renderPost).join('')
+      noResults.classList.toggle('hidden', filteredPosts.length > 0)
+    }
+
+    // Debounce function to limit how often filterPosts runs
+    function debounce(func, wait) {
+      let timeout
+      return function executedFunction(...args) {
+        const later = () => {
+          clearTimeout(timeout)
+          func(...args)
+        }
+        clearTimeout(timeout)
+        timeout = setTimeout(later, wait)
+      }
+    }
+
+    // Add event listeners
+    searchInput.addEventListener('input', debounce(filterPosts, 300))
+
+    tagButtons.forEach(button => {
+      button.addEventListener('click', () => {
+        const tag = button.dataset.tag
+        if (activeTags.has(tag)) {
+          activeTags.delete(tag)
+          button.classList.remove('active')
+        } else {
+          activeTags.add(tag)
+          button.classList.add('active')
+        }
+        filterPosts()
+      })
+    })
+
+    // Initial load of search index
+    loadSearchIndex()
+  })
+</script>
+
+</body>
+
+</html>