From b4472b41214eeeacce071df41bf0f782e1f16d6d Mon Sep 17 00:00:00 2001 From: "Gabriel A. Giovanini" Date: Thu, 9 Jun 2022 20:10:19 +0200 Subject: feat: Move from pico to custom css Use css from my current blog, which is a lot smaller. The text itself looks good but the code still breaks the page. Metrics: - hyper: 16.37 KB / 16.47 KB transferred - 1 request --- .gitlab-ci.yml | 62 ------ Procfile | 1 - content/posts/2020-07-12Road_to_local_K8S.html | 150 +++++++------- src/blog.rs | 32 ++- src/router.rs | 11 +- templates/head.html | 2 +- templates/header.html | 18 +- templates/index.html | 44 +++-- templates/main.css | 263 +++++++++++++++++++++++++ templates/post.html | 32 +-- 10 files changed, 411 insertions(+), 204 deletions(-) delete mode 100644 .gitlab-ci.yml delete mode 100644 Procfile create mode 100644 templates/main.css 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 @@
-

Goal

-

+

Goal

+

The goal is to deploy kubernetes on my local networks, and keep everything as reproducible as possible. -

-

Stack

-

+

+

Stack

+

I'll use Fedora Core OS, Matchbox and Terraform 1, a match the requirements for Tectonic2.

-

Steps

- -

Network Setup DHCP/TFTP/DNS

-

First learning the basics

- -

+

Steps

+ +

Network Setup DHCP/TFTP/DNS

+

First learning the basics

+ +

To check open ports -

lsof -Pni | grep LISTEN
-

-

+

lsof -Pni | grep LISTEN
+

+

Run the provided6 image with dnsmasq and PXE toolkit -

docker run --rm --cap-add=NET_ADMIN --net=host quay.io/coreos/dnsmasq \
+    
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
-

-

Matchbox

-

...

-

PXE network boot enviroment

-

...

-

Terraform Tectonic

-

...

-

Links

-
- 1 - - https://coreos.com/tectonic/docs/latest/install/bare-metal/metal-terraform.html - -
-
- 2 - - https://coreos.com/tectonic/docs/latest/install/bare-metal/requirements.html - -
-
- 3 - - https://coreos.com/matchbox/docs/latest/network-setup.html - -
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[\d]{4}-[\d]{2}-[\d]{2})(?P[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 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 @@
- +
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 @@ - - <% include!("head.html"); %> - - -<% include!("header.html"); %> -
-
- A gathering of information about some things I do on my spare time. - You can find me on gitlab, twitter and linkedin. -
-
- -
-
- + + <% include!("head.html"); %> + + +
+ <% include!("header.html"); %> +
+
+ A gathering of information about some things I do on my + spare time. You can find me on gitlab, twitter and + linkedin. +
+
+ <% for p in &posts { %> + + <% } %> +
+
+
+ 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 @@ - - <% include!("head.html"); %> - - -<% include!("header.html"); %> -
-

<%- title %>

-
Created At: <%- date %>
- <%- content %> - -
- - - + + <% include!("head.html"); %> + + +
+ <% include!("header.html"); %> +
+
+

<%- title %>

+ +
+ <%- content %> +
+
+
+
+ -- cgit v1.2.3