diff options
Diffstat (limited to 'website/blog')
37 files changed, 1209 insertions, 0 deletions
diff --git a/website/blog/.envrc b/website/blog/.envrc new file mode 100644 index 000000000000..b80e28b4b815 --- /dev/null +++ b/website/blog/.envrc @@ -0,0 +1,2 @@ +source_up +eval "$(lorri direnv)" diff --git a/website/blog/archetypes/default.md b/website/blog/archetypes/default.md new file mode 100644 index 000000000000..00e77bd79be4 --- /dev/null +++ b/website/blog/archetypes/default.md @@ -0,0 +1,6 @@ +--- +title: "{{ replace .Name "-" " " | title }}" +date: {{ .Date }} +draft: true +--- + diff --git a/website/blog/config.toml b/website/blog/config.toml new file mode 100644 index 000000000000..de67cf19cc69 --- /dev/null +++ b/website/blog/config.toml @@ -0,0 +1,25 @@ +baseURL = "https://blog.wpcarro.dev" +disqusShortname = "wpcarro" +languageCode = "en-us" +title = "blog.wpcarro.dev" +theme = "tailwind" +pygmentsCodeFences = true +pygmentsUseClasses = true + +[taxonomies] + tag = "tags" + +[permalinks] + posts = "/posts/:year/:month/:title/" + +[params] + author = "William Carroll" + description = "Loosely structured streams of consciousness" + tagline = "Loosely structured streams of consciousness" + +[languages] + [languages.en] + contentDir = "content/english" + languageCode = "en-us" + languageName = "English" + weight = 1 \ No newline at end of file diff --git a/website/blog/content/english/caffeine.md b/website/blog/content/english/caffeine.md new file mode 100644 index 000000000000..9c3dbac0f120 --- /dev/null +++ b/website/blog/content/english/caffeine.md @@ -0,0 +1,5 @@ +--- +title: "Caffeine" +date: 2020-03-11T22:50:40Z +draft: true +--- diff --git a/website/blog/content/english/cell-phone-experiment.md b/website/blog/content/english/cell-phone-experiment.md new file mode 100644 index 000000000000..c8efbf38052d --- /dev/null +++ b/website/blog/content/english/cell-phone-experiment.md @@ -0,0 +1,92 @@ +--- +title: "Cell Phone Experiment" +date: 2020-03-09T22:02:07Z +draft: true +--- + +### TL;DR + +I will not use my cell phone during March to challenge myself and learn more +about how much I depend on my device. + +### Background + +Ever since I read Charles Duhigg's book, [The Power of Habit](poh), I try to +habituate as many aspects of my life that I can. + +The *exploit* axis of the [explore/exploit tradeoff](exp-exp) endows habits with +their power. If you are interested in learning more about the explore/exploit +tradeoff, Brian Christian and Tom Griffiths explain this concept more clearly +than I could in Chapter 2 of their exceptional book, [Algorithms to Live +By](algos). + +One pitfall of overly exploiting an activity, however, is neglecting global +optima in favor of local optima. Thus we must also explore. Is it possible to +habituate exploration? I think so. + +Every month since October 2018, I commit to a monthly challenge. In the past, +monthly challenges have been things like: +- sign up and take Brazilian Jiu Jitsu lessons +- buy a guitar and learn [Freight Train by Elizabeth Cotton](https://www.youtube.com/watch?v=IUK8emiWabU) +- study Italian +- attempt to learn a handstand + +Typically for an activity to qualify as a challenge, I must spend at least +fifteen minutes working on it at least five days each week. Oftentimes +challenges have concrete deliverables (e.g. playing the "Freight Train" song +from start-to-finish). Other times, with Jiu Jitsu, the challenge consists of +attending classes five days a week without any absences. + +This month I'm challenging myself to avoid using my cell phone for the entire +month. I am interested in partially digitally detoxing. + +My parents gave me a cell phone when when I was a freshman in High School; those +days, I was fourteen years old. I am now twenty-eight years old, which means I +have been using a cell phone semi-daily for over ten years. + +While I enjoy the convenience that my cell phone provides me, I am curious to +suspend my usage aiming to more clearly understand how much I depend on it. + +### What was different? + +Things that I am missing: +- Alarm clock: I decided to avoid buying an alarm clock. I theorize that alarms + and caffeine may distort my reality. An excuse to sleep in? Twist my arm... +- Waking Up with Sam Harris: Thankfully, Waking Up supports web browsers, so + this was easy to replace. +- Banking with Monzo: Monzo has a web client for doing simple banking tasks. I + needed to internationally transfer GBP to my USD account. +- Spotify: I either read while taking public transport, attempted to briefly + meditate, or (most commonly) started blankly. +- Taking notes +- Timers +- Google Calendar for meeting room information + +Things that I did miss: +- Phone calls: My birthday is March 5, and I wanted to talk to my family then + since I'm currently living abroad in London; I'm originally from a suburb + outside of Washington D.C. + +Things that I thought I would miss but I didn't miss: +- Email: I prefer checking my emails minimally anyhow. +- Text messaging: Maybe I enjoyed this because I knew the whole time it was + temporary. I'm unsure if I'd feel this way if it was permanent. + +Exploits +- Telegram native client +- Instagram's web client + +### What was bad? + +Not much. + +### Will I use a cell phone in April? + +Probably. I think this exercise removed some of the long-standing barnacles, but +some of the old habits and triggers exist. Also with web browser and native +client alternatives to mobile apps, the partial digital detox felt even more +partial. + +[pod]: https://www.goodreads.com/book/show/12609433-the-power-of-habit +[exp-exp]: https://en.wikipedia.org/wiki/Multi-armed_bandit +[algos]: https://www.goodreads.com/book/show/25666050-algorithms-to-live-by diff --git a/website/blog/content/english/lets-learn-nix-caching.md b/website/blog/content/english/lets-learn-nix-caching.md new file mode 100644 index 000000000000..a436d4de25eb --- /dev/null +++ b/website/blog/content/english/lets-learn-nix-caching.md @@ -0,0 +1,49 @@ +--- +title: "Lets Learn Nix Caching" +date: 2020-03-17T18:05:38Z +draft: true +--- + +## TL;DR + +1. I use `NixOS/nixpkgs-channels` instead of `NixOS/nixpkgs` and avoid + `nix-channel`. + +## More information + +- By default the Nix package manager uses cache.nixos.org as a binary cache. +- Visit status.nixos.org +- `git clone git@github.com:NixOS/nixpkgs-channels` instead of + `NixOS/nixpkgs`. The former mirrors the latter and uses Git branches to track + the published channels. + +## What is a Nix channel + +If you run... + +```shell +$ git clone git@github.com:NixOS/nixpkgs ~/nixpkgs +$ export NIX_PATH="nixpkgs=$(realpath ~/nixpkgs)" +``` + +One benefit to cloning nixpkgs is that you can browse the source code on your +machine using tools like `git` and `emacs`. You can also experimentally patch +and test Nix code this way. + +If any of the above appeals to you, clone `nixpkgs-channels` instead. + +The Nix maintainers build and test the commits from `nixpkgs` using Hydra. Tests +include reproducibility tests, etc. + +Various channels have different verification phases. + +The cache at cache.nixos.org is populate the cache at cache.nixos.org. + +You want to increase the likelihood that you are hitting this cache. For +example, `google-chrome` takes hours to build. + +## What is a binary cache? + +## What is Hydra (Nix CI)? + +## What is Cachix? diff --git a/website/blog/content/english/lets-learn-nix-determinism-vs-reproducibility.md b/website/blog/content/english/lets-learn-nix-determinism-vs-reproducibility.md new file mode 100644 index 000000000000..2e12a6b06fcc --- /dev/null +++ b/website/blog/content/english/lets-learn-nix-determinism-vs-reproducibility.md @@ -0,0 +1,121 @@ +--- +title: "Lets Learn Nix: Reproducibility" +date: 2020-03-17T12:06:47Z +draft: true +--- + +I am dedicating this page to defining and disambiguating some terminology. I +think it is important to use these terms precisely, so it may be worthwhile to +memorize these definitions and ensure that you are clarifying the discourse +rather than muddying it. + +## Terms + +- repeatable build: +- reproducible build: +- deterministic build: +- pure function: +- impure function: +- idempotent function: + +TODO(wpcarro): Consistently and deliberately use reproducible and +deterministic. + +## Repeatable vs. Reproducible + +Is NixOS reproducible? Visit [@grhmc][who-grhmc]'s website, +[r13y.com](https://r13y.com), to find out. + +At the time of this writing, 1519 of 1568 (i.e. 96.9%) of the paths in the +`nixos.iso_minimal.x86_64-linux` installation image are reproducible. + +## What hinders reproducibility? + +Timestamps. + +If package A encodes a timestamp into its build artifact, then we can +demonstrate that package A is *not reproducible* simply by building it at two +different times and doing a byte-for-byte comparison of the build artifacts. + +## Does Nix protect developers against non-determinism + +Yes. But not entirely. How? + +## Deterministic Nix derivation + +```nix +{ pkgs ? import <nixpkgs> {}, ... }: + +with pkgs; + +stdenv.mkDerivation { + name = "reproducible"; + phases = [ "buildPhase" ]; + buildPhase = "echo reproducible >$out"; +} +``` + +## Non-deterministic Nix derivation + +We can introduce some non-determinism into our build using the `date` function. + +```nix +# file: /tmp/test.nix +{ pkgs ? import <nixpkgs> {}, ... }: + +with pkgs; + +stdenv.mkDerivation { + name = "non-reproducible"; + phases = [ "buildPhase" ]; + buildPhase = "date >$out"; +} +``` + +Then run... + +```shell +$ nix-build /tmp/test.nix +$ nix-build /tmp/test.nix --check --keep-failed +``` + +## How do you test reproducibility? + +We can use `cmp` to compare files byte-for-byte. The following comparison should +fail: + +```shell +$ echo foo >/tmp/a +$ echo bar >/tmp/b +$ cmp --silent /tmp/{a,b} +$ echo $? +``` + +And the following comparison should succeed: + +```shell +$ echo hello >/tmp/a +$ echo hello >/tmp/b +$ cmp --silent /tmp/{a,b} +$ echo $? +``` + +## Reproducible vs. deterministic + +Reproducible builds *are* deterministic builds and deterministic build + +## Deterministic, Reproducible, Pure, Idempotent, oh my + +- A pure function has no side-effects. + +- An idempotent function can be executed more than once with the same arguments + without altering the side-effects. + +- A deterministic function ensures that + +## Deterministic vs. Reproducible + +I can check if a build is reproducible using [these tools][wtf-repro-tools]. + +[wtf-repro-tools]: https://reproducible-builds.org/tools/ +[who-grhmc]: https://twitter.com/grhmc diff --git a/website/blog/content/english/lets-learn-nix-dotfiles.md b/website/blog/content/english/lets-learn-nix-dotfiles.md new file mode 100644 index 000000000000..084fb19e4406 --- /dev/null +++ b/website/blog/content/english/lets-learn-nix-dotfiles.md @@ -0,0 +1,401 @@ +--- +title: "Let's Learn Nix: Dotfiles" +date: 2020-03-13T22:23:02Z +draft: true +--- + +## Let's Learn Nix: Dotfiles + +### Dependencies + +Speaking of dependencies, here's what you should know before reading this tutorial. + +- Basic Nix syntax: Nix 1p + +What version of Nix are we using? What version of `<nixpkgs>` are we using? What +operating system are we using? So many variables... + +Cartesian product of all possibilities... + +TODO(wpcarro): Create a graphic of the options. + +### The problems of dotfiles + +How do you manage your dependencies? + +You can use `stow` to install the dotfiles. + +### home-manager + +What we are going to write is most likely less preferable to the following +alternatives: +- using Nix home-manager +- committing your `.gitconfig` into your + +In the next tutorial, we will use [home-manager][wtf-home-mgr] to replace the +functionality that we wrote. + +So why bother completing this? + +### Let's begin + +Welcome to the first tutorial in the [Let's Learn Nix][wtf-lln] series. Today we +are going to create a Nix derivation for one of your dotfiles. + +"Dotfiles" refers to a user's collection of configuration files. Typically these +files look like: +- `.vimrc` +- `.xsessionrc` +- `.bashrc` + +The leading "dot" at the beginning gives dotfiles their name. + +You probably have amassed a collection of dotfiles whether or not you are +aware. For example, if you use [git][wtf-git], the file `~/.gitconfig` should +exist on your machine. You can verify this with: + +```shell +$ stat ~/.gitconfig +``` + +When I was first learning `git`, I learned to configure it using commands I +found in books and tutorials that often looked like: + +```shell +$ git config user.email +``` + +The `~/.gitconfig` file on your machine may look something like this: + +```.gitconfig +[user] + name = John Cleese + email = john@flying-circus.com + username = jcleese +[core] + editor = emacs +[web] + browser = google-chrome +[rerere] + enabled = 1 + autoupdate = 1 +[push] + default = matching +[color] + ui = auto +[alias] + a = add --all + ai = add -i + b = branch + cl = clone + cp = cherry-pick + d = diff + fo = fetch origin + lg = log --oneline --graph --decorate + ps = push + pb = pull --rebase + s = status +``` + +As I ran increasingly more `git config` commands to configure my `git` +preferences, the size of my `.gitconfig` increased, and the less likely I was to +remember which options I set to which values. + +Thankfully a coworker at the time, Ryan ([@rschmukler][who-ryan]), told me that +he version-controlled his `.gitconfig` file along with his other configuration +files (e.g. `.vimrc`) in a repository he called "dotfiles". + +Version-controlling your dotfiles improves upon a workflow where you have a +variety of configuration files scattered around your machine. + +If you look at the above `.gitconfig`, can you spot the dependencies? + +We explicitly depend `emacs` and `google-chrome`. We also *implicitly* depend on +`git`: there is not much value of having a `.gitconfig` file if you also do not +have `git` installed on your machine. + +Dependencies: +- `emacs` +- `google-chrome` + +Let's use Nix to generate this `.gitconfig` file. Here is what I would like our +API to be: + +Let's create a file `gitconfig.nix` and build our function section-by-section: + +TODO(wpcarro): Link to sections here +- options.user +- options.core +- options.web +- options.rerere +- options.push +- options.color +- options.alias + +```shell +$ touch gitconfig.nix +``` + +### options.user + +```haskell +AttrSet -> String +``` + +```nix +user = { + name = "John Cleese"; + email = "john@flying-circus.com"; + username = "jcleese"; +}; +``` + +```.gitconfig +[user] + name = John Cleese + email = john@flying-circus.com + username = jcleese +``` + +### options.core + +```nix +core = { + editor = "${pkgs.emacs}/bin/emacs"; +}; +``` + +```.gitconfig +[core] + editor = /nix/store/<hash>-emacs-<version>/bin/emacs +``` + +### options.web + +```nix +web.browser = "${pkgs.google-chrome}/bin/google-chrome"; +``` + +```.gitconfig +[web] + browser = /nix/store/<hash>-google-chrome-<version>/bin/google-chrome +``` + +### options.rerere + +```nix +rerere = { + enabled = true; + autoupdate = true; +}; +``` + +```.gitconfig +[rerere] + enabled = 1 + autoupdate = 1 +``` + +### options.push + +```nix +push.default = "matching"; +``` + +```.gitconfig +[push] + default = matching +``` + +### options.color + +```nix +color.ui = "auto"; +``` + +```.gitconfig +[color] + ui = auto +``` + +We need to define a function named `gitconfig` that creates a Nix [derivation][wtf-derivation]: + +```nix +# file: gitconfig.nix +let + # Import the <nixpkgs> package repository. + pkgs = import <nixpkgs> {}; + + # Stringify the attribute set, `xs`, as a multilined string formatted as "<key> = <value>". + # See attrsets.nix for more functions that work with attribute sets. + encodeAttrSet = xs: lib.concatStringsSep "\n" (lib.mapAttrsToList (k: v: "${k} = ${v}") xs); + + # Define out function name `gitconfig` that accepts an `options` argument. + gitconfig = options: pkgs.stdenv.mkDerivation { + # The gitconfig file that Nix builds will be located /nix/store/some-hash-gitconfig. + name = "gitconfig"; + src = pkgs.writeTextFile ".gitconfig" '' + [user] + name = ${options.user.name} + email = ${options.user.email} + username = ${options.user.username} + [core] + editor = ${options.core.editor} + [web] + editor = ${options.web.browser} + [rerere] + enabled = ${if options.rerere.enabled "1" else "0"} + autoupdate = ${if options.rerere.autoupdate "1" else "0"} + [push] + default = ${options.push.default} + [color] + ui = ${options.color.ui} + [alias] + ${encodeAttrSet options.aliases} + ''; + buildPhase = '' + ${pkgs.coreutils}/bin/cp $src $out + ''; + installPhase = '' + ${pkgs.coreutils}/bin/ln -s $out ~/.gitconfig + ''; + }; +} in gitconfig { + user = { + name = "John Cleese"; + email = "john@flying-circus.com"; + username = "jcleese"; + }; + core = { + editor = "${pkgs.emacs}/bin/emacs"; + }; + web.browser = "${pkgs.google-chrome}/bin/google-chrome"; + rerere = { + enabled = true; + autoupdate = true; + }; + push.default = "matching"; + color.ui = "auto"; + aliases = { + a = "add --all"; + ai = "add -i"; + b = "branch"; + cl = "clone"; + cp = "cherry-pick"; + d = "diff"; + fo = "fetch origin"; + lg = "log --oneline --graph --decorate"; + ps = "push"; + pb = "pull --rebase"; + s = "status"; + }; +} +``` + +### options.alias + +We want to write a function that accepts an attribute set and returns a +string. While Nix is a dynamically typed programming language, thinking in types +helps me clarify what I'm trying to write. + +```haskell +encodeAttrSet :: AttrSet -> String +``` + +I prefer using a Haskell-inspired syntax for describing type signatures. Even if +you haven't written Haskell before, you may find the syntax intuitive. + +Here is a non comprehensive, but demonstrative list of example type signatures: +- `[String]`: A list of strings (i.e. `[ "cogito" "ergo" "sum" ]`) +- `AttrSet`: A nix attribute set (i.e. `{ name = "John Cleese"; age = 80; }`). +- `add :: Integer -> Integer -> Integer`: A function named `add` that accepts + two integers and returns an integer. + +Specifically, we want to make sure that when we call: + +```nix +encodeAttrSet { + a = "add --all"; + b = "branch"; +} +``` + +...it returns a string that looks like this: + +```.gitconfig +a = "add --all" +b = "branch" +``` + + +TODO(wpcarro): @tazjin's nix-1p mentions this. Link to it. +Nix has useful functions scattered all over the place: +- `lib.nix` +- `list.nix` +- `lib.attrSet` + +But I cannot recall exactly which functions we will need to write +`encodeAttrSet`. In these cases, I do the following: +1. Run `nix repl`. +2. Browse the Nix source code. + +Google "nix attribute sets" and find the Github link to `attrsets.nix`. + +You should consider repeating this search but instead of searching for +"attribute sets" search for "lists" and "strings". That is how I found the +functions needed to write `encodeAttrSet`. Let's return to our `nix repl`. + +Load the nixpkgs set: + +```nix +nix-repl> :l <nixpkgs> +Added 11484 variables. +``` + +Define a test input called `attrs`: + +```nix +nix-repl> attrs = { fname = "John"; lname = "Cleese"; } +``` + +Map the attribute set into `[String]` using `lib.mapAttrsToList`: + +```nix +nix-repl> lib.mapAttrsToList (k: v: "${k} = ${toString v}") attrs +[ "fname = John" "lname = Cleese" ] +``` + +Now join the `[String]` together using `lib.concatStringsSep`: + +```nix +nix-repl> lib.concatStringsSep "\n" (lib.mapAttrsToList (k: v: "${k} = ${v}") attrs) +"fname = John\nlname = Cleese" +``` + +Now let's use this to define our function `encodeAttrSet`: + +```nix +# file: gitconfig.nix +encodeAttrSet = xs: lib.concatStringsSep "\n" (lib.mapAttrsToList (k: v: "${k} = ${v}") xs); +``` + +### Using nixpkgs search + +[Nixpkgs search][wtf-nixpkgs-search]. + +### Conclusion + +We learned how to help ourselves. + +- Where does `emacs` exist? What about `google-chrome`? [nixpkgs search][wtf-nixpkgs-search] +- Verify that I have it? [nix REPL][using-nix-repl] + +We used Nix to create our first derivation. + +[wtf-lln]: /lets-learn-nix +[wtf-git]: https://git-scm.com/ +[wtf-derivation]: https://nixos.org/nixos/nix-pills/our-first-derivation.html +[wtf-nixpkgs-search]: https://nixos.org/nixos/packages.html?channel=nixos-19.09 +[using-nix-repl]: /using-the-nix-repl +[wtf-home-mgr]: https://github.com/rycee/home-manager +[who-ryan]: https://twitter.com/rschmukler diff --git a/website/blog/content/english/lets-learn-nix-tutorial-reproducibility.md b/website/blog/content/english/lets-learn-nix-tutorial-reproducibility.md new file mode 100644 index 000000000000..c80892164dbe --- /dev/null +++ b/website/blog/content/english/lets-learn-nix-tutorial-reproducibility.md @@ -0,0 +1,41 @@ +--- +title: "Lets Learn Nix: Tutorial Reproducibility" +date: 2020-03-17T18:34:58Z +draft: true +--- + +## Install Nix + +Link to nixos page. + +## The rest + +Start with this... + +```shell +$ mkdir ~/lets-learn-nix +$ cd ~/lets-learn-nix +``` + +...done. Copy the following and paste it into a file name `shell.nix`. + +```nix +# file: shell.nix +let + pkgs = import (builtins.fetchGit { + url = "https://github.com/NixOS/nixpkgs-channels"; + ref = "refs/heads/nixos-19.09"; + }) {} +in pkgs.mkShell { + buildInputs = with pkgs; [ + git + ]; + NIX_PATH = "nixpkgs=${pkgs}"; +}; +``` + +...then... + +```shell +$ nix-shell +``` diff --git a/website/blog/content/english/lets-learn-nix.md b/website/blog/content/english/lets-learn-nix.md new file mode 100644 index 000000000000..a7c9a22e422e --- /dev/null +++ b/website/blog/content/english/lets-learn-nix.md @@ -0,0 +1,58 @@ +--- +title: "Lets Learn Nix" +date: 2020-03-13T21:50:47Z +draft: false +--- + +## Background + +[Nix][wtf-nix] may be the most useful tool that I use. I consider it as valuable +as [Git][wtf-git] or [Emacs][wtf-emacs]. My friend, David ([@dmjio][who-dmjio]), +first introduced me to Nix when we worked together at a Haskell startup in +NYC. Before this, I had been managing my system configuration using software +that I wrote -- first in Bash, then in Python, then in Golang. + +It took me awhile to understand Nix. I left the NYC startup, joined Google, and +relocated to London. Here I met another Nix-enlightened monk, Vincent +([@tazjin][who-tazjin]), who patiently taught me enough Nix to become +self-reliant and productive. + +Many resources exist to learn Nix; the Nix community on IRC continues to help me +and others effectively use Nix. I'm creating this series to write the tutorials +that I would have found useful when I started learning Nix. If you are just +beginning your Nix journey, I hope these tutorials help you. + +## Goals + +I aim to make each tutorial in the "Let's Learn Nix" series: +- Actionable: Readers will be writing code. +- Digestible: Readers should be able to finish each tutorial in fifteen minutes. +- Reproducible: Readers should expect the output of their code to match what + these tutorials claim they should see. + +## About the author + +My name is William ([@wpcarro][who-wpcarro]). My three favorite tools are Git, +Emacs, and Nix. I am an American expat currently working at Google in +London. While during the day I primarily write Java, Python, and TypeScript, I +prefer functional programming. I use Nix to deploy software and manage the +multiple machines across which I work. + +## Let's Begin + +Before we get started, Nix is a programming language. To familiarize yourself +with the syntax, semantics, and idioms, consider reading this brief [Nix One +Pager][nix-1p]. I recommend keeping it around as a reference. + +When I was first learning Nix, I wanted to use it to manage my dotfiles. Our +first tutorial will help you get started: [Let's Learn Nix: +Dotfiles][lln-dotfiles] + +[wtf-nix]: https://nixos.org +[wtf-git]: https://git-scm.com +[wtf-emacs]: https://www.gnu.org/software/emacs +[who-dmjio]: https://twitter.com/dmjio +[who-tazjin]: https://twitter.com/tazjin +[who-wpcarro]: https://twitter.com/wpcarro +[lln-dotfiles]: /lets-learn-nix-dotfiles +[nix-1p]: https://github.com/tazjin/nix-1p diff --git a/website/blog/content/english/nix-and-hugo.md b/website/blog/content/english/nix-and-hugo.md new file mode 100644 index 000000000000..ff0fe70205da --- /dev/null +++ b/website/blog/content/english/nix-and-hugo.md @@ -0,0 +1,5 @@ +--- +title: "Deploy Hugo blog with Nix" +date: 2020-03-11T18:42:32Z +draft: true +--- diff --git a/website/blog/content/english/self-hosting.md b/website/blog/content/english/self-hosting.md new file mode 100644 index 000000000000..1705541d820c --- /dev/null +++ b/website/blog/content/english/self-hosting.md @@ -0,0 +1,6 @@ +--- +title: "Self Hosting" +date: 2020-03-11T22:53:56Z +draft: true +--- + diff --git a/website/blog/default.nix b/website/blog/default.nix new file mode 100644 index 000000000000..437f5cc108d7 --- /dev/null +++ b/website/blog/default.nix @@ -0,0 +1,12 @@ +{ pkgs, ... }: + +pkgs.stdenv.mkDerivation { + name = "blog.wpcarro.dev"; + buildInputs = with pkgs; [ hugo ]; + src = ./.; + buildPhase = '' + mkdir -p $out + ${pkgs.hugo}/bin/hugo --minify --destination $out + ''; + dontInstall = true; +} diff --git a/website/blog/shell.nix b/website/blog/shell.nix new file mode 100644 index 000000000000..d1b4f49942bc --- /dev/null +++ b/website/blog/shell.nix @@ -0,0 +1,8 @@ +let + pkgs = import <nixpkgs> {}; +in +pkgs.mkShell { + buildInputs = with pkgs; [ + hugo + ]; +} diff --git a/website/blog/themes/tailwind/.gitignore b/website/blog/themes/tailwind/.gitignore new file mode 100644 index 000000000000..eb1a2c123ccc --- /dev/null +++ b/website/blog/themes/tailwind/.gitignore @@ -0,0 +1,5 @@ +.vscode/ + +node_modules +public/build +yarn.lock diff --git a/website/blog/themes/tailwind/archetypes/default.md b/website/blog/themes/tailwind/archetypes/default.md new file mode 100644 index 000000000000..f7e5e03d9ebd --- /dev/null +++ b/website/blog/themes/tailwind/archetypes/default.md @@ -0,0 +1,7 @@ +--- +title: "{{ replace .Name "-" " " | title }}" +description: "" +date: {{ .Date }} +draft: true +tags: [] +--- diff --git a/website/blog/themes/tailwind/i18n/en.yaml b/website/blog/themes/tailwind/i18n/en.yaml new file mode 100644 index 000000000000..8326be14acf4 --- /dev/null +++ b/website/blog/themes/tailwind/i18n/en.yaml @@ -0,0 +1,5 @@ +- id: back_home + translation: "Back Home" + +- id: not_found_page_title + translation: "Whoops! The page you're looking for doesn't exist :(" diff --git a/website/blog/themes/tailwind/images/screenshot.png b/website/blog/themes/tailwind/images/screenshot.png new file mode 100644 index 000000000000..3ca0b46b2d2b --- /dev/null +++ b/website/blog/themes/tailwind/images/screenshot.png Binary files differdiff --git a/website/blog/themes/tailwind/images/tn.png b/website/blog/themes/tailwind/images/tn.png new file mode 100644 index 000000000000..785504cd0176 --- /dev/null +++ b/website/blog/themes/tailwind/images/tn.png Binary files differdiff --git a/website/blog/themes/tailwind/layouts/404.html b/website/blog/themes/tailwind/layouts/404.html new file mode 100644 index 000000000000..afa69fec743e --- /dev/null +++ b/website/blog/themes/tailwind/layouts/404.html @@ -0,0 +1,12 @@ +{{ define "heading"}} +<div> + <a class="text-lg mb-8 inline-block" href="{{ .Site.BaseURL | relLangURL }}">← {{ i18n "back_home" }}</a> + <h1 class="text-4xl font-bold">{{ i18n "not_found_page_title" }}</h1> +</div> +{{ end }} + +{{ define "content" }} +<section class="mb-24"> + <img src="{{ "images/404-background.png" | relURL }}" alt="Page Not Found"> +</section> +{{ end }} diff --git a/website/blog/themes/tailwind/layouts/_default/baseof.html b/website/blog/themes/tailwind/layouts/_default/baseof.html new file mode 100644 index 000000000000..2cc783dae038 --- /dev/null +++ b/website/blog/themes/tailwind/layouts/_default/baseof.html @@ -0,0 +1,87 @@ +<!doctype html> +<html lang="{{ .Site.Params.LanguageCode }}"> + +<head> + <meta charset="utf-8"> + {{ hugo.Generator }} + + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> + + <!-- Twitter Card --> + <meta name="twitter:card" content="summary"> + <meta name="twitter:title" content="{{ if .IsHome }}{{ .Site.Title }}{{ else }}{{ .Title }} - {{ .Site.Title }}{{ end }}"> + <meta name="twitter:description" content="{{ if .IsHome }}{{ .Site.Params.description }}{{ else }}{{ .Summary | plainify }}{{ end }}"> + <meta name="twitter:site" content="{{ .Site.BaseURL }}"> + <meta name="twitter:creator" content="{{ .Params.Author }}"> + <meta name="twitter:image" content="{{ .Site.Params.Avatar | absURL }}"> + + <!-- Open-Graph Data --> + <meta property="og:locale" content="{{ .Site.Params.LanguageCode }}"> + <meta property="og:type" content="{{ if .IsHome }}website{{ else }}article{{ end }}"> + <meta property="og:title" content="{{ if .IsHome }}{{ .Site.Title }}{{ else }}{{ .Title }} - {{ .Site.Title }}{{ end }}"> + <meta property="og:description" content="{{ if .IsHome }}{{ .Site.Params.description }}{{ else }}{{ .Summary | plainify }}{{ end }}"> + <meta property="og:url" content="{{ .Permalink }}"> + <meta property="og:site_name" content="{{ .Site.Title }}"> + <meta property="og:image" content="{{ .Site.Params.Avatar | absURL }}"> + + <title>{{ if .IsHome }}{{ .Site.Title }}{{ else }}{{ .Title }} - {{ .Site.Title }}{{ end }}</title> + + <meta name="author" content="{{ .Site.Params.Author }}"> + <meta name="description" content="{{ if .IsHome }}{{ .Site.Params.description }}{{ else }}{{ .Summary | plainify }}{{ end }}"> + + <!-- RSS --> + {{ with .OutputFormats.Get "RSS" }} + <link rel="alternate" href="{{ .RelPermalink | absURL }}" type="application/rss+xml" title="{{ $.Site.Title }}"> + {{ end }} + + <!-- Translations --> + {{ if .IsTranslated }} + {{ range .Translations }} + <link rel="alternate" hreflang="{{ .Language.Lang }}" href="{{ .Permalink }}" title="{{ .Site.Title }}"> + {{ end }} + {{ end }} + + <!-- Stylesheets --> + <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Code+Pro|Arvo:400,700"> + <link rel="stylesheet" href="{{ "css/theme.css" | absURL }}"> + <link rel="stylesheet" href="{{ "css/chroma.dracula.css" | absURL }}"> +</head> +<body class="font-serif border-t-4 border-blue-500 antialiased"> + <div class="w-full p-6 md:w-2/3 md:px-0 md:mx-auto xl:w-2/5"> + <header class="mb-6"> + <!-- All the pages must have a heading block, defaults to a link for the home page and a title. --> + <div class="mb-6 md:flex md:items-center"> + {{ block "heading" . }} + <div> + {{ partial "back-home.html" . }} + <h1 class="text-4xl font-bold">{{ .Title }}</h1> + </div> + {{ end }} + </div> + + <!-- If the blog has translation, they shoul be displayed here. --> + {{ if .IsTranslated }} + <nav> + {{ range $i, $lang := .Translations }} + {{ if $i }}/{{ end }} + <a href="{{ .Permalink }}">{{ $lang.Language.LanguageName }}</a> + {{ end}} + </nav> + {{ end }} + </header> + + <!-- The content block. --> + {{ block "content" . }}{{ end }} + + <footer> + <p> + © {{ now.Format "2006"}}. Thank you for reading. + </p> + </footer> + </div> + + {{ template "_internal/google_analytics.html" . }} + <script data-ad-client="ca-pub-6018268443649487" async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> +</body> +</html> diff --git a/website/blog/themes/tailwind/layouts/_default/list.html b/website/blog/themes/tailwind/layouts/_default/list.html new file mode 100644 index 000000000000..d781ce752a4a --- /dev/null +++ b/website/blog/themes/tailwind/layouts/_default/list.html @@ -0,0 +1,7 @@ +{{ define "content" }} +<section class="mb-24"> + {{ range site.RegularPages.GroupByDate "2006" -}} + {{ partial "posts.html" . }} + {{ end }} +</section> +{{ end }} diff --git a/website/blog/themes/tailwind/layouts/_default/single.html b/website/blog/themes/tailwind/layouts/_default/single.html new file mode 100644 index 000000000000..e4485f324e9c --- /dev/null +++ b/website/blog/themes/tailwind/layouts/_default/single.html @@ -0,0 +1,28 @@ +{{ define "heading" }} +<div> + {{ partial "back-home.html" . }} + + <!-- Title and Publication Date --> + <h1 class="text-4xl font-bold">{{ .Title }}</h1> + <time datetime="{{ .Date.Format "2006-01-02 15:04:05 MST" }}">{{ .Date.Format "02 Jan 2006" }}</time> + + <!-- Tags --> + {{ with .Params.tags }} + <ol class="mt-4"> + {{ range . }} + <li class="inline-block"> + <a class="border-none text-gray-800 text-xs bg-gray-400 hover:bg-gray-600 hover:text-white rounded-sm px-3 py-1" href="{{ "tags" | absURL }}/{{ . | urlize }}">{{ . }}</a> + </li> + {{ end }} + </ol> + {{ end }} +</div> +{{ end }} + +{{ define "content" }} +<article class="mb-12"> + {{ .Content }} + + {{ template "_internal/disqus.html" . }} +</article> +{{ end }} diff --git a/website/blog/themes/tailwind/layouts/index.html b/website/blog/themes/tailwind/layouts/index.html new file mode 100644 index 000000000000..4869c466b613 --- /dev/null +++ b/website/blog/themes/tailwind/layouts/index.html @@ -0,0 +1,18 @@ +{{ define "heading" }} +{{ if .Site.Params.Avatar }} +<img class="hidden md:block w-20 rounded-full mr-6" src="{{ .Site.Params.Avatar | absURL }}" alt="{{ .Site.Params.Author }}"> +{{ end }} + +<div> + <h1 class="text-4xl font-bold">{{ .Site.Title }}</h1> + <p>{{ .Site.Params.tagline }}</p> +</div> +{{ end }} + +{{ define "content" }} +<section class="mb-24"> + {{ range site.RegularPages.GroupByDate "2006" -}} + {{ partial "posts.html" . }} + {{ end }} +</section> +{{ end }} diff --git a/website/blog/themes/tailwind/layouts/partials/back-home.html b/website/blog/themes/tailwind/layouts/partials/back-home.html new file mode 100644 index 000000000000..4064d5256137 --- /dev/null +++ b/website/blog/themes/tailwind/layouts/partials/back-home.html @@ -0,0 +1 @@ +<a class="text-lg mb-8 inline-block" href="{{ .Site.BaseURL | relLangURL }}">← {{ i18n "back_home" }}</a> diff --git a/website/blog/themes/tailwind/layouts/partials/posts.html b/website/blog/themes/tailwind/layouts/partials/posts.html new file mode 100644 index 000000000000..0ebd4ca7e9b4 --- /dev/null +++ b/website/blog/themes/tailwind/layouts/partials/posts.html @@ -0,0 +1,12 @@ +<div> + <h2 class="text-3xl font-bold mb-2">{{ .Key }}</h2> + + <ol> + {{ range .Pages -}} + <li class="mb-6 md:flex md:flex-row"> + <time class=" block md:flex-l-24" datetime="{{ .Date.Format "2006-01-02 15:04:05 MST" }}">{{ .Date.Format "Jan 02"}}</time> + <a class="text-lg md:ml-12" href="{{ .RelPermalink }}">{{ .Title }}</a> + </li> + {{- end }} + </ol> +</div> diff --git a/website/blog/themes/tailwind/layouts/taxonomy/terms.html b/website/blog/themes/tailwind/layouts/taxonomy/terms.html new file mode 100644 index 000000000000..76da49ed0a09 --- /dev/null +++ b/website/blog/themes/tailwind/layouts/taxonomy/terms.html @@ -0,0 +1,13 @@ +{{ define "content" }} +<section class="mb-24"> + <ol class="-mx-2"> + {{ range .Pages -}} + <li class="inline-block mx-2 my-2"> + <a class="border-none text-gray-800 bg-gray-400 hover:bg-gray-600 hover:text-white rounded-sm px-3 py-1" href="{{ .RelPermalink }}"> + {{ .Title }} + </a> + </li> + {{- end }} + </ol> +</section> +{{ end }} diff --git a/website/blog/themes/tailwind/license.md b/website/blog/themes/tailwind/license.md new file mode 100644 index 000000000000..196326bb0e7e --- /dev/null +++ b/website/blog/themes/tailwind/license.md @@ -0,0 +1,7 @@ +Copyright 2019 Ian Rodrigues. + +Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. diff --git a/website/blog/themes/tailwind/package.json b/website/blog/themes/tailwind/package.json new file mode 100644 index 000000000000..86bb50f9490a --- /dev/null +++ b/website/blog/themes/tailwind/package.json @@ -0,0 +1,17 @@ +{ + "scripts": { + "watch": "cross-env NODE_ENV=development postcss scss/theme.scss -o static/css/theme.css --watch", + "build": "cross-env NODE_ENV=production postcss scss/theme.scss -o static/css/theme.css" + }, + "dependencies": { + "autoprefixer": "^9.5.1", + "tailwindcss": "^1.0" + }, + "devDependencies": { + "@fullhuman/postcss-purgecss": "^1.2.0", + "concurrently": "^4.1.0", + "cross-env": "^5.2.0", + "cssnano": "^4.1.10", + "postcss-cli": "^6.1.2" + } +} diff --git a/website/blog/themes/tailwind/postcss.config.js b/website/blog/themes/tailwind/postcss.config.js new file mode 100644 index 000000000000..6efcb774fa7c --- /dev/null +++ b/website/blog/themes/tailwind/postcss.config.js @@ -0,0 +1,14 @@ +const purgecss = require('@fullhuman/postcss-purgecss')({ + content: ['./layouts/**/*.html'], + defaultExtractor: content => content.match(/[A-Za-z0-9-_:/]+/g) || [] +}) + +module.exports = { + plugins: [ + require('tailwindcss'), + require('autoprefixer'), + ...process.env.NODE_ENV === 'production' + ? [purgecss, require('cssnano')] + : [] + ] +} diff --git a/website/blog/themes/tailwind/readme.md b/website/blog/themes/tailwind/readme.md new file mode 100644 index 000000000000..cdb69a619730 --- /dev/null +++ b/website/blog/themes/tailwind/readme.md @@ -0,0 +1,62 @@ +# TailwindCSS Journal + +_TailwindCSS Journal_ is a minimalist theme for [Hugo](https://gohugo.io) using [TailwindCSS](https://tailwindcss.com). + +Based on [Journal](https://dashdashzako.github.io/hugo-journal-demo/), it also focuses on improving reading experience with no fancy effect. + +It uses [Chroma](https://gohugo.io/content-management/syntax-highlighting/) for the syntaxic coloration of code snippets. + +Demo is available [here](https://ianrodrigues.github.io/hugo-tailwind-journal-demo/). + +## Installation + +Please refer to the [Hugo documentation](https://gohugo.io/themes/installing/). + +## Configuration + +A few parameters should be adjusted in the site config: + +```toml +baseURL = "https://username.github.io/" +disqusShortname = "username" +googleAnalytics = "UA-XXXXXXXXX-X" +title = "Tailwind Journal" +theme = "hugo-tailwind-journal" +pygmentsCodeFences = true +pygmentsUseClasses = true + +[taxonomies] + tag = "tags" + +[permalinks] + posts = "/posts/:year/:month/:title/" + +[params] + author = "John Doe" + avatar = "images/avatar.jpg" + description = "A minimalist journal template for Hugo using TailwindCSS." + tagline = "A minimalist journal template for Hugo using TailwindCSS." + +[languages] + [languages.en] + contentDir = "content/english" + languageCode = "en-us" + languageName = "🇺🇸 English" + weight = 1 + + [languages.pt-br] + contentDir = "content/portuguese" + description = "Um template minimalista para Hugo usando TailwindCSS." + languageCode = "pt-br" + languageName = "🇧🇷 Português" + tagline = "Um template minimalista para Hugo usando TailwindCSS." + weight = 2 + + [languages.de] + contentDir = "content/german" + description = "Eine minimalistische Journalvorlage für Hugo mit TailwindCSS." + languageCode = "de" + languageName = "🇩🇪 Deutsch" + tagline = "Eine minimalistische Journalvorlage für Hugo mit TailwindCSS." + weight = 3 +``` diff --git a/website/blog/themes/tailwind/scss/theme.scss b/website/blog/themes/tailwind/scss/theme.scss new file mode 100644 index 000000000000..9da9261b63a1 --- /dev/null +++ b/website/blog/themes/tailwind/scss/theme.scss @@ -0,0 +1,51 @@ +@tailwind base; +@tailwind components; +@tailwind utilities; + +body { + @apply text-gray-800; +} + +h1, h2, h3, h4, h5, h6, strong { + @apply text-gray-900; +} + +article > p, ul, ol { + @apply text-lg tracking-wide; +} + +article > div, p, ul, ol, pre:not(:last-child) { + @apply mb-6; +} + +article > ol, ul { + @apply list-disc ml-8; +} + +article > li:not(:last-of-type) { + @apply mb-2; +} + +article p > code { + @apply p-1/2 bg-gray-400; +} + +article > h2 { + @apply text-2xl my-8 font-bold text-black; +} + +a { + @apply border-b border-black text-black; +} + +/* purgecss ignore */ +pre.chroma { + @apply p-4 overflow-x-auto font-mono text-lg; +} + +@screen md { + /* purgecss ignore */ + div.highlight { + @apply -mx-12; + } +} diff --git a/website/blog/themes/tailwind/static/css/chroma.dracula.css b/website/blog/themes/tailwind/static/css/chroma.dracula.css new file mode 100644 index 000000000000..5e903f4fd7bc --- /dev/null +++ b/website/blog/themes/tailwind/static/css/chroma.dracula.css @@ -0,0 +1 @@ +.chroma{color:#f8f8f2;background-color:#282a36}.chroma .lntd{vertical-align:top;padding:0;margin:0;border:0}.chroma .lntable{border-spacing:0;padding:0;margin:0;border:0;width:auto;overflow:auto;display:block}.chroma .hl{display:block;width:100%;background-color:#ffc}.chroma .lnt{margin-right:.4em;padding:0 .4em 0 .4em;color:#7f7f7f}.chroma .ln{margin-right:.4em;padding:0 .4em 0 .4em;color:#7f7f7f}.chroma .k{color:#ff79c6}.chroma .kc{color:#ff79c6}.chroma .kd{color:#8be9fd;font-style:italic}.chroma .kn{color:#ff79c6}.chroma .kp{color:#ff79c6}.chroma .kr{color:#ff79c6}.chroma .kt{color:#8be9fd}.chroma .na{color:#50fa7b}.chroma .nb{color:#8be9fd;font-style:italic}.chroma .nc{color:#50fa7b}.chroma .nf{color:#50fa7b}.chroma .nl{color:#8be9fd;font-style:italic}.chroma .nt{color:#ff79c6}.chroma .nv{color:#8be9fd;font-style:italic}.chroma .vc{color:#8be9fd;font-style:italic}.chroma .vg{color:#8be9fd;font-style:italic}.chroma .vi{color:#8be9fd;font-style:italic}.chroma .s{color:#f1fa8c}.chroma .sa{color:#f1fa8c}.chroma .sb{color:#f1fa8c}.chroma .sc{color:#f1fa8c}.chroma .dl{color:#f1fa8c}.chroma .sd{color:#f1fa8c}.chroma .s2{color:#f1fa8c}.chroma .se{color:#f1fa8c}.chroma .sh{color:#f1fa8c}.chroma .si{color:#f1fa8c}.chroma .sx{color:#f1fa8c}.chroma .sr{color:#f1fa8c}.chroma .s1{color:#f1fa8c}.chroma .ss{color:#f1fa8c}.chroma .m{color:#bd93f9}.chroma .mb{color:#bd93f9}.chroma .mf{color:#bd93f9}.chroma .mh{color:#bd93f9}.chroma .mi{color:#bd93f9}.chroma .il{color:#bd93f9}.chroma .mo{color:#bd93f9}.chroma .o{color:#ff79c6}.chroma .ow{color:#ff79c6}.chroma .c{color:#6272a4}.chroma .ch{color:#6272a4}.chroma .cm{color:#6272a4}.chroma .c1{color:#6272a4}.chroma .cs{color:#6272a4}.chroma .cp{color:#ff79c6}.chroma .cpf{color:#ff79c6}.chroma .gd{color:#8b080b}.chroma .ge{text-decoration:underline}.chroma .gh{font-weight:700}.chroma .gi{font-weight:700}.chroma .go{color:#44475a}.chroma .gu{font-weight:700}.chroma .gl{text-decoration:underline} diff --git a/website/blog/themes/tailwind/static/css/theme.css b/website/blog/themes/tailwind/static/css/theme.css new file mode 100644 index 000000000000..4d9cc992fd36 --- /dev/null +++ b/website/blog/themes/tailwind/static/css/theme.css @@ -0,0 +1 @@ +/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}a{background-color:transparent}strong{font-weight:bolder}img{border-style:none}button,input{font-family:inherit;font-size:100%;line-height:1.15;margin:0;overflow:visible}button{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}legend{color:inherit;display:table;max-width:100%;white-space:normal}[type=checkbox],[type=radio],legend{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}[hidden],template{display:none}html{box-sizing:border-box;font-family:sans-serif}*,:after,:before{box-sizing:inherit}h1,h2,p{margin:0}button{background:transparent;padding:0}button:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}ol{list-style:none;margin:0;padding:0}html{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;line-height:1.5}*,:after,:before{border:0 solid #e2e8f0}img{border-style:solid}input::-webkit-input-placeholder{color:#a0aec0}input::-moz-placeholder{color:#a0aec0}input:-ms-input-placeholder{color:#a0aec0}input::-ms-input-placeholder{color:#a0aec0}input::placeholder{color:#a0aec0}[role=button],button{cursor:pointer}h1,h2{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}button,input{padding:0;line-height:inherit;color:inherit}canvas,img{display:block;vertical-align:middle}img{max-width:100%;height:auto}.bg-gray-200{background-color:#edf2f7}.bg-gray-400{background-color:#cbd5e0}.hover\:bg-gray-600:hover{background-color:#718096}.border-blue-500{border-color:#4299e1}.rounded-sm{border-radius:.125rem}.rounded-full{border-radius:9999px}.border-none{border-style:none}.border-t-4{border-top-width:4px}.block{display:block}.inline-block{display:inline-block}.hidden{display:none}.font-serif{font-family:Arvo}.font-bold{font-weight:700}.my-2{margin-top:.5rem;margin-bottom:.5rem}.mx-2{margin-left:.5rem;margin-right:.5rem}.-mx-2{margin-left:-.5rem;margin-right:-.5rem}.mb-2{margin-bottom:.5rem}.mt-4{margin-top:1rem}.mr-6{margin-right:1.5rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.mb-12{margin-bottom:3rem}.mb-24{margin-bottom:6rem}.p-6{padding:1.5rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.px-3{padding-left:.75rem;padding-right:.75rem}.text-gray-800{color:#2d3748}.hover\:text-white:hover{color:#fff}.text-xs{font-size:.75rem}.text-lg{font-size:1.125rem}.text-3xl{font-size:1.875rem}.text-4xl{font-size:2.25rem}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.w-20{width:5rem}.w-full{width:100%}body{color:#2d3748}h1,h2,strong{color:#1a202c}article>p,ol{font-size:1.125rem;letter-spacing:.025em}article>div,ol,p{margin-bottom:1.5rem}article>ol{list-style-type:disc;margin-left:2rem}article>li:not(:last-of-type){margin-bottom:.5rem}article>h2{font-size:1.5rem;margin-top:2rem;margin-bottom:2rem;font-weight:700;color:#000}a{border-bottom-width:1px;border-color:#000;color:#000}pre.chroma{padding:1rem;overflow-x:auto;font-family:Source Code Pro;font-size:1.125rem}@media (min-width:768px){div.highlight{margin-left:-3rem;margin-right:-3rem}}@media (min-width:768px){.md\:block{display:block}.md\:flex{display:-webkit-box;display:flex}.md\:flex-row{-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row}.md\:items-center{-webkit-box-align:center;align-items:center}.md\:flex-l-24{-webkit-box-flex:0;flex:0 0 6rem}.md\:mx-auto{margin-left:auto;margin-right:auto}.md\:ml-12{margin-left:3rem}.md\:px-0{padding-left:0;padding-right:0}.md\:w-2\/3{width:66.666667%}}@media (min-width:1280px){.xl\:w-2\/5{width:40%}} \ No newline at end of file diff --git a/website/blog/themes/tailwind/static/images/404-background.png b/website/blog/themes/tailwind/static/images/404-background.png new file mode 100644 index 000000000000..4b945386a001 --- /dev/null +++ b/website/blog/themes/tailwind/static/images/404-background.png Binary files differdiff --git a/website/blog/themes/tailwind/tailwind.config.js b/website/blog/themes/tailwind/tailwind.config.js new file mode 100644 index 000000000000..f3714704df46 --- /dev/null +++ b/website/blog/themes/tailwind/tailwind.config.js @@ -0,0 +1,18 @@ +module.exports = { + theme: { + extend: { + flex: { + 'l-24': '0 0 6rem' + }, + fontFamily: { + serif: ['Arvo'], + mono: ['Source Code Pro'] + }, + padding: { + '1/2': '0.125rem' + } + } + }, + variants: {}, + plugins: [], +} diff --git a/website/blog/themes/tailwind/theme.toml b/website/blog/themes/tailwind/theme.toml new file mode 100644 index 000000000000..bfdefa7160df --- /dev/null +++ b/website/blog/themes/tailwind/theme.toml @@ -0,0 +1,12 @@ +name = "Tailwind Journal" +license = "MIT" +licenselink = "https://github.com/ianrodrigues/hugo-tailwind-journal/blob/master/license.md" +description = "A minimalist journal template for Hugo using TailwindCSS." +homepage = "https://github.com/ianrodrigues/hugo-tailwind-journal" +tags = ["minimalist", "reading", "blog", "tailwindcss"] +features = ["blog"] +min_version = "0.54.0" + +[author] + name = "Ian Rodrigues" + homepage = "https://ianrodrigues.dev" |
