rawfeed 0.0.1 → 0.1.0

data/_sass/theme/_dark.scss

@@ -0,0 +1,79 @@
+$theme-colors: (
+  bg: #181818,
+  text: #bfbfbf,
+  text-muted: #9b9b9b,
+  // default primary: #66c9e2 | #61b8b8
+  // primary dark blue: #668be2
+  // primary grovbox: #ebdbb2
+  // primary oliva: #639e5b
+  // primary oliva2: #75a683
+  // primary opaque aqua: #61b8b8
+  primary: #4ce4c8,
+  shadow-color: rgba(0, 0, 0, 0.1),
+  code-color: #f55ca8,
+  code-block-header-color: #141414,
+  border-color: #373737,
+  scrollbar-color: rgba(255, 255, 255, 0.534),
+  blockquote-bg-color: #131313,
+  footer-border-color: #020202,
+  footer-bg-color: #111111,
+  terminal-shadow: 0 10px 30px rgba(0, 0, 0, 0.7),
+  sumary-bg-color: #303030,
+  checkbox-border-color: #2b2b2b,
+  checkbox-border-color-after: #999999,
+  table-border-color: #a5a5a5,
+  table-color: #bfbfbf,
+  table-tr-bg-color: #131313,
+  table-tr-border-color: #585858,
+  table-td-border-color: #585858,
+  table-tr-odd-bg-color: #313131,
+  table-tr-even-bg-color: #181818,
+  terminal-color: #97ff97,
+  terminal-bg-color: #000000,
+  terminal-border-color: #1a1a1a,
+  terminal-btn-close-bg-color: #0bff55,
+  terminal-btn-min-bg-color: #0b9e3a,
+  terminal-btn-max-bg-color: #0b6b2a,
+  terminal-title-color: #4b8f3e,
+  terminal-screen-text-shadow: "0 0 5px #00FF41, 0 0 10px #00B831",
+  terminal-screen-after-bg-color: "repeating-linear-gradient(to bottom, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.5) 1px, transparent 1px,transparent 3px)",
+  terminal-header-border-bottom-color: rgba(56, 56, 56, 0.5),
+  terminal-prompt-text-color: #97ff97,
+  terminal-screen-text-transform: uppercase,
+  terminal-cursor-color: #7cff6b,
+  terminal-screen-link-color: aqua,
+  details-bg-color: #383838,
+  video-border-color: #333333,
+  chart-bg-color: #fff,
+  chart-box-shadow-color: rgba(0, 0, 0, 0.9),
+  tabs-bg-color: #303030,
+  tabs-color: var(--text-color),
+  tabs-border-color: #555555,
+  tabs-nav-border-color: #222,
+  tab-btn-color: var(--primary-color),
+  tab-btn-color-hover: var(--text-color),
+  tab-btn-color-active: #e0e0e0,
+  resume-bg-color: #111,
+  resume-border-color: #000000,
+  resume-title-text-color: white,
+  resume-content-text-color: #d3d3d3,
+  resume-text-muted-color: #707070,
+);
+
+/* matrix */
+// $theme-colors: (
+//   bg: #000400,
+//   text: #00ff00,
+//   text-muted: #9b9b9b,
+//   primary: #ffffff,
+//   shadow-color: rgba(0,0,0,0.1),
+//   code-color: #f55ca8,
+//   code-block-header-color: #020702,
+//   border-color: #373737,
+//   scrollbar-color: rgba(255, 255, 255, 0.534),
+//   blockquote-bg-color: #131313,
+//   footer-border-color: #020202,
+//   footer-bg-color: #111111,
+//   terminal-shadow: 0 10px 30px rgba(0,0,0,0.7),
+//   sumary-bg-color: #1f1f1f,
+// );

data/_sass/theme/_index.scss

@@ -0,0 +1,13 @@
+@use "sass:map";
+@use "light" as light;
+@use "dark" as dark;
+
+@function theme-color($key, $mode: light) {
+  @if $mode == light {
+    @return map.get(light.$theme-colors, $key);
+  }
+  @else if $mode == dark {
+    @return map.get(dark.$theme-colors, $key);
+  }
+  @return null;
+}

data/_sass/theme/_light.scss

