aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--.gitlab-ci.yml62
-rw-r--r--Procfile1
-rw-r--r--content/posts/2020-07-12Road_to_local_K8S.html150
-rw-r--r--src/blog.rs32
-rw-r--r--src/router.rs11
-rw-r--r--templates/head.html2
-rw-r--r--templates/header.html18
-rw-r--r--templates/index.html44
-rw-r--r--templates/main.css263
-rw-r--r--templates/post.html32
10 files changed, 411 insertions, 204 deletions
diff --git a/.gitlab-ci.yml b/.gitlab-ci.yml
deleted file mode 100644
index dd3bba4..0000000
--- a/.gitlab-ci.yml
+++ /dev/null
@@ -1,62 +0,0 @@
-stages:
- - test
- - production
- - prepare
- - release
-
-test:
- image: rust:alpine
- stage: test
- script:
- - apk add musl-dev
- - cargo install cargo2junit
- - cargo test -- -Z unstable-options --format json --report-time | cargo2junit > results.xml
- only:
- - master
- artifacts:
- reports:
- junit: results.xml
-
-production:
- stage: production
- image: ruby:latest
- needs:
- - test
- script:
- - apt-get update -qy
- - apt-get install -y ruby-dev
- - gem install dpl
- - gem install faraday -v 1.8.0
- - dpl --provider=heroku --app=$HEROKU_APP --api-key=$HEROKU_API_KEY
- only:
- - master
-
-prepare_job:
- stage: prepare
- image: rust:alpine
- rules:
- - if: $CI_COMMIT_TAG
- script:
- - echo "running release_job"
- - apk add musl-dev
- - cargo build --release
- artifacts:
- paths:
- - target/release/hyper
- - target/release/actix
-
-release_job:
- stage: release
- image: registry.gitlab.com/gitlab-org/release-cli:latest
- rules:
- - if: $CI_COMMIT_TAG
- script:
- - echo "running release_job for $TAG"
- needs:
- - job: prepare_job
- artifacts: true
- release:
- name: 'Release $CI_COMMIT_TAG'
- description: 'New macroblog version'
- tag_name: '$CI_COMMIT_TAG'
- ref: '$CI_COMMIT_TAG'
diff --git a/Procfile b/Procfile
deleted file mode 100644
index 51c4728..0000000
--- a/Procfile
+++ /dev/null
@@ -1 +0,0 @@
-web: ./target/release/actix
diff --git a/content/posts/2020-07-12Road_to_local_K8S.html b/content/posts/2020-07-12Road_to_local_K8S.html
index 5d34b27..52820b3 100644
--- a/content/posts/2020-07-12Road_to_local_K8S.html
+++ b/content/posts/2020-07-12Road_to_local_K8S.html
@@ -1,43 +1,43 @@
<section>
- <h3>Goal</h3>
- <p>
+ <h3>Goal</h3>
+ <p>
The goal is to deploy kubernetes on my local networks, and keep everything
as reproducible as possible.
- </p>
- <h3>Stack</h3>
- <p>
+ </p>
+ <h3>Stack</h3>
+ <p>
I'll use Fedora Core OS, Matchbox and Terraform
<sup><a href="#footnotes">1</a></sup>, a match the requirements for
Tectonic<sup><a href="#footnotes">2</a></sup>.</p>
- <h3>Steps</h3>
- <ul>
- <li>Network Setup DHCP/TFTP/DNS<sup><a href="#footnotes">3</a></sup></li>
- <li>Matchbox<sup><a href="#footnotes">4</a></sup></li>
- <li>PXE nextwork boot evnrionment</li>
- <li>Terraform Tectonic<sup><a href="#footnotes">5</a></sup></li>
- </ul>
- <h3>Network Setup DHCP/TFTP/DNS</h3>
- <p>First learning the basics</p>
- <ul>
- <li>
- <a href="https://linuxhint.com/install_dhcp_server_ubuntu/">
- https://linuxhint.com/install_dhcp_server_ubuntu/
- </a>
- </li>
- <li>
- <a href="https://www.youtube.com/watch?v=XQ3T14SIlV4">
- https://www.youtube.com/watch?v=XQ3T14SIlV4
- </a>
- </li>
- </ul>
- <p>
+ <h3>Steps</h3>
+ <ul>
+ <li>Network Setup DHCP/TFTP/DNS<sup><a href="#footnotes">3</a></sup></li>
+ <li>Matchbox<sup><a href="#footnotes">4</a></sup></li>
+ <li>PXE nextwork boot evnrionment</li>
+ <li>Terraform Tectonic<sup><a href="#footnotes">5</a></sup></li>
+ </ul>
+ <h3>Network Setup DHCP/TFTP/DNS</h3>
+ <p>First learning the basics</p>
+ <ul>
+ <li>
+ <a href="https://linuxhint.com/install_dhcp_server_ubuntu/">
+ https://linuxhint.com/install_dhcp_server_ubuntu/
+ </a>
+ </li>
+ <li>
+ <a href="https://www.youtube.com/watch?v=XQ3T14SIlV4">
+ https://www.youtube.com/watch?v=XQ3T14SIlV4
+ </a>
+ </li>
+ </ul>
+ <p>
To check open ports
-<pre><code>lsof -Pni | grep LISTEN</code></pre>
- </p>
- <p>
+ <pre><code>lsof -Pni | grep LISTEN</code></pre>
+ </p>
+ <p>
Run the provided<sup><a href="#footnotes">6</a></sup> image with dnsmasq and
PXE toolkit
-<pre><code>docker run --rm --cap-add=NET_ADMIN --net=host quay.io/coreos/dnsmasq \
+ <pre><code>docker run --rm --cap-add=NET_ADMIN --net=host quay.io/coreos/dnsmasq \
-d -q \
--dhcp-range=192.168.1.3,192.168.1.254 \
--enable-tftp --tftp-root=/var/lib/tftpboot \
@@ -54,48 +54,48 @@
--address=/matchbox.example/192.168.1.2 \
--log-queries \
--log-dhcp</code></pre>
- </p>
- <h3>Matchbox</h3>
- <p>...</p>
- <h3>PXE network boot enviroment</h3>
- <p>...</p>
- <h3>Terraform Tectonic</h3>
- <p>...</p>
- <h3 id="footnotes">Links</h3>
- <div >
- <sup>1</sup>
- <a href="https://coreos.com/tectonic/docs/latest/install/bare-metal/metal-terraform.html">
- https://coreos.com/tectonic/docs/latest/install/bare-metal/metal-terraform.html
- </a>
- <div>
- <div>
- <sup>2</sup>
- <a href="https://coreos.com/tectonic/docs/latest/install/bare-metal/requirements.html">
- https://coreos.com/tectonic/docs/latest/install/bare-metal/requirements.html
- </a>
- <div>
- <div>
- <sup>3</sup>
- <a href="https://coreos.com/matchbox/docs/latest/network-setup.html">
- https://coreos.com/matchbox/docs/latest/network-setup.html
- </a>
- <div>
- <div>
- <sup>4</sup>
- <a href="https://coreos.com/matchbox/docs/latest/deployment.html">
- https://coreos.com/matchbox/docs/latest/deployment.html
- </a>
- <div>
- <div>
- <sup>5</sup>
- <a href="https://coreos.com/tectonic/releases/">
- https://coreos.com/tectonic/releases/
- </a>
- <div>
- <div>
- <sup>6</sup>
- <a href="https://github.com/poseidon/matchbox/tree/v0.7.0/contrib/dnsmasq">
- https://github.com/poseidon/matchbox/tree/v0.7.0/contrib/dnsmasq
- </a>
- <div>
+ </p>
+ <h3>Matchbox</h3>
+ <p>...</p>
+ <h3>PXE network boot enviroment</h3>
+ <p>...</p>
+ <h3>Terraform Tectonic</h3>
+ <p>...</p>
+ <h3 id="footnotes">Links</h3>
+ <div >
+ <sup>1</sup>
+ <a href="https://coreos.com/tectonic/docs/latest/install/bare-metal/metal-terraform.html">
+ https://coreos.com/tectonic/docs/latest/install/bare-metal/metal-terraform.html
+ </a>
+ <div>
+ <div>
+ <sup>2</sup>
+ <a href="https://coreos.com/tectonic/docs/latest/install/bare-metal/requirements.html">
+ https://coreos.com/tectonic/docs/latest/install/bare-metal/requirements.html
+ </a>
+ <div>
+ <div>
+ <sup>3</sup>
+ <a href="https://coreos.com/matchbox/docs/latest/network-setup.html">
+ https://coreos.com/matchbox/docs/latest/network-setup.html
+ </a>
+ <div>
+ <div>
+ <sup>4</sup>
+ <a href="https://coreos.com/matchbox/docs/latest/deployment.html">
+ https://coreos.com/matchbox/docs/latest/deployment.html
+ </a>
+ <div>
+ <div>
+ <sup>5</sup>
+ <a href="https://coreos.com/tectonic/releases/">
+ https://coreos.com/tectonic/releases/
+ </a>
+ <div>
+ <div>
+ <sup>6</sup>
+ <a href="https://github.com/poseidon/matchbox/tree/v0.7.0/contrib/dnsmasq">
+ https://github.com/poseidon/matchbox/tree/v0.7.0/contrib/dnsmasq
+ </a>
+ <div>
</section>
diff --git a/src/blog.rs b/src/blog.rs
index 6bbda49..0fa9543 100644
--- a/src/blog.rs
+++ b/src/blog.rs
@@ -1,9 +1,9 @@
+use chrono::NaiveDate;
+use regex::Regex;
use rust_embed::RustEmbed;
use sailfish::TemplateOnce;
-use chrono::NaiveDate;
-use regex::{Regex};
+use std::cmp::{Eq, Ord, PartialEq, PartialOrd};
use std::str;
-use std::cmp::{PartialOrd, Ord, PartialEq, Eq};
const BLOG_REGEX: &str = r"(?P<date>[\d]{4}-[\d]{2}-[\d]{2})(?P<title>[a-zA-Z0-9-_]*)";
@@ -11,7 +11,6 @@ const BLOG_REGEX: &str = r"(?P<date>[\d]{4}-[\d]{2}-[\d]{2})(?P<title>[a-zA-Z0-9
#[folder = "content/posts/"]
struct PostAsset;
-
#[derive(TemplateOnce)]
#[template(path = "index.html")]
struct IndexTemplate {
@@ -23,7 +22,7 @@ struct IndexTemplate {
struct PostTemplate {
content: String,
title: String,
- date: String
+ date: String,
}
#[derive(PartialEq, Eq, PartialOrd, Ord)]
@@ -43,12 +42,11 @@ impl BlogEntry {
BlogEntry {
title: String::from(title),
file: String::from(path),
- datetime: NaiveDate::parse_from_str(date, "%Y-%m-%d").unwrap()
+ datetime: NaiveDate::parse_from_str(date, "%Y-%m-%d").unwrap(),
}
}
pub fn read_assets() -> Vec<BlogEntry> {
-
let mut entries: Vec<BlogEntry> = PostAsset::iter()
.map(|e| format!("{}", e))
.map(|e| BlogEntry::new(&e))
@@ -61,29 +59,27 @@ impl BlogEntry {
}
fn get_file_content(path: &str) -> String {
- let buffer = PostAsset::get(path)
- .unwrap()
- .data
- .into_owned();
+ let buffer = PostAsset::get(path).unwrap().data.into_owned();
return String::from_utf8(buffer).unwrap();
}
-
pub fn render_post_page(path: &String) -> String {
let blog = BlogEntry::new(path);
PostTemplate {
content: get_file_content(path),
title: blog.title,
- date: blog.datetime.format("%Y-%m-%d").to_string()
+ date: blog.datetime.format("%Y-%m-%d").to_string(),
}
- .render_once()
- .unwrap()
+ .render_once()
+ .unwrap()
}
pub fn render_index_page() -> String {
- IndexTemplate { posts: BlogEntry::read_assets() }
- .render_once()
- .unwrap()
+ IndexTemplate {
+ posts: BlogEntry::read_assets(),
+ }
+ .render_once()
+ .unwrap()
}
diff --git a/src/router.rs b/src/router.rs
index 0bba091..35fdf3e 100644
--- a/src/router.rs
+++ b/src/router.rs
@@ -1,4 +1,4 @@
-use regex::{Regex};
+use regex::Regex;
const ACTION_REGEX: &str = r"/{0,1}(?P<action>\w*)/(?P<id>.+)";
@@ -14,14 +14,15 @@ impl Router {
let caps = re.captures(path);
let action = match caps {
Some(ref value) => &value["action"],
- None => "index"
+ None => "index",
};
match action {
- "posts" => Router::Post { page: caps.unwrap()["id"].to_string() },
+ "posts" => Router::Post {
+ page: caps.unwrap()["id"].to_string(),
+ },
"index" => Router::Index,
- _ => Router::NotFound
+ _ => Router::NotFound,
}
}
}
-
diff --git a/templates/head.html b/templates/head.html
index c054157..3492eda 100644
--- a/templates/head.html
+++ b/templates/head.html
@@ -3,5 +3,5 @@
<title>Yet Another Blog</title>
<link rel="icon" type="image/x-icon" href="data:image/x-icon;base64,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">
<style>
- <% include!("pico.min.css"); %>
+<% include!("main.css"); %>
</style>
diff --git a/templates/header.html b/templates/header.html
index 1340aa1..c830273 100644
--- a/templates/header.html
+++ b/templates/header.html
@@ -1,10 +1,12 @@
<header class="container">
- <nav class="container-fluid">
- <ul>
- <li><h2><a href="/">Yet Another Blog</a></h2></li>
- </ul>
- <ul>
- <li><a href="https://gitlab.com/gabrielgio/cv/-/raw/main/cv.pdf?inline=false" class="secondary">Resume</a></li>
- </ul>
- </nav>
+ <div class="title-wrapper">
+ <a href="/">
+ <h2 class="title">Yet Another Blog</h2>
+ </a>
+ <nav class="container-fluid">
+ <ul>
+ <li><a href="https://gitlab.com/gabrielgio/cv/-/raw/main/cv.pdf?inline=false" class="secondary">Resume</a></li>
+ </ul>
+ </nav>
+ </div>
</header>
diff --git a/templates/index.html b/templates/index.html
index 006643a..f6f3ca9 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -1,22 +1,28 @@
<!DOCTYPE html>
<html data-theme="light" lang="en">
-<head>
- <% include!("head.html"); %>
-</head>
-<body>
-<% include!("header.html"); %>
-<main class="container">
- <section>
- A gathering of information about some things I do on my spare time.
- You can find me on gitlab, twitter and linkedin.
- </section>
- <section>
- <ul>
- <% for p in &posts { %>
- <li><a href="/posts/<%- p.file %>"><%- p.title %></a></li>
- <% } %>
- </ul>
- </section>
-</main>
-</body>
+ <head>
+ <% include!("head.html"); %>
+ </head>
+ <body>
+ <div class="layout">
+ <% include!("header.html"); %>
+ <main>
+ <div class="slim-description">
+ A gathering of information about some things I do on my
+ spare time. You can find me on gitlab, twitter and
+ linkedin.
+ </div>
+ <div class="blog-list">
+ <% for p in &posts { %>
+ <article class="list-item">
+ <div class="post-title">
+ <a href="/posts/<%- p.file %>"><%- p.title %></a>
+ </div>
+ <span classname="data-label"><%- p.datetime | disp %></span>
+ </article>
+ <% } %>
+ </div>
+ </main>
+ </div>
+ </body>
</html>
diff --git a/templates/main.css b/templates/main.css
new file mode 100644
index 0000000..f056a50
--- /dev/null
+++ b/templates/main.css
@@ -0,0 +1,263 @@
+* {
+ box-sizing: border-box;
+ font-family: dejavu sans;
+}
+body {
+ margin: 0;
+}
+h1,
+h2,
+h3,
+h4 {
+ font-weight: 400;
+}
+code[class*="language-"],
+nav,
+.blog-list {
+ font-style: normal;
+ font-weight: 400;
+ font-size: 1.025rem;
+}
+code {
+ font-family: dejavu sans mono;
+}
+tags {
+ font-family: dejavu sans mono;
+}
+.list-item {
+ font-family: dejavu sans mono;
+}
+html {
+ font-size: 16px;
+}
+body {
+ line-height: 1.8em;
+ color: #333;
+ background: #fefefe;
+}
+.post-title,
+.date-label {
+ letter-spacing: 0.025rem;
+}
+p,
+sub,
+nav {
+ letter-spacing: 0.05rem;
+}
+.title-wrapper,
+.title {
+ letter-spacing: 0.075rem;
+}
+a {
+ text-decoration: none;
+}
+.brand-icon {
+ color: #f93a3a;
+ display: inline-flex;
+ border-bottom: 1px solid;
+}
+.brand-icon:hover {
+ border-bottom: none;
+}
+.layout {
+ max-width: 48rem;
+ margin-left: auto;
+ margin-right: auto;
+ padding: 2.625rem 1.3125rem;
+}
+.layout .title-wrapper {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ margin-bottom: 0.5rem;
+}
+.layout .title {
+ color: #333;
+ text-align: left;
+ display: block;
+ font-size: 1.875rem;
+ margin: 0;
+}
+nav {
+ font-size: 1.025rem;
+ text-align: center;
+}
+nav ul {
+ display: block;
+ padding: 0;
+}
+nav ul li {
+ display: inline;
+ list-style-type: none;
+}
+nav ul li a {
+ color: #333;
+ display: inline-block;
+ padding-top: 0.5rem;
+ padding-bottom: 0.5rem;
+ border-bottom: 1px solid #fefefe;
+}
+nav ul li a:hover {
+ color: #f93a3a;
+}
+nav ul li:not(:last-child) {
+ padding: 0 1rem 0 0;
+}
+.slim-description {
+ margin-bottom: calc(16px * 2);
+ color: #666;
+}
+.blog-post-content a {
+ color: #f93a3a;
+ text-decoration: none;
+ border-bottom: 1px solid;
+}
+.blog-post-content a:hover {
+ border-bottom: none;
+}
+.blog-list .list-item {
+ display: flex;
+ flex-direction: column-reverse;
+ align-items: baseline;
+ padding: 0.5rem 0.5rem 0.5rem 0;
+}
+.blog-list .post-title a {
+ text-decoration: none;
+ color: #333;
+ border-bottom: none;
+}
+.blog-list .post-title a:hover {
+ border-bottom: 1px solid;
+}
+.blog-list .date-label {
+ font-size: 80%;
+ margin-right: 1rem;
+}
+.content .title {
+ font-size: 1.275rem;
+}
+.blog-post-content a {
+ color: #f93a3a;
+ text-decoration: none;
+ border-bottom: 1px solid;
+}
+.blog-post-content a:hover {
+ border-bottom: none;
+}
+.blog-post-content img {
+ width: 100%;
+}
+.post-image {
+ margin-left: calc(-1.3125rem);
+ margin-right: calc(-1.3125rem);
+}
+.post-image img {
+ width: 100%;
+}
+.tags {
+ font-size: 0.9em;
+ text-align: left;
+}
+.tags ul {
+ display: block;
+ padding: 0;
+}
+.tags ul li {
+ display: inline;
+ list-style-type: none;
+ text-align: center;
+}
+.tags ul li a {
+ border: 1px solid #f93a3a;
+ border-radius: 3px;
+ background: #f93a3a;
+ padding: 0.2em;
+ color: #fff;
+ margin: 10px 2px 10px 0;
+ line-height: 1em;
+}
+.tags ul li a:hover {
+ background: #fefefe;
+ color: #f93a3a;
+}
+.tags ul li:not(:last-child) {
+ padding: 0 0.1rem 0 0;
+}
+.highlight {
+ margin-left: calc(-1.3125rem);
+ margin-right: calc(-1.3125rem);
+}
+.highlight pre {
+ line-height: 1.2rem;
+ border: 1px solid #ddd;
+ border-radius: 5px;
+ overflow: auto;
+ padding: 1.3125rem;
+ margin: 0;
+}
+.highlight pre code[class*="language-"] {
+ font-size: 0.9em;
+}
+.highlight pre .token.comment {
+ font-style: italic;
+}
+blockquote {
+ background: #f9f9f9;
+ border-left: 5px solid #333;
+ margin: 1.5em 10px;
+ padding: 0.5em 10px;
+ quotes: "“" "”" "‘" "’";
+}
+blockquote:before {
+ color: #333;
+ content: open-quote;
+ font-size: 4em;
+ line-height: 0.1em;
+ margin-right: 0.25em;
+ vertical-align: -0.4em;
+}
+blockquote p {
+ display: inline;
+}
+time {
+ font-size: 80%;
+ margin-right: 1rem;
+}
+@media only screen and (min-width: 600px) {
+ .layout .title-wrapper {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ flex-direction: row;
+ }
+ .layout .title {
+ margin-block-start: 0.83em;
+ margin-block-end: 0.83em;
+ margin-inline-start: 0;
+ margin-inline-end: 0;
+ }
+ .blog-list .list-item {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ flex-direction: unset;
+ padding: 0;
+ margin-bottom: 0.5rem;
+ }
+ .blog-list .date-label {
+ font-size: 100%;
+ margin-right: 0;
+ }
+ .project-board {
+ grid-template-columns: 1fr 1fr;
+ }
+ .highlight {
+ margin-left: 0;
+ margin-right: 0;
+ }
+ .post-image {
+ margin-left: 0;
+ margin-right: 0;
+ }
+}
+
diff --git a/templates/post.html b/templates/post.html
index 7e0a909..99a7852 100644
--- a/templates/post.html
+++ b/templates/post.html
@@ -1,18 +1,20 @@
<!DOCTYPE html>
<html data-theme="light" lang="en">
-<head>
- <% include!("head.html"); %>
-</head>
-<body>
-<% include!("header.html"); %>
-<main class="container">
- <h2><%- title %></h2>
- <h5>Created At: <%- date %></h2>
- <%- content %>
- </section>
-</main>
-</body>
-
-<script>
-</script>
+ <head>
+ <% include!("head.html"); %>
+ </head>
+ <body>
+ <div class="layout">
+ <% include!("header.html"); %>
+ <main>
+ <article>
+ <h1><%- title %></h1>
+ <time>Created At: <%- date %></time>
+ <div class="blog-post-content">
+ <%- content %>
+ </div>
+ </article>
+ </main>
+ </div>
+ </body>
</html>