ericlikedis 6409892add changes
2023-08-26 22:38:57 -05:00

1674 lines
23 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!doctype html>
<!-- `site.alt_lang` can specify a language different from the UI -->
<html lang="en"
>
<!-- The Head -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="theme-color" media="(prefers-color-scheme: light)" content="#f7f7f7">
<meta name="theme-color" media="(prefers-color-scheme: dark)" content="#1b1b1e">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<meta
name="viewport"
content="width=device-width, user-scalable=no initial-scale=1, shrink-to-fit=no, viewport-fit=cover"
>
<!-- Begin Jekyll SEO tag v2.8.0 -->
<meta name="generator" content="Jekyll v4.3.2" />
<meta property="og:title" content="Blogging" />
<meta property="og:locale" content="en" />
<meta name="description" content="A minimal, responsive and feature-rich Jekyll theme for technical writing." />
<meta property="og:description" content="A minimal, responsive and feature-rich Jekyll theme for technical writing." />
<link rel="canonical" href="http://localhost:4000/categories/blogging/" />
<meta property="og:url" content="http://localhost:4000/categories/blogging/" />
<meta property="og:site_name" content="neos brain" />
<meta property="og:type" content="website" />
<meta name="twitter:card" content="summary" />
<meta property="twitter:title" content="Blogging" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"WebPage","description":"A minimal, responsive and feature-rich Jekyll theme for technical writing.","headline":"Blogging","url":"http://localhost:4000/categories/blogging/"}</script>
<!-- End Jekyll SEO tag -->
<title>Blogging | neo's brain
</title>
<!--
The Favicons for Web, Android, Microsoft, and iOS (iPhone and iPad) Apps
Generated by: https://realfavicongenerator.net/
-->
<link rel="apple-touch-icon" sizes="180x180" href="/assets/img/favicons/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/assets/img/favicons/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/assets/img/favicons/favicon-16x16.png">
<link rel="manifest" href="/assets/img/favicons/site.webmanifest">
<link rel="shortcut icon" href="/assets/img/favicons/favicon.ico">
<meta name="apple-mobile-web-app-title" content="neo's brain">
<meta name="application-name" content="neo's brain">
<meta name="msapplication-TileColor" content="#da532c">
<meta name="msapplication-config" content="/assets/img/favicons/browserconfig.xml">
<meta name="theme-color" content="#ffffff">
<link rel="preconnect" href="https://fonts.googleapis.com" >
<link rel="dns-prefetch" href="https://fonts.googleapis.com" >
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="dns-prefetch" href="https://fonts.gstatic.com" crossorigin>
<link rel="preconnect" href="https://fonts.googleapis.com" >
<link rel="dns-prefetch" href="https://fonts.googleapis.com" >
<link rel="preconnect" href="https://cdn.jsdelivr.net" >
<link rel="dns-prefetch" href="https://cdn.jsdelivr.net" >
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Lato&family=Source+Sans+Pro:wght@400;600;700;900&display=swap">
<!-- GA -->
<!-- Bootstrap -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css">
<!-- Font Awesome -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.4.0/css/all.min.css">
<link rel="stylesheet" href="/assets/css/style.css">
<!-- JavaScript -->
<!-- Switch the mode between dark and light. -->
<script type="text/javascript">
class ModeToggle {
static get MODE_KEY() {
return 'mode';
}
static get MODE_ATTR() {
return 'data-mode';
}
static get DARK_MODE() {
return 'dark';
}
static get LIGHT_MODE() {
return 'light';
}
static get ID() {
return 'mode-toggle';
}
constructor() {
if (this.hasMode) {
if (this.isDarkMode) {
if (!this.isSysDarkPrefer) {
this.setDark();
}
} else {
if (this.isSysDarkPrefer) {
this.setLight();
}
}
}
let self = this;
/* always follow the system prefers */
this.sysDarkPrefers.addEventListener('change', () => {
if (self.hasMode) {
if (self.isDarkMode) {
if (!self.isSysDarkPrefer) {
self.setDark();
}
} else {
if (self.isSysDarkPrefer) {
self.setLight();
}
}
self.clearMode();
}
self.notify();
});
} /* constructor() */
get sysDarkPrefers() {
return window.matchMedia('(prefers-color-scheme: dark)');
}
get isSysDarkPrefer() {
return this.sysDarkPrefers.matches;
}
get isDarkMode() {
return this.mode === ModeToggle.DARK_MODE;
}
get isLightMode() {
return this.mode === ModeToggle.LIGHT_MODE;
}
get hasMode() {
return this.mode != null;
}
get mode() {
return sessionStorage.getItem(ModeToggle.MODE_KEY);
}
/* get the current mode on screen */
get modeStatus() {
if (this.isDarkMode || (!this.hasMode && this.isSysDarkPrefer)) {
return ModeToggle.DARK_MODE;
} else {
return ModeToggle.LIGHT_MODE;
}
}
setDark() {
document.documentElement.setAttribute(ModeToggle.MODE_ATTR, ModeToggle.DARK_MODE);
sessionStorage.setItem(ModeToggle.MODE_KEY, ModeToggle.DARK_MODE);
}
setLight() {
document.documentElement.setAttribute(ModeToggle.MODE_ATTR, ModeToggle.LIGHT_MODE);
sessionStorage.setItem(ModeToggle.MODE_KEY, ModeToggle.LIGHT_MODE);
}
clearMode() {
document.documentElement.removeAttribute(ModeToggle.MODE_ATTR);
sessionStorage.removeItem(ModeToggle.MODE_KEY);
}
/* Notify another plugins that the theme mode has changed */
notify() {
window.postMessage(
{
direction: ModeToggle.ID,
message: this.modeStatus
},
'*'
);
}
flipMode() {
if (this.hasMode) {
if (this.isSysDarkPrefer) {
if (this.isLightMode) {
this.clearMode();
} else {
this.setLight();
}
} else {
if (this.isDarkMode) {
this.clearMode();
} else {
this.setDark();
}
}
} else {
if (this.isSysDarkPrefer) {
this.setLight();
} else {
this.setDark();
}
}
this.notify();
} /* flipMode() */
} /* ModeToggle */
const modeToggle = new ModeToggle();
</script>
<!-- A placeholder to allow defining custom metadata -->
</head>
<body>
<!-- The Side Bar -->
<div id="sidebar" class="d-flex flex-column align-items-end">
<div class="profile-wrapper">
<a href="/" id="avatar" class="rounded-circle">
</a>
<div class="site-title">
<a href="/">neo's brain</a>
</div>
<div class="site-subtitle fst-italic">just a bunch of technical write ups and notes.</div>
</div>
<!-- .profile-wrapper -->
<ul class="nav flex-column flex-grow-1 w-100 ps-0">
<!-- home -->
<li class="nav-item">
<a href="/" class="nav-link">
<i class="fa-fw fas fa-home"></i>
<span>HOME</span>
</a>
</li>
<!-- the real tabs -->
<li class="nav-item">
<a href="/categories/" class="nav-link">
<i class="fa-fw fas fa-stream"></i>
<span>CATEGORIES</span>
</a>
</li>
<!-- .nav-item -->
<li class="nav-item">
<a href="/tags/" class="nav-link">
<i class="fa-fw fas fa-tags"></i>
<span>TAGS</span>
</a>
</li>
<!-- .nav-item -->
<li class="nav-item">
<a href="/archives/" class="nav-link">
<i class="fa-fw fas fa-archive"></i>
<span>ARCHIVES</span>
</a>
</li>
<!-- .nav-item -->
<li class="nav-item">
<a href="/about/" class="nav-link">
<i class="fa-fw fas fa-info-circle"></i>
<span>ABOUT</span>
</a>
</li>
<!-- .nav-item -->
</ul>
<!-- ul.nav.flex-column -->
<div class="sidebar-bottom d-flex flex-wrap align-items-center w-100">
<button class="mode-toggle btn" aria-label="Switch Mode">
<i class="fas fa-adjust"></i>
</button>
<span class="icon-border"></span>
<a
href="https://github.com/ericlikedis"
aria-label="github"
target="_blank"
rel="noopener noreferrer"
>
<i class="fab fa-github"></i>
</a>
<a
href="https://twitter.com/"
aria-label="twitter"
target="_blank"
rel="noopener noreferrer"
>
<i class="fab fa-twitter"></i>
</a>
<a
href="javascript:location.href = 'mailto:' + ['ereymundo2013','gmail.com'].join('@')"
aria-label="email"
>
<i class="fas fa-envelope"></i>
</a>
<a
href="/feed.xml"
aria-label="rss"
>
<i class="fas fa-rss"></i>
</a>
</div>
<!-- .sidebar-bottom -->
</div>
<!-- #sidebar -->
<div id="main-wrapper" class="d-flex justify-content-center">
<div id="main" class="container px-xxl-5">
<!-- The Top Bar -->
<div id="topbar-wrapper">
<div
id="topbar"
class="container d-flex align-items-center justify-content-between h-100"
>
<span id="breadcrumb">
<span>
<a href="/">
Home
</a>
</span>
<span>
<a href="/categories">
Categories
</a>
</span>
<span>Blogging</span>
</span>
<!-- endof #breadcrumb -->
<i id="sidebar-trigger" class="fas fa-bars fa-fw"></i>
<div id="topbar-title">
Category
</div>
<i id="search-trigger" class="fas fa-search fa-fw"></i>
<span id="search-wrapper" class="align-items-center">
<i class="fas fa-search fa-fw"></i>
<input
class="form-control"
id="search-input"
type="search"
aria-label="search"
autocomplete="off"
placeholder="Search..."
>
</span>
<span id="search-cancel">Cancel</span>
</div>
</div>
<div class="row mb-5">
<!-- core -->
<div id="core-wrapper" class="col-12 col-lg-11 col-xl-9 pe-xl-4">
<div class="post px-1 px-md-2">
<div id="page-category">
<h1 class="ps-lg-2">
<i class="far fa-folder-open fa-fw text-muted"></i>
Blogging
<span class="lead text-muted ps-2">1</span>
</h1>
<ul class="post-content ps-0">
<li class="d-flex justify-content-between px-md-3">
<a href="/posts/text-and-typography/">Text and Typography</a>
<span class="dash flex-grow-1"></span>
<!--
Date format snippet
See: ${JS_ROOT}/utils/locale-dateime.js
-->
<span
class="text-muted small"
data-ts="1565235180"
data-df="ll"
>
Aug 7, 2019
</span>
</li>
</ul>
</div>
</div>
</div>
<!-- #core-wrapper -->
<!-- panel -->
<div id="panel-wrapper" class="col-xl-3 ps-2 text-muted">
<div class="access">
<!-- Get the last 5 posts from lastmod list. -->
<div id="access-lastmod" class="post">
<div class="panel-heading">Recently Updated</div>
<ul class="post-content list-unstyled ps-0 pb-1 ms-1 mt-2">
<li class="text-truncate lh-lg">
<a href="/posts/Mac-M1-Run-Diablo-4/">Mac M1 Run Diablo 4 - Links</a>
</li>
<li class="text-truncate lh-lg">
<a href="/posts/text-and-typography/">Text and Typography</a>
</li>
<li class="text-truncate lh-lg">
<a href="/posts/Flaws.cloud-AWS/">Flaws.cloud walkthrough</a>
</li>
<li class="text-truncate lh-lg">
<a href="/posts/M1-Mac-How-to-switch-the-Terminal-between-x86_64-and-arm64/">M1 Mac - How to Switch the Terminal between x86_64 and arm64</a>
</li>
<li class="text-truncate lh-lg">
<a href="/posts/Admonitions-Documentation/">Admonitions Documentation</a>
</li>
</ul>
</div>
<!-- #access-lastmod -->
<!-- The trending tags list -->
<div id="access-tags">
<div class="panel-heading">Trending Tags</div>
<div class="d-flex flex-wrap mt-3 mb-1 me-3">
<a class="post-tag btn btn-outline-primary" href="/tags/cybersecurity/">cybersecurity</a>
<a class="post-tag btn btn-outline-primary" href="/tags/diablo-4/">diablo 4</a>
<a class="post-tag btn btn-outline-primary" href="/tags/docs/">docs</a>
<a class="post-tag btn btn-outline-primary" href="/tags/terminal/">terminal</a>
<a class="post-tag btn btn-outline-primary" href="/tags/diablo/">diablo</a>
<a class="post-tag btn btn-outline-primary" href="/tags/m1/">M1</a>
<a class="post-tag btn btn-outline-primary" href="/tags/apple-silicon/">apple silicon</a>
<a class="post-tag btn btn-outline-primary" href="/tags/cheatsheets/">cheatsheets</a>
<a class="post-tag btn btn-outline-primary" href="/tags/cloud/">cloud</a>
<a class="post-tag btn btn-outline-primary" href="/tags/gcih/">GCIH</a>
</div>
</div>
</div>
</div>
</div>
<script src="https://tryhackme.com/badge/313518"></script>
<!-- tail -->
<!-- The Search results -->
<div id="search-result-wrapper" class="d-flex justify-content-center unloaded">
<div class="col-11 post-content">
<div id="search-hints">
<!-- The trending tags list -->
<div id="access-tags">
<div class="panel-heading">Trending Tags</div>
<div class="d-flex flex-wrap mt-3 mb-1 me-3">
<a class="post-tag btn btn-outline-primary" href="/tags/cybersecurity/">cybersecurity</a>
<a class="post-tag btn btn-outline-primary" href="/tags/diablo-4/">diablo 4</a>
<a class="post-tag btn btn-outline-primary" href="/tags/docs/">docs</a>
<a class="post-tag btn btn-outline-primary" href="/tags/terminal/">terminal</a>
<a class="post-tag btn btn-outline-primary" href="/tags/diablo/">diablo</a>
<a class="post-tag btn btn-outline-primary" href="/tags/m1/">M1</a>
<a class="post-tag btn btn-outline-primary" href="/tags/apple-silicon/">apple silicon</a>
<a class="post-tag btn btn-outline-primary" href="/tags/cheatsheets/">cheatsheets</a>
<a class="post-tag btn btn-outline-primary" href="/tags/cloud/">cloud</a>
<a class="post-tag btn btn-outline-primary" href="/tags/gcih/">GCIH</a>
</div>
</div>
</div>
<div id="search-results" class="d-flex flex-wrap justify-content-center text-muted mt-3"></div>
</div>
</div>
</div>
</div>
<!-- The Footer -->
<footer>
<div class="container px-lg-4">
<div class="d-flex justify-content-center align-items-center text-muted mx-md-3">
<p>Using the <a href="https://jekyllrb.com" target="_blank" rel="noopener">Jekyll</a> theme <a href="https://github.com/cotes2020/jekyll-theme-chirpy" target="_blank" rel="noopener">Chirpy</a>
</p>
<p>©
2023
<a href="https://github.com/username">Eric Reymundo</a>.
<span
data-bs-toggle="tooltip"
data-bs-placement="top"
title="Except where otherwise noted, the blog posts on this site are licensed under the Creative Commons Attribution 4.0 International (CC BY 4.0) License by the author."
>Some rights reserved.</span>
</p>
</div>
</div>
</footer>
<div id="mask"></div>
<button id="back-to-top" aria-label="back-to-top" class="btn btn-lg btn-box-shadow">
<i class="fas fa-angle-up"></i>
</button>
<div
id="notification"
class="toast"
role="alert"
aria-live="assertive"
aria-atomic="true"
data-bs-animation="true"
data-bs-autohide="false"
>
<div class="toast-header">
<button
type="button"
class="btn-close ms-auto"
data-bs-dismiss="toast"
aria-label="Close"
></button>
</div>
<div class="toast-body text-center pt-0">
<p class="px-2 mb-3">A new version of content is available.</p>
<button type="button" class="btn btn-primary" aria-label="Update">
Update
</button>
</div>
</div>
<!-- JS selector for site. -->
<!-- commons -->
<!-- layout specified -->
<script src="https://cdn.jsdelivr.net/combine/npm/jquery@3.7.0/dist/jquery.min.js,npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js,npm/simple-jekyll-search@1.10.0/dest/simple-jekyll-search.min.js,npm/dayjs@1.11.7/dayjs.min.js,npm/dayjs@1.11.7/locale/en.min.js,npm/dayjs@1.11.7/plugin/relativeTime.min.js,npm/dayjs@1.11.7/plugin/localizedFormat.min.js"></script>
<script defer src="/assets/js/dist/misc.min.js"></script>
<!--
Jekyll Simple Search loader
See: <https://github.com/christian-fei/Simple-Jekyll-Search>
-->
<script>
/* Note: dependent library will be loaded in `js-selector.html` */
SimpleJekyllSearch({
searchInput: document.getElementById('search-input'),
resultsContainer: document.getElementById('search-results'),
json: '/assets/js/data/search.json',
searchResultTemplate: '<div class="px-1 px-sm-2 px-lg-4 px-xl-0"> <a href="{url}">{title}</a> <div class="post-meta d-flex flex-column flex-sm-row text-muted mt-1 mb-1"> {categories} {tags} </div> <p>{snippet}</p></div>',
noResultsText: '<p class="mt-5"></p>',
templateMiddleware: function(prop, value, template) {
if (prop === 'categories') {
if (value === '') {
return `${value}`;
} else {
return `<div class="me-sm-4"><i class="far fa-folder fa-fw"></i>${value}</div>`;
}
}
if (prop === 'tags') {
if (value === '') {
return `${value}`;
} else {
return `<div><i class="fa fa-tag fa-fw"></i>${value}</div>`;
}
}
}
});
</script>
</body>
</html>