@@ -0,0 +1,56 @@
+$theme-colors: (
+  bg: #f3f3f3,
+  // bg default: #f3f3f3
+  text: #020202,
+  text-muted: #808080,
+  primary: #a00,
+  shadow-color: rgba(0, 0, 0, 0.1),
+  code-color: #db3688,
+  code-block-header-color: #f5f5f5,
+  border-color: #dfdfdf,
+  scrollbar-color: rgba(0, 0, 0, 0.18),
+  blockquote-bg-color: #e4e4e4,
+  footer-border-color: #e4e4e4,
+  footer-bg-color: #f3f3f3,
+  terminal-shadow: 0 10px 30px rgba(0, 0, 0, 0.7),
+  sumary-bg-color: #fbfbfb,
+  checkbox-border-color: #d3d3d3,
+  checkbox-border-color-after: #1f1f1f,
+  table-border-color: #a5a5a5,
+  table-color: #020202,
+  table-tr-bg-color: #d8d8d8,
+  table-tr-border-color: #949494,
+  table-td-border-color: #949494,
+  table-tr-odd-bg-color: #f3f3f3,
+  table-tr-even-bg-color: #e7e7e7,
+  terminal-color: #131313,
+  terminal-bg-color: #ffffff,
+  terminal-border-color: #aaaaaa,
+  terminal-btn-close-bg-color: #5c5c5c,
+  terminal-btn-min-bg-color: #747474,
+  terminal-btn-max-bg-color: #949494,
+  terminal-title-color: #252525,
+  terminal-screen-text-shadow: none,
+  terminal-screen-after-bg-color: none,
+  terminal-header-border-bottom-color: rgba(206, 206, 206, 0.5),
+  terminal-prompt-text-color: #000000,
+  terminal-screen-text-transform: none,
+  terminal-cursor-color: #020202,
+  terminal-screen-link-color: var(--primary-color),
+  details-bg-color: #fbfbfb,
+  video-border-color: #c9c9c9,
+  chart-bg-color: #fff,
+  chart-box-shadow-color: rgba(0, 0, 0, 0.7),
+  tabs-bg-color: #fdfdfd,
+  tabs-color: var(--text-color),
+  tabs-border-color: #cfcfcf,
+  tabs-nav-border-color: #757575,
+  tab-btn-color: var(--primary-color),
+  tab-btn-color-hover: var(--text-color),
+  tab-btn-color-active: #303030,
+  resume-bg-color: white,
+  resume-border-color: #ddd,
+  resume-title-text-color: black,
+  resume-content-text-color: #222,
+  resume-text-muted-color: #555,
+);

data/assets/css/style.scss

@@ -0,0 +1,5 @@
+---
+# Only the main Sass file needs front matter (the dashes are enough)
+---
+
+@use "main";

data/assets/js/avatar.js

@@ -0,0 +1,50 @@
+document.addEventListener("DOMContentLoaded", () => {
+  // O alvo do clique agora é o contêiner INTERATIVO
+  const flipperAvatars = document.querySelectorAll('.avatar-flipper__open-true');
+  const modalEl = document.getElementById('avatarModal');
+  const modalAvatar = document.getElementById('modalAvatar');
+  const header = document.querySelector('.header');
+  const bsModal = new bootstrap.Modal(modalEl);
+
+  flipperAvatars.forEach((flipper) => {
+    // Escuta o clique no contêiner inteiro
+    flipper.addEventListener("click", () => {
+      // Encontra o card que realmente anima
+      const card = flipper.querySelector('.avatar-card');
+      // Encontra a imagem de TRÁS e pega o seu src ANTES da animação
+      const backImage = flipper.querySelector('.avatar-back img');
+      const backImageSrc = backImage.src;
+
+      // Adiciona a classe de animação ao card
+      card.classList.add("flip-avatar");
+
+      card.addEventListener(
+        "animationend",
+        () => {
+          card.classList.remove("flip-avatar");
+
+          // Usa o src da imagem de trás que guardamos
+          modalAvatar.src = backImageSrc;
+
+          bsModal.show();
+        },
+        { once: true }
+      );
+    });
+  });
+
+  // quando o modal está visível, escondemos os contêineres (esta parte já estava correta)
+  modalEl.addEventListener("shown.bs.modal", () => {
+    modalAvatar.classList.remove("modal-avatar");
+    void modalAvatar.offsetWidth;
+    modalAvatar.classList.add("modal-avatar");
+    header.classList.remove("modal-active");
+
+    flipperAvatars.forEach((flipper) => flipper.classList.add("hidden"));
+  });
+
+  // quando o modal é fechado, mostramos os contêineres (esta parte já estava correta)
+  modalEl.addEventListener("hidden.bs.modal", () => {
+    flipperAvatars.forEach((flipper) => flipper.classList.remove("hidden"));
+  });
+});

data/assets/js/blog_search.js

