| Commit message (Collapse) | Author | Files | Lines |
|
|
|
Use web font to draw icons.
|
|
Open Sans Light 300 turns out to be too thin when antialiased (e.g., in
mobile Safari.)
|
|
Using web font Open Sans (light) instead of Helvetica Neue. Text is
thinner, but close enough and feels about right.
|
|
I forgot to update print.css to match the updated DOM last time.
|
|
To distinguish long captions from article paragraphs.
|
|
|
|
|
|
The main aim is a more logical DOM structure and more performant CSS.
|
|
Also adjusted some margins.
|
|
New:
* Greater than 1440px: load theme-wide.css, content width: 50%;
* Between 1024 and 1440px: standard theme.css, content width: 60%;
* Lower than 1024px: load theme-narrow.css, content width: 90% (and
floating nav element moves up to page top to make space).
|
|
Again using -webkit-image-set.
|
|
200x200 icon wastes too much valuable screen estate on a smart phone.
|
|
|
|
This way we can deliver the right size based on the window size (wide or
narrow), rather than deliver a universal one then scale down.
|
|
Add class and variation selector (# U+FE0E: VARIATION SELECTOR-15) to
U+21A9: LEFTWARDS ARROW WITH HOOK to fix outstanding font issue of
footnote backlinks on mobile.
Updated styles accordingly.
Trick learned from Daring Fireball.
Before: https://i.imgur.com/eUbL1k8.png
After: https://i.imgur.com/msv3INn.png
|
|
Viewport configuration per Google's mobile usability suggestions. It not
only provides a consistent experience by using device independent
pixels, but also help me get rid of theme-enlarge.css, which could
result in unexpectedly large font when one accidently resize to a
portrait window on the desktop. Thanks Google!
See https://developers.google.com/speed/docs/insights/ConfigureViewport.
|
|
The bar is the same as that for pre. Horizontal padding reduced to 1em.
|
|
Global font size in each style sheet has been tweaked very carefully so
that the precise line height is very close to a whole number of pixels,
so that precision alignment using em, which aligns something
precise (top: 13.5em) to something inprecise (line heights, with
accumulated errors due to rounding in every line), is not lost.
Note that Firefox is NOT supported, since each line seems to always
occupy one more pixel than the calculated line height.
For some reason line numbers in the print view are still rather
problematic at a page continuation. In Chrome and Safari, the first two
line numbers on a new page tend to overlap, so everything afterwards are
off (and on Firefox line numbers do not show up on the second page at
all). Anyway, printing shouldn't be a big concern.
|
|
|
|
|
|
Tested on iPhone 6 Plus (both portrait and landscape).
|
|
For better formatting.
The following screenshots illustrate the difference:
* https://i.imgur.com/ZfkUpBG.png
* https://i.imgur.com/S6cRK00.png
I also reduced the indentation on the left of each year's index from 2em
to 1em.
|
|
|
|
I just noticed that code font is crazy without Consolas installed (I
recently reinstalled my OS and got rid of Office for Mac 2011 — that's
probably why). The line numbers are all off (since the line heights are
carefully pre-calculated, and fallback fonts of different leadings won't
help). Therefore, I'm moving to the quite nice looking and controllable
Droid Sans Mono. Isn't as satisfactory as Consolas on the web, but
certainly better than Monaco.
Note: I originally copied my list Consolas, Monaco, 'Andale Mono',
monospace (I added Courier since I like it a lot as the primitive
monospace font) from MDN Wiki, but now it looks like a bad choice when I
don't have Consolas any more. By the way, MDN Wiki renders line numbers
using JS, so at least they are able to calculate the line heights. I'm
serving everything statically, so this is a problem.
|
|
|
|
|
|
|
|
The way I handle line numbers and the pre block in general is inspired
by the MDN wiki. See, for instance,
https://developer.mozilla.org/en-US/docs/Web/JavaScript/A_re-introduction_to_JavaScript
a screenshot is here: https://i.imgur.com/982TBDc.png
Also tweaked other styles, e.g., changed the primary monospace font to
Consolas, and slightly tweaked a few old posts.
|
|
(other than index.html).
|
|
Also fixed the bugs in pyblog introduced in the last revision and
tweaked the theme a bit.
|
|
|
|
|
|
Also implemented the "touch" action in pyblog, as well as wrote a
README.md for the source branch. And some other minor patching.
|
|
Among other fixes and tweaks.
|
|
Also changed month to short format on the index page.
|
|
Also fixed several problems:
1. Rending SVG and making it a clickable link is basically impossible
across multiple browsers. I'm now using a pretty good PNG;
2. Implemented new_post in pyblog;
3. Footnotes related updates to the theme.
|
|
Note that I'm using an <embed> tag with the svg because if wrapped in
<img>, the svg won't render on Safari. After using the <embed> tag, the
svg renders on all four major browsers on OS X (Chrome, Safari, Firefox,
Opera), and it looks nice on all three but Firefox, in which case it's
crappy as fuck.
|
|
Mainly generating feed and index.
|
|
Also wrote pyblog that currently can generate parts most of the blog.
|