jekyll-theme-zer0 0.1.3 → 0.1.5

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: f51889f72c3949cdfc2a364886b710ff778164e254a586a1ff4dafc628d6743d
-  data.tar.gz: eb237dcc3999a7ea65f62ed7db483cbda799cc4c12913a4b92176b279dba7375
+  metadata.gz: 54143764fa2227d99167438eb1a68c6e98e5133e0d01f2b2633acd88be6a3a00
+  data.tar.gz: 4d5ccc9af8f8aaf8d478789588419732268637965a655609bdad43c8d214c768
 SHA512:
-  metadata.gz: f3a48c3bf56d3eafe8e059a250ec828762ec6d016e90a80a663e4db4c6db8da0781dcc1afa94d67c8ac3edff0272711d87330c1db54985f1cef110f91e464203
-  data.tar.gz: 810c5f6750d2dbafa59820a7821a7705e8481d71670e6be00bc44a8d66bf96a4dd2c45cee64644901a42099e4c6cc0a7ab74f87aae04c39cc67604bce8d4d4e3
+  metadata.gz: 319dce277549bc6825dde7174f75000c04fef3c77ebba798d8a0041c761fe31da2690eb6d1c90c0d6b515192333bb1e5f42b00a2f6f065f9ce0479999ddf4d2b
+  data.tar.gz: 8b0f559ed7a5a01314a0f02a392d63700f10fc17d179741297e6ac751a9cd02c01571eeac2fdab82ea8e42b23b809319b181e9bf99b3bc54f04571a09a5ac178

data/README.md

@@ -30,13 +30,16 @@ snippet: What is a snippet?
 comments: true
 ---
 
