Merge pull request #1 from Cyb3rM0nk3ys/refactoring

Refactoring
Cyb3rM0nk3ys · Nov 29, 2023 · 765af49 · 765af49
2 parents c2d5bc6 + cb70b78
commit 765af49
Show file tree

Hide file tree

Showing 16 changed files with 86 additions and 54 deletions.
diff --git a/_includes/head-custom-metadata.html b/_includes/head-custom-metadata.html
@@ -0,0 +1,5 @@
+<meta charset='utf-8'>
+<meta http-equiv="X-UA-Compatible" content="IE=edge">
+<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 }}">
+<link rel="icon" type="image/x-icon" href="/assets/images/team-logo-optimized.webp">
diff --git a/_includes/head-custom.html b/_includes/head-custom.html
@@ -1,29 +1,38 @@
+<!-- start custom head snippets, customize with your own _includes/head-custom.html file -->
 
 <!-- Setup theme-color -->
 {% include head-custom-theme-colors.html %}
 
 <!-- Setup Google Analytics -->
 {% include head-custom-google-analytics.html %}
 
-<!-- link rel="shortcut icon" type="image/x-icon" href="{{ '/favicon.ico' | relative_url }}" -->
+
+<!-- Setup favicon, stylesheets and metadata -->
+{% include head-custom-metadata.html %}
+
 
 <header>
-<div class="container">
+ <div class="container">
  <center>
- <img src="/assets/images/team-logo.svg" alt="Cyb3rM0nk3ys logo" width="7%" height="7%"/>
+ <img src="/assets/images/team-logo.png" alt="Cyb3rM0nk3ys logo" width="7%" height="7%"/>
+
  <a id="a-title" href="/">
  <h1>Cyb3rM0nk3ys</h1>
  </a>
- <h2>Cyb3rM0nk3ys is a CTF team based in Verona.</h2>
+ <h2>Cyb3rM0nk3ys is a ...CTF team...</h2>
 
- <a href="/">
+ <a href="/home">
  Home</a>
+ <a href="/about">
+ About us
+ </a>
+ <a href="/join">
+ Join us</a>
  <a href="/members">
  Monkeys</a>
- <a href="/join">
- Join us</a> 
+ <!-- profiles -->
  </center>
  </div>
 </header>
 
-<!-- end custom head snippets -->
+<!-- end custom head snippets -->
diff --git a/_layouts/404.html b/_layouts/404.html
@@ -2,10 +2,7 @@
 <html lang="{{ site.lang | default: " en-US" }}">
 
 <head>
- <meta charset='utf-8'>
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
- <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 }}">
+
  {% include head-custom.html %}
 
  {% seo %}
@@ -14,7 +11,9 @@
 <body>
  <div class="container">
  <center>
- <b><h1>404 ~ banana not found</h1></b>
+ <b>
+ <h1>404 ~ banana not found</h1>
+ </b>
  <section id="main_content">
  <div id="gif-container">
  <img id="gif" src="">
@@ -27,11 +26,37 @@
  // chatGPT make a js function that returns a random GIF
  function getRandomGif() {
  const gifFiles = [
- "shocked-monkey1.gif",
- "shocked-monkey2.gif",
+ "shocked-monkey1",
+ "shocked-monkey2",
+ "shocked-monkey3",
+ "angry-monkey",
+ "type-monkey",
  ];
- const randomGif = gifFiles[Math.floor(Math.random() * gifFiles.length)];
- document.getElementById("gif").src = `/assets/gifs/${randomGif}`;
+ const randomIndex = Math.floor(Math.random() * gifFiles.length);
+ const randomGif = gifFiles[randomIndex];
+ const placeholderImage = new Image();
+
+ // Preload webp image as a placeholder
+ placeholderImage.src = `assets/images/gifs-first-image/${randomGif.concat(".webp")}`;
+ placeholderImage.onload = function () {
+ // Once the webp image is loaded, set it as the placeholder
+ let existingImage = document.getElementById("gif");
+
+ existingImage.parentNode.replaceChild(placeholderImage, existingImage);
+ placeholderImage.id = "gif"
+
+ // Load the actual GIF in the background
+ const actualGif = new Image();
+ actualGif.src = `assets/gifs/${randomGif.concat(".gif")}`;
+ actualGif.onload = function () {
+ // Replace the placeholder with the loaded GIF
+ existingImage = document.getElementById("gif");
+
+ existingImage.parentNode.replaceChild(actualGif, existingImage);
+ existingImage.id = "gif"
+ };
+ };
+
  }
  window.onload = getRandomGif;
  </script>

