Friends
## Acknowledgements ¶
Hugo
The world’s fastest framework for building websites

Alice
A classic and elegant hugo theme

MistY (who made the theme)
Professional Cat

Gasiyu
Jiābān Enthusiast (aka Coder)
CodeMirror
The in-browser code editor
IBM Plex
It’s global, it’s versatile and it’s distinctly IBM
MathJax
Beautiful and accessible math in all browsers
SVG Repo
Free SVG Vectors and Icons
KaTeX
The fastest math typesetting library for the web

Waline
A Simple, Safe Comment System.
Mozilla Developer Network
Resources for Developers, by Developers
TikZJax
TikZJax converts script tags (containing TikZ code) into SVGs.
GLightbox
A pure javascript lightbox
pseudocode.js
Beautiful pseudocode for the Web
## How to add new friends? ¶
Information of your friend can be give in json, yaml, toml or xml format.
Example friend data file:
{
"id": "friend-id",
"name": "Friend name",
"tagline": "Your cool tagline",
"avatar": {
"kind": "url",
"content": "https://your.cool/avatar.webp"
},
"website": "https://your.cool.site",
"koukando": 99,
"dead": false
}id: friend-id
name: Friend name
tagline: Your cool tagline
avatar:
kind: url
content: https://your.cool/avatar.webp
website: https://your.cool.site
koukando: 99
dead: falseid = "friend-id"
name = "Friend name"
tagline = "Your cool tagline"
[avatar]
kind = "url"
content = "https://your.cool/avatar.webp"
website = "https://your.cool.site"
koukando = 99
dead = false<id>friend-id</id>
<name>Friend name</name>
<tagline>Your cool tagline</tagline>
<avatar>
<kind>url</kind>
<content>https://your.cool/avatar.webp</content>
</avatar>
<website>https://your.cool.site</website>
<koukando>99</koukando>
<dead>false</dead>About the fields
avatar also supports SVG, change kind to svg and fill the content with the raw svg markup string.
koukando is the weight that will be used for sorting your friends in frienmily shortcode. It’s the romaji of "好感度" in Japanese kanji (it’s also of the same meaning and orthography in Chinese), koukando basically stands for "favorability" in English.
So human/animal dies… dead is true if your friend dies, or his/her website dies… The dead friend will still be rendered and displayed, but the card style will be "dead", looking black and gray, the avatar will be converted to grayscale image.
The other data fields are easy to understand.
After filling up your friend information, put your friend data file some-friend.yaml in the data/friends directory.
Now, you can display your friend!
You could display all your friends using the {{< frienmily >}} shortcode ── just like above.
You could also display some friend using the {{< friend id="some-friend-id" >}} shortcode, with a specific friend ID some-friend-id. For example, {{< friend id="alice" >}} will be rendered like following:

Alice
A classic and elegant hugo theme
