https://jangobrecht.com/

Scan-ID:
7ae0a5e8-7a2e-4076-b75c-5f6fcf4d3c74Beendet
Eingereichte URL:
https://jangobrecht.com/
Bericht beendet:

Die von der Seite ausgehenden identifizierten Links

LinkText
https://mastodon.scot/@janMastodon
https://www.mojeek.com

JavaScript-Variablen · 4 gefunden

Globale JavaScript-Variablen, die in das Window Object einer Seite geladen werden, sind Variablen, die außerhalb von Funktionen deklariert werden und von jeder Stelle des Codes innerhalb des aktuellen Bereichs zugänglich sind

NameTyp
onbeforetoggleobject
documentPictureInPictureobject
onscrollendobject
getContrastColorfunction

Konsolenprotokoll-Meldungen · 0 gefunden

In der Web-Konsole protokollierte Meldungen

HTML

Der HTML-Rohtext der Seite

<!DOCTYPE html><html lang="en-GB"><head>
	<meta name="generator" content="Hugo 0.138.0">
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="shortcut icon" href="https://jangobrecht.com/images/favicon.png">
<title>Home - jan’s thoughts
    </title>
<meta name="title" content="Home">
<meta name="description" content="Thoughts on the future and hypertext">
<meta name="keywords" content="">


<meta property="og:url" content="https://jangobrecht.com/">
  <meta property="og:site_name" content="jan’s thoughts">
  <meta property="og:title" content="Home">
  <meta property="og:description" content="Heyo 👀 My name is Jan. I’m a human who lives in Edinburgh.
What’s this all about? When you’re reading this, you’ve entered my personal internet playground. Welcome, please come in, have a seat, a beer and pretzels. This is where I come to collect and express my thoughts, as well as to try out new tech. It’s my mental sanctuary, so psst!
Views are all my own, so I take full responsibility for what I personally write and publish here.">
  <meta property="og:locale" content="en_GB">
  <meta property="og:type" content="website">
    <meta property="og:image" content="https://jangobrecht.com/images/share.png">




  <meta name="twitter:card" content="summary_large_image">
  <meta name="twitter:image" content="https://jangobrecht.com/images/share.png">
  <meta name="twitter:title" content="Home">
  <meta name="twitter:description" content="Heyo 👀 My name is Jan. I’m a human who lives in Edinburgh.
What’s this all about? When you’re reading this, you’ve entered my personal internet playground. Welcome, please come in, have a seat, a beer and pretzels. This is where I come to collect and express my thoughts, as well as to try out new tech. It’s my mental sanctuary, so psst!
Views are all my own, so I take full responsibility for what I personally write and publish here.">




  <meta itemprop="name" content="Home">
  <meta itemprop="description" content="Heyo 👀 My name is Jan. I’m a human who lives in Edinburgh.
What’s this all about? When you’re reading this, you’ve entered my personal internet playground. Welcome, please come in, have a seat, a beer and pretzels. This is where I come to collect and express my thoughts, as well as to try out new tech. It’s my mental sanctuary, so psst!
Views are all my own, so I take full responsibility for what I personally write and publish here.">
  <meta itemprop="datePublished" content="2024-11-13T13:37:00+00:00">
  <meta itemprop="dateModified" content="2024-11-13T13:37:00+00:00">
  <meta itemprop="wordCount" content="86">
  <meta itemprop="image" content="https://jangobrecht.com/images/share.png">