diff --git a/_layouts/achievement.html b/_layouts/achievement.html
@@ -2,10 +2,7 @@
 <html lang="{{ site.lang | default: " en-US" }}">
 
 <head>
- <meta charset='utf-8'>
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
- <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 }}">
+
  {% include head-custom.html %}
 
  {% seo %}
@@ -14,8 +11,8 @@
 <body>
  <div class="container">
  <section id="writeup">
-  <small>{{ page.date | date: "%-d %B %Y" }}</small>
-  <h1><b>{{ page.title }}</b></h1>
+ <small>{{ page.date | date: "%-d %B %Y" }}</small>
+ <h1><b>{{ page.title }}</b></h1>
  <hr>
  {{content}}
  </section>
diff --git a/_layouts/default.html b/_layouts/default.html
@@ -1,22 +1,20 @@
 <!DOCTYPE html>
-<html lang="{{ site.lang | default: "en-US" }}">
- <head>
- <meta charset='utf-8'>
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
- <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 }}">
- {% include head-custom.html %}
+<html lang="{{ site.lang | default: " en-US" }}">
 
-{% seo %}
- </head>
+<head>
 
- <body>
- <div class="container">
- <section id="main_content">
- <div id="ascii-art"></div>
- <div id="left-column">
- <!-- mi annoiavo di questi investigatori scarsi quindi ho deciso di leakare una vera flag :) -->
- <pre>
+ {% include head-custom.html %}
+
+ {% seo %}
+</head>
+
+<body>
+ <div class="container">
+ <section id="main_content">
+ <div id="ascii-art"></div>
+ <div id="left-column">
+ <!-- mi annoiavo di questi investigatori scarsi quindi ho deciso di leakare una vera flag :) -->
+ <pre>
  ██ 
  ██ ██████████ ████████████ 
  ██████████▒▒▒▒▒▒▒▒▒▒████████▒▒▒▒▒▒▒▒▒▒▒▒██ 
@@ -67,11 +65,12 @@
  ░░░░░░██░░▒▒████████████████████████░░▒▒████░░░░░░░░░░░░░░░░ 
  ░░░░░░████░░░░░░░░░░░░░░░░░░░░░░░░████░░░░░░░░░░░░░░░░ 
  </pre>
- </div>
- <div id="right-column">
- {{ content }}
- </div>
- </section>
- </div>
- </body>
-</html>
+ </div>
+ <div id="right-column">
+ {{ content }}
+ </div>
+ </section>
+ </div>
+</body>
+
+</html>
diff --git a/_layouts/post.html b/_layouts/post.html
@@ -2,10 +2,7 @@
 <html lang="{{ site.lang | default: " en-US" }}">
 
 <head>
- <meta charset='utf-8'>
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
- <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 }}">
+
  {% include head-custom.html %}
 
  {% seo %}
@@ -14,9 +11,9 @@
 <body>
  <div class="container">
  <section id="writeup">
-  <small>{{ page.date | date: "%-d %B %Y" }}</small>
-  <h1><b>{{ page.title }}</b></h1>
-  <p class="view">by {{ page.author | default: site.author }} | Category: {{ page.chall-category }}</p>
+ <small>{{ page.date | date: "%-d %B %Y" }}</small>
+ <h1><b>{{ page.title }}</b></h1>
+ <p class="view">by {{ page.author | default: site.author }} | Category: {{ page.chall-category }}</p>
  <hr>
  {{content}}
 

diff --git a/assets/gifs/angry-monkey.gif b/assets/gifs/angry-monkey.gif
diff --git a/assets/gifs/shocked-monkey3.gif b/assets/gifs/shocked-monkey3.gif
diff --git a/assets/gifs/type-monkey.gif b/assets/gifs/type-monkey.gif
diff --git a/assets/images/gifs-first-image/angry-monkey.webp b/assets/images/gifs-first-image/angry-monkey.webp
diff --git a/assets/images/gifs-first-image/shocked-monkey1.webp b/assets/images/gifs-first-image/shocked-monkey1.webp
diff --git a/assets/images/gifs-first-image/shocked-monkey2.webp b/assets/images/gifs-first-image/shocked-monkey2.webp
diff --git a/assets/images/gifs-first-image/shocked-monkey3.webp b/assets/images/gifs-first-image/shocked-monkey3.webp
diff --git a/assets/images/gifs-first-image/type-monkey.webp b/assets/images/gifs-first-image/type-monkey.webp
diff --git a/assets/images/team-logo-optimized.webp b/assets/images/team-logo-optimized.webp
diff --git a/assets/images/team-logo.png b/assets/images/team-logo.png