| Commit message (Collapse) | Author | Age | Lines |
| |
|
|
|
|
|
| |
This seems like a better pick because it is more broad and arguably more
recognizable.
|
| |
|
| |
|
| |
|
|
|
|
|
| |
The page title is way more important than the title of the microblog, so
make sure it gets prominent treatment.
|
| |
|
|
|
|
|
| |
Give the page a more consistent design by standardizing the normal
border radius to be 4px.
|
|
|
|
|
| |
We don't use shadows anywhere else on the site, so putting <pre> in line
with <img> by using rounded corners makes more sense.
|
|
|
|
|
| |
Now that we can put nicely-aligned content at the side we can use the
space to mark the "Related posts" header in a nicer way.
|
|
|
|
|
|
|
| |
We've always been wanting to have the avatars aligned in the negative
space next to the posts but never found an adequately nice way to do it.
With grid this is now easy. We can also replace lots of the old margin
and padding rules with gaps.
|
| |
|
|
|
|
| |
Judging from the CSS this was supposed to be </h3> and not </h2>.
|
| |
|
|
|
|
|
|
| |
This has two reasons: One, the date is more to readers than the avatar.
Two, we are wasting a gigantic 62px just for the padding used to display
the avatar. Clearly it has to go.
|
| |
|
|
|
|
|
|
| |
This helps readability significantly, especially on posts with a large
amount of pre-formatted content. Pick the same colour we've been using
on the main site.
|
| |
|
| |
|
|
|
|
|
|
| |
This was still missing and is needed in the upcoming post. For now, mark
the quote with a border on the left and shrink the text size a bit to
create contrast between normal paragraphs and the quote.
|
| |
|
| |
|
| |
|
| |
|
| |
|
| |
|
| |
|
|
|
|
|
| |
Mostly trivial option renames or moves, and apparently the sass compiler
doesn't like semicola in indented syntax.
|
|
|
|
|
|
|
|
|
|
|
|
|
| |
The use of the section sign § as a permalink marker has been bugging us
for a while now. Whilst being fairly well highlighted it is very hard to
click on account of being so small. Some other sites usually "hide" the
permalink behind the date, but that feels very counterintuitive to us.
Instead, use the most prominent feature of the banner, the title. Make
sure to underline it so that people know it's clickable. Whilst we're
there, also remove the special handling for related posts (no need
anymore now to reveal the post number on the page). Since we were using
the 'bold-hover' class in this particular element only, also remove it.
|
|
|
|
|
|
|
|
| |
Whilst we specifically mention related or relevant posts in some cases,
sometimes related posts are added without any commentary. In that case
it is confusing to name them "mentioned" without there being any mention
of them in the post itself. Naming these kinds of posts "related" makes
more sense and is clearer.
|
|
|
|
|
|
| |
This should make sure that the picture takes all of the available space
in the post since the earlier value of 500px was too small to fill the
entire <figure> element.
|
| |
|
| |
|
|
|
|
|
|
|
|
|
|
|
| |
Commit ea7baaa (templates: Allow setting 'float' for figures in the
'img' shortcode, 2022-04-09) introduces inline styles which were
considered more straightforward than adding special CSS rules. Sadly,
restrictive Content-Security-Policy settings will make browsers
disregard inline styles as a security measure.
Since we don't want to turn off CSP, this comment implement CSS rules
for setting the float attribute on elements.
|
| |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| |
Common elements in <article> usually have their own margin settings. In
a previous CSS rule we make sure to set 'margin-top' for the first
element in <article> to a lower value such that we have a consistent
margin between the article header and the content itself.
However, if the first element is not a <p>, no such margin change will
take effect for the first <p> element. For example, if the first element
is a floating <figure>, the <figure> element will have its margin
modified, whilst the <p> will keep its usual settings, resulting in a
very inconsistent layout.
We assume that the first <p> element is at the top of the article in
almost all cases, and include a new rule in this commit that applies the
margin settings correctly.
|
|
|
|
|
|
|
|
| |
Up until now we always linked to the image itself, but in the future we
may want to link to any arbitrary (even external) page. Add a 'link'
argument to the 'img' shortcode to facilitate this. If no link is given,
we fall back to linking to the image; this makes sure that older posts
need not be changed.
|
|
|
|
|
|
|
| |
We've never had to flow text around a <figure> element before, so this
particular feature was missing. Instead of creating small CSS rules,
interface with the style attribute directly. This is easier and allows
more straight-forward control.
|
|
|
|
|
|
|
| |
An upcoming post will require a smaller figure which has text flowing
around it. This is not nicely possible with the hard-coded setting of
500 pixels. Introduce an optional argument 'width' to the shortcode to
make custom sizes possible.
|
| |
|
|
|
|
|
|
|
| |
The 'resize_image' function was changed to return a map in [1], so we
have to update our code accordingly.
[1] https://github.com/getzola/zola/commit/7fb99eaa44f387fadf744354c605f0cfcc582800
|
| |
|
|
|
|
| |
Since we ended up actually doing what we joked about, this is only fair.
|
| |
|
| |
|
| |
|
| |
|
|
|
|
|
|
|
| |
According to MDN [1], the width attribute carries a unitless integer
instead of "px" et al. Make sure we conform to the standard.
[1] https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attr-width
|
|
|
|
|
|
|
| |
Legacy devices might not render the CSS correctly, making the
high-resolution avatar images take up most of the space on the site.
Make sure to resize them to 64px in HTML using a width attribute.
|
|
|
|
|
|
| |
Instead of just indenting the pre block, it is more visually pleasing
and clear to draw a border around it. That way, code blocks are clearly
delineated from text.
|