<meta name="referrer" content="no-referrer-when-downgrade">

    
    <link rel="alternate" type="application/rss+xml" href="https://jangobrecht.com/index.xml" title="jan’s thoughts">
     <style>
   
   

  :root {
     
    --main-font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
      Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    --bg-color-1: #f0efe7;
    --main-dark-color: #191a22;
    --main-light-color: #f5f5f5;
    --main-greyish-color: #ddd;
    --main-darkish-color: #888;
    --main-link-color: #3273dc;
    --main-link-visited-color: #8b6fcb;
    --skinny-font: 400;
    --fatty-font: 700;
    text-rendering: optimizeSpeed;
  }

  *,
  *::before,
  *::after {
    box-sizing: border-box;
  }

  html {
    -moz-text-size-adjust: none;
    -webkit-text-size-adjust: none;
    text-size-adjust: none;
  }

  body {
    font-family: var(--main-font-family);
    margin: auto;
    padding: 20px;
    max-width: 720px;
    text-align: left;
    background-color: var(--bg-color-1);
    word-wrap: break-word;
    overflow-wrap: break-word;
    line-height: 1.5;
    color: var(--main-dark-color);
  }

  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  strong,
  b {
    color: var(--main-dark-color);
  }

  a {
    color: var(--main-link-color);
  }

  .title {
    display: inline-block;
    text-decoration: none;
    border: 0;
    color: var(--main-dark-color);
    transform: rotate(-2deg);
  }

  .title span {
    font-weight: var(--skinny-font);
  }

  nav a {
    margin-right: 10px;
  }

  .is-active {
    font-weight: var(--fatty-font);
    text-decoration: none;
  }

  textarea {
    width: 100%;
    font-size: 16px;
  }

  button,
  input {
    font-size: 16px;
  }

  content {
    line-height: 1.6;
  }

  table {
    width: 100%;
  }

  img {
    max-width: 100%;
    height: auto;
  }

  code {
    padding: 2px 5px;
    background-color: #f2f2f2;
  }

  pre code {
    color: var(--main-dark-color);
    display: block;
    padding: 20px;
    white-space: pre-wrap;
    font-size: 14px;
  }

  blockquote {
    border-left: 1px solid #999;
    color: var(--main-dark-color);
    padding-left: 20px;
    font-style: italic;
  }

  footer {
    padding: 25px;
    text-align: center;
  }

  .helptext {
    color: var(--main-darkish-color);
    font-size: small;
  }

  .errorlist {
    color: #eba613;
    font-size: small;
  }

   
  ul.blog-posts {
    list-style-type: none;
    padding: unset;
  }

  ul.blog-posts li {
    display: flex;
  }

  ul.blog-posts li span {
    flex: 0 0 130px;
  }

  ul.blog-posts li a:visited {
    color: var(--main-link-visited-color);
  }

  figure {
    margin: 0 auto 15px;
  }

   
  figure.about {
    text-align: center;
  }
  figure.about img {
    border-radius: 50%;
  }

  @media (prefers-color-scheme: dark) {
    body {
      background-color: var(--main-dark-color);
      color: var(--main-greyish-color);
    }

    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    strong,
    b {
      color: #eee;
    }

    a {
      color: #8cc2dd;
    }

    code {
      background-color: #777;
    }

    pre code {
      color: var(--main-greyish-color);
    }

    blockquote {
      color: var(--main-greyish-color);
    }

    textarea,
    input {
      background-color: #252525;
      color: var(--main-greyish-color);
    }

    .helptext {
      color: #aaa;
    }
  }
</style>

 </head>

  <body>
    <header><header style="display: flex; justify-content: space-between; align-items: center; padding: 1.1rem 1.1rem 1.1rem 0;">
  <a href="/" class="title">
    <h2>jan’s thoughts</h2>
  </a>
  <nav aria-label="Main Navigation"><nav class="main-nav">
  <input type="checkbox" id="menu-toggle" class="menu-toggle">
  <label for="menu-toggle" class="menu-icon">
    <span></span>
    <span></span>
    <span></span>
  </label>
  <ul class="menu-items">
         
    <li>
      <a href="/" class="is-active">Home</a>
    </li>
        
    <li>
      <a href="/blog/">Blog</a>
    </li>
        
    <li>
      <a href="/photos/">Photos</a>
    </li>
        
    <li>
      <a href="/about/">About</a>
    </li>
        
    <li>
      <a href="/guestbook/">Guestbook</a>
    </li>
        
    <li>
      <a href="/contact/">Contact</a>
    </li>
    
  </ul>
</nav>

<style>
  .main-nav {
    position: relative;
  }

  .menu-toggle {
    display: none;
  }

  .menu-icon {
    display: none;
    cursor: pointer;
    padding: 10px;
    position: relative;
    z-index: 2;
    width: 30px;
    height: 25px;
  }

  .menu-icon span {
    display: block;
    position: absolute;
    height: 3px;
    width: 100%;
    background-color: #191a22;
    border-radius: 3px;
    opacity: 1;
    left: 0;
    transform: rotate(0deg);
    transition: 0.25s ease-in-out;
  }

  .menu-icon span:nth-child(1) {
    top: 0px;
  }

  .menu-icon span:nth-child(2) {
    top: 10px;
  }

  .menu-icon span:nth-child(3) {
    top: 20px;
  }

  .menu-items {
    list-style-type: none;
    padding: 0;
    margin: 0;
    display: flex;
  }

  .menu-items li {
    margin-left: 20px;
  }

  .menu-items a {
    text-decoration: none;
    color: #191a22;
  }

  @media (prefers-color-scheme: dark) {
    .menu-items a {
      color: #f8f8f8;
    }

    .menu-icon span {
      background-color: #f8f8f8;
    }
  }

  .menu-items a.is-active {
    font-weight: bold;
  }

  @media (max-width: 768px) {
    .main-nav {
      display: flex;
      justify-content: flex-end;
      align-items: center;
    }

    .menu-icon {
      display: block;
    }

    .menu-items {
      display: none;
      position: absolute;
      top: 100%;
      right: 0;
      width: 250px;
      background-color: #f8f8f8;
      padding: 20px;
      box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
      flex-direction: column;
    }

    @media (prefers-color-scheme: dark) {
      .menu-items {
        background-color: #191a22;
      }
    }

    .menu-items li {
      margin: 0 0 15px 0;
      text-align: left;
    }

    .menu-items li:last-child {
      margin-bottom: 0;
    }

    .menu-items a {
      display: block;
      padding: 5px 0;
    }

    .menu-toggle:checked ~ .menu-items {
      display: block;
    }

    .menu-toggle:checked ~ .menu-icon span:nth-child(1) {
      top: 10px;
      transform: rotate(135deg);
    }

    .menu-toggle:checked ~ .menu-icon span:nth-child(2) {
      opacity: 0;
      left: -60px;
    }

    .menu-toggle:checked ~ .menu-icon span:nth-child(3) {
      top: 10px;
      transform: rotate(-135deg);
    }
  }
