Merge pull request #15 from Slavetomints/guides-page

Slavetomints · web-flow · commit e7bf98e40271 · 2025-12-18T23:34:56.000-06:00
add(feat): created guides tab
diff --git a/_posts/2025-12-13-guides-cyber-chef-i.md b/_posts/2025-12-13-guides-cyber-chef-i.md
@@ -18,9 +18,9 @@ image:
 
 > This was originally a set of walkthrough challenges I created for StoutCTF 2025. They have been re-uploaded here as guides after the fact. CyberChef VIII - CyberChef X are considered to be writeups, and are in the writeups category.
 >
->CyberChef VIII: http://slavetomints.com/posts/stoutctf-cyber-chef-viii/
->CyberChef IX: http://slavetomints.com/posts/stoutctf-cyber-chef-ix/
->CyberChef X: http://slavetomints.com/posts/stoutctf-cyber-chef-x/
+>- CyberChef VIII: [here](https://slavetomints.com/posts/stoutctf-cyber-chef-viii/)
+>- CyberChef IX: [here](https://slavetomints.com/posts/stoutctf-cyber-chef-ix/)
+>- CyberChef X: [here](https://slavetomints.com/posts/stoutctf-cyber-chef-x/)
 {: .prompt-info }
 
 Can you decode this ciphertext?
diff --git a/_posts/2025-12-13-guides-cyber-chef-ii.md b/_posts/2025-12-13-guides-cyber-chef-ii.md
@@ -17,9 +17,9 @@ image:
 ---
 > This was originally a set of walkthrough challenges I created for StoutCTF 2025. They have been re-uploaded here as guides after the fact. CyberChef VIII - CyberChef X are considered to be writeups, and are in the writeups category.
 >
->CyberChef VIII: http://slavetomints.com/posts/stoutctf-cyber-chef-viii/
->CyberChef IX: http://slavetomints.com/posts/stoutctf-cyber-chef-ix/
->CyberChef X: http://slavetomints.com/posts/stoutctf-cyber-chef-x/
+>- CyberChef VIII: [here](https://slavetomints.com/posts/stoutctf-cyber-chef-viii/)
+>- CyberChef IX: [here](https://slavetomints.com/posts/stoutctf-cyber-chef-ix/)
+>- CyberChef X: [here](https://slavetomints.com/posts/stoutctf-cyber-chef-x/)
 {: .prompt-info }
 
 
diff --git a/_posts/2025-12-13-guides-cyber-chef-iii.md b/_posts/2025-12-13-guides-cyber-chef-iii.md
@@ -18,9 +18,9 @@ image:
 
 > This was originally a set of walkthrough challenges I created for StoutCTF 2025. They have been re-uploaded here as guides after the fact. CyberChef VIII - CyberChef X are considered to be writeups, and are in the writeups category.
 >
->CyberChef VIII: http://slavetomints.com/posts/stoutctf-cyber-chef-viii/
->CyberChef IX: http://slavetomints.com/posts/stoutctf-cyber-chef-ix/
->CyberChef X: http://slavetomints.com/posts/stoutctf-cyber-chef-x/
+>- CyberChef VIII: [here](https://slavetomints.com/posts/stoutctf-cyber-chef-viii/)
+>- CyberChef IX: [here](https://slavetomints.com/posts/stoutctf-cyber-chef-ix/)
+>- CyberChef X: [here](https://slavetomints.com/posts/stoutctf-cyber-chef-x/)
 {: .prompt-info }
 
 Can you decode this ciphertext?
diff --git a/_posts/2025-12-13-guides-cyber-chef-iv.md b/_posts/2025-12-13-guides-cyber-chef-iv.md
@@ -18,9 +18,9 @@ image:
 
 > This was originally a set of walkthrough challenges I created for StoutCTF 2025. They have been re-uploaded here as guides after the fact. CyberChef VIII - CyberChef X are considered to be writeups, and are in the writeups category.
 >
->CyberChef VIII: http://slavetomints.com/posts/stoutctf-cyber-chef-viii/
->CyberChef IX: http://slavetomints.com/posts/stoutctf-cyber-chef-ix/
->CyberChef X: http://slavetomints.com/posts/stoutctf-cyber-chef-x/
+>- CyberChef VIII: [here](https://slavetomints.com/posts/stoutctf-cyber-chef-viii/)
+>- CyberChef IX: [here](https://slavetomints.com/posts/stoutctf-cyber-chef-ix/)
+>- CyberChef X: [here](https://slavetomints.com/posts/stoutctf-cyber-chef-x/)
 {: .prompt-info }
 
 Can you decode this ciphertext?
diff --git a/_posts/2025-12-13-guides-cyber-chef-v.md b/_posts/2025-12-13-guides-cyber-chef-v.md
@@ -18,9 +18,9 @@ image:
 
 > This was originally a set of walkthrough challenges I created for StoutCTF 2025. They have been re-uploaded here as guides after the fact. CyberChef VIII - CyberChef X are considered to be writeups, and are in the writeups category.
 >
->CyberChef VIII: http://slavetomints.com/posts/stoutctf-cyber-chef-viii/
->CyberChef IX: http://slavetomints.com/posts/stoutctf-cyber-chef-ix/
->CyberChef X: http://slavetomints.com/posts/stoutctf-cyber-chef-x/
+>- CyberChef VIII: [here](https://slavetomints.com/posts/stoutctf-cyber-chef-viii/)
+>- CyberChef IX: [here](https://slavetomints.com/posts/stoutctf-cyber-chef-ix/)
+>- CyberChef X: [here](https://slavetomints.com/posts/stoutctf-cyber-chef-x/)
 {: .prompt-info }
 
 Can you decode this ciphertext?
diff --git a/_posts/2025-12-13-guides-cyber-chef-vi.md b/_posts/2025-12-13-guides-cyber-chef-vi.md
@@ -18,9 +18,9 @@ image:
 
 > This was originally a set of walkthrough challenges I created for StoutCTF 2025. They have been re-uploaded here as guides after the fact. CyberChef VIII - CyberChef X are considered to be writeups, and are in the writeups category.
 >
->CyberChef VIII: http://slavetomints.com/posts/stoutctf-cyber-chef-viii/
->CyberChef IX: http://slavetomints.com/posts/stoutctf-cyber-chef-ix/
->CyberChef X: http://slavetomints.com/posts/stoutctf-cyber-chef-x/
+>- CyberChef VIII: [here](https://slavetomints.com/posts/stoutctf-cyber-chef-viii/)
+>- CyberChef IX: [here](https://slavetomints.com/posts/stoutctf-cyber-chef-ix/)
+>- CyberChef X: [here](https://slavetomints.com/posts/stoutctf-cyber-chef-x/)
 {: .prompt-info }
 
 Can you decode this ciphertext?
diff --git a/_posts/2025-12-13-guides-cyber-chef-vii.md b/_posts/2025-12-13-guides-cyber-chef-vii.md
@@ -18,9 +18,9 @@ image:
 
 > This was originally a set of walkthrough challenges I created for StoutCTF 2025. They have been re-uploaded here as guides after the fact. CyberChef VIII - CyberChef X are considered to be writeups, and are in the writeups category.
 >
->CyberChef VIII: http://slavetomints.com/posts/stoutctf-cyber-chef-viii/
->CyberChef IX: http://slavetomints.com/posts/stoutctf-cyber-chef-ix/
->CyberChef X: http://slavetomints.com/posts/stoutctf-cyber-chef-x/
+>- CyberChef VIII: [here](https://slavetomints.com/posts/stoutctf-cyber-chef-viii/)
+>- CyberChef IX: [here](https://slavetomints.com/posts/stoutctf-cyber-chef-ix/)
+>- CyberChef X: [here](https://slavetomints.com/posts/stoutctf-cyber-chef-x/)
 {: .prompt-info }
 
 Can you decode this ciphertext?
diff --git a/_tabs/archives.md b/_tabs/archives.md
@@ -1,5 +1,5 @@
 ---
 layout: archives
 icon: fas fa-archive
-order: 5
+order: 6
 ---
diff --git a/_tabs/categories.md b/_tabs/categories.md
@@ -1,5 +1,5 @@
 ---
 layout: categories
 icon: fas fa-stream
-order: 3
+order: 4
 ---
diff --git a/_tabs/guides.md b/_tabs/guides.md
@@ -0,0 +1,40 @@
+---
+layout: default
+title: "Guides"
+permalink: /guides/
+icon: fas fa-book
+order: 3
+---
+# Guides
+
+<br>
+
+<div class="guides-grid">
+
+  <div>
+  <a href="/guides/cyberchef/" class="guide-card">
+    <div class="guide-card-image">
+      <img
+        src="/assets/img/guides/cyberchef/cyberchef-128x128.png"
+        alt="CyberChef logo and recipe interface"
+      />
+    </div>
+
+    <div class="guide-card-body">
+      <h2>CyberChef</h2>
+      <p>
+        Practical CyberChef guides covering decoding, forensics,
+        OSINT workflows, and CTF-style recipes.
+      </p>
+
+      <div class="guide-card-meta">
+        <i class="far fa-folder-open fa-fw"></i>
+        <span>Guides, CyberChef</span>
+      </div>
+    </div>
+  </a>
+</div>
+
+
+
+</div>
diff --git a/_tabs/tags.md b/_tabs/tags.md
@@ -1,5 +1,5 @@
 ---
 layout: tags
 icon: fas fa-tags
-order: 4
+order: 5
 ---
diff --git a/assets/css/jekyll-theme-chirpy.scss b/assets/css/jekyll-theme-chirpy.scss
@@ -0,0 +1,89 @@
+---
+---
+
+/* prettier-ignore */
+@use 'main
+{%- if jekyll.environment == 'production' -%}
+  .bundle
+{%- endif -%}
+';
+
+/* append your custom style below */
+
+.guide-card {
+  display: flex;
+  flex-direction: row;
+  text-decoration: none;
+  color: inherit;
+
+  background-color: var(--card-bg);        // same as posts
+  box-shadow: var(--card-shadow);
+  border-radius: 0.5rem;                   // same rounded corners as posts
+  overflow: hidden;
+  position: relative;
+  transition: box-shadow 0.35s ease-in-out; // remove background-color transition
+  margin-bottom: 1.5rem;
+
+  &:hover {
+    box-shadow: 0 8px 20px rgba(0,0,0,0.15);
+  }
+
+  .guide-card-image {
+    display: flex;
+    align-items: center;    // vertical center
+    justify-content: center; // horizontal center
+    padding: 1rem;
+
+    img {
+      width: 128px;
+      height: 128px;
+      object-fit: cover;
+      border-radius: 0.25rem; // slightly rounded
+    }
+  }
+
+  .guide-card-body {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    padding: 1rem;
+
+    h2 {
+      margin: 0 0 0.5rem;
+    }
+
+    p {
+      margin: 0 0 1rem;
+      line-height: 1.4;
+    }
+
+    .guide-card-meta {
+      font-size: 0.85rem;
+      color: var(--text-muted-color);
+      display: flex;
+      align-items: center;
+
+      i {
+        margin-right: 0.25rem;
+      }
+    }
+  }
+
+  // subtle overlay like posts
+  &::before {
+    content: '';
+    width: 100%;
+    height: 100%;
+    position: absolute;
+    background-color: var(--card-hover-bg);
+    opacity: 0;              // start invisible
+    transition: opacity 0.35s ease-in-out;
+    border-radius: 0.5rem;
+    pointer-events: none;
+  }
+
+  &:hover::before {
+    opacity: 0.15;           // very subtle darkening
+  }
+}
diff --git a/assets/css/style.css b/assets/css/style.css
diff --git a/guides/cyberchef.md b/guides/cyberchef.md
@@ -0,0 +1,95 @@
+---
+layout: default
+title: CyberChef Guides
+permalink: /guides/cyberchef/
+---
+
+<h1>CyberChef Guides</h1>
+
+{% include lang.html %}
+
+{% assign all_pinned = '' | split: '' %}
+{% assign all_normal = '' | split: '' %}
+
+{% for post in site.posts %}
+  {% if post.categories.size > 1
+        and post.categories[0] == "Guides"
+        and post.categories[1] == "CyberChef" %}
+    {% if post.pin %}
+      {% assign all_pinned = all_pinned | push: post %}
+    {% elsif post.hidden != true %}
+      {% assign all_normal = all_normal | push: post %}
+    {% endif %}
+  {% endif %}
+{% endfor %}
+
+{% assign posts = all_pinned | concat: all_normal %}
+
+<div id="post-list" class="flex-grow-1 px-xl-1">
+  {% for post in posts %}
+    <article class="card-wrapper card">
+      <a href="{{ post.url | relative_url }}" class="post-preview row g-0 flex-md-row-reverse">
+        {% assign card_body_col = '12' %}
+
+        {% if post.image %}
+          {% assign src = post.image.path | default: post.image %}
+          {% capture src %}{% include media-url.html src=src subpath=post.media_subpath %}{% endcapture %}
+
+          {% assign alt = post.image.alt | xml_escape | default: 'Preview Image' %}
+
+          {% assign lqip = null %}
+
+          {% if post.image.lqip %}
+            {% capture lqip_url %}{% include media-url.html src=post.image.lqip subpath=post.media_subpath %}{% endcapture %}
+            {% assign lqip = 'lqip="' | append: lqip_url | append: '"' %}
+          {% endif %}
+
+          <div class="col-md-5">
+            <img src="{{ src }}" alt="{{ alt }}" {{ lqip }}>
+          </div>
+
+          {% assign card_body_col = '7' %}
+        {% endif %}
+
+        <div class="col-md-{{ card_body_col }}">
+          <div class="card-body d-flex flex-column">
+            <h1 class="card-title my-2 mt-md-0">{{ post.title }}</h1>
+
+            <div class="card-text content mt-0 mb-3">
+              <p>{% include post-description.html %}</p>
+            </div>
+
+            <div class="post-meta flex-grow-1 d-flex align-items-end">
+              <div class="me-auto">
+                <!-- posted date -->
+                <i class="far fa-calendar fa-fw me-1"></i>
+                {% include datetime.html date=post.date lang=lang %}
+
+                <!-- categories -->
+                {% if post.categories.size > 0 %}
+                  <i class="far fa-folder-open fa-fw me-1"></i>
+                  <span class="categories">
+                    {% for category in post.categories %}
+                      {{ category }}
+                      {%- unless forloop.last -%},{%- endunless -%}
+                    {% endfor %}
+                  </span>
+                {% endif %}
+              </div>
+
+              {% if post.pin %}
+                <div class="pin ms-1">
+                  <i class="fas fa-thumbtack fa-fw"></i>
+                  <span>{{ site.data.locales[lang].post.pin_prompt }}</span>
+                </div>
+              {% endif %}
+            </div>
+            <!-- .post-meta -->
+          </div>
+          <!-- .card-body -->
+        </div>
+      </a>
+    </article>
+  {% endfor %}
+</div>
+<!-- #post-list -->
