notes.memorabilium.net

procrastinating

Decided to make this a more direct counterpart to memorabilium. So there it is: notes.memorabilium.net

#notes #procrastinating

An evolution of my old Write.as linklog, experimenting with Write.as for old-school tumbelogging: Memorābilium

Very much a v1.

#procrastinating

With an awful lot of help from GPT4, styled the blog with custom CSS based on colours from Liverpool's excellent 2021/22 season kits.

Here it is.

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap');

body, body * {
    background-color: #F9F8F2;
    font-family: 'Inter', sans-serif !important;
    color: #292929 !important;
}

h1 {
    color: #292929 !important; /* Corrected from 'colour' to 'color' */
}

a {
    text-decoration: underline;
    color: #CB272E !important; /* Adjust comment if needed */
}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
    text-decoration: none;
}

.dt-published {
    font-weight: bold; /* Makes the text bolder */
    color: #FD8B69 !important;
}

.hashtag a {
    color: #CB272E !important;
}

.book.e-content {
    border-bottom: 3px dashed #FDE03E;
    padding-bottom: 30px; /* Adds space above the border */
    margin-bottom: 20px; /* Adds space below the border */
}

strong, b {
    text-decoration: underline dashed #87E0A0;
    text-decoration-thickness: 2px; /* Adjust the thickness of the underline */
    text-underline-offset: 3px; /* Adjust the offset of the underline from the text */
}

blockquote {
    border-left: solid 3px #87E0A0 !important;
    padding-left: 10px !important;
    margin-left: 0 !important;
}

ul {
    list-style-type: square;
}

Notes: Write.as doesn't seem to make it easy to style dates and hashtags, but not to worry!

This is bold text.

This is blockquote text.

#procrastinating

I've wanted to try Tufte CSS (Github) with Write.as for a while. Had a play today. Do you see?

Notes:

i. I binned the tufte.css hr styling as, as is, it breaks the hr Write.as uses in its standard footer. I don't see a reason not to keep the Write.as default.

ii. You need to define p.description.p-note, which Write.as uses for its blog straplines. I duplicated tufte.css' p.subtitle class, so essentially you're just adding this:

p.description.p-note {
     font-style: italic;
    margin-top: 1rem;
    margin-bottom: 1rem;
    font-size: 1.8rem;
    display: block;
    line-height: 1;
}

iii. That leaves much of Tufte CSS untested (including sidenotes, arguably its main reason to exist.) So I might be running a semi-broken blog unawares here. Let's see.

iv. Procrastinating much?

v. On publishing, I need to do something about post dates. Not now, though.

Update: Fun as that was, reverting for the same reasons I did before. Font size and body width faff, and the fact that default styling looks better anyway. Let's just set links to underline and not pretend CSS is something I should put time into.

#procrastinating