@@ -0,0 +1,102 @@
+document.addEventListener("DOMContentLoaded", () => {
+  /* blog search open
+  --------------------------------------------------------------------------------------------------
+  */
+  const btn = document.getElementById('blog-search__btn');
+  const box = document.querySelector('.blog-search');
+  const searchInput = document.getElementById('blog-search__input');
+  const blogPosts = document.getElementById('posts');
+  const searchResults = document.getElementById('blog-search__results');
+  const searchResultsWrapper = document.getElementById('blog-search__results-wrapper');
+  const btnSearchClean = document.getElementById('blog-search__btn-clean');
+  const blogSeachInput = document.getElementById('blog-search__input');
+
+
+  if (!btn || !box) return;
+
+  const openSearch = () => {
+    box.classList.add('is-open');
+    box.style.maxHeight = box.scrollHeight + 'px';
+    box.style.opacity = '1';
+    box.addEventListener('transitionend', function onOpened(e) {
+      if (e.propertyName === 'max-height') {
+        box.style.maxHeight = 'none';
+        box.removeEventListener('transitionend', onOpened);
+      }
+    });
+    blogSeachInput.focus();
+  };
+
+  const closeSearch = () => {
+    box.style.maxHeight = box.scrollHeight + 'px';
+    void box.offsetHeight; // reflow force
+    requestAnimationFrame(() => {
+      box.style.maxHeight = '0';
+      box.style.opacity = '0';
+    });
+    box.classList.remove('is-open');
+  };
+
+  btn.addEventListener('click', (e) => {
+    e.preventDefault();
+    // if are already in /blog/, toggle
+    const pathname = location.pathname.replace(/\/$/, '');
+    const isBlog = pathname === '/blog' || pathname === '/blog/index.html';
+
+    if (!isBlog) {
+      // if are on another page, go to /blog/ and open it
+      window.location.href = '/blog/?search=open';
+      return;
+    }
+
+    // toggle
+    if (box.classList.contains('is-open')) {
+      closeSearch();
+      searchInput.value = '';
+      blogPosts.classList.remove('disabled');
+      searchResultsWrapper.classList.add('disabled');
+    } else {
+      openSearch();
+    }
+  });
+
+  // opens automatically if arrived from another link with ?search=open
+  const params = new URLSearchParams(location.search);
+  if (params.get('search') === 'open') {
+    setTimeout(openSearch, 30);
+  }
+
+  /* clean button input blog search
+  --------------------------------------------------------------------------------------------------
+  */
+  function clearSearch() {
+    blogSeachInput.value = '';
+    blogPosts.classList.remove('disabled');
+    searchResults.classList.add('disabled');
+    searchResultsWrapper.classList.add('disabled');
+    blogSeachInput.focus();
+  }
+  btnSearchClean.addEventListener('click', clearSearch);
+  document.addEventListener('keydown', (e) => {
+    if (e.key === 'Escape') {
+      clearSearch();
+      closeSearch();
+    }
+  });
+
+  /* open results and close posts in search (toggle)
+  --------------------------------------------------------------------------------------------------
+  */
+  searchInput.addEventListener('input', () => {
+    if (searchInput.value.trim().length > 0) {
+      blogPosts.classList.add('disabled');
+      searchResults.classList.remove('disabled');
+      searchResultsWrapper.classList.remove('disabled');
+    } else {
+      blogPosts.classList.remove('disabled');
+      searchResults.classList.add('disabled');
+      searchResultsWrapper.classList.add('disabled');
+    }
+  });
+
+});

data/assets/js/default.js

