| Commit message (Collapse) | Author | Age | Lines |
|
|
|
| |
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.
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| |
A regular posts indicates its permalink with a section sign. However,
for mentioned posts we'd like to be explicit about the post number,
since we may refer to them this way in the parent post.
This behaviour should have been working since day one in ad2be2b
(Initial commit, 2021-06-12), but it was subtly broken. Since the
render_post macro does not have access to the 'mention' variable, only
the section sign would ever be used to indicate a permalink.
This probably happened because the rendering code for a post used to
live in the post template instead of a macro.
|
|
|
|
|
|
|
|
|
|
| |
Now that about two months have passed since the initial publication, we
know better with which frequency posts are made. Since there's usually
more than one day between posts, rendering prominently the time at which
posts were made is needlessly noisy.
We already put the exact date and time in the HTML source and the title
tag, so it is still there if really needed.
|
| |
|
| |
|
|
|
|
|
|
|
|
|
|
| |
The img shortcode inserts, along the picture itself, a figcaption
element containing a brief description. We may want to include links or
other HTML elements in that description. This is not possible right now
because we insert the caption content verbatim.
This commit changes the img shortcode such that markdown is now rendered
inline for the figcaption element.
|
|
|
|
|
| |
People might read post 8 on its own so make sure we mention the
followup.
|
| |
|
|
|
|
|
|
| |
Added in the previous commit, this class renders a link more subtly and
is supposed to be used when referencing internal content. We do exactly
this here.
|
|
|
|
|
|
|
|
| |
We may want a post to contain references to a whole number of previous
posts. The styling for external links will then clash, especially if
there are a lot of them. Make sure to make it possible to highlight
internal links differently and more subtly by adding an "internal" class
for <a>.
|
|
|
|
|
|
|
|
|
| |
An upcoming post will (finally) make use of the "mentions" feature.
Whilst working on that post we noticed that the header indicating
mentioned posts is a big too big and clashes even with the site title.
h3 should be better suited for this purpose. Since the default margins
are slightly different from h2, make sure to tweak the stylesheet too.
|
| |
|
| |
|