Compare commits
13 Commits
1a98f7a163
...
columns
| Author | SHA1 | Date | |
|---|---|---|---|
| 42698372ad | |||
| eddde95b57 | |||
| b5b9e68df0 | |||
| 5bcad7eb77 | |||
| 2be883b19f | |||
| 98f61d6d2f | |||
| 4ebf756c88 | |||
| 0bea1250bc | |||
| 175c9e77c9 | |||
| 64a5cdd775 | |||
| 9ee0254509 | |||
| fc2afda5d0 | |||
| 63842070cc |
@@ -94,11 +94,13 @@ laptop, phone, etc. to protect you from public WiFi, create only a single extra
|
||||
$ ./easyrsa build-client-full client nopass # optional
|
||||
```
|
||||
|
||||
Leave off `nopass` if you want to password protect the config file when you set
|
||||
up a new client.
|
||||
Leave off `nopass` if you want to password protect the config file keys when you
|
||||
set up a new client.
|
||||
|
||||
Create the server config file `/etc/openvpn/server.conf`:
|
||||
|
||||
<span class="aside">Can't use port 443 here since it'll be forwarded</span>
|
||||
|
||||
```
|
||||
port 1194
|
||||
proto udp
|
||||
@@ -144,7 +146,7 @@ ifconfig-push 10.8.0.100 255.255.255.0
|
||||
Test your config by running:
|
||||
|
||||
```
|
||||
sudo openvpn --config /etc/openvpn/server.conf
|
||||
$ sudo openvpn --config /etc/openvpn/server.conf
|
||||
```
|
||||
|
||||
If you run `ip addr` in another terminal, you should see an entry like this:
|
||||
@@ -236,7 +238,7 @@ $ sudo ufw disable && sudo ufw enable
|
||||
|
||||
Switch to your home server or client machine.
|
||||
|
||||
Install openvpn:
|
||||
Install OpenVPN:
|
||||
|
||||
```
|
||||
$ sudo apt update
|
||||
@@ -275,8 +277,8 @@ key-direction 1
|
||||
</tls-auth>
|
||||
```
|
||||
|
||||
Replace the `[server ...]` lines with the contents of that file on the VPN
|
||||
server, for example:
|
||||
Replace the `[server ...]` lines with the contents of that file on the __VPN
|
||||
server__, for example:
|
||||
|
||||
```
|
||||
$ sudo cat /etc/openvpn/easy-rsa/pki/ca.crt
|
||||
@@ -294,6 +296,7 @@ client
|
||||
dev tun
|
||||
proto udp
|
||||
remote vpn.example.com 1194
|
||||
redirect-gateway def1
|
||||
resolv-retry infinite
|
||||
nobind
|
||||
persist-key
|
||||
@@ -303,7 +306,6 @@ cipher AES-256-GCM
|
||||
auth SHA256
|
||||
comp-lzo
|
||||
key-direction 1
|
||||
redirect-gateway def1
|
||||
<ca>
|
||||
[server /etc/openvpn/easy-rsa/pki/ca.crt]
|
||||
</ca>
|
||||
@@ -323,7 +325,7 @@ The `client.ovpn` file is ready to be imported into your VPN clients.
|
||||
Test your config by running:
|
||||
|
||||
```
|
||||
sudo openvpn --config /etc/openvpn/client.conf
|
||||
$ sudo openvpn --config /etc/openvpn/client.conf
|
||||
```
|
||||
|
||||
If you run `ip addr` in another terminal, you should see an entry like this:
|
||||
@@ -376,5 +378,15 @@ You should now be fine to access your home server from over the internet.
|
||||
To forward additional ports, just edit the `/etc/ufw/before.rules` file like
|
||||
above.
|
||||
|
||||
You can now point a domain to your virtual server's IP and use that to connect
|
||||
to your home server. Use a CNAME to make it easy to change later:
|
||||
|
||||
```
|
||||
NAME TYPE VALUE
|
||||
--------------------------------------------------
|
||||
vpn.example.com. A 123.123.123.123
|
||||
myserver.example.com. CNAME vpn.example.com.
|
||||
```
|
||||
|
||||
Finally, make sure any server programs are listening / bound to `10.8.0.100` or
|
||||
`0.0.0.0` so that they can get traffic from that interface.
|
||||
|
||||
1
content/extra/favicon.svg
Normal file
1
content/extra/favicon.svg
Normal file
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><text y=".9em" font-size="90">🏴☠️</text></svg>
|
||||
|
After Width: | Height: | Size: 119 B |
@@ -8,7 +8,7 @@ their shop. I wanted to create a sculpture, so with pieces of scrap metal I
|
||||
welded together this hand. The beads are far from perfect. Working with small
|
||||
pieces of rusted metal made it difficult.
|
||||
|
||||
|
||||
|
||||
|
||||
## The Name
|
||||
|
||||
@@ -25,4 +25,4 @@ grinder. It was made in a machine shop with no real planning done ahead of time.
|
||||
In between welds, I used my own hand as a reference. Below is a picture of me
|
||||
adding a bead to it.
|
||||
|
||||
|
||||
|
||||
|
||||
@@ -8,14 +8,14 @@ wanted to wear a dress that was lit up with LEDs acting as twinkling stars.
|
||||
Seven of the 28 stars are aligned to resemble the Big Dipper constellation and
|
||||
twinkle differently than the rest, which twinkle in a random pattern.
|
||||
|
||||
|
||||
|
||||
|
||||
## Construction
|
||||
|
||||
The LEDs came from that strip that was cut up and soldered together with very
|
||||
small wires. Each of the LEDs can be controlled individually.
|
||||
|
||||
|
||||
|
||||
|
||||
21 of the stars are light magenta in color and twinkle by fading randomly. The
|
||||
seven LEDs that form the Big Dipper continually scroll through a gradient of
|
||||
|
||||
@@ -12,7 +12,7 @@ face-plate and turned it into a capacitive touch sensor. The slightest touch
|
||||
anywhere on the plate is enough to toggle the light. I had to electrically
|
||||
isolate the metal screws from it because they screw into a grounded switch box.
|
||||
|
||||
|
||||
|
||||
|
||||
## Function
|
||||
|
||||
@@ -26,8 +26,8 @@ by an AC-DC converter.
|
||||
|
||||
This entire process happens quicker than half a second, so it feels instant.
|
||||
|
||||
|
||||
|
||||
|
||||
<span class="aside">Black stuff's liquid electrical tape</span>
|
||||
|
||||
|
||||
|
||||
|
||||
@@ -9,7 +9,7 @@ attempted to paint it. I eventually got it framed at Michaels. Many thanks to my
|
||||
friend Laura for the opportunity to do this, I couldn't have done it without her
|
||||
help.
|
||||
|
||||
|
||||
|
||||
|
||||
## The Meaning
|
||||
|
||||
@@ -37,4 +37,4 @@ in. It was quite difficult to get the blending and shadows perfect, but I had
|
||||
Laura to tell me when things didn't look right. Below I am trying to figure out
|
||||
what a hand looks like in a mirror.
|
||||
|
||||
|
||||
|
||||
|
||||
@@ -38,4 +38,4 @@ it would run backwards until the tube was cleared of water.
|
||||
|
||||
<span class="aside">Also dead :(</span>
|
||||
|
||||
|
||||
|
||||
|
||||
@@ -9,7 +9,7 @@ interests. The car was the top Canadian team in a 3000 km race from Darwin to
|
||||
Adelaide, Australia in 2011. We met up at a shop on campus every Saturday
|
||||
morning to work on the new Generation IV of the solar car.
|
||||
|
||||
|
||||
|
||||
|
||||
## The Helianthus MPPT
|
||||
|
||||
@@ -20,4 +20,4 @@ without them. The Generation IV car, Schulich Delta (pictured below) uses seven
|
||||
of them: one per section of solar cells with similar lighting conditions. Andrei
|
||||
and I designed the MPPT above.
|
||||
|
||||
|
||||
|
||||
|
||||
@@ -34,6 +34,12 @@ MARKDOWN = {
|
||||
'output_format': 'html5',
|
||||
}
|
||||
|
||||
STATIC_PATHS = ['images', 'extra']
|
||||
|
||||
EXTRA_PATH_METADATA = {
|
||||
'extra/favicon.svg': {'path': 'favicon.svg'},
|
||||
}
|
||||
|
||||
# Uncomment following line if you want document-relative URLs when developing
|
||||
#RELATIVE_URLS = True
|
||||
|
||||
|
||||
@@ -34,6 +34,12 @@ MARKDOWN = {
|
||||
'output_format': 'html5',
|
||||
}
|
||||
|
||||
STATIC_PATHS = ['images', 'extra']
|
||||
|
||||
EXTRA_PATH_METADATA = {
|
||||
'extra/favicon.svg': {'path': 'favicon.svg'},
|
||||
}
|
||||
|
||||
# Uncomment following line if you want document-relative URLs when developing
|
||||
#RELATIVE_URLS = True
|
||||
|
||||
@@ -48,10 +54,10 @@ AUTHORS_SAVE_AS = ''
|
||||
CATEGORIES_SAVE_AS = ''
|
||||
TAGS_SAVE_AS = ''
|
||||
|
||||
INDEX_SAVE_AS = 'index.php'
|
||||
INDEX_SAVE_AS = 'index.html'
|
||||
ARTICLE_URL = '{slug}/'
|
||||
ARTICLE_SAVE_AS = '{slug}/index.php'
|
||||
ARTICLE_SAVE_AS = '{slug}/index.html'
|
||||
PAGE_URL = '{slug}/'
|
||||
PAGE_SAVE_AS = '{slug}/index.php'
|
||||
PAGE_SAVE_AS = '{slug}/index.html'
|
||||
|
||||
PROD = True
|
||||
|
||||
@@ -26,8 +26,10 @@
|
||||
|
||||
{% block info %}
|
||||
Tanner Collin
|
||||
<p class='theme-select'>
|
||||
<a onClick="setTheme('light')">Light</a> / <a onClick="setTheme('dark')">Dark</a>
|
||||
<p class="contact-icons">
|
||||
<a href="mailto:site2@tannercollin.com" rel="noreferrer noopener"><img alt="email" src="/theme/mail.svg" width="20" height="20" /></a>
|
||||
<a href="https://t.me/tannercollin" target="_blank" rel="noreferrer noopener"><img alt="telegram" src="/theme/telegram.svg" width="20" height="20" /></a>
|
||||
<a href="https://github.com/tannercollin" target="_blank" rel="noreferrer noopener"><img alt="github" src="/theme/github.svg" width="20" height="20" /></a>
|
||||
</p>
|
||||
{% endblock %}
|
||||
|
||||
@@ -39,10 +41,6 @@
|
||||
<div class="content">
|
||||
{% endif %}
|
||||
|
||||
<div class="topbar">
|
||||
{{ info() }}
|
||||
</div>
|
||||
|
||||
<p><a href="/">← Return to Home</a></p>
|
||||
<header>
|
||||
<h1>{{ article.title }}</h1>
|
||||
|
||||
@@ -11,8 +11,8 @@
|
||||
<html lang="en">
|
||||
<head>
|
||||
{% block head %}
|
||||
<meta charset="UTF-8"/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta charset="utf-8"/>
|
||||
|
||||
<title>{% block title %}{{ SITENAME }}{% endblock title %}</title>
|
||||
<meta name="author" content="{{ AUTHOR }}" />
|
||||
@@ -28,62 +28,30 @@
|
||||
<link rel="preload" href="/theme/fonts/Lato-Italic.ttf" as="font" type="font/ttf" crossorigin="anonymous">
|
||||
<link rel="preload" href="/theme/fonts/Lato-Regular.ttf" as="font" type="font/ttf" crossorigin="anonymous">
|
||||
|
||||
<link rel="icon" href="favicon.svg">
|
||||
|
||||
<style>
|
||||
{% include 'style.css' %}
|
||||
{% include 'fonts.css' %}
|
||||
</style>
|
||||
|
||||
<script defer src="/theme/instant-page.js"></script>
|
||||
|
||||
<noscript>
|
||||
<style type="text/css">
|
||||
.theme-select {
|
||||
display: none !important;
|
||||
}
|
||||
</style>
|
||||
</noscript>
|
||||
</head>
|
||||
|
||||
{% if PROD %}
|
||||
<body class="<?php echo $themeClass; ?>">
|
||||
{% else %}
|
||||
<body>
|
||||
{% endif %}
|
||||
<body>
|
||||
<div class="container">
|
||||
<div class="bar">
|
||||
{% block info %}
|
||||
{% endblock %}
|
||||
</div>
|
||||
|
||||
{%- macro info() -%}
|
||||
{% block info %}{% endblock %}
|
||||
{%- endmacro -%}
|
||||
|
||||
<div class="container">
|
||||
<div class="sidebar">
|
||||
{{ info() }}
|
||||
{% block content %}
|
||||
{% endblock %}
|
||||
</div>
|
||||
|
||||
{% block content %}
|
||||
{% endblock %}
|
||||
</div>
|
||||
|
||||
<p class="copyright">
|
||||
© 2012–2021 Tanner Collin
|
||||
</p>
|
||||
|
||||
|
||||
<script>
|
||||
function setTheme(theme) {
|
||||
console.log('Setting theme to', theme);
|
||||
|
||||
if (theme == 'dark') {
|
||||
document.body.classList.add('dark');
|
||||
document.body.classList.remove('light');
|
||||
} else if (theme == 'light') {
|
||||
document.body.classList.add('light');
|
||||
document.body.classList.remove('dark');
|
||||
}
|
||||
|
||||
document.cookie = 'theme=' + theme + '; Max-Age=31536000; Path=/; SameSite=Lax';
|
||||
}
|
||||
</script>
|
||||
|
||||
<p class="copyright">
|
||||
© 2012–2021 Tanner Collin
|
||||
</p>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
@@ -8,64 +8,115 @@
|
||||
{% endblock %}
|
||||
|
||||
{% block info %}
|
||||
<img src="/theme/me.jpg" class="me" alt="A picture of me smiling" />
|
||||
<img src="/theme/me.jpg" width="128" class="me" alt="me smiling wide and looking into the camera lit up brightly" />
|
||||
<div class="info">
|
||||
Tanner Collin
|
||||
<h1>Tanner Collin</h1>
|
||||
<p class="contact-icons">
|
||||
<a href="mailto:site2@tannercollin.com" rel="noreferrer noopener"><img alt="email icon" src="/theme/mail.svg" /></a>
|
||||
<a href="https://t.me/tannercollin" target="_blank" rel="noreferrer noopener"><img alt="telegram logo" src="/theme/telegram.svg" /></a>
|
||||
<a href="https://github.com/tannercollin" target="_blank" rel="noreferrer noopener"><img alt="github logo" src="/theme/github.svg" /></a>
|
||||
</p>
|
||||
<p class='theme-select'>
|
||||
<a onClick="setTheme('light')">Light</a> / <a onClick="setTheme('dark')">Dark</a>
|
||||
<a href="mailto:site2@tannercollin.com" rel="noreferrer noopener"><img alt="email" src="/theme/mail.svg" width="20" height="20" /></a>
|
||||
<a href="https://t.me/tannercollin" target="_blank" rel="noreferrer noopener"><img alt="telegram" src="/theme/telegram.svg" width="20" height="20" /></a>
|
||||
<a href="https://github.com/tannercollin" target="_blank" rel="noreferrer noopener"><img alt="github" src="/theme/github.svg" width="20" height="20" /></a>
|
||||
</p>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<div class="content">
|
||||
|
||||
<div class="topbar">
|
||||
{{ info() }}
|
||||
</div>
|
||||
|
||||
<div class="content content-index">
|
||||
<p>
|
||||
Hi, I'm Tanner! I do firmware and web development in Calgary.
|
||||
</p>
|
||||
|
||||
<h2>Contact Info</h2>
|
||||
<div class="leftcol">
|
||||
<div class="inside">
|
||||
|
||||
<p>
|
||||
Email: <a href="mailto:site2@tannercollin.com">site2@tannercollin.com</a> <br />
|
||||
Telegram: <a href="https://t.me/tannercollin" target="_blank" rel="noreferrer noopener">@tannercollin</a>
|
||||
</p>
|
||||
<h2>Contact Info</h2>
|
||||
|
||||
<h2>Resume</h2>
|
||||
<p>
|
||||
Email: <a href="mailto:site2@tannercollin.com">site2@tannercollin.com</a> <br />
|
||||
Telegram: <a href="https://t.me/tannercollin" target="_blank" rel="noreferrer noopener">@tannercollin</a>
|
||||
</p>
|
||||
|
||||
<ul>
|
||||
<li>Firmware Engineer at <a href="https://cabanablockchain.com" target="_blank" rel="noreferrer noopener">Cabana Blockchain</a>, 2018–</li>
|
||||
<li>Lead Hardware Engineer at <a href="https://criticalcontrol.com/" target="_blank" rel="noreferrer noopener">Critical Control</a>, 2016–2018</li>
|
||||
<li>Electrical Engineer at <a href="https://www.opener.aero/" target="_blank" rel="noreferrer noopener">Opener Aero</a>, 2016–2016</li>
|
||||
<li>Electrical Engineer Intern at <a href="https://www.pason.com/" target="_blank" rel="noreferrer noopener">Pason Systems</a>, 2014–2015</li>
|
||||
<li>BSc. Electrical Engineering from University of Calgary</li>
|
||||
</ul>
|
||||
<h2>Resume</h2>
|
||||
|
||||
<h2>Projects</h2>
|
||||
<ul>
|
||||
<li>Firmware Engineer at <a href="https://cabanablockchain.com" target="_blank" rel="noreferrer noopener">Cabana Blockchain</a>, 2018–</li>
|
||||
<li>Lead Hardware Engineer at <a href="https://criticalcontrol.com/" target="_blank" rel="noreferrer noopener">Critical Control</a>, 2016–2018</li>
|
||||
<li>Electrical Engineer at <a href="https://www.opener.aero/" target="_blank" rel="noreferrer noopener">Opener Aero</a>, 2016–2016</li>
|
||||
<li>Electrical Engineer Intern at <a href="https://www.pason.com/" target="_blank" rel="noreferrer noopener">Pason Systems</a>, 2014–2015</li>
|
||||
<li>BSc. Electrical Engineering from University of Calgary</li>
|
||||
</ul>
|
||||
|
||||
<p>
|
||||
My main hobby is working on technical projects. I typically design websites or
|
||||
build tools that make my life easier. Sometimes art.
|
||||
</p>
|
||||
<h2>Projects</h2>
|
||||
|
||||
<p>
|
||||
You can find my code on <a href="https://github.com/tannercollin" target="_blank" rel="noreferrer noopener">GitHub</a>.
|
||||
</p>
|
||||
<p>
|
||||
My main hobby is working on software projects. I typically design websites or
|
||||
build tools that make my life easier.
|
||||
</p>
|
||||
|
||||
{% for article in articles_page.object_list if article.category.name == 'Projects' %}
|
||||
<h3><a href="{{ article.url }}">{{ article.title }}</a></h3>
|
||||
<h3>
|
||||
<a href="https://news.t0.vc/" target="_blank" rel="noreferrer noopener">QotNews</a>
|
||||
— <a class="source" href="https://git.tannercollin.com/tanner/qotnews" target="_blank" rel="noreferrer noopener">source code</a>
|
||||
</h3>
|
||||
<div class="summary">
|
||||
{{ article.summary }}
|
||||
<p>Hacker News, Reddit, Lobsters, and Tildes articles pre-rendered in reader mode. Optimized for speed and distraction-free reading.</p>
|
||||
</div>
|
||||
{% endfor %}
|
||||
|
||||
<h3>
|
||||
<a href="https://notica.us" target="_blank" rel="noreferrer noopener">Notica</a>
|
||||
— <a class="source" href="https://github.com/tannercollin/Notica" target="_blank" rel="noreferrer noopener">source code</a>
|
||||
</h3>
|
||||
<div class="summary">
|
||||
<p>Send browser notifications from your terminal. No installation. No registration.</p>
|
||||
</div>
|
||||
|
||||
<h3>
|
||||
<a href="https://my.protospace.ca" target="_blank" rel="noreferrer noopener">Spaceport</a>
|
||||
— <a class="source" href="https://github.com/Protospace/spaceport" target="_blank" rel="noreferrer noopener">source code</a>
|
||||
</h3>
|
||||
<div class="summary">
|
||||
<p>Makerspace members' portal for Calgary Protospace. It tracks membership, courses, training, access cards, and more.</p>
|
||||
</div>
|
||||
|
||||
<h3>
|
||||
<a href="https://txt.t0.vc" target="_blank" rel="noreferrer noopener">t0txt</a>
|
||||
— <a class="source" href="https://github.com/tannercollin/t0txt" target="_blank" rel="noreferrer noopener">source code</a>
|
||||
</h3>
|
||||
<div class="summary">
|
||||
<p>Minimal command line pastebin. Allows you to upload text notes from a bash pipe or web browser.</p>
|
||||
</div>
|
||||
|
||||
<h3>
|
||||
<a href="https://github.com/tannercollin/standardnotes-fs" target="_blank" rel="noreferrer noopener">standardnotes-fs</a>
|
||||
</h3>
|
||||
<div class="summary">
|
||||
<p>A filesystem that mounts your Standard Notes account as a directory of text files that you can edit.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="rightcol">
|
||||
<div class="inside">
|
||||
<h2>Creations</h2>
|
||||
|
||||
<p>Sometimes I create art or interactive tech.</p>
|
||||
|
||||
{% for article in articles_page.object_list if article.category.name == 'Projects' %}
|
||||
<h3><a href="{{ article.url }}">{{ article.title }}</a></h3>
|
||||
<div class="summary">
|
||||
{{ article.summary }}
|
||||
</div>
|
||||
{% endfor %}
|
||||
|
||||
<h2>Writing</h2>
|
||||
|
||||
<p>Various articles, mostly about computers.</p>
|
||||
|
||||
{% for article in articles_page.object_list if article.category.name == 'Writing' %}
|
||||
<h3><a href="{{ article.url }}">{{ article.title }}</a></h3>
|
||||
<div class="summary">
|
||||
{{ article.summary }}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
||||
@@ -12,6 +12,14 @@ a {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.info h1 {
|
||||
font: 1.2rem/1.0 Lato,sans-serif;
|
||||
}
|
||||
|
||||
.source {
|
||||
font: 1rem/1.5 Apparatus SIL,serif;
|
||||
}
|
||||
|
||||
pre {
|
||||
font-size: 1rem;
|
||||
padding: 1rem;
|
||||
@@ -33,77 +41,6 @@ pre {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.theme-select {
|
||||
font-size: 1rem;
|
||||
margin-bottom: 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.sidebar {
|
||||
margin-top: 2px;
|
||||
float: left;
|
||||
width: 8rem;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.sidebar .me {
|
||||
width: 100%;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.sidebar .info {
|
||||
margin-top: 2rem;
|
||||
}
|
||||
|
||||
.sidebar .contact-icons a {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.sidebar .contact-icons img {
|
||||
width: 1.25rem;
|
||||
height: 1.25rem;
|
||||
margin-left: 0.5rem;
|
||||
}
|
||||
|
||||
.topbar {
|
||||
display: table;
|
||||
overflow: auto;
|
||||
margin: auto;
|
||||
margin-top: -0.5rem;
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
.topbar .me {
|
||||
float: left;
|
||||
height: 6.5rem;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.topbar .info {
|
||||
float: left;
|
||||
margin-top: -0.25rem;
|
||||
margin-left: 1.5rem;
|
||||
}
|
||||
|
||||
.topbar .contact-icons {
|
||||
margin-left: 0.25rem;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.topbar .contact-icons a {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.topbar .contact-icons img {
|
||||
width: 1.5rem;
|
||||
height: 1.5rem;
|
||||
margin-right: 1rem;
|
||||
}
|
||||
|
||||
.topbar .theme-select {
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
|
||||
.toc {
|
||||
float: right;
|
||||
padding: 0.75rem;
|
||||
@@ -136,9 +73,17 @@ pre {
|
||||
}
|
||||
|
||||
.content-wide {
|
||||
max-width: 46rem;;
|
||||
}
|
||||
|
||||
.content-index {
|
||||
max-width: none;
|
||||
}
|
||||
|
||||
.content-index h3 {
|
||||
font: 1.2rem/1.5 Apparatus SIL,serif;
|
||||
}
|
||||
|
||||
.content p {
|
||||
font: 1.2rem/1.5 Apparatus SIL,serif;
|
||||
}
|
||||
@@ -165,32 +110,103 @@ pre {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.toclink:not(:hover)::after {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.toclink::after {
|
||||
color: #999;
|
||||
content: "\00B6";
|
||||
margin-left: 0.5rem;
|
||||
.toclink:not(:hover) {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
@media screen and (min-width:36rem) {
|
||||
.content {
|
||||
margin-left: 10rem;
|
||||
}
|
||||
.topbar {
|
||||
display: none;
|
||||
|
||||
.bar {
|
||||
margin-top: 2px;
|
||||
float: left;
|
||||
width: 8rem;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.bar .me {
|
||||
width: 100%;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.bar .info {
|
||||
margin-top: 1.75rem;
|
||||
}
|
||||
|
||||
.bar .contact-icons a {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.bar .contact-icons img {
|
||||
width: 1.25rem;
|
||||
height: 1.25rem;
|
||||
margin-left: 0.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width:36rem) {
|
||||
.sidebar {
|
||||
display: none;
|
||||
.bar {
|
||||
display: table;
|
||||
overflow: auto;
|
||||
margin: auto;
|
||||
margin-top: -0.5rem;
|
||||
}
|
||||
|
||||
.bar .me {
|
||||
float: left;
|
||||
height: 6.5rem;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.bar .info {
|
||||
float: left;
|
||||
margin-top: 0.5rem;
|
||||
margin-left: 1.5rem;
|
||||
}
|
||||
|
||||
.bar .contact-icons {
|
||||
margin-top: 1rem;
|
||||
margin-left: 0.25rem;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.bar .contact-icons a {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.bar .contact-icons img {
|
||||
width: 1.25rem;
|
||||
height: 1.25rem;
|
||||
margin-right: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width:58rem) {
|
||||
.container {
|
||||
max-width: 75rem;
|
||||
}
|
||||
|
||||
.leftcol {
|
||||
float: left;
|
||||
width: 50%;
|
||||
margin-top: -1rem;
|
||||
}
|
||||
|
||||
.leftcol > .inside {
|
||||
padding-right: 1rem;
|
||||
}
|
||||
|
||||
.rightcol {
|
||||
overflow: hidden;
|
||||
margin-top: -1rem;
|
||||
}
|
||||
|
||||
.rightcol > .inside {
|
||||
padding-left: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: #eee;
|
||||
@@ -218,75 +234,7 @@ pre {
|
||||
color: #555;
|
||||
}
|
||||
|
||||
body.dark {
|
||||
background-color: #000;
|
||||
color: #eee;
|
||||
}
|
||||
|
||||
body.dark a {
|
||||
color: #eee;
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
|
||||
body.dark pre {
|
||||
background-color: #222;
|
||||
}
|
||||
|
||||
body.dark :not(pre)>code {
|
||||
background-color: #222;
|
||||
}
|
||||
|
||||
body.dark .toc {
|
||||
background-color: #222;
|
||||
}
|
||||
|
||||
body.dark .content p.metadata {
|
||||
color: #aaa;
|
||||
}
|
||||
|
||||
body.dark .content img {
|
||||
filter: brightness(75%);
|
||||
}
|
||||
|
||||
body.dark .contact-icons img {
|
||||
filter: invert(1);
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
body.light {
|
||||
background-color: #eee;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
body.light a {
|
||||
color: #000;
|
||||
border-bottom: 1px solid #000;
|
||||
}
|
||||
|
||||
body.light pre {
|
||||
background-color: #ddd;
|
||||
}
|
||||
|
||||
body.light :not(pre)>code {
|
||||
background-color: #ddd;
|
||||
}
|
||||
|
||||
body.light .toc {
|
||||
background-color: #ddd;
|
||||
}
|
||||
|
||||
body.light .content p.metadata {
|
||||
color: #555;
|
||||
}
|
||||
|
||||
body.light .contact-icons img {
|
||||
filter: none;
|
||||
}
|
||||
|
||||
body.light .content img {
|
||||
filter: none;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: #000;
|
||||
color: #eee;
|
||||
|
||||
Reference in New Issue
Block a user