updated design and added the recommended exploits selector

hideckies · Aug 12, 2024 · 6f7ab55 · 6f7ab55 · deno-deploy · Aug 12, 2024
1 parent 2fa3b1d
commit 6f7ab55
Show file tree

Hide file tree

Showing 24 changed files with 969 additions and 437 deletions.
diff --git a/_config.ts b/_config.ts
@@ -53,29 +53,6 @@ site
 .use(tailwindcss({
     options: {
         theme: {
-            colors: {
-                'black': '#000000',
-                'emerald': '#047857',
-                'emerald-dark': '#064e3b',
-                'emerald-light': '#059669',
-                'navy': '#081624',
-                'navy-dark': '#030911',
-                'navy-light': '#1a1d2f',
-                'navy-light-super': '#29283e',
-                'pink': '#cb17c7',
-                'pink-dark': '#4d074d',
-                'pink-light': '#d462d6',
-                'red': '#7f1d1d',
-                'red-dark': '#450a0a',
-                'red-light': '#b91c1c',
-                'slate': '#1e293b',
-                'slate-dark': '#0f172a',
-                'slate-light': '#334155',
-                'white': '#ffffff',
-                'white-light': '#dadada',
-                'white-dark': '#b9b9b9',
-                'transparent': 'transparent',
-            },
             fontFamily: {
                 base: ["Calibri, sans-serif"],
                 title: ["courier"],
@@ -109,7 +86,7 @@ site.process([".html"], (pages: Lume.Page[]) => {
                             aElem.setAttribute("href", `#${c.slug}`);
                             aElem.innerHTML = c.text;
                             aElem.classList.add('text-base');
-                            aElem.classList.add('hover:brightness-150');
+                            aElem.classList.add('text-slate-400');
                             aElem.classList.add('break-words');
 
                             // Add to the parent element

diff --git a/codecopy.ts b/codecopy.ts
@@ -51,11 +51,11 @@ const defaults: Options = {
         buttonStyles: {
             top: "0",
             right: "0",
-            width: "42px",
-            height: "42px",
-            padding: "12px",
-            background: "#555585",
-            backgroundHovered: "#8888c8",
+            width: "38px",
+            height: "38px",
+            padding: "8px",
+            background: "none",
+            backgroundHovered: "none",
             border: "none",
             outline: "none",
             display: "flex",
@@ -72,7 +72,7 @@ const defaults: Options = {
             opacity: "0",
             fontSize: "1.1em",
             fontWeight: "bold",
-            color: "#12efb5",
+            color: "#8b5cf6",
             pointerEvents: "none",
             transition: "0.1s",
         },

diff --git a/deno.json b/deno.json
@@ -1,7 +1,7 @@
 {
   "importMap": "./import_map.json",
   "tasks": {
-    "lume": "echo \"import 'lume/cli.ts'\" | deno run --unstable -A -",
+    "lume": "echo \"import 'lume/cli.ts'\" | deno run -A -",
     "build": "deno task lume",
     "serve": "deno task lume -s"
   },

diff --git a/deno.lock b/deno.lock
diff --git a/serve.ts b/serve.ts
@@ -1,6 +1,7 @@
-import Server from "https:/deno.land/x/lume/core/server.ts";
-import expires from "https:/deno.land/x/lume/middlewares/expires.ts";
-import notFound from "https://deno.land/x/lume@v1.19.3/middlewares/not_found.ts";
+import Server from "lume/core/server.ts";
+import cache_busting from "lume/middlewares/cache_busting.ts";
+import expires from "lume/middlewares/expires.ts";
+import notFound from "lume/middlewares/not_found.ts";
 
 const server = new Server({
   port: 8000,
@@ -12,10 +13,9 @@ server.use(notFound({
   root: `${Deno.cwd()}/_site`,
   page404: "/404",
 }));
-
+server.use(cache_busting());
 server.use(expires());
 
 server.start();
 
 console.log("Listening on http://localhost:8000");
-
diff --git a/src/_components/card.vto b/src/_components/card.vto
@@ -1,10 +1,10 @@
 <div
     class="
-        relative w-[320px] bg-black border-2 border-white rounded-md
+        relative w-[320px] bg-black border-2 border-slate-500 rounded-md
         p-4 flex-shrink-0
     "
 >
-    <div class="mb-4 w-full flex items-center gap-x-2 border-b-2 border-slate-light">
+    <div class="mb-4 w-full flex items-center gap-x-2 border-b-2 border-slate-500">
         {{ icon }}
         <h3 class="text-lg text-white">{{ category }}</h3>
     </div>

diff --git a/src/_components/footer.vto b/src/_components/footer.vto
@@ -1,4 +1,4 @@
-<footer class="mt-12 w-full px-8 py-16 bg-navy-light">
+<footer class="mt-12 w-full px-8 py-16 bg-slate-900">
     <div
         class="
             md:mx-auto w-full md:w-2/3
@@ -9,10 +9,11 @@
 
         {{# PAGES #}}
         <div class="w-full flex flex-col gap-y-2">
-            <h3 class="text-sm opacity-60">PAGES</h3>
+            <h3 class="text-sm text-slate-500">PAGES</h3>
             <div class="w-full flex flex-col lg:flex-row items-start lg:items-center gap-y-2 lg:gap-3">
-                <a href="/disclaimer" class="hover:brightness-200">Disclaimer</a>
-                <a href="/privacy-policy" class="hover:brightness-200">Privacy Policy</a>
+                <a href="/disclaimer/">Disclaimer</a>
+                <a href="/privacy-policy/">Privacy Policy</a>
+                <a href="/support/">Support</a>
             </div>
         </div>
         {{# /PAGES #}}

diff --git a/src/_components/header.vto b/src/_components/header.vto
@@ -1,83 +1,72 @@
-<header class="sticky top-0 left-0 w-full z-20 bg-gradient-to-r from-pink-dark p-2">
-    <div class="md:mx-auto w-full md:w-2/3 h-full flex justify-around items-center">
-        <div
-            class="
-                py-1 w-full md:w-3/4 lg:w-2/3 h-full flex flex-col md:flex-row items-center
-                md:gap-x-3 gap-y-3 md:gap-y-0
-            "
-        >
-            <a
-                href="/"
-                class="
-                    flex md:flex-col gap-x-1 md:gap-x-0 md:gap-y-1
-                    text-md md:text-sm text-white leading-[0.9em] md:leading-[0.7em]
-                "
-            >
-                <span>Exploit</span>
-                <span>Notes</span>
+<header class="sticky top-0 left-0 w-full z-20 bg-slate-900 p-1">
+    <div class="md:mx-auto w-full md:w-11/12 h-full p-1 flex items-center justify-around md:gap-x-4">
+
+        {{# Title & Search #}}
+        <div class="w-full h-full flex flex-col md:flex-row items-center md:gap-x-3">
+            {{# Title #}}
+            <a href="/">
+                <img src="/assets/img/icon.png" alt="icon" width="64" height="64" class="w-8 md:w-12" />
             </a>
-            {{# Search UI #}}
+            {{# /Title #}}
+
+            {{# Search #}}
             <div id="search"></div>
+            {{# /Search #}}
+
+            {{# Exploits #}}
+            <div class="bg-red">
+                <select
+                    id="exploit-select"
+                    class="hidden md:block bg-slate-800 p-1 text-white text-base hover:cursor-pointer"
+                >
+                    <option value="">- Recommended Exploits -</option>
+                    <option value="/exploit/privacy/tor/anonymize-traffic-with-tor/">Anonymize Traffic with Tor</option>
+                    <option value="/exploit/cryptography/algorithm/">Cryptography</option>
+                    <option value="/exploit/linux/privilege-escalation/">Linux PrivEsc</option>
+                    <option value="/exploit/network/port-forwarding/port-forwarding-with-chisel/">Port Forwarding with Chisel</option>
+                    <option value="/exploit/reconnaissance/">Reconnaissance</option>
+                    <option value="/exploit/shell/reverse-shell-cheat-sheet/">Reverse Shell Cheat Sheet</option>
+                    <option value="/exploit/web/method/web-content-discovery/">Web Content Discovery</option>
+                    <option value="/exploit/windows/privilege-escalation/">Windows PrivEsc</option>
+                </select>
+            </div>
+            {{# /Exploits #}}
         </div>
+        {{# /Title & Search #}}
 
-        {{# Links #}}
-        <div class="hidden sm:flex w-full h-full items-center justify-center gap-x-3">
 
-            {{# Security Links link #}}
+        {{# Socials #}}
+        <div class="hidden md:flex w-full h-full items-center justify-end gap-x-4">
+            <a href="/support/">
+                Support
+            </a>
             <a
                 href="{{ site.security_links.url }}"
                 target="_blank"
                 rel="noopener noreferrer"
                 alt="{{ site.security_links.name }}"
-                title="{{ site.security_links.name }}"
             >
-                <img
-                    src="/assets/img/security-links.png" alt="{{ site.security_links.name }}"
-                    class="w-7 h-7"
-                />
+                Security Links
             </a>
-
-            {{# GitHub link #}}
             <a
                 href="{{ site.github.url }}"
                 target="_blank"
                 rel="noopener noreferrer"
                 alt="{{ site.github.name }}"
             >
-                <svg
-                    xmlns="http://www.w3.org/2000/svg"
-                    width="24" height="24" viewBox="0 0 24 24"
-                    class="w-6 h-6 fill-white"
-                >
-                    <path
-                        d="
-                            M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207
-                            11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729
-                            1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304
-                            3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381
-                            1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399
-                            3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242
-                            2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823
-                            1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"
-                    />
-                </svg>
+                GitHub
             </a>
-
-            {{# X link #}}
             <a
                 href="{{ site.twitter.url }}"
                 target="_blank"
                 rel="noopener noreferrer"
                 alt="{{ site.twitter.name }}"
             >
-                <img
-                    src="/assets/img/x.png" alt="{{ site.twitter.name }}"
-                    width="22" height="22"
-                    class="w-6 h-6"
-                />
+                Twitter
             </a>
-
         </div>
+        {{# /Socials #}}
+
     </div>
 </header>
 
@@ -122,13 +111,21 @@
                 drawerElem.style.opacity = 0;
             });
         }
-
         inputElem.addEventListener('focus', () => {
             if (searchBgElem) {
                 searchBgElem.classList.remove("hidden");
                 drawerElem.style.visibility = "visible";
                 drawerElem.style.opacity = 1;
             }
         });
+
+        // Exploit selector
+        const optionElem = document.querySelector("#exploit-select");
+        if (optionElem) {
+            optionElem.addEventListener('change', () => {
+                let selectedValue = optionElem.value;
+                window.location.href = selectedValue;
+            });
+        }
     });
 </script>
diff --git a/src/_components/navigation.vto b/src/_components/navigation.vto
@@ -1,7 +1,7 @@
 <nav class="nav-links hidden">
     <div class="w-full flex flex-col gap-y-4">
         <div>
-            <h3 class="my-4 text-base text-white opacity-60">SOCIAL & DONATE</h3>
+            <h3 class="my-4 text-base text-slate-400">SOCIAL & DONATE</h3>
             <div class="w-full flex flex-col gap-y-1">
                 <a
                     href="{{ site.github.url }}"
@@ -40,14 +40,15 @@
         <div>
             <h3 class="my-4 text-base text-white opacity-60">PAGES</h3>
             <div class="w-full flex flex-col gap-y-1">
-                <a href="/disclaimer" class="text-lg">
+                <a href="/disclaimer/" class="text-lg">
                     Disclaimer
                 </a>
-            </div>
-            <div class="w-full flex flex-col gap-y-1">
-                <a href="/privacy-policy" class="text-lg">
+                <a href="/privacy-policy/" class="text-lg">
                     Privacy Policy
                 </a>
+                <a href="/support/" class="text-lg">
+                    Support
+                </a>
             </div>
         </div>
         <div>
@@ -84,13 +85,13 @@
         width: 100vw;
         height: 100vh;
         min-height: 100vh;
-        background-color: var(--color-slate-dark);
+        background-color: black;
         padding: 60px 32px;
         display: flex;
         flex-direction: column;
         align-items: flex-start;
         justify-content: flex-start;
         gap: 32px 0px;
-        color: var(--color-khaki);
+        color: #94a3b8;
     }
 </style>
diff --git a/src/_components/support.vto b/src/_components/support.vto
@@ -0,0 +1,31 @@
+<div class="bg-slate-800 rounded p-8 flex flex-col items-center gap-y-8">
+    <h2 class="text-2xl md:text-4xl font-black">Support Me!</h2>
+    <p class="text-lg md:text-xl text-center">
+        If you find this site helpful, please consider supporting my ongoing efforts through a donation.
+    </p>
+    <div class="flex flex-col md:flex-row md:flex-start justify-center items-center gap-4">
+        {{# BuyMeCoffee #}}
+        <a
+            href="https://www.buymeacoffee.com/hdks"
+            target="_blank"
+        >
+            <img
+                src="https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png"
+                alt="Buy Me A Coffee"
+                class="h-12"
+            >
+        </a>
+        {{# Ko-Fi #}}
+        <a
+            href='https://ko-fi.com/R5R0S649A'
+            target='_blank'
+        >
+            <img
+                src='https://storage.ko-fi.com/cdn/kofi1.png?v=3'
+                border='0'
+                alt='Buy Me a Coffee at ko-fi.com'
+                class="h-12"
+            />
+        </a>
+    </div>
+</div>
diff --git a/src/_includes/layouts/base.vto b/src/_includes/layouts/base.vto
@@ -1,13 +1,13 @@
 <!DOCTYPE html>
 <html lang="en" class="m-0 p-0 w-screen min-h-screen bg-navy-dark">
 
-    <head>
+    <head class="m-0 p-0 overflow-x-hidden">
         <meta charset="UTF-8">
         <meta name="viewport" content="width=device-width, initial-scale=1.0">
         <title>{{ title || site.title }} {{ if url != "/"  }}| {{ site.title }}{{ /if }}</title>
         <meta name="description" content="{{ description || site.description }}">
         {{# <meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self' 'unsafe-inline' 'unsafe-eval'; img-src 'self' data: w3.org/svg/2000 http://localhost:8888"> #}}
-        <link rel="icon" type="image/x-icon" href="/assets/img/favicon.png">
+        <link rel="icon" type="image/x-icon" href="/assets/img/favicon.ico">
         <link rel="stylesheet" href="/styles.css">
         <link rel="stylesheet" href="/css/carbonads.css">
         {{ if url.includes("/exploit/") }}
@@ -32,7 +32,12 @@
         </script>
     </head>
 
-    <body class="relative w-screen min-h-screen text-white font-base">
+    <body
+        class="
+            relative m-0 w-screen min-h-screen bg-black p-0 overflow-x-hidden
+            text-base text-white font-base
+        "
+    >
         {{ comp.header() }}
         {{ comp.navigation() }}
         <main>