fix(): Adds CSS support for Note and Warning

content-org/blog.org

@@ -207,7 +207,7 @@ You can also, if you like, mount a backup and get stuff out.
 
 #+BEGIN_EXPORT html
 <div class="admonition warning">
-<p class="admonition-title">warning</p>
+<p class="admonition-title"><b>Warning</b></p>
 #+END_EXPORT
 Mounting a *Borg* backup is done using /fuse/
 #+BEGIN_EXPORT html
@@ -316,7 +316,7 @@ This is the /prefix/ that *borgmatic* uses to consider backups for *pruning*.
 
 #+BEGIN_EXPORT html
 <div class="admonition warning">
-<p class="admonition-title">warning</p>
+<p class="admonition-title"><b>Warning</b></p>
 #+END_EXPORT
 Watch out for the retention =prefix=
 #+BEGIN_EXPORT html
@@ -339,7 +339,7 @@ consistency:
 
 #+BEGIN_EXPORT html
 <div class="admonition warning">
-<p class="admonition-title">warning</p>
+<p class="admonition-title"><b>Warning</b></p>
 #+END_EXPORT
 Watch out, again, for the consistency =prefix=
 #+BEGIN_EXPORT html
@@ -477,7 +477,7 @@ On a /*nix/ system, whether /Linux/, /BSD/ or even /Mac OS/ now, the application
 
 #+BEGIN_EXPORT html
 <div class="admonition note">
-<p class="admonition-title">Note</p>
+<p class="admonition-title"><b>Note</b></p>
 #+END_EXPORT
 I will be using /dotfiles/ and /configuration files/ interchangeably in this article, and they can be thought as such.
 #+BEGIN_EXPORT html
@@ -565,7 +565,7 @@ This is going to showcase some of /Chezmoi/'s capabilities.
 
 #+BEGIN_EXPORT html
 <div class="admonition note">
-<p class="admonition-title">Note</p>
+<p class="admonition-title"><b>Note</b></p>
 #+END_EXPORT
 This is how I use /Chezmoi/. If you have a better way to do things, I'd like to hear about it!
 #+BEGIN_EXPORT html
@@ -643,7 +643,7 @@ chezmoi -v apply
 
 #+BEGIN_EXPORT html
 <div class="admonition note">
-<p class="admonition-title">Note</p>
+<p class="admonition-title"><b>Note</b></p>
 #+END_EXPORT
 I like to use the =-v= flag to check what is *actually* being applied.
 #+BEGIN_EXPORT html
@@ -673,7 +673,7 @@ If you've followed so far, you might have wondered... If I edit =~/.ds9/config=,
 
 #+BEGIN_EXPORT html
 <div class="admonition warning">
-<p class="admonition-title">warning</p>
+<p class="admonition-title"><b>Warning</b></p>
 #+END_EXPORT
 Always use /Chezmoi/ to edit your managed /dotfiles/. Do *NOT* edit them directly.
 
@@ -735,7 +735,7 @@ chezmoi add --template ~/.ds9/config
 
 #+BEGIN_EXPORT html
 <div class="admonition warning">
-<p class="admonition-title">warning</p>
+<p class="admonition-title"><b>Warning</b></p>
 #+END_EXPORT
 Follow the [[https://www.chezmoi.io/docs/how-to/#use-templates-to-manage-files-that-vary-from-machine-to-machine][documentation]] to /configure/ the *values*.
 #+BEGIN_EXPORT html
@@ -1095,7 +1095,7 @@ def test_nginx_running_and_enabled(host):
 
 #+BEGIN_EXPORT html
 <div class="admonition warning">
-<p class="admonition-title">warning</p>
+<p class="admonition-title"><b>Warning</b></p>
 #+END_EXPORT
 Uncomment =truthy: disable= in =.yamllint= found at the base of the role.
 #+BEGIN_EXPORT html
@@ -1298,7 +1298,7 @@ Even though /namespaces/ have been around since 2002, /Linux/ version =2.4.19=,
 
 #+BEGIN_EXPORT html
 <div class="admonition note">
-<p class="admonition-title">Note</p>
+<p class="admonition-title"><b>Note</b></p>
 #+END_EXPORT
 It is worth mentioning that /LXC/ runs a full /operating system/ containers from an image.
 In other words, /LXC/ containers are meant to run more than one process.
@@ -1436,7 +1436,7 @@ Let's download a docker image. I am using =podman=, an open source project that
 
 #+BEGIN_EXPORT html
 <div class="admonition note">
-<p class="admonition-title">Note</p>
+<p class="admonition-title"><b>Note</b></p>
 #+END_EXPORT
 You might want to run these commands with =sudo= privileges.
 #+BEGIN_EXPORT html
@@ -1641,7 +1641,7 @@ STEP 3: COMMIT neofetch-ubuntu:20.04
 
 #+BEGIN_EXPORT html
 <div class="admonition note">
-<p class="admonition-title">Note</p>
+<p class="admonition-title"><b>Note</b></p>
 #+END_EXPORT
 You might need =sudo= to run this command.
 #+BEGIN_EXPORT html
@@ -2065,7 +2065,7 @@ services:
 
 #+BEGIN_EXPORT html
 <div class="admonition note">
-<p class="admonition-title">Note</p>
+<p class="admonition-title"><b>Note</b></p>
 #+END_EXPORT
 Upgrading to =version 3.x= of /docker-compose/ requires the creation of /network/ to /link/ containers together. It's worth investing into, this is not a /docker-compose/ tutorial.
 #+BEGIN_EXPORT html
@@ -2168,7 +2168,7 @@ Let's configure /acme/ to do just that. Get us certificates. In this example, we
 
 #+BEGIN_EXPORT html
 <div class="admonition warning">
-<p class="admonition-title">warning</p>
+<p class="admonition-title"><b>Warning</b></p>
 #+END_EXPORT
 /Let's Encrypt/ have set limits on *how many* certificates you can request per certain amount of time. To test your certificate request and renewal processes, use their staging infrastructure. It is made for such purpose.
 #+BEGIN_EXPORT html
@@ -2533,7 +2533,7 @@ If we point our ~/etc/hosts~ to our site, we can test that everything works.
 
 #+BEGIN_EXPORT html
 <div class="admonition note">
-<p class="admonition-title">Note</p>
+<p class="admonition-title"><b>Note</b></p>
 #+END_EXPORT
 Replace ~192.168.0.1~ with your public server's IP address. This is an example
 of an IP unroutable on the internet.
@@ -2671,7 +2671,7 @@ Now, the /Helm Chart/ will deploy an ingress and expose the dashboard for you on
 
 #+BEGIN_EXPORT html
 <div class="admonition note">
-<p class="admonition-title">Note</p>
+<p class="admonition-title"><b>Note</b></p>
 #+END_EXPORT
 I figured out the values to set in =valuesContent= by reading the /Helm Chart/
 #+BEGIN_EXPORT html
@@ -2696,7 +2696,7 @@ Let's do that, shall we ?
 
 #+BEGIN_EXPORT html
 <div class="admonition note">
-<p class="admonition-title">Note</p>
+<p class="admonition-title"><b>Note</b></p>
 #+END_EXPORT
 We need to make sure that *k3s* does not deploy its own *traefik* but ours.
 Make sure to add =--no-deploy traefik= to our deployment command.
@@ -3291,7 +3291,7 @@ Once all 4 nodes have been created, when you boot into the /RancherOS/ [[https:/
 
 #+BEGIN_EXPORT html
 <div class="admonition note">
-<p class="admonition-title">Note</p>
+<p class="admonition-title"><b>Note</b></p>
 #+END_EXPORT
 Because I was using /libvirt/, I was able to do =virsh console <vm>= and run these commands.
 #+BEGIN_EXPORT html
@@ -3438,7 +3438,7 @@ Do the same for /all the rest/. Once the first docker image gets downloaded and
 
 #+BEGIN_EXPORT html
 <div class="admonition warning">
-<p class="admonition-title">warning</p>
+<p class="admonition-title"><b>Warning</b></p>
 #+END_EXPORT
 Do *NOT* click /done/ until you see all /3 nodes registered/.
 #+BEGIN_EXPORT html
@@ -3478,7 +3478,7 @@ Generally, you would install the helm binary on your machine and install it into
 
 #+BEGIN_EXPORT html
 <div class="admonition note">
-<p class="admonition-title">Note</p>
+<p class="admonition-title"><b>Note</b></p>
 #+END_EXPORT
 This is not a production recommended way to deploy helm. I would *NOT* deploy helm this way on a production cluster. I would restrict the permissions of any =ServiceAccount= deployed in the cluster to its bare minimum requirements.
 #+BEGIN_EXPORT html
@@ -3511,7 +3511,7 @@ We de deploy the =ServiceAccount= to the cluster. Save it to =ServiceAccount.yam
 
 #+BEGIN_EXPORT html
 <div class="admonition note">
-<p class="admonition-title">Note</p>
+<p class="admonition-title"><b>Note</b></p>
 #+END_EXPORT
 To read more about =ServiceAccount= and their uses please visit the /kubernetes/ documentation page on the [[https://kubernetes.io/docs/reference/access-authn-authz/service-accounts-admin/][topic]].
 #+BEGIN_EXPORT html
@@ -3582,7 +3582,7 @@ Now that we have all the basics deployed, we can finally deploy /Tiller/ in the
 
 #+BEGIN_EXPORT html
 <div class="admonition note">
-<p class="admonition-title">Note</p>
+<p class="admonition-title"><b>Note</b></p>
 #+END_EXPORT
 Please make sure you read the helm installation documentation if you are deploying this in a production environment. You can find how you can make it more secure [[https://helm.sh/docs/using_helm/#securing-your-helm-installation][there]].
 #+BEGIN_EXPORT html
@@ -3660,7 +3660,7 @@ So here I was with *Ubuntu* installed on my laptop on root *ZFS*. So I had to do
 
 #+BEGIN_EXPORT html
 <div class="admonition note">
-<p class="admonition-title">Note</p>
+<p class="admonition-title"><b>Note</b></p>
 #+END_EXPORT
 I have read somewhere in a blog about *Ubuntu* that I should not run an upgrade on the boot pool.
 #+BEGIN_EXPORT html
@@ -3723,7 +3723,7 @@ Let's look at the sanitized version of the datasets.
 
 #+BEGIN_EXPORT html
 <div class="admonition note">
-<p class="admonition-title">Note</p>
+<p class="admonition-title"><b>Note</b></p>
 #+END_EXPORT
 The installer have created some random IDs that I have not figured out if they are totally random or mapped to something so I have sanitized them.
 I also sanitized the user, of course. ;)
@@ -4074,7 +4074,7 @@ Basically, I make sure that all the emails, in their folders, are tagged properl
 
 #+BEGIN_EXPORT html
 <div class="admonition note">
-<p class="admonition-title">Note</p>
+<p class="admonition-title"><b>Note</b></p>
 #+END_EXPORT
 The *read* / *unread* tag is automatically handled between /notmuch/ and /isync/. It's seemlessly synchronized between the tools.
 #+BEGIN_EXPORT html
@@ -4442,7 +4442,7 @@ pip install --user pipx
 
 #+BEGIN_EXPORT html
 <div class="admonition warning">
-<p class="admonition-title">warning</p>
+<p class="admonition-title"><b>Warning</b></p>
 #+END_EXPORT
 You are setting yourself up for a *world of hurt* if you use =sudo= with =pip= or run it as =root=. *ONLY* run commands as =root= or with escalated privileges when you know what you're doing.
 #+BEGIN_EXPORT html
@@ -5481,7 +5481,7 @@ other types of deployments.
 
 #+BEGIN_EXPORT html
 <div class="admonition note">
-<p class="admonition-title">Note</p>
+<p class="admonition-title"><b>Note</b></p>
 #+END_EXPORT
 I'm still running on =2.x= API version. I know I need to upgrade to a newer
 version but that's a bit of networking work. It's an ongoing work.
@@ -5782,7 +5782,7 @@ Okay, that's what's trying to load /htmlize/. Let's try to add it to the =load-p
 
 #+BEGIN_EXPORT html
 <div class="admonition note">
-<p class="admonition-title">Note</p>
+<p class="admonition-title"><b>Note</b></p>
 #+END_EXPORT
 In my case, the path to =htmlize= is =~/.emacs.d/.local/straight/build/htmlize=.
 
@@ -5808,7 +5808,7 @@ Let's create this blog post.
 
 #+BEGIN_EXPORT html
 <div class="admonition warning">
-<p class="admonition-title">warning</p>
+<p class="admonition-title"><b>Warning</b></p>
 #+END_EXPORT
 It is very important to use the =nikola= command line interface to create the post. I spent too much time trying to figure out the /header/ settings.
 #+BEGIN_EXPORT html
@@ -5864,7 +5864,7 @@ $ nikola theme --new custom-willy-theme --parent willy-theme --engine=jinja
 
 #+BEGIN_EXPORT html
 <div class="admonition note">
-<p class="admonition-title">Note</p>
+<p class="admonition-title"><b>Note</b></p>
 #+END_EXPORT
 I had to use =--engine=jinja= because /willy-theme/ uses jinja templating. If you are using the /mako/ engine, you don't need to add thihs as the *default* is /mako/.
 #+BEGIN_EXPORT html
@@ -5873,7 +5873,7 @@ I had to use =--engine=jinja= because /willy-theme/ uses jinja templating. If yo
 
  #+BEGIN_EXPORT html
  <div class="admonition warning">
- <p class="admonition-title">warning</p>
+ <p class="admonition-title"><b>Warning</b></p>
  #+END_EXPORT
 You will /probably/ need both themes in your =themes/= directory. The /willy-theme/ needs to be installed before creating your /custom/ theme from it.
 #+BEGIN_EXPORT html
@@ -6543,7 +6543,7 @@ This is due to the fact that all the conflicts would've been resolved in each re
 
 #+BEGIN_EXPORT html
 <div class="admonition note">
-<p class="admonition-title">Note</p>
+<p class="admonition-title"><b>Note</b></p>
 #+END_EXPORT
 Branch and branch often!
 if you merge, merge and merge often!
@@ -6690,7 +6690,7 @@ Sounds simple enough, doesn't it ?
 
 #+BEGIN_EXPORT html
 <div class="admonition warning">
-<p class="admonition-title">warning</p>
+<p class="admonition-title"><b>Warning</b></p>
 #+END_EXPORT
 If you follow along this blog post, here's what you can expect.
 - You *WILL* lose /all the files you delete from disk/, as well, so make a copy
@@ -6727,7 +6727,7 @@ $ pip install git-filter-repo
 
 #+BEGIN_EXPORT html
 <div class="admonition warning">
-<p class="admonition-title">warning</p>
+<p class="admonition-title"><b>Warning</b></p>
 #+END_EXPORT
 *BEWARE THE DRAGONS*
 #+BEGIN_EXPORT html
@@ -6765,7 +6765,7 @@ $ sudo apt-get install git-lfs
 
 #+BEGIN_EXPORT html
 <div class="admonition warning">
-<p class="admonition-title">warning</p>
+<p class="admonition-title"><b>Warning</b></p>
 #+END_EXPORT
 Before you commit to using /git-lfs/, make sure that your /git/ server supports it.
 
@@ -6875,7 +6875,7 @@ And the deed is done.
 
 #+BEGIN_EXPORT html
 <div class="admonition note">
-<p class="admonition-title">Note</p>
+<p class="admonition-title"><b>Note</b></p>
 #+END_EXPORT
 If you were extremely observant so war, you might've noticed that I used the same link again while I said a *new repository*.
 
@@ -6930,7 +6930,7 @@ a breeze. It is also offered in container form.
 
 #+BEGIN_EXPORT html
 <div class="admonition note">
-<p class="admonition-title">Note</p>
+<p class="admonition-title"><b>Note</b></p>
 #+END_EXPORT
 Yeah ? You read that ? I said /container/ ! You're ears are ringing now,
 something inside your head started making plans on what you can do with that.
@@ -6992,7 +6992,7 @@ questions to find answers to.
 
 #+BEGIN_EXPORT html
 <div class="admonition warning">
-<p class="admonition-title">warning</p>
+<p class="admonition-title"><b>Warning</b></p>
 #+END_EXPORT
 If you're not thinking about how to *back* your server *up*, *recover* it and
 *monitor* it, you're doing it wrong !
@@ -7040,7 +7040,7 @@ know you have one choice here and the choice is /Gitlab/.
 
 #+BEGIN_EXPORT html
 <div class="admonition note">
-<p class="admonition-title">Note</p>
+<p class="admonition-title"><b>Note</b></p>
 #+END_EXPORT
 It is worth noting here that I am assuming integration with LDAP (or some other
 authentication system), complex CI/CD, Kubernetes integration and much more.
@@ -7062,7 +7062,7 @@ are going to be using. It also meets your standards of complexity and stability.
 
 #+BEGIN_EXPORT html
 <div class="admonition note">
-<p class="admonition-title">Note</p>
+<p class="admonition-title"><b>Note</b></p>
 #+END_EXPORT
 It is worth mentioning here that you should test the tools you're considering in
 a few POC trials. Get familiarised with it and the way it works. How is it
@@ -7230,7 +7230,7 @@ This is just another file in my /org/ collection. Nothing special about it, it g
 
 #+BEGIN_EXPORT html
 <div class="admonition note">
-<p class="admonition-title">Note</p>
+<p class="admonition-title"><b>Note</b></p>
 #+END_EXPORT
 I added the ~(elfeed-org)~ in the block to load ~elfeed-org~ after I had to load it manually a few times. This made it work on my system, I might be doing it wrong so your milage may vary.
 
@@ -7258,7 +7258,7 @@ The end result configuration is as follows.
 
 #+BEGIN_EXPORT html
 <div class="admonition warning">
-<p class="admonition-title">warning</p>
+<p class="admonition-title"><b>Warning</b></p>
 #+END_EXPORT
 This is the time where you /reload/ your configuration, /reload/ emacs and then /reload/ the world.
 
@@ -7459,7 +7459,7 @@ stream {
 
 #+BEGIN_EXPORT html
 <div class="admonition warning">
-<p class="admonition-title">warning</p>
+<p class="admonition-title"><b>Warning</b></p>
 #+END_EXPORT
 The =stream= section has to be outside the =http= section.
 
@@ -7562,7 +7562,7 @@ You can use this later with =M-x= + =genrate-new-header-org=.
 
 #+BEGIN_EXPORT html
 <div class="admonition note">
-<p class="admonition-title">Note</p>
+<p class="admonition-title"><b>Note</b></p>
 #+END_EXPORT
 =M-x= is the *Meta* key and *x* combination.
 Your *Meta* key can differ between the *Alt* on /Linux/ and *Command* on /Mac OS X/.
@@ -7640,7 +7640,7 @@ It's a nice touch to add these skeletons after /Org-mode/ has loaded.
 
 #+BEGIN_EXPORT html
 <div class="admonition warning">
-<p class="admonition-title">warning</p>
+<p class="admonition-title"><b>Warning</b></p>
 #+END_EXPORT
 If you modify any file in =~/.doom.d/=, do not forget to run =doom sync= and =doom doctor= to update and check your configuration respectively.
 #+BEGIN_EXPORT html
@@ -7762,7 +7762,7 @@ First step, I added the following line to my /main/ configuration. In my case, m
 
 #+BEGIN_EXPORT html
 <div class="admonition warning">
-<p class="admonition-title">warning</p>
+<p class="admonition-title"><b>Warning</b></p>
 #+END_EXPORT
 Make sure /org-mode/ and /org-babel/ are both *installed* and *configured* on your system before trying to run ~org-babel-load-file~
 #+BEGIN_EXPORT html

static/css/custom.css

@@ -1,3 +1,21 @@
 #header {
     text-align: center;
 }
+
+div.note
+{
+     background-color: #f0f7fb;
+     border-left: solid 4px #3498db;
+     line-height: 18px;
+     overflow: hidden;
+     padding: 12px;
+}
+
+div.warning
+{
+     background-color: #f9e7e4;
+     border-left: solid 4px #d25547;
+     line-height: 18px;
+     overflow: hidden;
+     padding: 12px;
+}