~andrewzah/personal-site

caf887314cf72942e446549176c23388329de0c2 — Andrew Zah 5 months ago 33b2890
add scss Note component
M .gitmodules => .gitmodules +1 -1
@@ 1,3 1,3 @@
[submodule "static/quotes"]
	path = static/quotes
	url = git@git.andrewzah.com:andrei/quotes.git
	url = git@git.sr.ht:~andrewzah/quotes

M content/posts/018_zola_caddy_automatic_deploy/index.md => content/posts/018_zola_caddy_automatic_deploy/index.md +3 -2
@@ 22,7 22,7 @@ footnotes = [

Over the years, I've slowly and incrementally optimized my blog. Originally I used an entire rails setup with postgres, because that was the first thing I really learned how to program. Yet that's quite the overkill for a static blog... I don't even include comments anymore.

This is where [Zola][Zola] comes in, previously named *Gutenberg*. It's a static site generator written in Rust that uses [Tera][tera] for templating. It serves as a counterpart to [Hugo][hugo], written in Golang. Both have a similar featureset, so I chose Zola since I know Rust and can contribute if needed.
This is where [Zola][Zola] comes in, previously named *Gutenberg*. It's a static site generator written in Rust that uses [Tera][tera] for templating. It serves as a counterpart to [Hugo][hugo], written in Golang. Both have a similar featureset, so I chose Zola since I use Rust and can contribute if needed.

However basically [any static site generation system][buildit] can work, so long as you end up with files generated to your liking.



@@ 160,7 160,8 @@ I keep my statically generated assets at [github.com/azah/personal-site-public][

Let's create the Caddyfile:

**NOTE**!! Use a port (like :2015) for local testing instead of the actual domain! If you run Caddy with this caddyfile locally without the `-disable-acme-auth`, caddy will repeatedly try to authorize, quickly **ratelimiting you from Let's Encrypt**!{{fn(n=2)}}
{{note(c="Warning", t="Use a port (like :2015) for local testing instead of the actual domain! If you run Caddy with this caddyfile locally without the -disable-acme-auth, caddy will repeatedly try to authorize, quickly ratelimiting you from Let's Encrypt!")
}}

```
# Caddyfile

A sass/components/_note.scss => sass/components/_note.scss +25 -0
@@ 0,0 1,25 @@
.note {
  margin: 1rem auto;
  padding: 1rem 1rem;
}

.note-Note {
  span, h4 {
    color: rgba(30, 55, 153, 1.0);
  }

  background-color: rgba(30, 55, 153, 0.1);
  border: 1px solid rgba(30, 55, 153, 0.5);
}

.note-Warning {
  span, h4 {
    color: rgba(229, 80, 57, 1.0);
  }

  background-color: rgba(229, 80, 57, 0.1);
  border: 1px solid rgba(229, 80, 57, 0.2);
}

.note-Success {
}

M sass/main.scss => sass/main.scss +1 -0
@@ 21,6 21,7 @@
@import 'components/_footer';
@import 'components/_footnote';
@import 'components/_highlight';
@import 'components/_note';
@import 'components/_nav';
@import 'components/_random_quote';
@import 'components/_toc';

M static/quotes => static/quotes +1 -1
@@ 1,1 1,1 @@
Subproject commit 6b51830950f56e5917df58be24df9a5798dc66e7
Subproject commit 0424ce514b4bfe0e98447585c8408161f0a88283

A templates/shortcodes/note.html => templates/shortcodes/note.html +4 -0
@@ 0,0 1,4 @@
<div class="note note-{{c}}">
  <h4>{{c}}</h4>
  <span>{{t}}</span>
</div>