From ec3c55c5d939ec937cc440b2d14efc6447a3deed Mon Sep 17 00:00:00 2001 From: "E. van Aubel" Date: Wed, 30 Oct 2024 22:35:16 +0100 Subject: [PATCH] temp about page layout --- about.php | 66 ++++++++++++++++-- blog/ctf.php | 2 +- blog/drive.php | 2 +- blog/markdowns/ctf.md | 6 +- index.php | 2 +- projects.php | 28 ++++---- style.css | 155 +++++++++++++++++++++++++++++++++++++++--- 7 files changed, 228 insertions(+), 33 deletions(-) diff --git a/about.php b/about.php index 6987834..e536b26 100644 --- a/about.php +++ b/about.php @@ -55,11 +55,67 @@ $_SESSION['lang'] = $currentLang;

-
- - - -

+
+
+ Profile Picture +
+

I'm E. Van Aubel

+

+
+

Hard Skills

+
    +
  • +

    Web Development:

    +
      +
    • HTML

    • +
    • CSS

    • +
    • Javascript

    • +
    • Python

    • +
    • Php

    • +
    +
  • +
  • +

    Cybersecurity

    +
      +
    • API Fuzzing

    • +
    • Securing Servers (currently learning)

    • +
    +
  • +
+

Soft Skills

+
    +
  • +

    Creatief

    +
  • +
  • +

    Caring

    +
  • +
  • +

    Curious

    +
  • +
+
+
+

Hire Me

+
+
+ + +
+ +
+ + +
+ +
+ + +
+ + +
+

diff --git a/blog/ctf.php b/blog/ctf.php index d8f58b0..662d5b1 100644 --- a/blog/ctf.php +++ b/blog/ctf.php @@ -27,7 +27,7 @@ $_SESSION['lang'] = $currentLang; Blog - +
diff --git a/blog/drive.php b/blog/drive.php index 1663899..0a22633 100644 --- a/blog/drive.php +++ b/blog/drive.php @@ -26,7 +26,7 @@ $_SESSION['lang'] = $currentLang; Driving Blog - +
diff --git a/blog/markdowns/ctf.md b/blog/markdowns/ctf.md index 730f5c6..d84fa2f 100644 --- a/blog/markdowns/ctf.md +++ b/blog/markdowns/ctf.md @@ -4,19 +4,19 @@ I recently took on an exciting challenge to complete a Capture The Flag (CTF) fo ## First Key -![First key image](/Webster/media/blogs/ctf/8hKuBbzL.jpg) +![First key image](../media/blogs/ctf/8hKuBbzL.jpg) The first key, with the value **073403c8a58a1f80d943455fb30724b9**, was found at the address `http://[IP ADDRESS OF MR.ROBOT]/key-1-of-3.txt`. It felt amazing to find this key and get one step closer to completing the challenge. ## Second Key -![Second key image](/Webster/media/blogs/ctf/QKNmVAwi.jpg) +![Second key image](../media/blogs/ctf/QKNmVAwi.jpg) Next, I found the second key, with the value **822c73956184f694993bede3eb39f959**, in the `home/robot` directory. It was a euphoric moment to find this key and realize that I was getting closer to the end goal. ## Third Key -![Third key image](/Webster/media/blogs/ctf/p8UpweNt.jpg) +![Third key image](../media/blogs/ctf/p8UpweNt.jpg) The third key, with the value **04787ddef27c3dee1ee161b21670b4e4**, was located in the root directory. It was a challenging hunt, but it felt amazing when I also found this key and successfully completed the challenge. diff --git a/index.php b/index.php index 9d4f886..8afab6a 100644 --- a/index.php +++ b/index.php @@ -19,7 +19,7 @@ $_SESSION['lang'] = $currentLang; if ($_SERVER['REQUEST_METHOD'] == 'GET' && isset($_GET['lang'])) { $lang = $_GET['lang']; setcookie('preferred_lang', $lang, time() + 60*60*24*30); - header("Location: index.php?lang=$lang"); + header("Location: index.php"); exit; } ?> diff --git a/projects.php b/projects.php index 37959dd..08719df 100644 --- a/projects.php +++ b/projects.php @@ -14,7 +14,8 @@ function getCurrentLang() { return $_COOKIE['preferred_lang']; } -} + return 'en'; +} $currentLang = getCurrentLang(); $_SESSION['lang'] = $currentLang; @@ -53,24 +54,27 @@ $_SESSION['lang'] = $currentLang; $json = file_get_contents('json/projects.json'); if ($json === false) { - die('Error reading the JSON file'); + die('Error reading the JSON file'); } $json_data = json_decode($json, true); - + if ($json_data === null) { - die('Error decoding the JSON file'); + die('Error decoding the JSON file'); } foreach ($json_data['projects'] as $project) { - echo "
    "; - echo "
    "; - foreach ($project['links'] as $link) { - echo "
  • " . htmlspecialchars($link[
  • "; - } - echo "
    "; - echo "
  • " . htmlspecialchars($project['title'][$currentLang]) . "
  • "; - echo "
