parent
82857b64f4
commit
7331fb5e90
@ -1,107 +0,0 @@
|
|||||||
---
|
|
||||||
title: "The \"Quiz Your Friends\" XSS Exploit"
|
|
||||||
layout: post
|
|
||||||
---
|
|
||||||
|
|
||||||
## TODO write intro
|
|
||||||
|
|
||||||
## How I Found This Exploit
|
|
||||||
|
|
||||||
While filling in one of my friend's surveys I thought it would be
|
|
||||||
funny for them to know it is me without anyone else knowing.
|
|
||||||
We were young and had `Inspect Element`ed a few things together,
|
|
||||||
so it was a safe bet that an HTML joke would let them know.
|
|
||||||
|
|
||||||
I decided to write my name like so: `<b>Steve</b>`.
|
|
||||||
Steve is in reference to the [main character](https://minecraft.gamepedia.com/Player) in the video game Minecraft.
|
|
||||||
|
|
||||||
|
|
||||||
<figure>
|
|
||||||
<img src="/assets/img/qyf-xss/2-bold.png">
|
|
||||||
<figcaption>
|
|
||||||
<p>Me typing in my name as <span class="mono"><b>Steve</b></span>.</p>
|
|
||||||
</figcaption>
|
|
||||||
</figure>
|
|
||||||
|
|
||||||
Now in theory this should have shown in in the leaderboard as: "<b>Steve</b>"
|
|
||||||
However, to my horror and excitement, I saw this in the leaderboard:
|
|
||||||
|
|
||||||
<figure>
|
|
||||||
<img src="/assets/img/qyf-xss/3-steve-board.png">
|
|
||||||
<figcaption>
|
|
||||||
<p><span class="mono"><b>Steve</b></span> displaying in the leaderboard as bold text: <b>Steve</b></p>
|
|
||||||
</figcaption>
|
|
||||||
</figure>
|
|
||||||
|
|
||||||
The text "Steve" showed up **in bold** on the leaderboard.
|
|
||||||
This told me all I needed to know.
|
|
||||||
How did this happen? You might wonder.
|
|
||||||
|
|
||||||
### Server-Side Validation
|
|
||||||
|
|
||||||
Here is a great demonstration why you should do most of your validation on the server side.
|
|
||||||
As a user, I can edit any of the HTML, CSS, or Javascript your server serves to me.
|
|
||||||
|
|
||||||
Quiz your friends uses the `maxlength=20` HTML attribute on the name input field.
|
|
||||||
Imagine trying to fit in a script tag doing anything useful with 20 characters! Don't forget that includes the `<script>` tag.
|
|
||||||
That would leave 13 characters for Javascript.
|
|
||||||
Although I'm sure a genius would be able to [code golf](https://code.golf/) that, I know I couldn't.
|
|
||||||
|
|
||||||
Now obviously I can edit any HTML that a server has sent to me.
|
|
||||||
If I open up my inspect element window, I can go ahead and change that `maxlength` attribute to anything I want.
|
|
||||||
Let's change it to 100!
|
|
||||||
|
|
||||||
<figure>
|
|
||||||
<img src="/assets/img/qyf-xss/5-maxlength.png" alt='An image of the Quiz Your Friends name input field with inspect element. THe code reads: <font class="style6"><input class="inputbutton" name="takername" type="text" id="takername" maxlength="20" width="425" placeholder="Your First Name" style="text-align: center; text-decoration:inherit; font-size:38px;" tabindex="-1"></font>'>
|
|
||||||
<figcaption>
|
|
||||||
Manually changing the maxlength attribute.
|
|
||||||
</figcaption>
|
|
||||||
</figure>
|
|
||||||
|
|
||||||
In theory, there is a way that a site can stop people from just putting in their name of any length: server-side validation.
|
|
||||||
The server *could* check to see if the input is too long and reject it if it is.
|
|
||||||
The Quiz My Friends server has *no such checks in place*.
|
|
||||||
Therefore, I can send an almost arbitrary load to them.
|
|
||||||
Being able to send something potentially very large (more than a few megabytes) is a vulnerability of its own.
|
|
||||||
Imagine being able to send entire executable programs as your "name" in one of these quizzes?
|
|
||||||
|
|
||||||
|
|
||||||
#### Hacking:
|
|
||||||
|
|
||||||
So I went on my merry way thinking about ways to use malicious javascript.
|
|
||||||
Then, I thought that might be mean, so I decided to warn users instead.
|
|
||||||
I filled in the name with a script tag and a call to `alert()` to warn the user about this site.
|
|
||||||
|
|
||||||
`JAVASCRIPT_NAME.JPG`
|
|
||||||
|
|
||||||
I ran out of room before I could finish it. Hmmm.
|
|
||||||
What if I do "Inspect Element" and manually override the max-length attribute?
|
|
||||||
|
|
||||||
The unfortunate truth is: this worked as well!
|
|
||||||
|
|
||||||
Not only could I manually set the max-length by changing it in the HTML,
|
|
||||||
but there were no client-side OR server-side checks to make sure the name I was sending was less than or equal to 20 characters.
|
|
||||||
|
|
||||||
If Javascript checked it, it would have stopped me (although maybe not a professional).
|
|
||||||
If the server checked it, it could have stopped almost anyone.
|
|
||||||
|
|
||||||
|
|
||||||
## Executing An Exploit
|
|
||||||
|
|
||||||
Suppose we're on a vulnerable site like [Quiz Your Friends](https://www.quizyourfriends.com/)
|
|
||||||
and you decide you want to hack your friend's quiz!
|
|
||||||
How can this be done?
|
|
||||||
|
|
||||||
#### Creating A Quiz
|
|
||||||
|
|
||||||
Here is my quiz below:
|
|
||||||
|
|
||||||
`CREATING_QUIZ.IMG`
|
|
||||||
|
|
||||||
#### Setting A Name With an HTML Tag
|
|
||||||
|
|
||||||
Just like the image above, about how I found out about this vulnerability: go ahead and use an HTML tag in your name to test this out.
|
|
||||||
|
|
||||||
`BOLD_ITALIC_STEVE.JPG`
|
|
||||||
|
|
||||||
|
|
@ -1,96 +1 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Padding And Margin | tait.tech</title> <link rel="stylesheet" href="/assets/css/style.css"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="author" content="Tait Hoyem"> <meta name="keywords" content=""> <meta name="description" content=""> </head> <body> <div id="wrapper"> <header> <h1>tait.tech</h1> <nav> <a href="/" class="nav-link">Home</a> <a href="/blog/" class="nav-link">Blog</a> <a href="/ideas/" class="nav-link">Ideas</a> <a href="/links/" class="nav-link">Links</a> <a href="https://github.com/TTWNO/" class="nav-link" target="_blank" rel="noopener noreferrer">Github</a> </nav> </header> <main> <article> <header> <h1 class="post-title">Padding And Margin</h1> <time datetime="20-01-22" class="post-date">Wednesday, January 22 2020</time> </header> <hr> <p>Many people have expressed confusion over how padding and margins work in HTML/CSS. I have been one of those people. In this short article I will explain what the differences are between the two, and how it may affect the functionality of your site.</p> <p>Here is an image from the World Wide Web Consortium (W3C) who sets the standards for the web.</p> <p><img src="/assets/img/w3c-padding-margin.png" alt="The W3C standard for padding, margin, borders and width. Width encompases the inner element + padding; the border then encompases it. The margin is the space beyond the border and in between other elements." title="W3C border, padding, margin standard."/></p> <p>Now although this image shows all the different types of spacing as equal, the majority of the time these will mostly be padding (inner) and margin (outer). Padding is the inner space between the element and its border; margin is the outer space between two different elements.</p> <p>Within the margin the user is unable to press any links or execute any javascript code. It is <em>empty</em> space. If each <code class="language-plaintext highlighter-rouge"><link></code> on your navigation bar has 10 pixels of margin, then there would be 20 pixels in between each <code class="language-plaintext highlighter-rouge"><link></code> that would <em>not</em> be clickable by the user.</p> <p>If you have <code class="language-plaintext highlighter-rouge"><link></code>s on your navigation bar with <em>padding</em> set to 20 pixels, however, then there will be 20 pixels on each side of the <code class="language-plaintext highlighter-rouge"><link></code> text where the user <em>is</em> able to click.</p> <p>If that part is confusing, try thinking about it in terms of whether <code class="language-plaintext highlighter-rouge">background-color</code> would apply.</p> <table> <thead> <tr> <th>Attribute</th> <th><strong>Padding</strong></th> <th><strong>Margin</strong></th> </tr> </thead> <tbody> <tr> <td>Spacing</td> <td>within element</td> <td>between elements</td> </tr> <tr> <td><code class="language-plaintext highlighter-rouge">background-color</code> applies</td> <td>Yes</td> <td>No</td> </tr> </tbody> </table> <p>In summary:</p> <ul> <li><strong>Padding</strong>: the space within a tag which is still part of the same tag. <code class="language-plaintext highlighter-rouge">background-color</code> applies.</li> <li><strong>Margin</strong>: the space in between two seperate tags. <code class="language-plaintext highlighter-rouge">background-color</code> does not apply; it is empty space.</li> <li><strong>Border</strong>: the space in between the two; it surrounds the padding, but is not the margin. It looks nice somtimes, but it has no non-visual function. <code class="language-plaintext highlighter-rouge">background-color</code> does not apply.</li> </ul> <p>I hope this covers the basics of margin and padding! Happy coding!</p> </article> </main> <hr> <footer> This page is mirrored on <a href="https://beta.tait.tech/2020/01/22/padding-and-margin/">beta.tait.tech</a>. </footer> </div> </body> </html>
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<title>Padding And Margin | tait.tech</title>
|
|
||||||
<link rel="stylesheet" href="/assets/css/style.css">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<meta name="author" content="Tait Hoyem">
|
|
||||||
<meta name="keywords" content="">
|
|
||||||
<meta name="description" content="">
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div id="wrapper">
|
|
||||||
<header>
|
|
||||||
<h1>tait.tech</h1>
|
|
||||||
|
|
||||||
<nav>
|
|
||||||
|
|
||||||
<a href="/" class="nav-link" >Home</a>
|
|
||||||
|
|
||||||
<a href="/blog/" class="nav-link" >Blog</a>
|
|
||||||
|
|
||||||
<a href="/ideas/" class="nav-link" >Ideas</a>
|
|
||||||
|
|
||||||
<a href="/links/" class="nav-link" >Links</a>
|
|
||||||
|
|
||||||
<a href="https://github.com/TTWNO/" class="nav-link" target="_blank" rel="noopener noreferrer" >Github</a>
|
|
||||||
|
|
||||||
</nav>
|
|
||||||
|
|
||||||
</header>
|
|
||||||
<main>
|
|
||||||
<article>
|
|
||||||
<header>
|
|
||||||
<h1 class="post-title">Padding And Margin</h1>
|
|
||||||
<time datetime="20-01-22" class="post-date">Wednesday, January 22 2020</time>
|
|
||||||
</header>
|
|
||||||
<hr>
|
|
||||||
|
|
||||||
<p>Many people have expressed confusion over how padding and margins work in HTML/CSS. I have been one of those people. In this short article I will explain what the differences are between the two, and how it may affect the functionality of your site.</p>
|
|
||||||
|
|
||||||
<p>Here is an image from the World Wide Web Consortium (W3C) who sets the standards for the web.</p>
|
|
||||||
|
|
||||||
<p><img src="/assets/img/w3c-padding-margin.png" alt="The W3C standard for padding, margin, borders and width. Width encompases the inner element + padding; the border then encompases it. The margin is the space beyond the border and in between other elements." title="W3C border, padding, margin standard." /></p>
|
|
||||||
|
|
||||||
<p>Now although this image shows all the different types of spacing as equal, the majority of the time these will mostly be padding (inner) and margin (outer). Padding is the inner space between the element and its border; margin is the outer space between two different elements.</p>
|
|
||||||
|
|
||||||
<p>Within the margin the user is unable to press any links or execute any javascript code. It is <em>empty</em> space. If each <code class="language-plaintext highlighter-rouge"><link></code> on your navigation bar has 10 pixels of margin, then there would be 20 pixels in between each <code class="language-plaintext highlighter-rouge"><link></code> that would <em>not</em> be clickable by the user.</p>
|
|
||||||
|
|
||||||
<p>If you have <code class="language-plaintext highlighter-rouge"><link></code>s on your navigation bar with <em>padding</em> set to 20 pixels, however, then there will be 20 pixels on each side of the <code class="language-plaintext highlighter-rouge"><link></code> text where the user <em>is</em> able to click.</p>
|
|
||||||
|
|
||||||
<p>If that part is confusing, try thinking about it in terms of whether <code class="language-plaintext highlighter-rouge">background-color</code> would apply.</p>
|
|
||||||
|
|
||||||
<table>
|
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
<th>Attribute</th>
|
|
||||||
<th><strong>Padding</strong></th>
|
|
||||||
<th><strong>Margin</strong></th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
|
||||||
<tr>
|
|
||||||
<td>Spacing</td>
|
|
||||||
<td>within element</td>
|
|
||||||
<td>between elements</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td><code class="language-plaintext highlighter-rouge">background-color</code> applies</td>
|
|
||||||
<td>Yes</td>
|
|
||||||
<td>No</td>
|
|
||||||
</tr>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
|
|
||||||
<p>In summary:</p>
|
|
||||||
<ul>
|
|
||||||
<li><strong>Padding</strong>: the space within a tag which is still part of the same tag. <code class="language-plaintext highlighter-rouge">background-color</code> applies.</li>
|
|
||||||
<li><strong>Margin</strong>: the space in between two seperate tags. <code class="language-plaintext highlighter-rouge">background-color</code> does not apply; it is empty space.</li>
|
|
||||||
<li><strong>Border</strong>: the space in between the two; it surrounds the padding, but is not the margin. It looks nice somtimes, but it has no non-visual function. <code class="language-plaintext highlighter-rouge">background-color</code> does not apply.</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<p>I hope this covers the basics of margin and padding! Happy coding!</p>
|
|
||||||
|
|
||||||
|
|
||||||
</article>
|
|
||||||
|
|
||||||
</main>
|
|
||||||
<hr>
|
|
||||||
<footer>
|
|
||||||
This page is mirrored on <a href="https://beta.tait.tech/2020/01/22/padding-and-margin/">beta.tait.tech</a>.
|
|
||||||
|
|
||||||
</footer>
|
|
||||||
</div>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -1,68 +1,5 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>rfi: A Simple Linux utility to get a random file from a directory | tait.tech</title> <link rel="stylesheet" href="/assets/css/style.css"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="author" content="Tait Hoyem"> <meta name="keywords" content=""> <meta name="description" content=""> </head> <body> <div id="wrapper"> <header> <h1>tait.tech</h1> <nav> <a href="/" class="nav-link">Home</a> <a href="/blog/" class="nav-link">Blog</a> <a href="/ideas/" class="nav-link">Ideas</a> <a href="/links/" class="nav-link">Links</a> <a href="https://github.com/TTWNO/" class="nav-link" target="_blank" rel="noopener noreferrer">Github</a> </nav> </header> <main> <article> <header> <h1 class="post-title">rfi: A Simple Linux utility to get a random file from a directory</h1> <time datetime="20-04-21" class="post-date">Tuesday, April 21 2020</time> </header> <hr> <p>I made a <a href="https://lbry.tv/@tait:7/rfi:5">little video</a> about this script I wrote:</p> <pre class="terminal">
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<title>rfi: A Simple Linux utility to get a random file from a directory | tait.tech</title>
|
|
||||||
<link rel="stylesheet" href="/assets/css/style.css">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<meta name="author" content="Tait Hoyem">
|
|
||||||
<meta name="keywords" content="">
|
|
||||||
<meta name="description" content="">
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div id="wrapper">
|
|
||||||
<header>
|
|
||||||
<h1>tait.tech</h1>
|
|
||||||
|
|
||||||
<nav>
|
|
||||||
|
|
||||||
<a href="/" class="nav-link" >Home</a>
|
|
||||||
|
|
||||||
<a href="/blog/" class="nav-link" >Blog</a>
|
|
||||||
|
|
||||||
<a href="/ideas/" class="nav-link" >Ideas</a>
|
|
||||||
|
|
||||||
<a href="/links/" class="nav-link" >Links</a>
|
|
||||||
|
|
||||||
<a href="https://github.com/TTWNO/" class="nav-link" target="_blank" rel="noopener noreferrer" >Github</a>
|
|
||||||
|
|
||||||
</nav>
|
|
||||||
|
|
||||||
</header>
|
|
||||||
<main>
|
|
||||||
<article>
|
|
||||||
<header>
|
|
||||||
<h1 class="post-title">rfi: A Simple Linux utility to get a random file from a directory</h1>
|
|
||||||
<time datetime="20-04-21" class="post-date">Tuesday, April 21 2020</time>
|
|
||||||
</header>
|
|
||||||
<hr>
|
|
||||||
|
|
||||||
<p>I made a <a href="https://lbry.tv/@tait:7/rfi:5">little video</a> about this script I wrote:</p>
|
|
||||||
|
|
||||||
<pre class="terminal">
|
|
||||||
$ rfi
|
$ rfi
|
||||||
</pre>
|
</pre> <p>This program gets a random file from your current directory if you do not specify one; it gets a random file from the specified directory if you give it one like so:</p> <pre class="terminal">
|
||||||
|
|
||||||
<p>This program gets a random file from your current directory
|
|
||||||
if you do not specify one;
|
|
||||||
it gets a random file from the specified directory if you give it one like so:</p>
|
|
||||||
|
|
||||||
<pre class="terminal">
|
|
||||||
# rfi /etc/wireguard
|
# rfi /etc/wireguard
|
||||||
</pre>
|
</pre> <p>Which is very useful if you want to start a random VPN configuration :)</p> <p>The code, comments, etc. are on the <a href="https://github.com/TTWNO/scripts">Github</a>.</p> </article> </main> <hr> <footer> This page is mirrored on <a href="https://beta.tait.tech/2020/04/21/rfi/">beta.tait.tech</a>. </footer> </div> </body> </html>
|
||||||
|
|
||||||
<p>Which is very useful if you want to start a random VPN configuration :)</p>
|
|
||||||
|
|
||||||
<p>The code, comments, etc. are on the <a href="https://github.com/TTWNO/scripts">Github</a>.</p>
|
|
||||||
|
|
||||||
</article>
|
|
||||||
|
|
||||||
</main>
|
|
||||||
<hr>
|
|
||||||
<footer>
|
|
||||||
This page is mirrored on <a href="https://beta.tait.tech/2020/04/21/rfi/">beta.tait.tech</a>.
|
|
||||||
|
|
||||||
</footer>
|
|
||||||
</div>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
@ -1,57 +1 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Site Update | tait.tech</title> <link rel="stylesheet" href="/assets/css/style.css"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="author" content="Tait Hoyem"> <meta name="keywords" content=""> <meta name="description" content=""> </head> <body> <div id="wrapper"> <header> <h1>tait.tech</h1> <nav> <a href="/" class="nav-link">Home</a> <a href="/blog/" class="nav-link">Blog</a> <a href="/ideas/" class="nav-link">Ideas</a> <a href="/links/" class="nav-link">Links</a> <a href="https://github.com/TTWNO/" class="nav-link" target="_blank" rel="noopener noreferrer">Github</a> </nav> </header> <main> <article> <header> <h1 class="post-title">Site Update</h1> <time datetime="20-06-04" class="post-date">Thursday, June 04 2020</time> </header> <hr> <p>I updated the site with some easier to identify information about me and my projects :)</p> <p>Also, Clue has been delayed due to my partner in crime on the project wokring too many hours.</p> <p>I also posted a new project called <em><a href="https://github.com/TTWNO/caesar-cipher">Caesar Cipher</a></em> in C. It will be an intermediate example of how to use build systems like <code class="language-plaintext highlighter-rouge">make</code>.</p> </article> </main> <hr> <footer> This page is mirrored on <a href="https://beta.tait.tech/2020/06/04/site-update/">beta.tait.tech</a>. </footer> </div> </body> </html>
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<title>Site Update | tait.tech</title>
|
|
||||||
<link rel="stylesheet" href="/assets/css/style.css">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<meta name="author" content="Tait Hoyem">
|
|
||||||
<meta name="keywords" content="">
|
|
||||||
<meta name="description" content="">
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div id="wrapper">
|
|
||||||
<header>
|
|
||||||
<h1>tait.tech</h1>
|
|
||||||
|
|
||||||
<nav>
|
|
||||||
|
|
||||||
<a href="/" class="nav-link" >Home</a>
|
|
||||||
|
|
||||||
<a href="/blog/" class="nav-link" >Blog</a>
|
|
||||||
|
|
||||||
<a href="/ideas/" class="nav-link" >Ideas</a>
|
|
||||||
|
|
||||||
<a href="/links/" class="nav-link" >Links</a>
|
|
||||||
|
|
||||||
<a href="https://github.com/TTWNO/" class="nav-link" target="_blank" rel="noopener noreferrer" >Github</a>
|
|
||||||
|
|
||||||
</nav>
|
|
||||||
|
|
||||||
</header>
|
|
||||||
<main>
|
|
||||||
<article>
|
|
||||||
<header>
|
|
||||||
<h1 class="post-title">Site Update</h1>
|
|
||||||
<time datetime="20-06-04" class="post-date">Thursday, June 04 2020</time>
|
|
||||||
</header>
|
|
||||||
<hr>
|
|
||||||
|
|
||||||
<p>I updated the site with some easier to identify information about me and my projects :)</p>
|
|
||||||
|
|
||||||
<p>Also, Clue has been delayed due to my partner in crime on the project wokring too many hours.</p>
|
|
||||||
|
|
||||||
<p>I also posted a new project called <em><a href="https://github.com/TTWNO/caesar-cipher">Caesar Cipher</a></em> in C. It will be an intermediate example of how to use build systems like <code class="language-plaintext highlighter-rouge">make</code>.</p>
|
|
||||||
|
|
||||||
|
|
||||||
</article>
|
|
||||||
|
|
||||||
</main>
|
|
||||||
<hr>
|
|
||||||
<footer>
|
|
||||||
This page is mirrored on <a href="https://beta.tait.tech/2020/06/04/site-update/">beta.tait.tech</a>.
|
|
||||||
|
|
||||||
</footer>
|
|
||||||
</div>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -1,108 +1 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Lichess Accessibility | tait.tech</title> <link rel="stylesheet" href="/assets/css/style.css"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="author" content="Tait Hoyem"> <meta name="keywords" content=""> <meta name="description" content=""> </head> <body> <div id="wrapper"> <header> <h1>tait.tech</h1> <nav> <a href="/" class="nav-link">Home</a> <a href="/blog/" class="nav-link">Blog</a> <a href="/ideas/" class="nav-link">Ideas</a> <a href="/links/" class="nav-link">Links</a> <a href="https://github.com/TTWNO/" class="nav-link" target="_blank" rel="noopener noreferrer">Github</a> </nav> </header> <main> <article> <header> <h1 class="post-title">Lichess Accessibility</h1> <time datetime="" class="post-date"></time> </header> <hr> I wanted to play chess with somebody who used a screen reader, without requiring a screen reader myself; some sites, like QuintenC's Playroom have a rather poor visual interface for anyone who would like the play the game visually. [Lichess](https://lichess.org) is an free and open-source website for chess players; it bridges this gap by having two "modes" on the site: standard mode and accessibility mode. ## Accessibility Mode Accessibility mode is far from perfect on lichess.org. That said, the idea to separate the sites into different modes was a good call. It stops the inevitable "this would work well for screen readers but cause visual issues" shenanigans, or, vice-verse "this looks great but it might be weird with a screen reader". This way all the things which affect the visual interface are in one place, and all things which affect the non-visual user interface (NVUI) are written in another. In my quest to play chess with visual and non-visual players with both having optimal experiences, I tried Lichess with my friend from [melly.tech](https://melly.tech/). She pointed out that the method to interface with the board previously was rather poor. This is because it required an "enter" at the end of each command and the commands tended to read out a row or column of a chessboard not just an individual square. For example, to list all pieces (or lack thereof) on the e file, I would type the command: ``` s e ``` Although this seems good in theory, and it's great when you need an entire file, there was no way to get only one square. In addition, imagine typing to navigate around the board: ``` s e1 s f1 s e2 ``` For the inexperienced player, it seems to be more convenient to bind some keys and have the user bounce to various buttons, which they can push to say "I want to move this piece". This is what I was told anyway. So I want to work making a system so you could use the following basic keys: * left/right/up/down arrow: move on the board. * k/q/r/b/n/p: move to next piece represented by its character in chess notation. * shift + k/q/r/b/n/p: move back to the last piece represented by its character in chess notation. * click/enter/space: select piece to move. * click/enter/space again: move piece here. * m: show where I can move with this piece. * shift+m: show where I can capture with this piece. * 1-8: move to rank 1-8; stay on same file. * shift + 1-8: move to file a-h; stay on same rank. This gives a pretty solid basis for playing the game. One caveat is after you have moved a pawn all the way to the farthest rank, only the destination tile will accept your promotion choice. Therefore, all the other keys still work on other square, but if you are on the destination square of a promotion q/r/b/n will promote your piece, not jump you to the next/previous one. This pull request was merged earlier this month: ## More To Come </article> </main> <hr> <footer> This page is mirrored on <a href="https://beta.tait.tech/3q">beta.tait.tech</a>. </footer> </div> </body> </html>
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<title>Lichess Accessibility | tait.tech</title>
|
|
||||||
<link rel="stylesheet" href="/assets/css/style.css">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<meta name="author" content="Tait Hoyem">
|
|
||||||
<meta name="keywords" content="">
|
|
||||||
<meta name="description" content="">
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div id="wrapper">
|
|
||||||
<header>
|
|
||||||
<h1>tait.tech</h1>
|
|
||||||
|
|
||||||
<nav>
|
|
||||||
|
|
||||||
<a href="/" class="nav-link" >Home</a>
|
|
||||||
|
|
||||||
<a href="/blog/" class="nav-link" >Blog</a>
|
|
||||||
|
|
||||||
<a href="/ideas/" class="nav-link" >Ideas</a>
|
|
||||||
|
|
||||||
<a href="/links/" class="nav-link" >Links</a>
|
|
||||||
|
|
||||||
<a href="https://github.com/TTWNO/" class="nav-link" target="_blank" rel="noopener noreferrer" >Github</a>
|
|
||||||
|
|
||||||
</nav>
|
|
||||||
|
|
||||||
</header>
|
|
||||||
<main>
|
|
||||||
<article>
|
|
||||||
<header>
|
|
||||||
<h1 class="post-title">Lichess Accessibility</h1>
|
|
||||||
<time datetime="" class="post-date"></time>
|
|
||||||
</header>
|
|
||||||
<hr>
|
|
||||||
|
|
||||||
I wanted to play chess with somebody who used a screen reader, without requiring a screen reader myself;
|
|
||||||
some sites, like QuintenC's Playroom have a rather poor visual interface for anyone who would like the play the game visually.
|
|
||||||
[Lichess](https://lichess.org) is an free and open-source website for chess players;
|
|
||||||
it bridges this gap by having two "modes" on the site:
|
|
||||||
standard mode and accessibility mode.
|
|
||||||
|
|
||||||
## Accessibility Mode
|
|
||||||
|
|
||||||
Accessibility mode is far from perfect on lichess.org.
|
|
||||||
That said, the idea to separate the sites into different modes was a good call.
|
|
||||||
It stops the inevitable "this would work well for screen readers but cause visual issues" shenanigans,
|
|
||||||
or, vice-verse "this looks great but it might be weird with a screen reader".
|
|
||||||
This way all the things which affect the visual interface are in one place,
|
|
||||||
and all things which affect the non-visual user interface (NVUI) are written in another.
|
|
||||||
|
|
||||||
In my quest to play chess with visual and non-visual players with both having optimal experiences, I tried Lichess with my friend from [melly.tech](https://melly.tech/).
|
|
||||||
She pointed out that the method to interface with the board previously was rather poor.
|
|
||||||
This is because it required an "enter" at the end of each command and the commands tended to read out a row or column of a chessboard not just an individual square.
|
|
||||||
|
|
||||||
For example, to list all pieces (or lack thereof) on the e file, I would type the command:
|
|
||||||
|
|
||||||
```
|
|
||||||
s e
|
|
||||||
```
|
|
||||||
|
|
||||||
Although this seems good in theory, and it's great when you need an entire file, there was no way to get only one square.
|
|
||||||
In addition, imagine typing to navigate around the board:
|
|
||||||
|
|
||||||
```
|
|
||||||
s e1
|
|
||||||
s f1
|
|
||||||
s e2
|
|
||||||
```
|
|
||||||
|
|
||||||
For the inexperienced player, it seems to be more convenient to bind some keys and have the user bounce to various buttons, which they can push to say "I want to move this piece".
|
|
||||||
This is what I was told anyway.
|
|
||||||
So I want to work making a system so you could use the following basic keys:
|
|
||||||
|
|
||||||
* left/right/up/down arrow: move on the board.
|
|
||||||
* k/q/r/b/n/p: move to next piece represented by its character in chess notation.
|
|
||||||
* shift + k/q/r/b/n/p: move back to the last piece represented by its character in chess notation.
|
|
||||||
* click/enter/space: select piece to move.
|
|
||||||
* click/enter/space again: move piece here.
|
|
||||||
* m: show where I can move with this piece.
|
|
||||||
* shift+m: show where I can capture with this piece.
|
|
||||||
* 1-8: move to rank 1-8; stay on same file.
|
|
||||||
* shift + 1-8: move to file a-h; stay on same rank.
|
|
||||||
|
|
||||||
This gives a pretty solid basis for playing the game.
|
|
||||||
One caveat is after you have moved a pawn all the way to the farthest rank, only the destination tile will accept your promotion choice.
|
|
||||||
Therefore, all the other keys still work on other square, but if you are on the destination square of a promotion q/r/b/n will promote your piece, not jump you to the next/previous one.
|
|
||||||
|
|
||||||
This pull request was merged earlier this month:
|
|
||||||
|
|
||||||
## More To Come
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</article>
|
|
||||||
|
|
||||||
</main>
|
|
||||||
<hr>
|
|
||||||
<footer>
|
|
||||||
This page is mirrored on <a href="https://beta.tait.tech/3q">beta.tait.tech</a>.
|
|
||||||
|
|
||||||
</footer>
|
|
||||||
</div>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
@ -1,45 +1 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>About | tait.tech</title> <link rel="stylesheet" href="/assets/css/style.css"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="author" content="Tait Hoyem"> <meta name="keywords" content=""> <meta name="description" content=""> </head> <body> <div id="wrapper"> <header> <h1>tait.tech</h1> <nav> <a href="/" class="nav-link">Home</a> <a href="/blog/" class="nav-link">Blog</a> <a href="/ideas/" class="nav-link">Ideas</a> <a href="/links/" class="nav-link">Links</a> <a href="https://github.com/TTWNO/" class="nav-link" target="_blank" rel="noopener noreferrer">Github</a> </nav> </header> <main> <h1 id="tait-hoyem">Tait Hoyem</h1> <p>I believe in three fundamentals</p> </main> <hr> <footer> This page is mirrored on <a href="https://beta.tait.tech/about/">beta.tait.tech</a>. </footer> </div> </body> </html>
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<title>About | tait.tech</title>
|
|
||||||
<link rel="stylesheet" href="/assets/css/style.css">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<meta name="author" content="Tait Hoyem">
|
|
||||||
<meta name="keywords" content="">
|
|
||||||
<meta name="description" content="">
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div id="wrapper">
|
|
||||||
<header>
|
|
||||||
<h1>tait.tech</h1>
|
|
||||||
|
|
||||||
<nav>
|
|
||||||
|
|
||||||
<a href="/" class="nav-link" >Home</a>
|
|
||||||
|
|
||||||
<a href="/blog/" class="nav-link" >Blog</a>
|
|
||||||
|
|
||||||
<a href="/ideas/" class="nav-link" >Ideas</a>
|
|
||||||
|
|
||||||
<a href="/links/" class="nav-link" >Links</a>
|
|
||||||
|
|
||||||
<a href="https://github.com/TTWNO/" class="nav-link" target="_blank" rel="noopener noreferrer" >Github</a>
|
|
||||||
|
|
||||||
</nav>
|
|
||||||
|
|
||||||
</header>
|
|
||||||
<main>
|
|
||||||
<h1 id="tait-hoyem">Tait Hoyem</h1>
|
|
||||||
|
|
||||||
<p>I believe in three fundamentals</p>
|
|
||||||
|
|
||||||
</main>
|
|
||||||
<hr>
|
|
||||||
<footer>
|
|
||||||
This page is mirrored on <a href="https://beta.tait.tech/about/">beta.tait.tech</a>.
|
|
||||||
|
|
||||||
</footer>
|
|
||||||
</div>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
File diff suppressed because one or more lines are too long
@ -1,285 +1 @@
|
|||||||
body { background-color: #fefefe; padding: 16px; font-family: -apple-system, helvetica, arial, sans-serif; font-size: 16px; color: #444444; line-height: 1.5em; overflow-wrap: break-word; }
|
body{background-color:#fefefe;padding:16px;font-family:-apple-system,helvetica,arial,sans-serif;font-size:16px;color:#444;line-height:1.5em;overflow-wrap:break-word}#wrapper{max-width:800px;margin:auto}#wrapper>header{text-align:center}.clear-list{list-style-type:none;margin:0;padding:0}.clear-list li{margin:0;padding:0}.projects a{font-weight:bold}h1,h2,h3,h4,h5,h6{line-height:1em}header{margin-bottom:32px}hr{border:0;border-bottom:1px solid #999}a{text-decoration:underline;color:#47a}a:visited{color:#941452}a.nav-link,a.post-title-link{color:#333;text-decoration:none}.post-title{line-height:1.5em;color:#333}a.citation-link{text-decoration:none}nav{text-align:center;padding:1em 0}nav a{margin:1em;color:#333;font-weight:bold;font-style:none}nav a:hover{text-decoration:underline}li{margin:.5em}p{padding:.1em 0}table,table tr,table td,table th{border:1px solid #aaa;border-collapse:collapse;padding:5px;font-weight:normal}table th{font-weight:bold}table{width:75%;margin:auto}img{display:block;width:55%;margin-left:auto;margin-right:auto}blockquote{font-style:italic}address{font-style:normal}@media screen and (max-width:600px){body{width:90%}#info{margin:0 7px}.menu-content{max-height:0;overflow:hidden}nav{text-align:left;width:100%}nav a{display:block;text-align:left;padding-left:0;margin-left:0}}.mono{font-family:monospace}.bold{font-weight:bold}sup{margin:0;padding:0}figcaption{margin-top:10px;font-style:italic}footer{padding-top:16px;margin-bottom:100px}.terminal{line-height:1em;overflow:scroll;padding:10px;color:#00ff41;margin:0;background-color:#151515}.file{overflow:scroll;padding:10px;margin:0;line-height:1.2em;background-color:#dfdfdf;color:#000}.small-image{width:100%}.post-date{font-size:18px;text-transform:uppercase;font-weight:bold;color:#555}.post-excerpt{margin:16px;margin-bottom:0}.highlight .hll{background-color:#ffc}.highlight{background:#f0f0f0}.highlight .c{color:#60a0b0;font-style:italic}.highlight .err{border:1px solid #f00}.highlight .k{color:#007020;font-weight:bold}.highlight .o{color:#666}.highlight .ch{color:#60a0b0;font-style:italic}.highlight .cm{color:#60a0b0;font-style:italic}.highlight .cp{color:#007020}.highlight .cpf{color:#60a0b0;font-style:italic}.highlight .c1{color:#60a0b0;font-style:italic}.highlight .cs{color:#60a0b0;background-color:#fff0f0}.highlight .gd{color:#a00000}.highlight .ge{font-style:italic}.highlight .gr{color:#f00}.highlight .gh{color:#000080;font-weight:bold}.highlight .gi{color:#00a000}.highlight .go{color:#888}.highlight .gp{color:#c65d09;font-weight:bold}.highlight .gs{font-weight:bold}.highlight .gu{color:#800080;font-weight:bold}.highlight .gt{color:#04d}.highlight .kc{color:#007020;font-weight:bold}.highlight .kd{color:#007020;font-weight:bold}.highlight .kn{color:#007020;font-weight:bold}.highlight .kp{color:#007020}.highlight .kr{color:#007020;font-weight:bold}.highlight .kt{color:#902000}.highlight .m{color:#40a070}.highlight .s{color:#4070a0}.highlight .na{color:#4070a0}.highlight .nb{color:#007020}.highlight .nc{color:#0e84b5;font-weight:bold}.highlight .no{color:#60add5}.highlight .nd{color:#555;font-weight:bold}.highlight .ni{color:#d55537;font-weight:bold}.highlight .ne{color:#007020}.highlight .nf{color:#06287e}.highlight .nl{color:#002070;font-weight:bold}.highlight .nn{color:#0e84b5;font-weight:bold}.highlight .nt{color:#062873;font-weight:bold}.highlight .nv{color:#bb60d5}.highlight .ow{color:#007020;font-weight:bold}.highlight .w{color:#bbb}.highlight .mb{color:#40a070}.highlight .mf{color:#40a070}.highlight .mh{color:#40a070}.highlight .mi{color:#40a070}.highlight .mo{color:#40a070}.highlight .sa{color:#4070a0}.highlight .sb{color:#4070a0}.highlight .sc{color:#4070a0}.highlight .dl{color:#4070a0}.highlight .sd{color:#4070a0;font-style:italic}.highlight .s2{color:#4070a0}.highlight .se{color:#4070a0;font-weight:bold}.highlight .sh{color:#4070a0}.highlight .si{color:#70a0d0;font-style:italic}.highlight .sx{color:#c65d09}.highlight .sr{color:#235388}.highlight .s1{color:#4070a0}.highlight .ss{color:#517918}.highlight .bp{color:#007020}.highlight .fm{color:#06287e}.highlight .vc{color:#bb60d5}.highlight .vg{color:#bb60d5}.highlight .vi{color:#bb60d5}.highlight .vm{color:#bb60d5}.highlight .il{color:#40a070}.highlight .n{color:#000}div.highlight{padding:0 5px;width:85%;margin:auto;overflow-x:scroll}
|
||||||
|
|
||||||
#wrapper { max-width: 800px; margin: auto; }
|
|
||||||
|
|
||||||
#wrapper > header { text-align: center; }
|
|
||||||
|
|
||||||
.clear-list { list-style-type: none; margin: 0; padding: 0; }
|
|
||||||
|
|
||||||
.clear-list li { margin: 0; padding: 0; }
|
|
||||||
|
|
||||||
.projects a { font-weight: bold; }
|
|
||||||
|
|
||||||
h1, h2, h3, h4, h5, h6 { line-height: 1em; }
|
|
||||||
|
|
||||||
header { margin-bottom: 32px; }
|
|
||||||
|
|
||||||
hr { border: none; border-bottom: 1px solid #999; }
|
|
||||||
|
|
||||||
a { text-decoration: underline; color: #47a; }
|
|
||||||
|
|
||||||
a:visited { color: #941452; }
|
|
||||||
|
|
||||||
a.nav-link, a.post-title-link { color: #333; text-decoration: none; }
|
|
||||||
|
|
||||||
.post-title { line-height: 1.5em; color: #333; }
|
|
||||||
|
|
||||||
a.citation-link { text-decoration: none; }
|
|
||||||
|
|
||||||
nav { text-align: center; padding: 1em 0px; }
|
|
||||||
|
|
||||||
nav a { margin: 1em; color: #333; font-weight: bold; font-style: none; }
|
|
||||||
|
|
||||||
nav a:hover { text-decoration: underline; }
|
|
||||||
|
|
||||||
li { margin: .5em; }
|
|
||||||
|
|
||||||
p { padding: .1em 0; }
|
|
||||||
|
|
||||||
table, table tr, table td, table th { border: 1px solid #aaa; border-collapse: collapse; padding: 5px; font-weight: normal; }
|
|
||||||
|
|
||||||
table th { font-weight: bold; }
|
|
||||||
|
|
||||||
table { width: 75%; margin: auto; }
|
|
||||||
|
|
||||||
img { display: block; width: 55%; margin-left: auto; margin-right: auto; }
|
|
||||||
|
|
||||||
blockquote { font-style: italic; }
|
|
||||||
|
|
||||||
address { font-style: normal; }
|
|
||||||
|
|
||||||
@media screen and (max-width: 600px) { body { width: 90%; } #info { margin: 0 7px; } .menu-content { max-height: 0; overflow: hidden; } nav { text-align: left; width: 100%; } nav a { display: block; text-align: left; padding-left: 0; margin-left: 0; } }
|
|
||||||
|
|
||||||
.mono { font-family: monospace; }
|
|
||||||
|
|
||||||
.bold { font-weight: bold; }
|
|
||||||
|
|
||||||
sup { margin: 0; padding: 0; }
|
|
||||||
|
|
||||||
figcaption { margin-top: 10px; font-style: italic; }
|
|
||||||
|
|
||||||
footer { padding-top: 16px; margin-bottom: 100px; }
|
|
||||||
|
|
||||||
.terminal { line-height: 1em; overflow: scroll; padding: 10px; color: #00FF41; margin: 0px; background-color: #151515; }
|
|
||||||
|
|
||||||
.file { overflow: scroll; padding: 10px; margin: 0px; line-height: 1.2em; background-color: #dfdfdf; color: #000; }
|
|
||||||
|
|
||||||
.small-image { width: 100%; }
|
|
||||||
|
|
||||||
.post-date { font-size: 18px; text-transform: uppercase; font-weight: bold; color: #555; }
|
|
||||||
|
|
||||||
.post-excerpt { margin: 16px; margin-bottom: 0; }
|
|
||||||
|
|
||||||
/* code highlghting */
|
|
||||||
.highlight .hll { background-color: #ffffcc; }
|
|
||||||
|
|
||||||
.highlight { background: #f0f0f0; }
|
|
||||||
|
|
||||||
.highlight .c { color: #60a0b0; font-style: italic; }
|
|
||||||
|
|
||||||
/* Comment */
|
|
||||||
.highlight .err { border: 1px solid #FF0000; }
|
|
||||||
|
|
||||||
/* Error */
|
|
||||||
.highlight .k { color: #007020; font-weight: bold; }
|
|
||||||
|
|
||||||
/* Keyword */
|
|
||||||
.highlight .o { color: #666666; }
|
|
||||||
|
|
||||||
/* Operator */
|
|
||||||
.highlight .ch { color: #60a0b0; font-style: italic; }
|
|
||||||
|
|
||||||
/* Comment.Hashbang */
|
|
||||||
.highlight .cm { color: #60a0b0; font-style: italic; }
|
|
||||||
|
|
||||||
/* Comment.Multiline */
|
|
||||||
.highlight .cp { color: #007020; }
|
|
||||||
|
|
||||||
/* Comment.Preproc */
|
|
||||||
.highlight .cpf { color: #60a0b0; font-style: italic; }
|
|
||||||
|
|
||||||
/* Comment.PreprocFile */
|
|
||||||
.highlight .c1 { color: #60a0b0; font-style: italic; }
|
|
||||||
|
|
||||||
/* Comment.Single */
|
|
||||||
.highlight .cs { color: #60a0b0; background-color: #fff0f0; }
|
|
||||||
|
|
||||||
/* Comment.Special */
|
|
||||||
.highlight .gd { color: #A00000; }
|
|
||||||
|
|
||||||
/* Generic.Deleted */
|
|
||||||
.highlight .ge { font-style: italic; }
|
|
||||||
|
|
||||||
/* Generic.Emph */
|
|
||||||
.highlight .gr { color: #FF0000; }
|
|
||||||
|
|
||||||
/* Generic.Error */
|
|
||||||
.highlight .gh { color: #000080; font-weight: bold; }
|
|
||||||
|
|
||||||
/* Generic.Heading */
|
|
||||||
.highlight .gi { color: #00A000; }
|
|
||||||
|
|
||||||
/* Generic.Inserted */
|
|
||||||
.highlight .go { color: #888888; }
|
|
||||||
|
|
||||||
/* Generic.Output */
|
|
||||||
.highlight .gp { color: #c65d09; font-weight: bold; }
|
|
||||||
|
|
||||||
/* Generic.Prompt */
|
|
||||||
.highlight .gs { font-weight: bold; }
|
|
||||||
|
|
||||||
/* Generic.Strong */
|
|
||||||
.highlight .gu { color: #800080; font-weight: bold; }
|
|
||||||
|
|
||||||
/* Generic.Subheading */
|
|
||||||
.highlight .gt { color: #0044DD; }
|
|
||||||
|
|
||||||
/* Generic.Traceback */
|
|
||||||
.highlight .kc { color: #007020; font-weight: bold; }
|
|
||||||
|
|
||||||
/* Keyword.Constant */
|
|
||||||
.highlight .kd { color: #007020; font-weight: bold; }
|
|
||||||
|
|
||||||
/* Keyword.Declaration */
|
|
||||||
.highlight .kn { color: #007020; font-weight: bold; }
|
|
||||||
|
|
||||||
/* Keyword.Namespace */
|
|
||||||
.highlight .kp { color: #007020; }
|
|
||||||
|
|
||||||
/* Keyword.Pseudo */
|
|
||||||
.highlight .kr { color: #007020; font-weight: bold; }
|
|
||||||
|
|
||||||
/* Keyword.Reserved */
|
|
||||||
.highlight .kt { color: #902000; }
|
|
||||||
|
|
||||||
/* Keyword.Type */
|
|
||||||
.highlight .m { color: #40a070; }
|
|
||||||
|
|
||||||
/* Literal.Number */
|
|
||||||
.highlight .s { color: #4070a0; }
|
|
||||||
|
|
||||||
/* Literal.String */
|
|
||||||
.highlight .na { color: #4070a0; }
|
|
||||||
|
|
||||||
/* Name.Attribute */
|
|
||||||
.highlight .nb { color: #007020; }
|
|
||||||
|
|
||||||
/* Name.Builtin */
|
|
||||||
.highlight .nc { color: #0e84b5; font-weight: bold; }
|
|
||||||
|
|
||||||
/* Name.Class */
|
|
||||||
.highlight .no { color: #60add5; }
|
|
||||||
|
|
||||||
/* Name.Constant */
|
|
||||||
.highlight .nd { color: #555555; font-weight: bold; }
|
|
||||||
|
|
||||||
/* Name.Decorator */
|
|
||||||
.highlight .ni { color: #d55537; font-weight: bold; }
|
|
||||||
|
|
||||||
/* Name.Entity */
|
|
||||||
.highlight .ne { color: #007020; }
|
|
||||||
|
|
||||||
/* Name.Exception */
|
|
||||||
.highlight .nf { color: #06287e; }
|
|
||||||
|
|
||||||
/* Name.Function */
|
|
||||||
.highlight .nl { color: #002070; font-weight: bold; }
|
|
||||||
|
|
||||||
/* Name.Label */
|
|
||||||
.highlight .nn { color: #0e84b5; font-weight: bold; }
|
|
||||||
|
|
||||||
/* Name.Namespace */
|
|
||||||
.highlight .nt { color: #062873; font-weight: bold; }
|
|
||||||
|
|
||||||
/* Name.Tag */
|
|
||||||
.highlight .nv { color: #bb60d5; }
|
|
||||||
|
|
||||||
/* Name.Variable */
|
|
||||||
.highlight .ow { color: #007020; font-weight: bold; }
|
|
||||||
|
|
||||||
/* Operator.Word */
|
|
||||||
.highlight .w { color: #bbbbbb; }
|
|
||||||
|
|
||||||
/* Text.Whitespace */
|
|
||||||
.highlight .mb { color: #40a070; }
|
|
||||||
|
|
||||||
/* Literal.Number.Bin */
|
|
||||||
.highlight .mf { color: #40a070; }
|
|
||||||
|
|
||||||
/* Literal.Number.Float */
|
|
||||||
.highlight .mh { color: #40a070; }
|
|
||||||
|
|
||||||
/* Literal.Number.Hex */
|
|
||||||
.highlight .mi { color: #40a070; }
|
|
||||||
|
|
||||||
/* Literal.Number.Integer */
|
|
||||||
.highlight .mo { color: #40a070; }
|
|
||||||
|
|
||||||
/* Literal.Number.Oct */
|
|
||||||
.highlight .sa { color: #4070a0; }
|
|
||||||
|
|
||||||
/* Literal.String.Affix */
|
|
||||||
.highlight .sb { color: #4070a0; }
|
|
||||||
|
|
||||||
/* Literal.String.Backtick */
|
|
||||||
.highlight .sc { color: #4070a0; }
|
|
||||||
|
|
||||||
/* Literal.String.Char */
|
|
||||||
.highlight .dl { color: #4070a0; }
|
|
||||||
|
|
||||||
/* Literal.String.Delimiter */
|
|
||||||
.highlight .sd { color: #4070a0; font-style: italic; }
|
|
||||||
|
|
||||||
/* Literal.String.Doc */
|
|
||||||
.highlight .s2 { color: #4070a0; }
|
|
||||||
|
|
||||||
/* Literal.String.Double */
|
|
||||||
.highlight .se { color: #4070a0; font-weight: bold; }
|
|
||||||
|
|
||||||
/* Literal.String.Escape */
|
|
||||||
.highlight .sh { color: #4070a0; }
|
|
||||||
|
|
||||||
/* Literal.String.Heredoc */
|
|
||||||
.highlight .si { color: #70a0d0; font-style: italic; }
|
|
||||||
|
|
||||||
/* Literal.String.Interpol */
|
|
||||||
.highlight .sx { color: #c65d09; }
|
|
||||||
|
|
||||||
/* Literal.String.Other */
|
|
||||||
.highlight .sr { color: #235388; }
|
|
||||||
|
|
||||||
/* Literal.String.Regex */
|
|
||||||
.highlight .s1 { color: #4070a0; }
|
|
||||||
|
|
||||||
/* Literal.String.Single */
|
|
||||||
.highlight .ss { color: #517918; }
|
|
||||||
|
|
||||||
/* Literal.String.Symbol */
|
|
||||||
.highlight .bp { color: #007020; }
|
|
||||||
|
|
||||||
/* Name.Builtin.Pseudo */
|
|
||||||
.highlight .fm { color: #06287e; }
|
|
||||||
|
|
||||||
/* Name.Function.Magic */
|
|
||||||
.highlight .vc { color: #bb60d5; }
|
|
||||||
|
|
||||||
/* Name.Variable.Class */
|
|
||||||
.highlight .vg { color: #bb60d5; }
|
|
||||||
|
|
||||||
/* Name.Variable.Global */
|
|
||||||
.highlight .vi { color: #bb60d5; }
|
|
||||||
|
|
||||||
/* Name.Variable.Instance */
|
|
||||||
.highlight .vm { color: #bb60d5; }
|
|
||||||
|
|
||||||
/* Name.Variable.Magic */
|
|
||||||
.highlight .il { color: #40a070; }
|
|
||||||
|
|
||||||
/* Literal.Number.Integer.Long */
|
|
||||||
/* ADDED CUSTOM */
|
|
||||||
.highlight .n { color: #000; }
|
|
||||||
|
|
||||||
/* General name */
|
|
||||||
div.highlight { padding: 0px 5px; width: 85%; margin: auto; overflow-x: scroll; }
|
|
||||||
|
|
||||||
/*# sourceMappingURL=style.css.map */
|
|
File diff suppressed because one or more lines are too long
@ -1,2 +1 @@
|
|||||||
alert("Warning! This site is insecure and open to an attack called XSS. You are now being redirected to an article about this vulnerability.");
|
alert("Warning! This site is insecure and open to an attack called XSS. You are now being redirected to an article about this vulnerability."),window.href="https://tait.tech/2020/04/22/quiz-your-friends.html";
|
||||||
window.href = "https://tait.tech/2020/04/22/quiz-your-friends.html";
|
|
File diff suppressed because one or more lines are too long
@ -1,56 +1 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title> | tait.tech</title> <link rel="stylesheet" href="/assets/css/style.css"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="author" content="Tait Hoyem"> <meta name="keywords" content=""> <meta name="description" content=""> </head> <body> <div id="wrapper"> <header> <h1>tait.tech</h1> <nav> <a href="/" class="nav-link">Home</a> <a href="/blog/" class="nav-link">Blog</a> <a href="/ideas/" class="nav-link">Ideas</a> <a href="/links/" class="nav-link">Links</a> <a href="https://github.com/TTWNO/" class="nav-link" target="_blank" rel="noopener noreferrer">Github</a> </nav> </header> <main> <p>Here are my contact details if you would like to contact me professionally or personally.</p> <div>Personal Email - tait.hoyem@protonmail.com</div> <p><br/></p> <div>Work Email - tait@tait.tech</div> <p><br/></p> <div>School Email - tait.hoyem@edu.sait.ca</div> <p><br/></p> <div>Phone - +1 (403) 771-4754</div> <p><br/></p> </main> <hr> <footer> This page is mirrored on <a href="https://beta.tait.tech/contact/">beta.tait.tech</a>. </footer> </div> </body> </html>
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<title> | tait.tech</title>
|
|
||||||
<link rel="stylesheet" href="/assets/css/style.css">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<meta name="author" content="Tait Hoyem">
|
|
||||||
<meta name="keywords" content="">
|
|
||||||
<meta name="description" content="">
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div id="wrapper">
|
|
||||||
<header>
|
|
||||||
<h1>tait.tech</h1>
|
|
||||||
|
|
||||||
<nav>
|
|
||||||
|
|
||||||
<a href="/" class="nav-link" >Home</a>
|
|
||||||
|
|
||||||
<a href="/blog/" class="nav-link" >Blog</a>
|
|
||||||
|
|
||||||
<a href="/ideas/" class="nav-link" >Ideas</a>
|
|
||||||
|
|
||||||
<a href="/links/" class="nav-link" >Links</a>
|
|
||||||
|
|
||||||
<a href="https://github.com/TTWNO/" class="nav-link" target="_blank" rel="noopener noreferrer" >Github</a>
|
|
||||||
|
|
||||||
</nav>
|
|
||||||
|
|
||||||
</header>
|
|
||||||
<main>
|
|
||||||
<p>Here are my contact details if you would like to contact me professionally or personally.</p>
|
|
||||||
|
|
||||||
<div>Personal Email - tait.hoyem@protonmail.com</div>
|
|
||||||
<p><br /></p>
|
|
||||||
|
|
||||||
<div>Work Email - tait@tait.tech</div>
|
|
||||||
<p><br /></p>
|
|
||||||
|
|
||||||
<div>School Email - tait.hoyem@edu.sait.ca</div>
|
|
||||||
<p><br /></p>
|
|
||||||
|
|
||||||
<div>Phone - +1 (403) 771-4754</div>
|
|
||||||
<p><br /></p>
|
|
||||||
|
|
||||||
|
|
||||||
</main>
|
|
||||||
<hr>
|
|
||||||
<footer>
|
|
||||||
This page is mirrored on <a href="https://beta.tait.tech/contact/">beta.tait.tech</a>.
|
|
||||||
|
|
||||||
</footer>
|
|
||||||
</div>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
@ -1,40 +1 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Cover Letter - VCC | tait.tech</title> <link rel="stylesheet" href="/assets/css/style.css"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> </head> <body> <main> <div id="wrapper"> <h2 id="tait-hoyem">Tait Hoyem</h2> <p>Hello, Alice</p> <p>This will be short and sweet.</p> <p>Copying and explaining information in accessible ways is something I have been doing my entire life—sometimes without realizing it. As a partially-sighted student, I know what information makes sense without visuals and what information will be completely meaningless without additional context or description.</p> <p>I also have some background in computer science. This allows me to transcribe and explain only what is important. Somebody without this background may not know when a number being shown on screen is important or when it is genuinely meaningless. I also do not need to go back and forth to the text I am copying from to be one-hundered percent sure I have the right paranthasies, brackets, less-than signs, et cetera. All these patterns make sense to me when I read them.</p> <p>Although I would prefer to work with computer science students, I am willing to be used more broadly if that is of use to you.</p> <p>Thank you for your consideration,</p> <p>—Tait Hoyem</p> <footer> </footer> </div> </main> </body> </html>
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<title>Cover Letter - VCC | tait.tech</title>
|
|
||||||
<link rel="stylesheet" href="/assets/css/style.css">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<main>
|
|
||||||
<div id="wrapper">
|
|
||||||
<h2 id="tait-hoyem">Tait Hoyem</h2>
|
|
||||||
|
|
||||||
<p>Hello, Alice</p>
|
|
||||||
|
|
||||||
<p>This will be short and sweet.</p>
|
|
||||||
|
|
||||||
<p>Copying and explaining information in accessible ways is something I have been doing my entire life—sometimes without realizing it.
|
|
||||||
As a partially-sighted student,
|
|
||||||
I know what information makes sense without visuals and what information will be completely meaningless without additional context or description.</p>
|
|
||||||
|
|
||||||
<p>I also have some background in computer science.
|
|
||||||
This allows me to transcribe and explain only what is important.
|
|
||||||
Somebody without this background may not know when a number being shown on screen is important or when it is genuinely meaningless.
|
|
||||||
I also do not need to go back and forth to the text I am copying from to be one-hundered percent sure I have the right paranthasies, brackets, less-than signs, et cetera.
|
|
||||||
All these patterns make sense to me when I read them.</p>
|
|
||||||
|
|
||||||
<p>Although I would prefer to work with computer science students,
|
|
||||||
I am willing to be used more broadly if that is of use to you.</p>
|
|
||||||
|
|
||||||
<p>Thank you for your consideration,</p>
|
|
||||||
|
|
||||||
<p>—Tait Hoyem</p>
|
|
||||||
|
|
||||||
<footer>
|
|
||||||
</footer>
|
|
||||||
</div>
|
|
||||||
</main>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
File diff suppressed because one or more lines are too long
@ -1,118 +1 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Home | tait.tech</title> <link rel="stylesheet" href="/assets/css/style.css"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="author" content="Tait Hoyem"> <meta name="keywords" content="UNIX Design, Tait Hoyem, security, privacy, software developer, Calgary, Alberta, Canada, independent, web developer"> <meta name="description" content="Tait Hoyem's website. The home of accessible, simple and secure computing."> </head> <body> <div id="wrapper"> <header> <h1>tait.tech</h1> <nav> <a href="/" class="nav-link" class="on-page">Home</a> <a href="/blog/" class="nav-link">Blog</a> <a href="/ideas/" class="nav-link">Ideas</a> <a href="/links/" class="nav-link">Links</a> <a href="https://github.com/TTWNO/" class="nav-link" target="_blank" rel="noopener noreferrer">Github</a> </nav> </header> <main> <h1>Tait Hoyem</h1> <p>I have three goals in my software development career:</p> <ol> <li>Strong adherence to the <a href="http://www.catb.org/~esr/writings/taoup/html/ch01s06.html">UNIX principles</a> of software design.</li> <li>Security, privacy, and anonymity of the internet.</li> <li>Accessibility of technology to the visually impaired.</li> </ol> <p>Some of my projects reflect these goals; others are just fun along the way. I have all of my code projects hosted on <a href="https://github.com/TTWNO">my Github</a>.</p> <h2>Projects</h2> <p>Here is some of my best work:</p> <ul class="clear-list projects"> <li> <p> <a href="https://github.com/ornicar/lila/pull/7772">Lichess</a> — A patch for Lichess.org which vastly extends support for screen reader users. The website has millions of active users. </p> </li> <li> <p> <a href="https://github.com/TTWNO/quote_pdf">Quote Retrieval System</a> — Written for a local roofing business to securely distribute quotes. </p> </li> <li> <p> <a href="https://github.com/TTWNO/epub-with-pinyin">epub-with-pinyin</a> — A program to add Pinyin above Chinese characters in .epub files to assist those learning Mandarin Chinese. </p> </li> <li> <p> <a href="https://github.com/TTWNO/lamegames.io">lamegames</a> — A little games website I made for some demonstrations of Django and websocket functionality. Very, very lame. Would not recommend. </p> </li> <li> <p> <a href="https://github.com/TTWNO/chess">chess</a> — A command-line chess game in C++. It is compileable on nearly any system. </p> </li> <li> <p> <a href="https://github.com/TTWNO/subnetting">subnetting</a> — One-night write of a subnet calculation tool. </p> </li> <li> <p> <a href="">Payroll</a> — A payroll system written in PHP. </p> </li> <li> <p> <a href="https://bytetools.ca">Bytetools</a> — I have my own company called Bytetools. We make websites, data archiving and custom applications. 10% discount for open-source or community-oriented projects. </p> </li> </ul> <p>I also occasionally put some content on <a href="/blog">my blog</a></p> <h2>Contact</h2> <address> <p>You can reach me via email at <a href="mailto:tait@tait.tech">tait@tait.tech</a>.</p> </address> <p>If you use PGP, download my <a href="/public-key.asc">public key</a>.</p> </main> <hr> <footer> This page is mirrored on <a href="https://beta.tait.tech/">beta.tait.tech</a>. </footer> </div> </body> </html>
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<title>Home | tait.tech</title>
|
|
||||||
<link rel="stylesheet" href="/assets/css/style.css">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<meta name="author" content="Tait Hoyem">
|
|
||||||
<meta name="keywords" content="UNIX Design, Tait Hoyem, security, privacy, software developer, Calgary, Alberta, Canada, independent, web developer">
|
|
||||||
<meta name="description" content="Tait Hoyem's website. The home of accessible, simple and secure computing.">
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div id="wrapper">
|
|
||||||
<header>
|
|
||||||
<h1>tait.tech</h1>
|
|
||||||
|
|
||||||
<nav>
|
|
||||||
|
|
||||||
<a href="/" class="nav-link" class="on-page" >Home</a>
|
|
||||||
|
|
||||||
<a href="/blog/" class="nav-link" >Blog</a>
|
|
||||||
|
|
||||||
<a href="/ideas/" class="nav-link" >Ideas</a>
|
|
||||||
|
|
||||||
<a href="/links/" class="nav-link" >Links</a>
|
|
||||||
|
|
||||||
<a href="https://github.com/TTWNO/" class="nav-link" target="_blank" rel="noopener noreferrer" >Github</a>
|
|
||||||
|
|
||||||
</nav>
|
|
||||||
|
|
||||||
</header>
|
|
||||||
<main>
|
|
||||||
<h1>Tait Hoyem</h1>
|
|
||||||
|
|
||||||
<p>I have three goals in my software development career:</p>
|
|
||||||
|
|
||||||
<ol>
|
|
||||||
<li>Strong adherence to the <a href="http://www.catb.org/~esr/writings/taoup/html/ch01s06.html">UNIX principles</a> of software design.</li>
|
|
||||||
<li>Security, privacy, and anonymity of the internet.</li>
|
|
||||||
<li>Accessibility of technology to the visually impaired.</li>
|
|
||||||
</ol>
|
|
||||||
|
|
||||||
<p>Some of my projects reflect these goals;
|
|
||||||
others are just fun along the way.
|
|
||||||
I have all of my code projects hosted on <a href="https://github.com/TTWNO">my Github</a>.</p>
|
|
||||||
|
|
||||||
<h2>Projects</h2>
|
|
||||||
<p>Here is some of my best work:</p>
|
|
||||||
<ul class="clear-list projects">
|
|
||||||
|
|
||||||
<li>
|
|
||||||
<p>
|
|
||||||
<a href="https://github.com/ornicar/lila/pull/7772">Lichess</a> — A patch for Lichess.org which vastly extends support for screen reader users. The website has millions of active users.
|
|
||||||
</p>
|
|
||||||
</li>
|
|
||||||
|
|
||||||
<li>
|
|
||||||
<p>
|
|
||||||
<a href="https://github.com/TTWNO/quote_pdf">Quote Retrieval System</a> — Written for a local roofing business to securely distribute quotes.
|
|
||||||
</p>
|
|
||||||
</li>
|
|
||||||
|
|
||||||
<li>
|
|
||||||
<p>
|
|
||||||
<a href="https://github.com/TTWNO/epub-with-pinyin">epub-with-pinyin</a> — A program to add Pinyin above Chinese characters in .epub files to assist those learning Mandarin Chinese.
|
|
||||||
</p>
|
|
||||||
</li>
|
|
||||||
|
|
||||||
<li>
|
|
||||||
<p>
|
|
||||||
<a href="https://github.com/TTWNO/lamegames.io">lamegames</a> — A little games website I made for some demonstrations of Django and websocket functionality. Very, very lame. Would not recommend.
|
|
||||||
</p>
|
|
||||||
</li>
|
|
||||||
|
|
||||||
<li>
|
|
||||||
<p>
|
|
||||||
<a href="https://github.com/TTWNO/chess">chess</a> — A command-line chess game in C++. It is compileable on nearly any system.
|
|
||||||
</p>
|
|
||||||
</li>
|
|
||||||
|
|
||||||
<li>
|
|
||||||
<p>
|
|
||||||
<a href="https://github.com/TTWNO/subnetting">subnetting</a> — One-night write of a subnet calculation tool.
|
|
||||||
</p>
|
|
||||||
</li>
|
|
||||||
|
|
||||||
<li>
|
|
||||||
<p>
|
|
||||||
<a href="">Payroll</a> — A payroll system written in PHP.
|
|
||||||
</p>
|
|
||||||
</li>
|
|
||||||
|
|
||||||
<li>
|
|
||||||
<p>
|
|
||||||
<a href="https://bytetools.ca">Bytetools</a> — I have my own company called Bytetools. We make websites, data archiving and custom applications. 10% discount for open-source or community-oriented projects.
|
|
||||||
</p>
|
|
||||||
</li>
|
|
||||||
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<p>I also occasionally put some content on <a href="/blog">my blog</a></p>
|
|
||||||
|
|
||||||
<h2>Contact</h2>
|
|
||||||
<address>
|
|
||||||
<p>You can reach me via email at <a href="mailto:tait@tait.tech">tait@tait.tech</a>.</p>
|
|
||||||
</address>
|
|
||||||
<p>If you use PGP, download my <a href="/public-key.asc">public key</a>.</p>
|
|
||||||
|
|
||||||
|
|
||||||
</main>
|
|
||||||
<hr>
|
|
||||||
<footer>
|
|
||||||
This page is mirrored on <a href="https://beta.tait.tech/">beta.tait.tech</a>.
|
|
||||||
|
|
||||||
</footer>
|
|
||||||
</div>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
@ -1,313 +1 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Links | tait.tech</title> <link rel="stylesheet" href="/assets/css/style.css"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="author" content="Tait Hoyem"> <meta name="keywords" content=""> <meta name="description" content=""> </head> <body> <div id="wrapper"> <header> <h1>tait.tech</h1> <nav> <a href="/" class="nav-link">Home</a> <a href="/blog/" class="nav-link">Blog</a> <a href="/ideas/" class="nav-link">Ideas</a> <a href="/links/" class="nav-link" class="on-page">Links</a> <a href="https://github.com/TTWNO/" class="nav-link" target="_blank" rel="noopener noreferrer">Github</a> </nav> </header> <main> <section> <header> <h2>Find Me Other Places</h2> </header> <ul> <li> <span class="bold">Main Site</span> - <a href="https://tait.tech/" class="mono"> tait.tech </a> </li> </ul> <ul> <li> <span class="bold">Backup/Mirror Site</span> - <a href="https://beta.tait.tech/" class="mono"> beta.tait.tech </a> </li> </ul> <ul> <li> <span class="bold">Email</span> - <a href="mailto:tait@tait.tech" class="mono"> tait@tait.tech </a> </li> </ul> <ul> <li> <span class="bold">Public Key</span> - <a href="/public-key.asc" class="mono"> public-key.asc </a> </li> </ul> <ul> <li> <span class="bold">Github</span> - <a href="https://github.com/TTWNO" class="mono"> github.com/TTWNO </a> </li> </ul> </section> <section> <header> <h2>Secure Service Links</h2> </header> <ul> <li> <span class="bold">Signal</span> - <a href="https://signal.org" class="mono"> https://signal.org </a> </li> </ul> <ul> <li> <span class="bold">Protonmail</span> - <a href="https://protonmail.com" class="mono"> https://protonmail.com </a> </li> </ul> </section> <section> <header> <h2>Linux Links</h2> </header> <ul> <li> <span class="bold">Arch Linux Wiki</span> - <a href="https://wiki.archlinux.org/" class="mono"> https://wiki.archlinux.org/ </a> </li> </ul> <ul> <li> <span class="bold">Speakup Project [Unencrypted]</span> - <a href="http://linux-speakup.org/" class="mono"> http://linux-speakup.org/ </a> </li> </ul> <ul> <li> <span class="bold">Luke Smith</span> - <a href="https://lukesmith.xyz/" class="mono"> https://lukesmith.xyz/ </a> </li> </ul> <ul> <li> <span class="bold">Brian Lunduke</span> - <a href="https://lunduke.com/" class="mono"> https://lunduke.com/ </a> </li> </ul> </section> <section> <header> <h2>Interesting Links</h2> </header> <ul> <li> <span class="bold">Suckless</span> - <a href="https://suckless.org/" class="mono"> https://suckless.org/ </a> </li> </ul> <ul> <li> <span class="bold">cat -v considered harmful [Unencrypted]</span> - <a href="http://cat-v.org/" class="mono"> http://cat-v.org/ </a> </li> </ul> <ul> <li> <span class="bold">Edward Snowden</span> - <a href="https://www.biography.com/activist/edward-snowden/" class="mono"> https://www.biography.com/activist/edward-snowden/ </a> </li> </ul> </section> <section> <header> <h2>Inspiration Comes From</h2> </header> <ul> <li> <span class="bold">Gregory Gundersen</span> - <a href="https://gregorygundersen.com/" class="mono"> https://gregorygundersen.com/ </a> </li> </ul> </section> <section> <header> <h2>The "This Is A Website" Series</h2> </header> <ul> <li> <span class="bold">Website</span> - <a href="https://motherfuckingwebsite.com/" class="mono"> https://motherfuckingwebsite.com/ </a> </li> </ul> <ul> <li> <span class="bold">Better Website</span> - <a href="http://bettermotherfuckingwebsite.com/" class="mono"> http://bettermotherfuckingwebsite.com/ </a> </li> </ul> <ul> <li> <span class="bold">The Best Website</span> - <a href="https://thebestmotherfucking.website/" class="mono"> https://thebestmotherfucking.website/ </a> </li> </ul> </section> <section> <header> <h2>Friends' Websites</h2> </header> <ul> <li> <span class="bold">Justin Pilon</span> - <a href="https://justinpilon.ca/" class="mono"> https://justinpilon.ca/ </a> </li> </ul> <ul> <li> <span class="bold">Melody Shih</span> - <a href="https://melly.tech/" class="mono"> https://melly.tech/ </a> </li> </ul> </section> <p>All my big projects are on my <a href="/">homepage</a>.</p> </main> <hr> <footer> This page is mirrored on <a href="https://beta.tait.tech/links/">beta.tait.tech</a>. </footer> </div> </body> </html>
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<title>Links | tait.tech</title>
|
|
||||||
<link rel="stylesheet" href="/assets/css/style.css">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<meta name="author" content="Tait Hoyem">
|
|
||||||
<meta name="keywords" content="">
|
|
||||||
<meta name="description" content="">
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div id="wrapper">
|
|
||||||
<header>
|
|
||||||
<h1>tait.tech</h1>
|
|
||||||
|
|
||||||
<nav>
|
|
||||||
|
|
||||||
<a href="/" class="nav-link" >Home</a>
|
|
||||||
|
|
||||||
<a href="/blog/" class="nav-link" >Blog</a>
|
|
||||||
|
|
||||||
<a href="/ideas/" class="nav-link" >Ideas</a>
|
|
||||||
|
|
||||||
<a href="/links/" class="nav-link" class="on-page" >Links</a>
|
|
||||||
|
|
||||||
<a href="https://github.com/TTWNO/" class="nav-link" target="_blank" rel="noopener noreferrer" >Github</a>
|
|
||||||
|
|
||||||
</nav>
|
|
||||||
|
|
||||||
</header>
|
|
||||||
<main>
|
|
||||||
|
|
||||||
<section>
|
|
||||||
<header>
|
|
||||||
<h2>Find Me Other Places</h2>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
<span class="bold">Main Site</span> -
|
|
||||||
<a href="https://tait.tech/" class="mono">
|
|
||||||
|
|
||||||
tait.tech
|
|
||||||
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
<span class="bold">Backup/Mirror Site</span> -
|
|
||||||
<a href="https://beta.tait.tech/" class="mono">
|
|
||||||
|
|
||||||
beta.tait.tech
|
|
||||||
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
<span class="bold">Email</span> -
|
|
||||||
<a href="mailto:tait@tait.tech" class="mono">
|
|
||||||
|
|
||||||
tait@tait.tech
|
|
||||||
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
<span class="bold">Public Key</span> -
|
|
||||||
<a href="/public-key.asc" class="mono">
|
|
||||||
|
|
||||||
public-key.asc
|
|
||||||
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
<span class="bold">Github</span> -
|
|
||||||
<a href="https://github.com/TTWNO" class="mono">
|
|
||||||
|
|
||||||
github.com/TTWNO
|
|
||||||
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<section>
|
|
||||||
<header>
|
|
||||||
<h2>Secure Service Links</h2>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
<span class="bold">Signal</span> -
|
|
||||||
<a href="https://signal.org" class="mono">
|
|
||||||
|
|
||||||
https://signal.org
|
|
||||||
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
<span class="bold">Protonmail</span> -
|
|
||||||
<a href="https://protonmail.com" class="mono">
|
|
||||||
|
|
||||||
https://protonmail.com
|
|
||||||
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<section>
|
|
||||||
<header>
|
|
||||||
<h2>Linux Links</h2>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
<span class="bold">Arch Linux Wiki</span> -
|
|
||||||
<a href="https://wiki.archlinux.org/" class="mono">
|
|
||||||
|
|
||||||
https://wiki.archlinux.org/
|
|
||||||
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
<span class="bold">Speakup Project [Unencrypted]</span> -
|
|
||||||
<a href="http://linux-speakup.org/" class="mono">
|
|
||||||
|
|
||||||
http://linux-speakup.org/
|
|
||||||
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
<span class="bold">Luke Smith</span> -
|
|
||||||
<a href="https://lukesmith.xyz/" class="mono">
|
|
||||||
|
|
||||||
https://lukesmith.xyz/
|
|
||||||
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
<span class="bold">Brian Lunduke</span> -
|
|
||||||
<a href="https://lunduke.com/" class="mono">
|
|
||||||
|
|
||||||
https://lunduke.com/
|
|
||||||
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<section>
|
|
||||||
<header>
|
|
||||||
<h2>Interesting Links</h2>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
<span class="bold">Suckless</span> -
|
|
||||||
<a href="https://suckless.org/" class="mono">
|
|
||||||
|
|
||||||
https://suckless.org/
|
|
||||||
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
<span class="bold">cat -v considered harmful [Unencrypted]</span> -
|
|
||||||
<a href="http://cat-v.org/" class="mono">
|
|
||||||
|
|
||||||
http://cat-v.org/
|
|
||||||
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
<span class="bold">Edward Snowden</span> -
|
|
||||||
<a href="https://www.biography.com/activist/edward-snowden/" class="mono">
|
|
||||||
|
|
||||||
https://www.biography.com/activist/edward-snowden/
|
|
||||||
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<section>
|
|
||||||
<header>
|
|
||||||
<h2>Inspiration Comes From</h2>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
<span class="bold">Gregory Gundersen</span> -
|
|
||||||
<a href="https://gregorygundersen.com/" class="mono">
|
|
||||||
|
|
||||||
https://gregorygundersen.com/
|
|
||||||
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<section>
|
|
||||||
<header>
|
|
||||||
<h2>The "This Is A Website" Series</h2>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
<span class="bold">Website</span> -
|
|
||||||
<a href="https://motherfuckingwebsite.com/" class="mono">
|
|
||||||
|
|
||||||
https://motherfuckingwebsite.com/
|
|
||||||
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
<span class="bold">Better Website</span> -
|
|
||||||
<a href="http://bettermotherfuckingwebsite.com/" class="mono">
|
|
||||||
|
|
||||||
http://bettermotherfuckingwebsite.com/
|
|
||||||
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
<span class="bold">The Best Website</span> -
|
|
||||||
<a href="https://thebestmotherfucking.website/" class="mono">
|
|
||||||
|
|
||||||
https://thebestmotherfucking.website/
|
|
||||||
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<section>
|
|
||||||
<header>
|
|
||||||
<h2>Friends' Websites</h2>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
<span class="bold">Justin Pilon</span> -
|
|
||||||
<a href="https://justinpilon.ca/" class="mono">
|
|
||||||
|
|
||||||
https://justinpilon.ca/
|
|
||||||
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
<span class="bold">Melody Shih</span> -
|
|
||||||
<a href="https://melly.tech/" class="mono">
|
|
||||||
|
|
||||||
https://melly.tech/
|
|
||||||
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<p>All my big projects are on my <a href="/">homepage</a>.</p>
|
|
||||||
|
|
||||||
</main>
|
|
||||||
<hr>
|
|
||||||
<footer>
|
|
||||||
This page is mirrored on <a href="https://beta.tait.tech/links/">beta.tait.tech</a>.
|
|
||||||
|
|
||||||
</footer>
|
|
||||||
</div>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
@ -1,125 +1 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Resume | tait.tech</title> <link rel="stylesheet" href="/assets/css/style.css"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> </head> <body> <main> <div id="wrapper"> <h1 id="tait-hoyem">Tait Hoyem</h1> <h3 id="experience">Experience</h3> <p><strong>Bytetools Technologies Inc.</strong>—<em>Founder</em> (2020-present)</p> <p>Providing small businesses with simple, secure software solutions.</p> <p><strong>Independent</strong>—<em>Tutoring</em> (2019-present)</p> <p>Working with computer science students explaining introductory to advanced concepts.</p> <p><strong>Total Impact Signs</strong>—<em>Technical Advisor</em> (2014-2016)</p> <p>Implemented a semi-automatic payroll system replacing the manual sign in book used before.</p> <h3 id="education">Education</h3> <p><strong>The Linux Foundation</strong>—Certification / <em>Certified Linux System Administrator</em> (2016)</p> <p>Certified in Linux system administration tasks. Running web servers, maintaining mass storage systems, running secure remote control tools. Certificate no longer valid.</p> <p><strong>Southern Alberta Institute of Technology</strong>—Diploma / <em>Information Technology-Software Development Major</em> (2019-2021)</p> <p>Full-stack two year software development diploma. Focusing on databases, interface design and enterprise solutions.</p> <h3 id="professional-development">Professional Development</h3> <p><strong>Dartmouth College (Open Corseware)</strong>—Professional Certificate / <em>C Programming with Linux</em> (2020)</p> <p>A certification in C programming, the <code class="language-plaintext highlighter-rouge">gcc</code> compiler, and the <code class="language-plaintext highlighter-rouge">make</code> compilation system. 100% mark.</p> <h3 id="projects">Projects</h3> <p><strong><a href="https://github.com/ornicar/lila/pull/7772">Lichess</a></strong></p> <p><em>A patch for Lichess.org which vastly extends support for screen reader users. The website has millions of active users.</em></p> <p><strong><a href="https://github.com/TTWNO/quote_pdf">Quote Retrieval System</a></strong></p> <p><em>Written for a local roofing business to securely distribute quotes.</em></p> <p><strong><a href="https://github.com/TTWNO/epub-with-pinyin">epub-with-pinyin</a></strong></p> <p><em>A program to add Pinyin above Chinese characters in .epub files to assist those learning Mandarin Chinese.</em></p> <p><strong><a href="https://github.com/TTWNO/lamegames.io">lamegames</a></strong></p> <p><em>A little games website I made for some demonstrations of Django and websocket functionality. Very, very lame. Would not recommend.</em></p> <p><strong><a href="https://github.com/TTWNO/chess">chess</a></strong></p> <p><em>A command-line chess game in C++. It is compileable on nearly any system.</em></p> <p><strong><a href="https://github.com/TTWNO/subnetting">subnetting</a></strong></p> <p><em>One-night write of a subnet calculation tool.</em></p> <p><strong><a href="">Payroll</a></strong></p> <p><em>A payroll system written in PHP.</em></p> <p><strong><a href="https://bytetools.ca">Bytetools</a></strong></p> <p><em>I have my own company called Bytetools. We make websites, data archiving and custom applications. 10% discount for open-source or community-oriented projects.</em></p> <h3 id="languages">Languages</h3> <h5 id="human">Human</h5> <ul> <li> <p>English (Native)</p> </li> <li> <p>Mandarin Chinese (Novice)</p> </li> </ul> <h5 id="computer">Computer</h5> <ul> <li> <p>C</p> </li> <li> <p>C++</p> </li> <li> <p>Python</p> </li> <li> <p>Javscript</p> </li> <li> <p>HTML/CSS</p> </li> <li> <p>Bash</p> </li> <li> <p>PHP</p> </li> <li> <p>Java EE</p> </li> </ul> <footer> </footer> </div> </main> </body> </html>
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<title>Resume | tait.tech</title>
|
|
||||||
<link rel="stylesheet" href="/assets/css/style.css">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<main>
|
|
||||||
<div id="wrapper">
|
|
||||||
<h1 id="tait-hoyem">Tait Hoyem</h1>
|
|
||||||
|
|
||||||
<h3 id="experience">Experience</h3>
|
|
||||||
|
|
||||||
<p><strong>Bytetools Technologies Inc.</strong>—<em>Founder</em> (2020-present)</p>
|
|
||||||
|
|
||||||
<p>Providing small businesses with simple, secure software solutions.</p>
|
|
||||||
|
|
||||||
<p><strong>Independent</strong>—<em>Tutoring</em> (2019-present)</p>
|
|
||||||
|
|
||||||
<p>Working with computer science students explaining introductory to advanced concepts.</p>
|
|
||||||
|
|
||||||
<p><strong>Total Impact Signs</strong>—<em>Technical Advisor</em> (2014-2016)</p>
|
|
||||||
|
|
||||||
<p>Implemented a semi-automatic payroll system replacing the manual sign in book used before.</p>
|
|
||||||
|
|
||||||
<h3 id="education">Education</h3>
|
|
||||||
|
|
||||||
<p><strong>The Linux Foundation</strong>—Certification / <em>Certified Linux System Administrator</em> (2016)</p>
|
|
||||||
|
|
||||||
<p>Certified in Linux system administration tasks. Running web servers, maintaining mass storage systems, running secure remote control tools. Certificate no longer valid.</p>
|
|
||||||
|
|
||||||
<p><strong>Southern Alberta Institute of Technology</strong>—Diploma / <em>Information Technology-Software Development Major</em> (2019-2021)</p>
|
|
||||||
|
|
||||||
<p>Full-stack two year software development diploma. Focusing on databases, interface design and enterprise solutions.</p>
|
|
||||||
|
|
||||||
<h3 id="professional-development">Professional Development</h3>
|
|
||||||
|
|
||||||
<p><strong>Dartmouth College (Open Corseware)</strong>—Professional Certificate / <em>C Programming with Linux</em> (2020)</p>
|
|
||||||
|
|
||||||
<p>A certification in C programming, the <code class="language-plaintext highlighter-rouge">gcc</code> compiler, and the <code class="language-plaintext highlighter-rouge">make</code> compilation system. 100% mark.</p>
|
|
||||||
|
|
||||||
<h3 id="projects">Projects</h3>
|
|
||||||
|
|
||||||
<p><strong><a href="https://github.com/ornicar/lila/pull/7772">Lichess</a></strong></p>
|
|
||||||
|
|
||||||
<p><em>A patch for Lichess.org which vastly extends support for screen reader users. The website has millions of active users.</em></p>
|
|
||||||
|
|
||||||
<p><strong><a href="https://github.com/TTWNO/quote_pdf">Quote Retrieval System</a></strong></p>
|
|
||||||
|
|
||||||
<p><em>Written for a local roofing business to securely distribute quotes.</em></p>
|
|
||||||
|
|
||||||
<p><strong><a href="https://github.com/TTWNO/epub-with-pinyin">epub-with-pinyin</a></strong></p>
|
|
||||||
|
|
||||||
<p><em>A program to add Pinyin above Chinese characters in .epub files to assist those learning Mandarin Chinese.</em></p>
|
|
||||||
|
|
||||||
<p><strong><a href="https://github.com/TTWNO/lamegames.io">lamegames</a></strong></p>
|
|
||||||
|
|
||||||
<p><em>A little games website I made for some demonstrations of Django and websocket functionality. Very, very lame. Would not recommend.</em></p>
|
|
||||||
|
|
||||||
<p><strong><a href="https://github.com/TTWNO/chess">chess</a></strong></p>
|
|
||||||
|
|
||||||
<p><em>A command-line chess game in C++. It is compileable on nearly any system.</em></p>
|
|
||||||
|
|
||||||
<p><strong><a href="https://github.com/TTWNO/subnetting">subnetting</a></strong></p>
|
|
||||||
|
|
||||||
<p><em>One-night write of a subnet calculation tool.</em></p>
|
|
||||||
|
|
||||||
<p><strong><a href="">Payroll</a></strong></p>
|
|
||||||
|
|
||||||
<p><em>A payroll system written in PHP.</em></p>
|
|
||||||
|
|
||||||
<p><strong><a href="https://bytetools.ca">Bytetools</a></strong></p>
|
|
||||||
|
|
||||||
<p><em>I have my own company called Bytetools. We make websites, data archiving and custom applications. 10% discount for open-source or community-oriented projects.</em></p>
|
|
||||||
|
|
||||||
<h3 id="languages">Languages</h3>
|
|
||||||
<h5 id="human">Human</h5>
|
|
||||||
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
<p>English (Native)</p>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<p>Mandarin Chinese (Novice)</p>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<h5 id="computer">Computer</h5>
|
|
||||||
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
<p>C</p>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<p>C++</p>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<p>Python</p>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<p>Javscript</p>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<p>HTML/CSS</p>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<p>Bash</p>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<p>PHP</p>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<p>Java EE</p>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
|
|
||||||
<footer>
|
|
||||||
</footer>
|
|
||||||
</div>
|
|
||||||
</main>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
@ -1 +1 @@
|
|||||||
Sitemap: http://localhost:4000/sitemap.xml
|
Sitemap: /sitemap.xml
|
@ -1,151 +1 @@
|
|||||||
<?xml version="1.0" encoding="UTF-8"?>
|
<?xml version="1.0" encoding="UTF-8"?> <urlset xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.sitemaps.org/schemas/sitemap/0.9 http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd" xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"> <url> <loc>/2020/01/22/padding-and-margin/</loc> <lastmod>2020-01-22T00:00:00-07:00</lastmod> </url> <url> <loc>/2020/01/26/rsa1/</loc> <lastmod>2020-01-26T00:00:00-07:00</lastmod> </url> <url> <loc>/2020/02/19/rsa2/</loc> <lastmod>2020-02-19T00:00:00-07:00</lastmod> </url> <url> <loc>/2020/04/02/rsa3/</loc> <lastmod>2020-04-02T00:00:00-06:00</lastmod> </url> <url> <loc>/2020/04/06/rsa4/</loc> <lastmod>2020-04-06T00:00:00-06:00</lastmod> </url> <url> <loc>/2020/04/12/nas1/</loc> <lastmod>2020-04-12T00:00:00-06:00</lastmod> </url> <url> <loc>/2020/04/21/rfi/</loc> <lastmod>2020-04-21T00:00:00-06:00</lastmod> </url> <url> <loc>/2020/04/25/xss/</loc> <lastmod>2020-04-25T00:00:00-06:00</lastmod> </url> <url> <loc>/2020/05/01/nginx-socket-io-projects/</loc> <lastmod>2020-05-01T00:00:00-06:00</lastmod> </url> <url> <loc>/2020/05/19/clue-announcement/</loc> <lastmod>2020-05-19T00:00:00-06:00</lastmod> </url> <url> <loc>/2020/06/04/site-update/</loc> <lastmod>2020-06-04T00:00:00-06:00</lastmod> </url> <url> <loc>/2020/06/25/tmux-minecraft/</loc> <lastmod>2020-06-25T00:00:00-06:00</lastmod> </url> <url> <loc>/2020/07/12/independence/</loc> <lastmod>2020-07-12T00:00:00-06:00</lastmod> </url> <url> <loc>/2020/07/19/multicraft-php-gentoo/</loc> <lastmod>2020-07-19T00:00:00-06:00</lastmod> </url> <url> <loc>/2020/07/30/canadian-parliament/</loc> <lastmod>2020-07-30T00:00:00-06:00</lastmod> </url> <url> <loc>/2020/08/15/openbsd1/</loc> <lastmod>2020-08-15T00:00:00-06:00</lastmod> </url> <url> <loc>/2020/08/18/django-deployment/</loc> <lastmod>2020-08-18T00:00:00-06:00</lastmod> </url> <url> <loc>/2020/09/09/lamegames/</loc> <lastmod>2020-09-09T00:00:00-06:00</lastmod> </url> <url> <loc>/2020/09/12/minesweeper/</loc> <lastmod>2020-09-12T00:00:00-06:00</lastmod> </url> <url> <loc>/2020/10/26/curiosity/</loc> <lastmod>2020-10-26T00:00:00-06:00</lastmod> </url> <url> <loc>/2020/11/15/nas2/</loc> <lastmod>2020-11-15T00:00:00-07:00</lastmod> </url> <url> <loc>/2020/12/01/pacaur-rpi/</loc> <lastmod>2020-12-01T00:00:00-07:00</lastmod> </url> <url> <loc>/2020/12/14/orca-raspberry-pi-manjaro/</loc> <lastmod>2020-12-14T00:00:00-07:00</lastmod> </url> <url> <loc>/2020/12/20/deploy-lichess/</loc> <lastmod>2020-12-20T00:00:00-07:00</lastmod> </url> <url> <loc>/2021/01/31/lichess/</loc> <lastmod>2021-01-31T00:00:00-07:00</lastmod> </url> <url> <loc>/2021/04/04/quiz-your-friends-xss/</loc> <lastmod>2021-04-04T00:00:00-06:00</lastmod> </url> <url> <loc>/blog/</loc> </url> <url> <loc>/tests/live-label/</loc> </url> <url> <loc>/tests/chess/</loc> </url> <url> <loc>/</loc> </url> <url> <loc>/ideas/</loc> </url> <url> <loc>/tutoring/</loc> </url> <url> <loc>/cover-letters/bloombase/</loc> </url> <url> <loc>/cover-letters/protonmail/</loc> </url> <url> <loc>/resume/</loc> </url> <url> <loc>/links/</loc> </url> <url> <loc>/cover-letter-vcc/</loc> </url> <url> <loc>/contact/</loc> </url> <url> <loc>/about/</loc> </url> <url> <loc>/scholarships/2020/cnib/</loc> </url> </urlset>
|
||||||
<urlset xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.sitemaps.org/schemas/sitemap/0.9 http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd" xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/2020/01/22/padding-and-margin/</loc>
|
|
||||||
<lastmod>2020-01-22T00:00:00-07:00</lastmod>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/2020/01/26/rsa1/</loc>
|
|
||||||
<lastmod>2020-01-26T00:00:00-07:00</lastmod>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/2020/02/19/rsa2/</loc>
|
|
||||||
<lastmod>2020-02-19T00:00:00-07:00</lastmod>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/2020/04/02/rsa3/</loc>
|
|
||||||
<lastmod>2020-04-02T00:00:00-06:00</lastmod>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/2020/04/06/rsa4/</loc>
|
|
||||||
<lastmod>2020-04-06T00:00:00-06:00</lastmod>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/2020/04/12/nas1/</loc>
|
|
||||||
<lastmod>2020-04-12T00:00:00-06:00</lastmod>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/2020/04/21/rfi/</loc>
|
|
||||||
<lastmod>2020-04-21T00:00:00-06:00</lastmod>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/2020/04/25/xss/</loc>
|
|
||||||
<lastmod>2020-04-25T00:00:00-06:00</lastmod>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/2020/05/01/nginx-socket-io-projects/</loc>
|
|
||||||
<lastmod>2020-05-01T00:00:00-06:00</lastmod>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/2020/05/19/clue-announcement/</loc>
|
|
||||||
<lastmod>2020-05-19T00:00:00-06:00</lastmod>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/2020/06/04/site-update/</loc>
|
|
||||||
<lastmod>2020-06-04T00:00:00-06:00</lastmod>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/2020/06/25/tmux-minecraft/</loc>
|
|
||||||
<lastmod>2020-06-25T00:00:00-06:00</lastmod>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/2020/07/12/independence/</loc>
|
|
||||||
<lastmod>2020-07-12T00:00:00-06:00</lastmod>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/2020/07/19/multicraft-php-gentoo/</loc>
|
|
||||||
<lastmod>2020-07-19T00:00:00-06:00</lastmod>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/2020/07/30/canadian-parliament/</loc>
|
|
||||||
<lastmod>2020-07-30T00:00:00-06:00</lastmod>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/2020/08/15/openbsd1/</loc>
|
|
||||||
<lastmod>2020-08-15T00:00:00-06:00</lastmod>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/2020/08/18/django-deployment/</loc>
|
|
||||||
<lastmod>2020-08-18T00:00:00-06:00</lastmod>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/2020/09/09/lamegames/</loc>
|
|
||||||
<lastmod>2020-09-09T00:00:00-06:00</lastmod>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/2020/09/12/minesweeper/</loc>
|
|
||||||
<lastmod>2020-09-12T00:00:00-06:00</lastmod>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/2020/10/26/curiosity/</loc>
|
|
||||||
<lastmod>2020-10-26T00:00:00-06:00</lastmod>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/2020/11/15/nas2/</loc>
|
|
||||||
<lastmod>2020-11-15T00:00:00-07:00</lastmod>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/2020/12/01/pacaur-rpi/</loc>
|
|
||||||
<lastmod>2020-12-01T00:00:00-07:00</lastmod>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/2020/12/14/orca-raspberry-pi-manjaro/</loc>
|
|
||||||
<lastmod>2020-12-14T00:00:00-07:00</lastmod>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/2020/12/20/deploy-lichess/</loc>
|
|
||||||
<lastmod>2020-12-20T00:00:00-07:00</lastmod>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/2021/01/31/lichess/</loc>
|
|
||||||
<lastmod>2021-01-31T00:00:00-07:00</lastmod>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/2020-04-27-quiz-your-friends-xss/</loc>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/tests/live-label/</loc>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/tests/chess/</loc>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/blog/</loc>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/</loc>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/about/</loc>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/resume/</loc>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/contact/</loc>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/links/</loc>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/scholarships/2020/cnib/</loc>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/tutoring/</loc>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/cover-letter-vcc/</loc>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/ideas/</loc>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/cover-letters/bloombase/</loc>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/cover-letters/protonmail/</loc>
|
|
||||||
</url>
|
|
||||||
<url>
|
|
||||||
<loc>http://localhost:4000/test/</loc>
|
|
||||||
</url>
|
|
||||||
</urlset>
|
|
@ -1,14 +0,0 @@
|
|||||||
ttv = '3.3v'
|
|
||||||
fv = '5v'
|
|
||||||
|
|
||||||
headers = ['WiringPi Pin', 'BCM GPIO', 'Name', 'Header', 'Header', 'Name', 'BCM GPIO', 'WiringPi Pin']
|
|
||||||
data = [
|
|
||||||
['', '', ttv, '1', '2', '5v', '', ''],
|
|
||||||
['8', 'Rv1:0 - Rv2:2', 'SDA', '3', '4', fv, '', ''],
|
|
||||||
['9', 'Rv1:1 - Rv2:3', 'SCL', '5', '6', '0v', '', ''],
|
|
||||||
['7', '4', 'GPIO7', '7', '8', 'TxD', '14', '15'],
|
|
||||||
['', '', '0v', '9', '10', 'RxD', '15', '16'],
|
|
||||||
['0', '17', 'GPIO0', '11', '12', 'GPIO1', '18', '1'],
|
|
||||||
[],
|
|
||||||
|
|
||||||
]
|
|
@ -1,47 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<title> | tait.tech</title>
|
|
||||||
<link rel="stylesheet" href="/assets/css/style.css">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<meta name="author" content="Tait Hoyem">
|
|
||||||
<meta name="keywords" content="">
|
|
||||||
<meta name="description" content="">
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div id="wrapper">
|
|
||||||
<header>
|
|
||||||
<h1>tait.tech</h1>
|
|
||||||
|
|
||||||
<nav>
|
|
||||||
|
|
||||||
<a href="/" class="nav-link" >Home</a>
|
|
||||||
|
|
||||||
<a href="/blog/" class="nav-link" >Blog</a>
|
|
||||||
|
|
||||||
<a href="/ideas/" class="nav-link" >Ideas</a>
|
|
||||||
|
|
||||||
<a href="/links/" class="nav-link" >Links</a>
|
|
||||||
|
|
||||||
<a href="https://github.com/TTWNO/" class="nav-link" target="_blank" rel="noopener noreferrer" >Github</a>
|
|
||||||
|
|
||||||
</nav>
|
|
||||||
|
|
||||||
</header>
|
|
||||||
<main>
|
|
||||||
<table>
|
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
<td>WiringPi Pin</td>
|
|
||||||
<td>
|
|
||||||
|
|
||||||
</main>
|
|
||||||
<hr>
|
|
||||||
<footer>
|
|
||||||
This page is mirrored on <a href="https://beta.tait.tech/test/">beta.tait.tech</a>.
|
|
||||||
|
|
||||||
</footer>
|
|
||||||
</div>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
@ -1,148 +1 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Chessboard | tait.tech</title> <link rel="stylesheet" href="/assets/css/style.css"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="author" content="Tait Hoyem"> <meta name="keywords" content=""> <meta name="description" content=""> </head> <body> <div id="wrapper"> <header> <h1>tait.tech</h1> <nav> <a href="/" class="nav-link">Home</a> <a href="/blog/" class="nav-link">Blog</a> <a href="/ideas/" class="nav-link">Ideas</a> <a href="/links/" class="nav-link">Links</a> <a href="https://github.com/TTWNO/" class="nav-link" target="_blank" rel="noopener noreferrer">Github</a> </nav> </header> <main> <table> <caption>Chess board</caption> <thead> <td></td> <th scopre="col">A</th> <th scopre="col">B</th> <th scopre="col">C</th> <th scopre="col">D</th> <th scopre="col">E</th> <th scopre="col">F</th> <th scopre="col">G</th> <th scopre="col">H</th> </thead> <tbody> <tr> <th scope="row">1</th> <td>R</td> <td>K</td> <td>B</td> <td>K</td> <td>Q</td> <td>B</td> <td>K</td> <td>R</td> </tr> <tr> <th scope="row">2</th> <td>P</td> <td>P</td> <td>P</td> <td>P</td> <td>P</td> <td>P</td> <td>P</td> <td>P</td> </tr> <tr> <th scope="row">3</th> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> </tr> <tr> <th scope="row">4</th> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> </tr> <tr> <th scope="row">5</th> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> </tr> <tr> <th scope="row">6</th> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> </tr> <tr> <th scope="row">7</th> <td>p</td> <td>p</td> <td>p</td> <td>p</td> <td>p</td> <td>p</td> <td>p</td> <td>p</td> </tr> <tr> <th scope="row">8</th> <td>r</td> <td>k</td> <td>b</td> <td>k</td> <td>q</td> <td>b</td> <td>k</td> <td>r</td> </tr> </tbody> </table> </main> <hr> <footer> This page is mirrored on <a href="https://beta.tait.tech/tests/chess/">beta.tait.tech</a>. </footer> </div> </body> </html>
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<title>Chessboard | tait.tech</title>
|
|
||||||
<link rel="stylesheet" href="/assets/css/style.css">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<meta name="author" content="Tait Hoyem">
|
|
||||||
<meta name="keywords" content="">
|
|
||||||
<meta name="description" content="">
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div id="wrapper">
|
|
||||||
<header>
|
|
||||||
<h1>tait.tech</h1>
|
|
||||||
|
|
||||||
<nav>
|
|
||||||
|
|
||||||
<a href="/" class="nav-link" >Home</a>
|
|
||||||
|
|
||||||
<a href="/blog/" class="nav-link" >Blog</a>
|
|
||||||
|
|
||||||
<a href="/ideas/" class="nav-link" >Ideas</a>
|
|
||||||
|
|
||||||
<a href="/links/" class="nav-link" >Links</a>
|
|
||||||
|
|
||||||
<a href="https://github.com/TTWNO/" class="nav-link" target="_blank" rel="noopener noreferrer" >Github</a>
|
|
||||||
|
|
||||||
</nav>
|
|
||||||
|
|
||||||
</header>
|
|
||||||
<main>
|
|
||||||
<!-- https://www.w3.org/WAI/tutorials/tables/two-headers/ -->
|
|
||||||
<table>
|
|
||||||
<caption>Chess board</caption>
|
|
||||||
<thead>
|
|
||||||
<td></td>
|
|
||||||
<th scopre="col">A</th>
|
|
||||||
<th scopre="col">B</th>
|
|
||||||
<th scopre="col">C</th>
|
|
||||||
<th scopre="col">D</th>
|
|
||||||
<th scopre="col">E</th>
|
|
||||||
<th scopre="col">F</th>
|
|
||||||
<th scopre="col">G</th>
|
|
||||||
<th scopre="col">H</th>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
|
||||||
<tr>
|
|
||||||
<th scope="row">1</th>
|
|
||||||
<td>R</td>
|
|
||||||
<td>K</td>
|
|
||||||
<td>B</td>
|
|
||||||
<td>K</td>
|
|
||||||
<td>Q</td>
|
|
||||||
<td>B</td>
|
|
||||||
<td>K</td>
|
|
||||||
<td>R</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th scope="row">2</th>
|
|
||||||
<td>P</td>
|
|
||||||
<td>P</td>
|
|
||||||
<td>P</td>
|
|
||||||
<td>P</td>
|
|
||||||
<td>P</td>
|
|
||||||
<td>P</td>
|
|
||||||
<td>P</td>
|
|
||||||
<td>P</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th scope="row">3</th>
|
|
||||||
<td></td>
|
|
||||||
<td></td>
|
|
||||||
<td></td>
|
|
||||||
<td></td>
|
|
||||||
<td></td>
|
|
||||||
<td></td>
|
|
||||||
<td></td>
|
|
||||||
<td></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th scope="row">4</th>
|
|
||||||
<td></td>
|
|
||||||
<td></td>
|
|
||||||
<td></td>
|
|
||||||
<td></td>
|
|
||||||
<td></td>
|
|
||||||
<td></td>
|
|
||||||
<td></td>
|
|
||||||
<td></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th scope="row">5</th>
|
|
||||||
<td></td>
|
|
||||||
<td></td>
|
|
||||||
<td></td>
|
|
||||||
<td></td>
|
|
||||||
<td></td>
|
|
||||||
<td></td>
|
|
||||||
<td></td>
|
|
||||||
<td></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th scope="row">6</th>
|
|
||||||
<td></td>
|
|
||||||
<td></td>
|
|
||||||
<td></td>
|
|
||||||
<td></td>
|
|
||||||
<td></td>
|
|
||||||
<td></td>
|
|
||||||
<td></td>
|
|
||||||
<td></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th scope="row">7</th>
|
|
||||||
<td>p</td>
|
|
||||||
<td>p</td>
|
|
||||||
<td>p</td>
|
|
||||||
<td>p</td>
|
|
||||||
<td>p</td>
|
|
||||||
<td>p</td>
|
|
||||||
<td>p</td>
|
|
||||||
<td>p</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th scope="row">8</th>
|
|
||||||
<td>r</td>
|
|
||||||
<td>k</td>
|
|
||||||
<td>b</td>
|
|
||||||
<td>k</td>
|
|
||||||
<td>q</td>
|
|
||||||
<td>b</td>
|
|
||||||
<td>k</td>
|
|
||||||
<td>r</td>
|
|
||||||
</tr>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
|
|
||||||
|
|
||||||
</main>
|
|
||||||
<hr>
|
|
||||||
<footer>
|
|
||||||
This page is mirrored on <a href="https://beta.tait.tech/tests/chess/">beta.tait.tech</a>.
|
|
||||||
|
|
||||||
</footer>
|
|
||||||
</div>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
@ -1,61 +1 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Test ARIA-live region with label | tait.tech</title> <link rel="stylesheet" href="/assets/css/style.css"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="author" content="Tait Hoyem"> <meta name="keywords" content=""> <meta name="description" content=""> </head> <body> <div id="wrapper"> <header> <h1>tait.tech</h1> <nav> <a href="/" class="nav-link">Home</a> <a href="/blog/" class="nav-link">Blog</a> <a href="/ideas/" class="nav-link">Ideas</a> <a href="/links/" class="nav-link">Links</a> <a href="https://github.com/TTWNO/" class="nav-link" target="_blank" rel="noopener noreferrer">Github</a> </nav> </header> <main> <div id="test-aria" aria-live="polite" aria-label="Test label"> I am some text. </div> <button id="btn">Update labled ARIA region.</button> <button id="btn2">Delete text</button> <p>Test</p> <script>ALDIV=document.getElementById("test-aria"),NEW_TEXT="new text;",UPDATE_BTN=document.getElementById("btn"),DELETE_BTN=document.getElementById("btn2"),UPDATE_BTN.addEventListener("click",function(){ALDIV.innerText="Updating... Hello world!"}),DELETE_BTN.addEventListener("click",function(){ALDIV.innerText=""});</script> </main> <hr> <footer> This page is mirrored on <a href="https://beta.tait.tech/tests/live-label/">beta.tait.tech</a>. </footer> </div> </body> </html>
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<title>Test ARIA-live region with label | tait.tech</title>
|
|
||||||
<link rel="stylesheet" href="/assets/css/style.css">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<meta name="author" content="Tait Hoyem">
|
|
||||||
<meta name="keywords" content="">
|
|
||||||
<meta name="description" content="">
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div id="wrapper">
|
|
||||||
<header>
|
|
||||||
<h1>tait.tech</h1>
|
|
||||||
|
|
||||||
<nav>
|
|
||||||
|
|
||||||
<a href="/" class="nav-link" >Home</a>
|
|
||||||
|
|
||||||
<a href="/blog/" class="nav-link" >Blog</a>
|
|
||||||
|
|
||||||
<a href="/ideas/" class="nav-link" >Ideas</a>
|
|
||||||
|
|
||||||
<a href="/links/" class="nav-link" >Links</a>
|
|
||||||
|
|
||||||
<a href="https://github.com/TTWNO/" class="nav-link" target="_blank" rel="noopener noreferrer" >Github</a>
|
|
||||||
|
|
||||||
</nav>
|
|
||||||
|
|
||||||
</header>
|
|
||||||
<main>
|
|
||||||
<div id="test-aria" aria-live="polite" aria-label="Test label">
|
|
||||||
I am some text.
|
|
||||||
</div>
|
|
||||||
<button id="btn">Update labled ARIA region.</button>
|
|
||||||
<button id="btn2">Delete text</button>
|
|
||||||
<p>Test</p>
|
|
||||||
<script>
|
|
||||||
ALDIV = document.getElementById("test-aria");
|
|
||||||
NEW_TEXT = "new text;";
|
|
||||||
UPDATE_BTN = document.getElementById("btn");
|
|
||||||
DELETE_BTN = document.getElementById("btn2");
|
|
||||||
|
|
||||||
UPDATE_BTN.addEventListener('click', function(e) {
|
|
||||||
ALDIV.innerText = 'Updating... Hello world!';
|
|
||||||
});
|
|
||||||
DELETE_BTN.addEventListener('click', function(e) {
|
|
||||||
ALDIV.innerText = '';
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
|
|
||||||
</main>
|
|
||||||
<hr>
|
|
||||||
<footer>
|
|
||||||
This page is mirrored on <a href="https://beta.tait.tech/tests/live-label/">beta.tait.tech</a>.
|
|
||||||
|
|
||||||
</footer>
|
|
||||||
</div>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
@ -1,76 +1 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Tutoring | tait.tech</title> <link rel="stylesheet" href="/assets/css/style.css"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="author" content="Tait Hoyem"> <meta name="keywords" content=""> <meta name="description" content=""> </head> <body> <div id="wrapper"> <header> <h1>tait.tech</h1> <nav> <a href="/" class="nav-link">Home</a> <a href="/blog/" class="nav-link">Blog</a> <a href="/ideas/" class="nav-link">Ideas</a> <a href="/links/" class="nav-link">Links</a> <a href="https://github.com/TTWNO/" class="nav-link" target="_blank" rel="noopener noreferrer">Github</a> </nav> </header> <main> <h2 id="tutoring">Tutoring</h2> <p>I believe in solving problems. Learn how to solve your own unique computer-related problems by learning how they work underneath all the fancy buttons you see.</p> <p>Contact me at <a href="mailto:tutoring@tait.tech">tutoring@tait.tech</a> for more info.</p> <h3 id="rateshour">Rates/hour</h3> <p><strong><em>C$25</em></strong> for a programming language I am comfortable with already.</p> <ul> <li>C, C++, Java, Python, HTML/CSS/JS.</li> </ul> <p><strong><em>C$20 + 1 week prep. time</em></strong> for a programming language I am not very comfortable with already.</p> <ul> <li>Rust, Go, Node.js.</li> </ul> <p><strong><em>C$35</em></strong> for Linux system administration.</p> <ul> <li>Paritioning disks, install and configure software and automate tasks via the command line interface (CLI).</li> </ul> <p>I offer group discounts for 2+ students.</p> <h5 id="resources">Resources:</h5> <p>My favourite resources are the following:</p> <ul> <li><a href="https://www.youtube.com/user/thenewboston">thenewboston (Youtube)</a></li> <li><a href="https://cppreference.com">cppreference.com</a> (also has C references)</li> </ul> </main> <hr> <footer> This page is mirrored on <a href="https://beta.tait.tech/tutoring/">beta.tait.tech</a>. </footer> </div> </body> </html>
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<title>Tutoring | tait.tech</title>
|
|
||||||
<link rel="stylesheet" href="/assets/css/style.css">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<meta name="author" content="Tait Hoyem">
|
|
||||||
<meta name="keywords" content="">
|
|
||||||
<meta name="description" content="">
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div id="wrapper">
|
|
||||||
<header>
|
|
||||||
<h1>tait.tech</h1>
|
|
||||||
|
|
||||||
<nav>
|
|
||||||
|
|
||||||
<a href="/" class="nav-link" >Home</a>
|
|
||||||
|
|
||||||
<a href="/blog/" class="nav-link" >Blog</a>
|
|
||||||
|
|
||||||
<a href="/ideas/" class="nav-link" >Ideas</a>
|
|
||||||
|
|
||||||
<a href="/links/" class="nav-link" >Links</a>
|
|
||||||
|
|
||||||
<a href="https://github.com/TTWNO/" class="nav-link" target="_blank" rel="noopener noreferrer" >Github</a>
|
|
||||||
|
|
||||||
</nav>
|
|
||||||
|
|
||||||
</header>
|
|
||||||
<main>
|
|
||||||
<h2 id="tutoring">Tutoring</h2>
|
|
||||||
|
|
||||||
<p>I believe in solving problems.
|
|
||||||
Learn how to solve your own unique computer-related problems by learning how they work underneath all the fancy buttons you see.</p>
|
|
||||||
|
|
||||||
<p>Contact me at <a href="mailto:tutoring@tait.tech">tutoring@tait.tech</a> for more info.</p>
|
|
||||||
|
|
||||||
<h3 id="rateshour">Rates/hour</h3>
|
|
||||||
|
|
||||||
<p><strong><em>C$25</em></strong> for a programming language I am comfortable with already.</p>
|
|
||||||
<ul>
|
|
||||||
<li>C, C++, Java, Python, HTML/CSS/JS.</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<p><strong><em>C$20 + 1 week prep. time</em></strong> for a programming language I am not very comfortable with already.</p>
|
|
||||||
<ul>
|
|
||||||
<li>Rust, Go, Node.js.</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<p><strong><em>C$35</em></strong> for Linux system administration.</p>
|
|
||||||
<ul>
|
|
||||||
<li>Paritioning disks, install and configure software and automate tasks via the command line interface (CLI).</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<p>I offer group discounts for 2+ students.</p>
|
|
||||||
|
|
||||||
<h5 id="resources">Resources:</h5>
|
|
||||||
|
|
||||||
<p>My favourite resources are the following:</p>
|
|
||||||
|
|
||||||
<ul>
|
|
||||||
<li><a href="https://www.youtube.com/user/thenewboston">thenewboston (Youtube)</a></li>
|
|
||||||
<li><a href="https://cppreference.com">cppreference.com</a> (also has C references)</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
</main>
|
|
||||||
<hr>
|
|
||||||
<footer>
|
|
||||||
This page is mirrored on <a href="https://beta.tait.tech/tutoring/">beta.tait.tech</a>.
|
|
||||||
|
|
||||||
</footer>
|
|
||||||
</div>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
Loading…
Reference in new issue