+[![pages-build-deployment](https://github.com/bamr87/zer0-mistakes/actions/workflows/pages/pages-build-deployment/badge.svg)](https://github.com/bamr87/zer0-mistakes/actions/workflows/pages/pages-build-deployment)
+
+[![Gem Version](https://badge.fury.io/rb/jekyll-theme-zer0.svg)](https://badge.fury.io/rb/jekyll-theme-zer0)
+
 This is the seed of the project with all the commands, scripts, and instructions that build this application from the ground up.
 In theory, this should be the only file you need to build the project from scratch.
 However, in practice, you may need to install additional dependencies or configure the environment to match the target system. 
 For example, you may need to install Ruby, Node.js, or other tools to run the application locally or deploy it to a server.
 Therefore, part of this document is to provide a list of prerequisites and setup instructions to help you get started with the project.
 
-[![Gem Version](https://badge.fury.io/rb/jekyll-theme-zer0.svg)](https://badge.fury.io/rb/jekyll-theme-zer0)
 
 ## System Specs
 
@@ -110,12 +113,45 @@ More importantly, you need to:
 Make sure you have the following installed on your machine:
 
 ```shell
-# install and update prerequisites
-
-brew install git
-brew install gh
-brew install --cask docker
-brew install --cask visual-studio-code
+# Check if git is installed
+if ! git --version > /dev/null 2>&1; then
+  echo "git is not installed. Installing..."
+  brew install git
+else
+  echo "git is already installed."
+fi
+
+# Check if gh is installed
+if ! gh --version > /dev/null 2>&1; then
+  echo "gh is not installed. Installing..."
+  brew install gh
+else
+  echo "gh is already installed."
+fi
+
+# Check if gh is authenticated
+if ! gh auth status > /dev/null 2>&1; then
+  echo "gh is not authenticated. Please authenticate..."
+  gh auth login
+else
+  echo "gh is already authenticated."
+fi
+
+# Check if Docker is installed
+if ! docker --version > /dev/null 2>&1; then
+  echo "Docker is not installed. Installing..."
+  brew install --cask docker
+else
+  echo "Docker is already installed."
+fi
+
+# Check if Visual Studio Code is installed
+if ! code --version > /dev/null 2>&1; then
+  echo "Visual Studio Code is not installed. Installing..."
+  brew install --cask visual-studio-code
+else
+  echo "Visual Studio Code is already installed."
+fi
 ```
 
 ## Environment
@@ -132,7 +168,7 @@ brew install --cask visual-studio-code
 # Or use the following to set the environment variables
 
 export GITHOME=~/github
-export GHUSER=bamr87
+export GHUSER=$(gh api user --jq '.login')
 export GIT_REPO=zer0-mistakes
 export ZREPO=$GITHOME/$GIT_REPO
 ```
@@ -254,6 +290,27 @@ echo "  gem 'jekyll-paginate', '~> 1.1'" >> Gemfile
 echo "end" >> Gemfile
 ```
 
+### Configure Jekyll
+
+```shell
+code _config.yml
+```
+
+```yaml
+theme: jekyll-theme-zer0
+
+title: zer0-mistakes
+email: bamr87@zer0-mistakes.com
+description: >- # this means to ignore newlines until "baseurl:"
+  Write an awesome description for your new site here. You can edit this
+  line in _config.yml. It will appear in your document head meta (for
+  Google search results) and in your feed.xml site description.
+baseurl: null # the subpath of your site, e.g. /blog
+url: null # the base hostname & protocol for your site, e.g. http://example.com
+twitter_username: bamr87
+github_username:  bamr87
+```
+
 ### Create Dockerfile
 
 ```shell
@@ -302,55 +359,6 @@ open http://localhost:4000/
 
 ![](/assets/images/zer0-checkpoint-2.png)
 
-## Install Jekyll
-
-Install [jekyll](https://jekyllrb.com/docs/installation/)
-
-```shell
-jekyll new ./ --force
-bundle install
-```
-
-## Checkpoint - Jekyll Initialized
-
-
-```shell
-code _config.yml
-```
-
-```yaml
-theme: jekyll-theme-zer0
-
-title: zer0-mistakes
-email: bamr87@zer0-mistakes.com
-description: >- # this means to ignore newlines until "baseurl:"
-  Write an awesome description for your new site here. You can edit this
-  line in _config.yml. It will appear in your document head meta (for
-  Google search results) and in your feed.xml site description.
-baseurl: null # the subpath of your site, e.g. /blog
-url: null # the base hostname & protocol for your site, e.g. http://example.com
-twitter_username: bamr87
-github_username:  bamr87
-```
-
-<!-- TODO: add favicon instructions for branding -->
-
-```shell
-cd $ZREPO
-wget https://raw.githubusercontent.com/bamr87/it-journey/master/favicon.ico
-```
-
-## Install Jekyll
-
-Install [jekyll](https://jekyllrb.com/docs/installation/)
-
-```shell
-docker run jekyll new ./ --force
-bundle install
-```
-
-## Checkpoint - Jekyll Initialized
-
 ```shell
 code _config.yml
 ```
@@ -368,102 +376,6 @@ twitter_username: bamr87
 github_username:  bamr87
 ```
 
-<!-- TODO: add favicon instructions for branding -->
-
-```shell
-cd $ZREPO
-wget https://raw.githubusercontent.com/bamr87/it-journey/master/favicon.ico
-```
-
-## Checkpoint 1
-
-```shell
-
-bundle lock --add-platform x86-mingw32 x64-mingw32 x86-mswin32 java
-```
-
-### Override default
-https://jekyllrb.com/docs/themes/#overriding-theme-defaults
-
-```shell
-# find theme path
-
-bundle info --path minima
-JEKYLL_THEME=$(bundle info --path minima)
-echo $JEKYLL_THEME
-cd $JEKYLL_THEME
-```
-
-### Copy theme repo
-
-```shell
-cp -aR $JEKYLL_THEME/* $ZREPO
-```
-
-### Remove Theme plugin
-
-```shell
-bundle remove jekyll-theme-minima
-```
-
-### Comment out the theme from config and Gemfile
-
-```shell
-#_config.yml
-# Build settings
-# theme: minima
-plugins:
-  - jekyll-feed
-```
-
-```shell
-bundle remove minima --install
-```
-
-Restart jekyll
-```shell
-jekyll serve
-```
-
-## Building the theme
-
-### Build default page
-
-```shell
-{%- raw -%}
-cd $ZREPO
-mkdir _layout
-cd _layout
-echo "{{ content }}" >> default.html 
-{% endraw %}
-``` 
-
-
-```shell
-#tree #alias #zshrc #profile
-alias tree="find . -print | sed -e 's;[^/]*/;|____;g;s;____|; |;g'"
-echo alias tree="find . -print | sed -e 's;[^/]*/;|____;g;s;____|; |;g'" >> ~/.zshrc
-
-tree
-cd -
-```
-
-
-## Plant the seed
-
-```shell
-# Set the date format
-d=$(date +%Y-%m-%d)
-echo "$d"
-```
-
-```shell
-# Download the seed page
-cd $ZREPO
-wget -O $d-zer0.md https://raw.githubusercontent.com/bamr87/it-journey/master/zer0.md 
-```
-
-
 ## Convert zer0.md to zer0.sh using Python
 
 ```python
@@ -500,3 +412,9 @@ def convert_md_to_files(md_file_path):
 
 convert_md_to_files('zer0.md')
 ```
+
+## Config file
+
+```yaml
+{% include_relative _config.yml %}
+```

data/_layouts/blog.html

@@ -0,0 +1,221 @@
+---
+layout: root
+source: "https://getbootstrap.com/docs/5.3/examples/blog/#"
+---
+
+<div class="container">
+  <header class="border-bottom lh-1 py-3">
+    <div class="row flex-nowrap justify-content-between align-items-center">
+      <div class="col-4 pt-1">
+        <a class="link-secondary" href="#">Subscribe</a>
+      </div>
+      <div class="col-4 text-center">
+        <a class="blog-header-logo text-body-emphasis text-decoration-none" href="#">{{ page.title }}</a>
+      </div>
+      <div class="col-4 d-flex justify-content-end align-items-center">
+        <a class="link-secondary" href="#" aria-label="Search">
+          <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="mx-3" role="img" viewBox="0 0 24 24"><title>Search</title><circle cx="10.5" cy="10.5" r="7.5"/><path d="M21 21l-5.2-5.2"/></svg>
+        </a>
+        <a class="btn btn-sm btn-outline-secondary" href="#">Sign up</a>
+      </div>
+    </div>
+  </header>
+
+  <div class="nav-scroller py-1 mb-3 border-bottom">
+    <nav class="nav nav-underline justify-content-between">
+      <a class="nav-item nav-link link-body-emphasis active" href="#">World</a>
+      <a class="nav-item nav-link link-body-emphasis" href="#">U.S.</a>
+      <a class="nav-item nav-link link-body-emphasis" href="#">Technology</a>
+      <a class="nav-item nav-link link-body-emphasis" href="#">Business</a>
+      <a class="nav-item nav-link link-body-emphasis" href="#">Politics</a>
+      <a class="nav-item nav-link link-body-emphasis" href="#">Science</a>
+      <a class="nav-item nav-link link-body-emphasis" href="#">Travel</a>
+    </nav>
+  </div>
+</div>
+
+<main class="container">
+  <div class="p-4 p-md-5 mb-4 rounded text-body-emphasis bg-body-secondary">
+    <div class="col-lg-6 px-0">
+      <h1 class="display-4 fst-italic">Title of a longer featured blog post</h1>
+      <p class="lead my-3">Multiple lines of text that form the lede, informing new readers quickly and efficiently about what’s most interesting in this post’s contents.</p>
+      <p class="lead mb-0"><a href="#" class="text-body-emphasis fw-bold">Continue reading...</a></p>
+    </div>
+  </div>
+
+  <div class="row mb-2">
+    <div class="col-md-6">
+      <div class="row g-0 border rounded overflow-hidden flex-md-row mb-4 shadow-sm h-md-250 position-relative">
+        <div class="col p-4 d-flex flex-column position-static">
+          <strong class="d-inline-block mb-2 text-primary-emphasis">World</strong>
+          <h3 class="mb-0">Featured post</h3>
+          <div class="mb-1 text-body-secondary">Nov 12</div>
+          <p class="card-text mb-auto">This is a wider card with supporting text below as a natural lead-in to additional content.</p>
+          <a href="#" class="icon-link gap-1 icon-link-hover stretched-link">
+            Continue reading
+            <svg class="bi"><use xlink:href="#chevron-right"/></svg>
+          </a>
+        </div>
+        <div class="col-auto d-none d-lg-block">
+          <svg class="bd-placeholder-img" width="200" height="250" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Placeholder: Thumbnail" preserveAspectRatio="xMidYMid slice" focusable="false"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"/><text x="50%" y="50%" fill="#eceeef" dy=".3em">Thumbnail</text></svg>
+        </div>
+      </div>
+    </div>
+    <div class="col-md-6">
+      <div class="row g-0 border rounded overflow-hidden flex-md-row mb-4 shadow-sm h-md-250 position-relative">
+        <div class="col p-4 d-flex flex-column position-static">
+          <strong class="d-inline-block mb-2 text-success-emphasis">Design</strong>
+          <h3 class="mb-0">Post title</h3>
+          <div class="mb-1 text-body-secondary">Nov 11</div>
+          <p class="mb-auto">This is a wider card with supporting text below as a natural lead-in to additional content.</p>
+          <a href="#" class="icon-link gap-1 icon-link-hover stretched-link">
+            Continue reading
+            <svg class="bi"><use xlink:href="#chevron-right"/></svg>
+          </a>
+        </div>
+        <div class="col-auto d-none d-lg-block">
+          <svg class="bd-placeholder-img" width="200" height="250" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Placeholder: Thumbnail" preserveAspectRatio="xMidYMid slice" focusable="false"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"/><text x="50%" y="50%" fill="#eceeef" dy=".3em">Thumbnail</text></svg>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <div class="row g-5">
+    <div class="col-md-8">
+      <h3 class="pb-4 mb-4 fst-italic border-bottom">
+        From the Firehose
+      </h3>
+
+      <article class="blog-post">
+        {{ content }}
+      </article>
+
+      <article class="blog-post">
+        <h2 class="display-5 link-body-emphasis mb-1">Another blog post</h2>
+        <p class="blog-post-meta">December 23, 2020 by <a href="#">Jacob</a></p>
+
+        <p>This is some additional paragraph placeholder content. It has been written to fill the available space and show how a longer snippet of text affects the surrounding content. We'll repeat it often to keep the demonstration flowing, so be on the lookout for this exact same string of text.</p>
+        <blockquote>
+          <p>Longer quote goes here, maybe with some <strong>emphasized text</strong> in the middle of it.</p>
+        </blockquote>
+        <p>This is some additional paragraph placeholder content. It has been written to fill the available space and show how a longer snippet of text affects the surrounding content. We'll repeat it often to keep the demonstration flowing, so be on the lookout for this exact same string of text.</p>
+        <h3>Example table</h3>
+        <p>And don't forget about tables in these posts:</p>
+        <table class="table">
+          <thead>
+            <tr>
+              <th>Name</th>
+              <th>Upvotes</th>
+              <th>Downvotes</th>
+            </tr>
+          </thead>
+          <tbody>
+            <tr>
+              <td>Alice</td>
+              <td>10</td>
+              <td>11</td>
+            </tr>
+            <tr>
+              <td>Bob</td>
+              <td>4</td>
+              <td>3</td>
+            </tr>
+            <tr>
+              <td>Charlie</td>
+              <td>7</td>
+              <td>9</td>
+            </tr>
+          </tbody>
+          <tfoot>
+            <tr>
+              <td>Totals</td>
+              <td>21</td>
+              <td>23</td>
+            </tr>
+          </tfoot>
+        </table>
+
+        <p>This is some additional paragraph placeholder content. It's a slightly shorter version of the other highly repetitive body text used throughout.</p>
+      </article>
+
+      <article class="blog-post">
+        <h2 class="display-5 link-body-emphasis mb-1">New feature</h2>
+        <p class="blog-post-meta">December 14, 2020 by <a href="#">Chris</a></p>
+
+        <p>This is some additional paragraph placeholder content. It has been written to fill the available space and show how a longer snippet of text affects the surrounding content. We'll repeat it often to keep the demonstration flowing, so be on the lookout for this exact same string of text.</p>
+        <ul>
+          <li>First list item</li>
+          <li>Second list item with a longer description</li>
+          <li>Third list item to close it out</li>
+        </ul>
+        <p>This is some additional paragraph placeholder content. It's a slightly shorter version of the other highly repetitive body text used throughout.</p>
+      </article>
+
+      <nav class="blog-pagination" aria-label="Pagination">
+        <a class="btn btn-outline-primary rounded-pill" href="#">Older</a>
+        <a class="btn btn-outline-secondary rounded-pill disabled" aria-disabled="true">Newer</a>
+      </nav>
+
+    </div>
+
+    <div class="col-md-4">
+      <div class="position-sticky" style="top: 2rem;">
+        <div class="p-4 mb-3 bg-body-tertiary rounded">
+          <h4 class="fst-italic">About</h4>
+          <p class="mb-0">Customize this section to tell your visitors a little bit about your publication, writers, content, or something else entirely. Totally up to you.</p>
+        </div>
+
+        <div>
+          <h4 class="fst-italic">Recent posts</h4>
+        <ul class="list-unstyled">
+            {% for post in site.posts limit:3 %}
+                <li>
+                    <a class="d-flex flex-column flex-lg-row gap-3 align-items-start align-items-lg-center py-3 link-body-emphasis text-decoration-none border-top" href="{{ post.url }}">
+                        <img class="bd-placeholder-img" src="{{ page.preview | default:  site.og_image }}" width="100%" height="96" alt="Preview image">
+                        <div class="col-lg-8">
+                            <h6 class="mb-0">{{ post.title }}</h6>
+                            <small class="text-body-secondary">{{ post.date | date: "%B %d, %Y" }}</small>
+                        </div>
+                    </a>
+                </li>
+            {% endfor %}
+        </ul>
+        </div>
+
+        <div class="p-4">
+          <h4 class="fst-italic">Archives</h4>
+          <ol class="list-unstyled mb-0">
+            <li><a href="#">March 2021</a></li>
+            <li><a href="#">February 2021</a></li>
+            <li><a href="#">January 2021</a></li>
+            <li><a href="#">December 2020</a></li>
+            <li><a href="#">November 2020</a></li>
+            <li><a href="#">October 2020</a></li>
+            <li><a href="#">September 2020</a></li>
+            <li><a href="#">August 2020</a></li>
+            <li><a href="#">July 2020</a></li>
+            <li><a href="#">June 2020</a></li>
+            <li><a href="#">May 2020</a></li>
+            <li><a href="#">April 2020</a></li>
+          </ol>
+        </div>
+
+        <div class="p-4">
+            {% include sidebar-categories.html %}
+        </div>
+
+        <div class="p-4">
+          <h4 class="fst-italic">Elsewhere</h4>
+          <ol class="list-unstyled">
+            <li><a href="#">GitHub</a></li>
+            <li><a href="#">Twitter</a></li>
+            <li><a href="#">Facebook</a></li>
+          </ol>
+        </div>
+      </div>
+    </div>
+  </div>
+
+</main>
+
+

data/_layouts/landing.html

@@ -0,0 +1,18 @@
+---
+layout: root
+---
+
+  <!-- Left Sidebar for Outline - Offcanvas -->
+  <!-- _includes/sidebar-left.html  -->
+  <div class="offcanvas">
+    {% include sidebar-left.html %}
+  </div>
+  <div class="container-xl pt-5">
+  
+  {{ content }}
+</div>
+
+<!-- Features -->
+    <!-- particles.js -->
+    <script src="/assets/js/particles-source.js"></script>
+    <script src="/assets/js/particles.js"></script>

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: jekyll-theme-zer0
 version: !ruby/object:Gem::Version
-  version: 0.1.3
+  version: 0.1.5
 platform: ruby
 authors:
 - Amr Abdel
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2024-06-10 00:00:00.000000000 Z
+date: 2024-06-15 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: jekyll
@@ -95,12 +95,14 @@ files:
 - _includes/toc
 - _includes/toc.html
 - _includes/zer0-env-var.html
+- _layouts/blog.html
 - _layouts/collection.html
 - _layouts/default.html
 - _layouts/home.html
 - _layouts/index.html
 - _layouts/javascript.html
 - _layouts/journals.html
+- _layouts/landing.html
 - _layouts/root.html
 - _sass/custom.scss
 - _sass/it-journey/_docs.scss