"; + echo "
    "; + echo "
    "; + foreach ($project['links'] as $link) { + echo "
  • " . htmlspecialchars($link[
  • "; + } + echo "
    "; + + // Check if the translation exists, fall back to English if not + $title = isset($project['title'][$currentLang]) ? $project['title'][$currentLang] : $project['title']['en']; + echo "
  • " . htmlspecialchars($title) . "
  • "; + echo "
"; } ?>
diff --git a/style.css b/style.css index 811395f..4f4adf4 100644 --- a/style.css +++ b/style.css @@ -107,14 +107,7 @@ hr { display: flex; } -/* .content{ - display: flex; - flex-direction: column; - flex: 1 auto; - align-items: center; - justify-content: center; - margin: 0; -} */ + .content__main{ display: flex; @@ -305,14 +298,14 @@ hr { .language__button { padding: 10px 15px; margin: 5px; - background-color: #007bff; /* Bootstrap primary color */ + background-color: #007bff; color: white; text-decoration: none; border-radius: 5px; } .language__button:hover { - background-color: #0056b3; /* Darker shade on hover */ + background-color: #0056b3; } .post__article{ @@ -373,6 +366,131 @@ hr { text-decoration-color: #f8f8f2; } +.about__content { + display: flex; + flex-direction: column; + align-items: center; + font-weight: 300; + overflow-wrap: break-word; + text-align: left; + border-radius: 1rem; + background-color: #2f3136; + color: #ffffff; + padding: 1.5rem; + box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2); +} + +#begin__introduction { + display: flex; + width: 100%; + height: auto; + justify-content: center; + padding: 0.9rem; + margin-bottom: 1rem; + margin-top: 0; + text-align: center; +} + +.about__pic { + display: flex; + align-items: center; + justify-content: center; + border-radius: 50%; + width: 30%; + height: 100%; + overflow: hidden; + margin-bottom: 1rem; +} + +.about__pic img { + width: 100%; + height: auto; +} + +.about__facts { + max-width: 80vw; + margin: 0 auto; + padding: 2rem; + display: flex; + flex-wrap: wrap; + align-items: center; +} + +.about__facts h1 { + display: flex; + justify-content: flex-start; + border-left: 0.3rem dotted #bac2de; +} + +.about__lists { + display: flex; + flex-wrap: wrap; + gap: 1rem; + width: 100%; + height: auto; +} + +.about__list { + flex-basis: 100%; + min-width: 200px; + padding: 0.5rem; + border-radius: 8px; + transition: transform 0.3s ease; + text-decoration: none; +} + +.about__list p { + margin: 0; + line-height: 1.5; + text-align: left; +} + +.about__list:hover { + transform: translateY(-5px); +} + +.hire__form{ +padding: 5rem; +border-radius: 3rem; +} + +.form-group { + margin-bottom: 15px; +} + +label { + display: block; + margin-bottom: 5px; +} + +input[type="text"], input[type="email"] { + width: 100%; + padding: 8px; + border: 1px solid #ddd; + border-radius: 4px; +} + +textarea { + width: 100%; + height: 100px; + padding: 8px; + border: 1px solid #ddd; + border-radius: 4px; +} + +#hire__send { + background-color: #007bff; + color: white; + padding: 10px 20px; + border: none; + border-radius: 4px; + cursor: pointer; + transition: background-color 0.3s; +} + +#hire__send:hover { + background-color: #0056b3; +} @media only screen and (max-width: 770px) { body { @@ -449,6 +567,14 @@ hr { display: block; } + .about__lists { + flex-direction: column; + } + + .about__list { + flex-basis: 100%; + } + } @media only screen and (max-width: 1024px) { @@ -464,6 +590,15 @@ hr { padding: 3rem; margin: 2rem; } + + .about__lists { + justify-content: center; + } + + .about__list { + flex-basis: calc(45% - 0.5rem); + } + } @media only screen and (max-width: 1440px) {