migrate to gutenberg
This commit is contained in:
Michael Zhang
parent
b18ce14efd
commit
63fa0d5d09
|
|
@ -1,6 +1 @@
|
|||
_site
|
||||
.sass-cache
|
||||
Gemfile.lock
|
||||
|
||||
/_posts/*
|
||||
!/_posts/.gitkeep
|
||||
public
|
||||
|
|
|
|||
12
Gemfile
12
Gemfile
|
|
@ -1,12 +0,0 @@
|
|||
# frozen_string_literal: true
|
||||
|
||||
source "https://rubygems.org" do
|
||||
gem "kramdown"
|
||||
gem "jekyll-feed"
|
||||
gem "jekyll-minifier"
|
||||
gem "jekyll-watch"
|
||||
gem "mathematical"
|
||||
gem "rouge"
|
||||
end
|
||||
|
||||
git_source(:github) {|repo_name| "https://git.mzhang.me/michael/blog" }
|
||||
13
_config.yml
13
_config.yml
|
|
@ -1,13 +0,0 @@
|
|||
markdown: kramdown
|
||||
|
||||
kramdown:
|
||||
input: GFM
|
||||
smart_quotes: ["apos", "apos", "quot", "quot"]
|
||||
syntax_highlighter: rouge
|
||||
|
||||
jekyll-minifier:
|
||||
exclude: "feed.xml"
|
||||
|
||||
plugins:
|
||||
- jekyll-feed
|
||||
- jekyll-minifier
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
<div style="text-align: center; font-weight: 200;">
|
||||
written by Michael Zhang.
|
||||
<a href="https://git.mzhang.me/michael/blog" class="colorlink" target="_blank">source</a>
|
||||
</div>
|
||||
|
|
@ -1,8 +0,0 @@
|
|||
<div class="container" id="navbar" style="padding-top: 10px;">
|
||||
<a href="/" class="title nocolorlink">michael's blog</a>
|
||||
|
||||
<div id="nav">
|
||||
<a href="/about" class="link">about</a>
|
||||
<a href="https://git.mzhang.me/explore" class="link">gitea</a>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
<html>
|
||||
|
||||
<head>
|
||||
<title>michael's blog</title>
|
||||
<link rel="stylesheet" href="/css/index.css" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<header>{% include navbar.html %}</header>
|
||||
|
||||
<div class="container" style="padding: 30px;">
|
||||
{{ content }}
|
||||
</div>
|
||||
|
||||
{% include footer.html %}
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
|
@ -1,28 +0,0 @@
|
|||
<html>
|
||||
|
||||
<head>
|
||||
<title>{{ page.title }} - michael's blog</title>
|
||||
<link rel="stylesheet" href="/css/index.css" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<header>{% include navbar.html %}</header>
|
||||
|
||||
<div class="container" style="padding: 30px;">
|
||||
<div style="text-align: center;">
|
||||
<h1 style="display: inline-block; margin: 0;">{{ page.title }}</h1>
|
||||
<p style="font-size: 0.9em;">published:
|
||||
<b>{{ page.date | date_to_long_string }}</b>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="content">
|
||||
{{ content }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% include footer.html %}
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
|
@ -1,42 +0,0 @@
|
|||
require "mathematical"
|
||||
|
||||
$blockRgx = /((?<block>\$\$[^\$]+\$\$)|[^\$](?<inline>\$[^\$]+\$)[^\$])/
|
||||
|
||||
module Jekyll
|
||||
class InlineLatex < Converter
|
||||
safe true
|
||||
priority :high
|
||||
|
||||
def matches(ext)
|
||||
ext =~ /^\.md$/i
|
||||
end
|
||||
|
||||
def output_ext(ext)
|
||||
".md"
|
||||
end
|
||||
|
||||
def convert(content)
|
||||
# first pass
|
||||
buf = StringIO.new
|
||||
prev = 0
|
||||
renderer = Mathematical.new({:base64 => true, :format => :svg})
|
||||
content.to_enum(:scan, $blockRgx).map { Regexp.last_match }.to_enum.with_index.each do |match, i|
|
||||
if match[:block] != nil
|
||||
code = match[:block]
|
||||
a, b = match.offset(:block)
|
||||
else
|
||||
code = match[:inline]
|
||||
a, b = match.offset(:inline)
|
||||
end
|
||||
|
||||
buf << content[prev..a].gsub(/^\$?\$/, "").gsub(/\$?\$$/, "")
|
||||
|
||||
render = renderer.render(code)
|
||||
buf << "<img src='" + render[:data] + "' />"
|
||||
prev = b - 1
|
||||
end
|
||||
buf << content[prev..content.length].gsub(/^\$?\$/, "")
|
||||
return buf.string
|
||||
end
|
||||
end
|
||||
end
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
title = "michael zhang"
|
||||
base_url = "https://mzhang.me"
|
||||
|
||||
compile_sass = true
|
||||
highlight_code = true
|
||||
generate_rss = true
|
||||
|
||||
[extra]
|
||||
nav_links = [
|
||||
{ url = "/pages/about", text = "about" },
|
||||
{ url = "https://nobs.mzhang.me", text = "projects" },
|
||||
]
|
||||
|
|
@ -0,0 +1,58 @@
|
|||
+++
|
||||
title = "my new life stack"
|
||||
template = "post.html"
|
||||
date = 2018-02-01
|
||||
|
||||
tags = ["life", "technology"]
|
||||
+++
|
||||
|
||||
This is my first post on my new blog! I used to put a CTF challenge writeup here but decided to change it up a bit. Recently, I've been changing a lot of the technology that I use day to day. Here's some of the changes that I've made!
|
||||
|
||||
## Operating System
|
||||
|
||||
I've ran regular Ubuntu on my laptop for a while, then switched to Elementary OS, which I found a lot more pleasing to use. After using Elementary OS for about 6 months, some of the software on my computer started behaving strangely, and I decided it was time for some change.
|
||||
|
||||
```
|
||||
# michael @ arch in ~ [3:20:09]
|
||||
$ screenfetch
|
||||
-`
|
||||
.o+` michael@arch
|
||||
`ooo/ OS: Arch Linux
|
||||
`+oooo: Kernel: x86_64 Linux 4.14.15-1-ARCH
|
||||
`+oooooo: Uptime: 6h 3m
|
||||
-+oooooo+: Packages: 546
|
||||
`/:-:++oooo+: Shell: zsh 5.4.2
|
||||
`/++++/+++++++: Resolution: 1920x1080
|
||||
`/++++++++++++++: WM: i3
|
||||
`/+++ooooooooooooo/` CPU: Intel Core i7-6500U @ 4x 3.1GHz [37.0°C]
|
||||
./ooosssso++osssssso+` GPU: intel
|
||||
.oossssso-````/ossssss+` RAM: 2963MiB / 7872MiB
|
||||
-osssssso. :ssssssso.
|
||||
:osssssss/ osssso+++.
|
||||
/ossssssss/ +ssssooo/-
|
||||
`/ossssso+/:- -:/+osssso+-
|
||||
`+sso+:-` `.-/+oso:
|
||||
`++:. `-/+/
|
||||
.` `/
|
||||
|
||||
```
|
||||
|
||||
I installed Arch Linux on my laptop the day before yesterday. I've used Arch Linux before, about a year ago, so setup was relatively familiar. On top of Arch Linux, I'm using the very widely recommended i3 tiling window manager, and urxvt terminal emulator.
|
||||
|
||||
## Code Editor
|
||||
|
||||
I usually use Sublime Text and Visual Studio Code (VSCode) equally much. Both editors are extremely customizable (and VSCode seems to be heavily inspired from Sublime), but when it comes down to it, VSCode doesn't outperform Sublime. There are many occasions when VSCode just takes forever (for example, when trying to open large codebases, and then automatically running static analyzers over the entire thing).
|
||||
|
||||
Since I started using Arch Linux, I've been trying out neovim. I'm packing my configuration with plugins, and seeing how well it works out as my main code editor. If I get really comfortable with it, I'll share my init file on a Git repo, probably.
|
||||
|
||||
## Browser... ??
|
||||
|
||||
I used to use Chromium, and ..I still do. I've tried several alternatives, like Firefox or even Vivaldi, but all of them seem to be missing something. I haven't tried the new Firefox Quantum yet, but unless there's a really big reason for me to change my browser, I'm probably going to stick to Chrome for a while. Chrome's DevTools are by far the best I've used, and its general ease of use makes it my favorite browser.
|
||||
|
||||
### cVim
|
||||
|
||||
[cVim](https://chrome.google.com/webstore/detail/cvim/ihlenndgcmojhcghmfjfneahoeklbjjh?hl=en) is a nice Chrome extension that provides vim-like keyboard bindings to Chrome. I'm going to have to admit that there's a lot of quirks around using it on pages that have heavy key bindings, but ever since I started using it, I can't help but use j/k scrolling and H/L for back and forth navigation!
|
||||
|
||||
## Personal Server
|
||||
|
||||
I got a droplet off DigitalOcean for hosting things that I regularly depend on. In fact, this blog (running Ghost) is hosted there now! I'm also hosting a Git server over at [https://git.mzhang.me](https://git.mzhang.me). It's running Gitea, a Go-based GitHub alternative. This doesn't mean I'm completely ditching GitHub, I just have things that I _really_ want to keep private, private.
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
+++
|
||||
title = "pumping lemma proofs"
|
||||
template = "post.html"
|
||||
date = 2018-02-12
|
||||
|
||||
tags = ["education", "math"]
|
||||
+++
|
||||
|
||||
I'm learning about language theory and the pumping lemma in my automata class. This post exists mainly for my personal understanding, but also to build up a future reference. Here I explain the idea of the pumping lemma and how it can be used to disprove properties about languages.
|
||||
|
||||
The pumping lemma provides an interesting sense of "closedness" among languages. On the most general level, if you know that your language is regular, or if it is a context-free language, it can be "pumped"; that is, part of the string can be repeated in such a way that the resulting string will still belong to the original language. I bunched regular languages and context-free languages together in here but the way the pumping lemma works for these two classes of languages actually works quite differently. In this post I'll just focus on the version of the pumping lemma for regular languages, but the version for context-free languages is a bit more involved.
|
||||
|
||||
[Regular languages](https://en.wikipedia.org/wiki/Regular_language) are languages that can be recognized by a finite automaton. If you recall, one of the biggest limitations about finite automata are that they cannot keep track of "parsing state" for arbitrarily long strings. One of the most common examples of an irregular language is the language matching *binary palindromes*. We'll define this language over the alphabet with symbols $\left\{0, 1\right\}$ as: $\left\{ss^R\right\}$, where $s^R$ denotes the reverse of the string. Let's stick to even-length palindromes for now, since it doesn't take that much more work to extend the proof to odd-length palindromes.
|
||||
|
||||
Basically, for any regular language, the pumping lemma guarantees that there exists a pumping length $P$, and that *every* string that is longer than this pumping length will be able to be represented as a concatenation of 3 smaller strings (let's call them $x$, $y$, and $z$) that have some pretty unique properties.
|
||||
|
||||
As long as $|xy| \leq P$ (that is, the length of $x$ concat $y$ is at most $p$), and $y$ is not empty, then the string $y$ can be repeated as many times as you'd like, and the resulting string would still be a member of the original language. To clarify, this means the strings $xz$, $xyz$, $xyyz$, $xyyyz$, etc. will all be closed under the same language. The string $xz$ would just be the equivalent of "unpumping" $y$, or taking 0 copies of $y$.
|
||||
|
||||
So if a regular language is guaranteed to have a pumping length and all these fantastic properties, if a language happens to not have these properties, it will have been proven to not be regular. Let's take this and apply it to the palindrome example above.
|
||||
|
||||
The way we'll perform this proof is by contradiction. We'll assume that the palindrome language is regular, then follow step-by-step until we reach a contradiction in the pumping lemma. Then we'll know for sure that palindromes are not a regular language.
|
||||
|
||||
### the proof
|
||||
|
||||
Suppose the palindrome language is regular. Let's start drawing out some of the conclusions from this assumption using the pumping lemma. First and foremost, being a regular language guarantees this language a pumping length $P$, and that a certain property holds for *every* string above this pumping length. If our goal is to find a contradiction, then finding *any* string for which this property doesn't hold will be enough. Remember, $|xy|$ must be less than or equal to $P$ in order for the pumping to work. So let's pick that one string and define it in terms of $P$, so we will be able to pick out $x$, $y$, and $z$ easier later. The string we'll go with is $s = 0^P1^{2P}0^P$.
|
||||
|
||||
It's easy to look at this string and verify that it belongs to the palindrome language. It consists of two strings, each of length $2P$ which are mirrors of each other. Because $|xy|$ must add up to be less than $P$, $x$ and $y$ must both be strings consisting only of $0$s. It's a good time to note that the pumping lemma doesn't guarantee that *every* combination of $x$ and $y$ can be pumped, only that for every string $s$, there's a *specific* $x$, $y$, and $z$ such that $y$ can be pumped. Consequently, we have to stick with a generic definition of $y$ and show that it will *never* be able to be pumped.
|
||||
|
||||
We're ready to start pumping. Pumping $y$ simply means turning the string $xyz$ into $xyyz$. Ok let's go over that in some more detail. We know that $xyz$ has to take the form $0^P1^{2P}0^P$, with $x$ and $y$ making up some if not all of the first $P$ zeros. We know that the length of $y$ must be greater than zero, since that's one of the premises of the substrings $x$, $y$, and $z$. So $xyyz$ must be $0^{P+|y|}1^{2P}0^P$, where $|y| > 0$. This clearly *isn't* in the palindromes language, since the number of 0s on the left side clearly isn't the same as the number of $0$s on the right side. We've just pumped a string out of its own language, even while following the rules of the pumping lemma. Since we encountered a contradiction, our proof is complete.
|
||||
|
||||
Thanks for reading! I'll try to share some more interesting things I find here.
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
+++
|
||||
title = "cleaning up your shell"
|
||||
template = "post.html"
|
||||
date = 2018-02-25
|
||||
|
||||
tags = ["technology", "shell"]
|
||||
+++
|
||||
|
||||
Is your shell loading slower than it used to? Maybe you've been sticking a bit more into your `.bashrc`/`.zshrc` than you thought.
|
||||
|
||||
It's only been a couple weeks since I installed my computer, and already my shell has been starting to lag. Since there's not that much I've put into my `.zshrc` file, I knew who the main culprits were. Namely, oh-my-zsh's "git" plugin and the nvm (node version manager) trying to load itself on startup. I'm not exactly in a situation where I need nvm most of the time I open my shell, so getting rid of that made my shell load a lot faster. It also means that every time I want to use node or npm, I'd have to manually call nvm, but that's not as important to me as a faster shell load time, especially since I don't really touch node that much.
|
||||
|
||||
One trick you can use to see what scripts are being called at startup is the `-x` option (stands for xtrace) that popular shells like `bash` and `zsh` support. If you go into your shell and run `set -o xtrace`, you'll see it start to spit out some bash commands; this is the list of everything that is being run when your shell starts. You might find that some apps take a ridiculous amount of time to start up. These are some of the things you'd want to eliminate.
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
+++
|
||||
title = "fixing tmux colors"
|
||||
template = "post.html"
|
||||
date = 2018-04-23
|
||||
|
||||
tags = ["technology", "shell"]
|
||||
+++
|
||||
|
||||
Put this in your `~/.tmux.conf`.
|
||||
|
||||
```bash
|
||||
set -g default-terminal "screen-256color"
|
||||
```
|
||||
|
||||
If this isn't set properly, tmux usually assumes 16-color mode, which displays colors probably not like what you're used to.
|
||||
|
|
@ -0,0 +1,48 @@
|
|||
+++
|
||||
title = "web apps"
|
||||
template = "post.html"
|
||||
date = 2018-05-28
|
||||
|
||||
tags = ["technology", "opinion"]
|
||||
+++
|
||||
|
||||
The other day, I just turned off JavaScript from my browser. "fucking neckbeard", "you'll turn it back in 2 weeks", "living without JavaScript is like living without electricity" were some of the responses I got. And they might be right. But let's see why things are the way they are and what we can do about it.
|
||||
|
||||
## what is the purpose of the web?
|
||||
|
||||
Well, the answer's pretty obvious, right? So you can surf it. But what does that even mean anymore? In the past, surfing the web meant viewing websites. You'd open something like your favorite news website, and it'd show you some of the latest updates. Or maybe you'd open the website for some company to find out their telephone so you can contact them. In other words, it was a channel from which you could receive information.
|
||||
|
||||
If you wanted to do anything more complicated or that required more interaction, like sending an email, you'd probably pop open a dedicated client to do it. Things like Microsoft Outlook, Mozilla Thunderbird serve as great email clients. For chat, you could use an IRC client. Hell, even the browser was a client, just for viewing webpages. If you didn't have a client for a service that you wanted to use, you'd download a client, enter in the details of the server you want to connect to, and then you would be off.
|
||||
|
||||
Things aren't that way anymore. For some reason, the web browser has become the all-in-one client for every service. Instead of simply acting as a HTTP client, your browser is now also capable of running full-blown 3D games, chat rooms, real-time word processors, and [full x86 emulators, apparently](http://copy.sh/v86/). What the hell happened?
|
||||
|
||||
## spoiler alert: javascript happened
|
||||
|
||||
JavaScript happened. That little _scripting_ language invented to, you know, make some hover animation on your page or have dropdowns on your menu bar. Thanks to the introduction of JavaScript (and jQuery especially), developers stopped viewing webpages as Word documents that you can share, and more like canvases. Hover animations are cute and dropdowns are useful. Sure. But when this _scripting_ language starts turning into a _systems_ language (for lack of a better term), you have a problem. When's the last time you used Perl to write an operating system?
|
||||
|
||||
Look at the things we do today with JavaScript. We have _full blown frameworks_ that we _compile_ into bundles of _executable code_ in people's browsers. We're basically talking about the equivalent of downloading a binary and executing it on your computer every time you open a _webpage_. Except for a few minor differences. Firstly, it's not really a binary, it's a huge blob of script, which means it must be executed inside some virtual interpreter. For each tab that you're running. Secondly, now you're downloading random scripts from any website that you open, and then [trusting it](https://superlogout.com/) and [running it](https://coinhive.com/). You wouldn't hesitate to click a link, but you'd definitely think twice before installing something from an unknown source into your computer, right?
|
||||
|
||||
On top of that, look at these huge frameworks that almost every company is hiring developers for: React, Angular, Vue. These frameworks help JavaScript developers develop "web apps", meaning your JavaScript is now responsible for things the browser should actually be doing for you: two-way data binding, template rendering, and more. Except now, you're downloading a script and running it inside of a virtual interpreter. And because of technologies like Webpack that bundles all your separate code files together (read: static linking), our browsers can't even use the same framework code from site to site.
|
||||
|
||||
Look at Facebook's home page. Just from regular use, that webpage itself can use over 4 gigabytes of RAM. It makes large amounts of network calls for data that's all just being stored in memory. And everyone who opens the Facebook website (for the first time) must download _all_ of that JavaScript. The website has its own tabs (within the page, yes) for chat windows, games, advertisements, embedded video players, and much more I probably didn't even know about. Why are we running full-blown apps in our browser?
|
||||
|
||||
## ok but what can i do
|
||||
|
||||
There's a number of things that can be done to turn this state of the web down a different path. Here's some ideas for users:
|
||||
|
||||
- Disable JavaScript in your browser. Grant websites permission to use JavaScript only if they need it. You'd be surprised how many sites work with JavaScript disabled.
|
||||
- If you're not ready to do that yet or don't want to, consider [uBlock Origin](https://chrome.google.com/webstore/detail/ublock-origin/cjpalhdlnbpafiamejdnhcphjbkeiagm?hl=en). It's an extension that can block scripts by source.
|
||||
|
||||
For developers:
|
||||
|
||||
- [svelte](https://svelte.technology/) is a cool alternative to frameworks like Angular or React.
|
||||
- Consider the impact of every library you include. Can you do without it? What if you just wrote something from scratch instead of importing a full framework to do it?
|
||||
- Write more non-JavaScript software/libraries. Developers have only turned towards sticking JavaScript everywhere because it's easy to use, and libraries are readily available through npm.
|
||||
|
||||
## ok but what can you do
|
||||
|
||||
I'm helping with a project called flubber, which originated as an IRC bouncer, but is slowly turning into a general messaging protocol. All-in-one messengers exist (and a particular one exists by that name exactly), but they all work by opening a browser view and just loading the page within it, so it's no different from just opening tabs in a browser. Flubber will communicate with these services through APIs, and then expose a uniform interface to clients which makes it easy to bring all into a single view. Check out my progress [here](https://github.com/iptq/flubber). Other than that, I'm also working on making my websites as light as possible in general, including this one (which, by the way, has 0 JavaScript content).
|
||||
|
||||
And of course, I've disabled JavaScript in my browser.
|
||||
|
||||
\</rant\> <small>thanks for reading!</small>
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
+++
|
||||
title = "michael's blog"
|
||||
template = "blog.html"
|
||||
|
||||
sort_by = "date"
|
||||
paginate_by = 10
|
||||
paginate_path = "page"
|
||||
+++
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
+++
|
||||
+++
|
||||
|
|
@ -1,18 +1,19 @@
|
|||
---
|
||||
layout: default
|
||||
---
|
||||
|
||||
# about me
|
||||
+++
|
||||
title = "about me"
|
||||
template = "post.html"
|
||||
+++
|
||||
|
||||
Hi there! I'm a Computer Science student at the University of Minnesota, and I've got a wide variety of interests under this field. I've been doing web development for a long time and now I'm looking into security, programming language development, and software development!
|
||||
|
||||
In an effort to rely on less services, I started doing a lot of self-hosting and rewriting of software. Check out some of the projects I'm doing over on my public [Git viewer](https://nobs.mzhang.me)!
|
||||
|
||||
Here's some of the languages I like, in approximate order of my skill/confidence in using them:
|
||||
|
||||
- **Python** My favorite language by far. Aside from its weakness in performance, I love how the language looks, and I'm currently working on a project that aims to use type inferencing to produce lower-level code.
|
||||
- **Rust** I can't say I'm fluent in Rust, but writing code in Rust just feels right. Most of my recent projects have been done in Rust.
|
||||
- **Go** I like the way this language is opinionated, and makes for very clean code. Unfortunately, because of their design decisions it's relatively lacking in language features.
|
||||
- **Python** One of my favorite languages by far. Aside from its weakness in performance, I love how the language looks. I do have several bones to pick, especially towards its dependency ecosystem.
|
||||
- **JavaScript** Although I'm trying to step away from JavaScript, I find myself using it from time to time simply out of ease of use and plethora of libraries.
|
||||
- **Rust** I can't say I'm fluent in Rust, but writing code in Rust just feels right.
|
||||
- **C** Largely prefer this over C++ because of much finer control over what's happening.
|
||||
- **Go** I really love this language.
|
||||
- **OCaml** Learned this from a functional programming class, and I still use it from time to time; I kinda see it as the "Python" of function languages.
|
||||
- **C++** Good for when I did competitive programming because of its very comprehensive standard library.
|
||||
|
||||
|
|
@ -21,3 +22,4 @@ If you want my resume, contact me through one of these means:
|
|||
## Contact
|
||||
- Discord: **michael#8440** (this is usually the best place to find me)
|
||||
- Email: (I sign all my Git commits with this email)
|
||||
- PGP Key: (coming soon)
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
---
|
||||
---
|
||||
|
||||
@import "main.scss";
|
||||
22
index.html
22
index.html
|
|
@ -1,22 +0,0 @@
|
|||
---
|
||||
layout: default
|
||||
---
|
||||
|
||||
<table style="width: 100%;">
|
||||
{% for post in site.posts %}
|
||||
<tr>
|
||||
<td>
|
||||
<h3 style="margin-bottom: 0;">
|
||||
<a class="colorlink" href="{{ post.url }}" style="font-weight: 300;">{{ post.title }}</a>
|
||||
</h3>
|
||||
</td>
|
||||
<td style="text-align: right;">
|
||||
<small>{{ post.date | date: "%B %e, %Y" }}</small>
|
||||
</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</table>
|
||||
|
||||
<p style="text-align: center;">
|
||||
<small><a href="/feed.xml" class="colorlink">click here for RSS feed</a></small>
|
||||
</p>
|
||||
|
|
@ -23,3 +23,8 @@
|
|||
font-weight: 300;
|
||||
src: url(/fonts/RobotoMono/RobotoMono-Light.ttf) format("truetype");
|
||||
}
|
||||
@font-face {
|
||||
font-family: "RobotoMono";
|
||||
font-weight: 400;
|
||||
src: url(/fonts/RobotoMono/RobotoMono-Regular.ttf) format("truetype");
|
||||
}
|
||||
|
|
@ -4,6 +4,7 @@
|
|||
@import "mixins.scss";
|
||||
@import "simple-grid.scss";
|
||||
@import "syntax.scss";
|
||||
|
||||
body {
|
||||
background-color: #f8f8f8;
|
||||
font-family: "Roboto", sans-serif;
|
||||
|
|
@ -15,6 +16,7 @@ body {
|
|||
}
|
||||
|
||||
a {
|
||||
color: $brand;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
|
|
@ -26,6 +28,10 @@ small {
|
|||
@include colored-link(1px, $brand);
|
||||
}
|
||||
|
||||
.brand-colorlink:not(.nocolorlink) {
|
||||
@include colored-link(1px, $brand);
|
||||
}
|
||||
|
||||
.colorlink:not(.nocolorlink) {
|
||||
@include colored-link(1px, #000);
|
||||
}
|
||||
|
|
@ -46,11 +52,18 @@ h6 {
|
|||
|
||||
pre,
|
||||
code {
|
||||
font-weight: 400;
|
||||
* {
|
||||
font-family: "RobotoMono", monospace;
|
||||
font-weight: 300;
|
||||
}
|
||||
padding: 10px;
|
||||
padding: 5px;
|
||||
margin: 5px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
code {
|
||||
background-color: #f9f2f4;
|
||||
color: #c7254e;
|
||||
}
|
||||
|
||||
pre:not(.highlight) {
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
{% extends "layout.html" %}
|
||||
{% import "macros/blog.html" as blog %}
|
||||
|
||||
{% block content %}
|
||||
{{ blog::postlisting(posts=section.pages) }}
|
||||
{% endblock %}
|
||||
|
|
@ -0,0 +1,26 @@
|
|||
{% import "macros/layout.html" as layout %}
|
||||
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<title>michael's blog</title>
|
||||
<link rel="stylesheet" href="/main.css" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<header>
|
||||
{{ layout::navbar(config=config) }}
|
||||
</header>
|
||||
|
||||
<div class="container" style="padding: 5px 30px;">
|
||||
{% block content %}{% endblock %}
|
||||
</div>
|
||||
|
||||
<div style="text-align: center; font-weight: 200; margin-bottom: 40px;">
|
||||
written by Michael Zhang.
|
||||
<a href="https://git.mzhang.me/michael/blog" class="colorlink" target="_blank">source</a>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
|
@ -0,0 +1,29 @@
|
|||
{% macro postlisting(posts) %}
|
||||
<table style="width: 100%;">
|
||||
{% for post in posts %}
|
||||
{% if not post.draft %}
|
||||
<tr>
|
||||
<td>
|
||||
<span style="font-size: 1.2em;">
|
||||
<a href="{{ post.permalink }}" class="brand-colorlink">{{ post.title }}</a>
|
||||
</span>
|
||||
<br />
|
||||
<small>
|
||||
Posted {% if post.extra.author %}by {{ post.extra.author }}{% endif %}
|
||||
on {{ post.date }}
|
||||
</small>
|
||||
</td>
|
||||
{% if post.tags %}
|
||||
<td style="text-align: right;" class="hidden-sm">
|
||||
<small>{{ post.tags | join(sep=", ") }}</small>
|
||||
</td>
|
||||
{% endif %}
|
||||
</tr>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</table>
|
||||
|
||||
<p style="text-align: center;">
|
||||
<small><a href="/rss.xml">click here for RSS feed</a></small>
|
||||
</p>
|
||||
{% endmacro postlisting %}
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
{% macro navbar(config) %}
|
||||
<div class="container">
|
||||
<a href="/" class="title nocolorlink">{{ config.title }}</a>
|
||||
|
||||
<div id="nav">
|
||||
{% for link in config.extra.nav_links %}
|
||||
<a href="{{ link.url | safe }}" class="link">{{ link.text | replace(from=" ", to=" ") }}</a>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endmacro navbar %}
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
{% extends "layout.html" %}
|
||||
|
||||
{% block content %}
|
||||
<h1 style="margin-bottom: 0;">{{ page.title }}</h1>
|
||||
{% if page.date or page.author %}
|
||||
<small style="display: block; margin-bottom: 20px;">
|
||||
Posted
|
||||
{% if page.extra.author %}by {{ page.extra.author }}{% endif %}
|
||||
on {{ page.date }}
|
||||
</small>
|
||||
{% endif %}
|
||||
{{ page.content | safe }}
|
||||
{% if page.extra.link %}
|
||||
<p>Visit <a href="{{ page.extra.link }}">here</a> for more info.</p>
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
Loading…
Reference in New Issue