-
Install and init Bun:
curl -fsSL https://bun.sh/install | bash bun --version cd aabbtree77.github.io bun init
-
Leave empty default prompts in
bun init, followed bybun add -d tailwindcss postcss autoprefixer bun tailwindcss init
-
Edit tailwind.config.js to specify your content files:
module.exports = { content: ["./*.html"], // Specify your HTML or other template files here theme: { extend: { fontFamily: { code: ['"Source Code Pro"', "monospace"], }, }, }, plugins: [], };
-
If *.html files are inside src, use
content: ["./*.html", "./src/**/*.html"],
-
Create a new file named input.css:
/* * { outline: 1px solid red; } */ @tailwind base; @tailwind components; @tailwind utilities;
-
Tailwind CSS work flow:
bun tailwindcss build -i input.css -o output.css --minify
output.cssneeds to be linked inside index.html:<link href="./output.css" rel="stylesheet" />
-
To automatically rebuild the CSS on changes:
bun tailwindcss build input.css -o output.css --minify --watch
-
Select and group multiple fonts from the Google API and get the joint
<link href="" rel="">link to include inside<head>. -
Adjust 'fontFamily
insidetailwind.config.js`, e.g.fontFamily: { code: ['"Source Code Pro"', 'monospace'], sans: ['Roboto', 'sans-serif'], heading: ['"Playfair Display"', 'serif'], },
-
Inside the HTML Tailwind CSS classes become
font-code,font-sans,font-heading, e.g.<h1 class="font-heading"></h1>
-
An average Google font takes 20-30KB.
The CV section contains a link which shows the last 50 visitors (guests) of this page. It is a minimal MERN app whose frontend is located in the directory miniguestlog in the same folder as this README.md. The backend is in aabbtree77/miniguestlog, hosted at render.com. To activate this app, add this line manually inside <head></head> of index.html:
<script type="text/javascript" src="miniguestlog/sendGuestTimeLoc.js"></script>-
Set up tokens with .bashrc.
-
Inside a newly created and cloned repo (locally):
git remote rm origin git remote add origin https://aabbtree77:[email protected]/aabbtree77/aabbtree77.github.io.git git remote show origin
-
Repo update routine:
git add . git commit -m "first commit" git push origin main
Here "main" can sometimes become "master" depending on what "git remote show origin" indicates.
-
A custom domain on github pages with the source branch "main" adds a file CNAME to remotes/origin/main, which results in the push failure with the message
Updates were rejected because the remote contains work that you do not have locally.Run
git config pull.rebase false git pull origin mainOne can set "git config pull.rebase true", it does not matter, what changes is only the commit history, not the result.
-
Sometimes this is also useful: Rewind to a particular commmit in the additional local copy of the repo:
git log --pretty=format:"%h - %ad : %s" git reset --hard hash#
-
VS Code: Select lines, ctrl+] or ctrl+[.
-
gedit: Preferences -> Editor -> Tab Stops. Select lines, shift+tab or tab.