Minimalistic blogs may get boring sometimes. We want to reduce visual polution, but our brain needs some visual sugar from time to time! That's why I configured a workflow for this blog that changes its theme color every day. Today you're seeing this color (yellow), but tomorrow you might see this color (red).
How
If you have read my about page, you know that this blog is built with the following stack: Hugo, Bear Blog Theme and GitHub Pages. Content is published to the web whenever my pages GitHub repository is updated, triggered by a GitHub Action.
The process to update theme color is seemingly the same: have a GitHub Action that is triggered every day by midnight.
name: update-theme-color
on:
schedule:
- cron: "0 0 * * *"
jobs:
cron:
runs-on: ubuntu-20.04
steps:
- uses: actions/checkout@v2
with:
submodules: true # Fetch Hugo themes (true OR recursive)
fetch-depth: 0 # Fetch all history for .GitInfo and .Lastmod
- name: Change color
run: bash scripts/update_theme_color.bash
- name: Commit and push
run: bash scripts/action_repo_commit_and_push_all.bash "Update theme color"
But how is each color chosen? Initially I thought that randomizing a color using the updating date as a seed (e.g., 2023-03-12
), but then I remembered that could lead to undesirable situations such as:
- (#FFFFFF) "really light" text on light theme
- (#000000) "really dark" text on dark theme
- (#4A412A) or even this! (light theme users, can you point the differences?)
To overcome this issue, I decided that the best option is to handfully pick a set of colors and then choose at random one of them. All I needed to do is create a source of great colors
#F94144
#F3722C
#F8961E
...
#A9DEF9
#E4C1F9
and then use bash scripting commands to chose one from the source and updated it in my blog config.toml
file.
#!/usr/bin/env bash
script_dir_path=$(dirname "$(realpath $0)")
colors_file_path="$script_dir_path/good_colors.lst"
random_color=$(shuf -n 1 $colors_file_path)
config=$(awk '{sub(/link_color.*/, "link_color = \"'$random_color'\"")}1' config.toml)
echo "$config" > config.toml
Top comments (0)