@@ -0,0 +1,148 @@
+document.addEventListener("DOMContentLoaded", () => {
+  /* lock menu context (click right mouse)
+  --------------------------------------------------------------------------------------------------
+  */
+  document.addEventListener('contextmenu', e => e.preventDefault());
+
+  /* Show/disappear top button
+  --------------------------------------------------------------------------------------------------
+  */
+  let topButton = document.getElementById("top-link");
+  const scrollThreshold = 700;
+  window.onscroll = function () { scrollFunction() };
+
+  function scrollFunction() {
+    if (document.body.scrollTop > scrollThreshold || document.documentElement.scrollTop > scrollThreshold) {
+      topButton.style.display = "block";
+    } else {
+      topButton.style.display = "none";
+    }
+  }
+
+  topButton.addEventListener("click", topFunction);
+
+  function topFunction() {
+    window.scrollTo({
+      top: 0,
+      behavior: 'smooth'
+    });
+  }
+
+  /* function Giscus
+  --------------------------------------------------------------------------------------------------
+  */
+  function setGiscusTheme(theme) {
+    // The function only executes if the themes object exists
+    if (window.giscusThemes) {
+      const giscusTheme = theme === 'light'
+        ? window.giscusThemes.light
+        : window.giscusThemes.dark;
+
+      const message = {
+        giscus: {
+          setConfig: {
+            theme: giscusTheme
+          }
+        }
+      };
+
+      // Let's use a timeout to ensure the Giscus iframe is ready
+      const giscusInterval = setInterval(() => {
+        const giscusFrame = document.querySelector('iframe.giscus-frame');
+        // Se o iframe existir no documento...
+        if (giscusFrame) {
+          // ...we sent the message...
+          giscusFrame.contentWindow.postMessage(message, 'https://giscus.app');
+          // ...and we stopped trying.
+          clearInterval(giscusInterval);
+        }
+      }, 500);
+
+      // As an extra safeguard, we stop trying after a few seconds
+      // to avoid creating an infinite loop if something goes wrong.
+      setTimeout(() => {
+        clearInterval(giscusInterval);
+      }, 4000); // Stop trying after 4 seconds
+    }
+  }
+
+  /* change theme light/dark
+  --------------------------------------------------------------------------------------------------
+  */
+  const toggleButton = document.getElementById('toggle-theme');
+  const icon = toggleButton.querySelector('i');
+  // const avatar = document.getElementById('avatarImage');
+  const root = document.documentElement;
+
+  function setTheme(theme) {
+    root.setAttribute('data-theme', theme);
+
+    icon.classList.remove('fa-sun', 'fa-moon');
+    icon.classList.add(theme === 'dark' ? 'fa-sun' : 'fa-moon');
+
+    if (typeof setGiscusTheme === 'function') {
+      setGiscusTheme(theme);
+    }
+
+    // if (avatar) {
+    //   avatar.src = theme === 'light'
+    //     ? avatar.dataset.light
+    //     : avatar.dataset.dark;
+    // }
+
+    localStorage.setItem('theme', theme);
+
+  }
+
+  // boot with saved or light
+  setTheme(localStorage.getItem('theme') || 'light');
+
+  // change theme on click
+  toggleButton.addEventListener('click', () => {
+    const current = root.getAttribute('data-theme');
+    const next = current === 'light' ? 'dark' : 'light';
+    setTheme(next);
+  });
+
+
+  /* highlight code
+  --------------------------------------------------------------------------------------------------
+  */
+  document.querySelectorAll("div.highlight, figure.highlight").forEach(highlightBlock => {
+    const container = document.createElement("div");
+    container.className = "code-block-container";
+    const header = document.createElement("div");
+    header.className = "code-block-header";
+
+    // button copy
+    const button = document.createElement("button");
+    button.className = "copy-btn";
+    button.type = "button";
+    button.setAttribute("aria-label", "Copy code");
+
+    const icon = document.createElement("i");
+    icon.className = "fa-solid fa-clipboard";
+    button.appendChild(icon);
+
+    header.appendChild(button);
+
+    highlightBlock.parentNode.insertBefore(container, highlightBlock);
+    container.appendChild(header);
+    container.appendChild(highlightBlock);
+
+    // event copy
+    button.addEventListener("click", () => {
+      const codeElement = highlightBlock.querySelector("td.code");
+      const textToCopy = codeElement ? codeElement.innerText.trim() : highlightBlock.innerText.trim();
+
+      navigator.clipboard.writeText(textToCopy).then(() => {
+        icon.className = "fa-solid fa-check";
+        setTimeout(() => (icon.className = "fa-solid fa-clipboard"), 2000);
+      }, () => {
+        icon.className = "fa-solid fa-xmark";
+        setTimeout(() => (icon.className = "fa-solid fa-clipboard"), 2000);
+      });
+    });
+  });
+
+});

data/assets/js/terminal.js

@@ -0,0 +1,15 @@
+document.addEventListener("DOMContentLoaded", () => {
+  /* effects terminal: maximize
+  --------------------------------------------------------------------------------------------------
+  */
+  const terminal = document.getElementById("terminal");
+  const btnMax   = terminal.querySelector(".terminal-header__max");
+
+  let isFullscreen = false;
+
+  // maximize/restore
+  btnMax.addEventListener("click", () => {
+    isFullscreen = !isFullscreen;
+    terminal.classList.toggle("terminal-fullscreen", isFullscreen);
+  });
+});

data/assets/js/toc.js

@@ -0,0 +1,20 @@
+document.addEventListener("DOMContentLoaded", () => {
+  /* TOC in top */
+  const toc = document.getElementById('toc');
+
+  const sentinel = document.createElement('div');
+  toc.parentNode.insertBefore(sentinel, toc);
+
+  const observer = new IntersectionObserver(
+    ([entry]) => {
+      if (!entry.isIntersecting) {
+        toc.classList.add('toc-fixed');
+      } else {
+        toc.classList.remove('toc-fixed');
+      }
+    },
+    { threshold: 0 }
+  );
+
+  observer.observe(sentinel);
+});

data/assets/json/blog_search.json

@@ -0,0 +1,16 @@
+---
+layout: none
+---
+
+{%- assign date_format =  "%b %-d,%Y" -%}
+
+[
+  {% for post in site.posts %}
+    {
+      "title"    : "{{ post.title | escape }}",
+      "tags"     : "{{ post.tags | join: ', ' }}",
+      "url"      : "{{ site.baseurl }}{{ post.url }}",
+      "date"     : "{{ post.date | date: date_format }}"
+    } {% unless forloop.last %},{% endunless %}
+  {% endfor %}
+]