</style>
</nav>
</header></header>
    <main>
<h1 id="heyo-">Heyo 👀</h1>
<p>My name is Jan. I’m a human who lives in Edinburgh.</p>
<h2 id="whats-this-all-about">What’s this all about?</h2>
<p>When you’re reading this, you’ve entered my personal internet playground. Welcome, please come in, have a seat, a beer and pretzels. This is where I come to collect and express my thoughts, as well as to try out new tech. It’s my mental sanctuary, so psst!</p>
<p>Views are all my own, so I take full responsibility for what I personally write and publish here.</p>
<p>Thanks for stopping by! ✌️</p>

</main>
    <footer><small><a href="/contact/" rel="me">Contact me</a> ⬌
  <a rel="me" href="https://mastodon.scot/@jan" title="Find me on Mastodon">Mastodon</a>
  ⬌ <a href="/guestbook/" title="Sign my guestbook">Guestbook</a> ⬌
  <a href="/yaml-to-json/" title="YAML to JSON converter">YAML to JSON</a></small><br>



<div id="counter">
  <span class="digit" style="background-color: rgb(25, 220, 210); color: rgb(255, 255, 255);">9</span>
  <span class="digit" style="background-color: rgb(136, 195, 86); color: rgb(0, 0, 0);">9</span>
  <span class="digit" style="background-color: rgb(167, 140, 128); color: rgb(0, 0, 0);">6</span>
  <span class="digit" style="background-color: rgb(94, 169, 131); color: rgb(0, 0, 0);">1</span>
  <span class="digit" style="background-color: rgb(95, 183, 36); color: rgb(255, 255, 255);">3</span>
  <span class="digit" style="background-color: rgb(155, 63, 230); color: rgb(0, 0, 0);">9</span>
</div>
<span id="counter-note">hits since 01/01/1970</span>

<div id="b88x31">
  
  
  <a href="https://www.mojeek.com" rel="nofollow"><img src="/images/mojeek.png" alt="Use Mojeek search engine" width="88" height="31"></a>

  
</div>

<style>
  #b88x31 {
    margin-top: 10px;
  }
  #counter {
    margin: 25px auto 0;
  }
  .digit {
    background-color: #191a22;
     
    font-family: "Comic Sans MS", monospace;
    font-size: 11px;
    font-weight: 700;
    padding: 5px 10px;
    margin: 0;
    color: #191a22;
  }
  #counter-note {
    color: #191a22;
    font-family: "Comic Sans MS", monospace;
    font-size: 11px;
    font-weight: 700;
  }
  @media (prefers-color-scheme: dark) {
    #counter-note {
      color: #f5f5f5;
    }
  }
</style>

<script>
  const digitSpans = document.querySelectorAll(".digit");

  digitSpans.forEach((span) => {
    const randomDigit = Math.floor(Math.random() * 10);
    span.textContent = randomDigit;
    const randomColor = `rgb(${Math.floor(Math.random() * 256)}, ${Math.floor(
      Math.random() * 256
    )}, ${Math.floor(Math.random() * 256)})`;

    span.style.backgroundColor = randomColor;

    const color = getContrastColor(randomColor);

    span.style.color = color;
  });

  function getContrastColor(bgColor) {
    const rgb = bgColor
      .substring(4, bgColor.length - 1)
      .replace(/ /g, "")
      .split(",");
    const r = parseInt(rgb[0], 10) / 255;
    const g = parseInt(rgb[1], 10) / 255;
    const b = parseInt(rgb[2], 10) / 255;
    const max = Math.max(r, g, b);
    const min = Math.min(r, g, b);
    const l = (max + min) / 2;
    const d = max - min;
    let h, s;
    if (max === min) {
      h = s = 0;
    } else {
      s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
      switch (max) {
        case r:
          h = (g - b) / d + (g < b ? 6 : 0);
          break;
        case g:
          h = (b - r) / d + 2;
          break;
        case b:
          h = (r - g) / d + 4;
          break;
      }
      h /= 6;
    }
    return l > 0.5 ? "#000000" : "#ffffff";
  }
</script>


</footer>

    


</body></html>