The default courier font has way too light of a font weight and tall line height, making the page itself way longer than it needs to. It's too difficult to read. So I made a custom style for the Stylus browser extension and thought other people might find it useful.
Other changes I made:
- Darkened the sig's separator line.
- Moved the user's info to the left so your eyes aren't zigzagging while reading a thread.
- Made the avatars smaller for less wasted space.
- Made all buttons change the cursor icon to a pointer.
Moving the user info kind of breaks the mobile view, but it's unlikely anyone will ever use Stylus on anything besides desktop. The default layout is fine enough on mobile anyway.
The CSS:
/* More readable text font */
div.payload-richtext > p {
font-family: Verdana;
line-height: 1.05;
}
/* Darker signature separator */
.border-t-2 {
border-top-color: var(--color-mspa-2);
}
/* Move the author info box to the left */
.md\:flex-row {
flex-direction: row-reverse;
}
div.author {
margin-right: calc(var(--spacing)*2);
}
/* Smaller avatars */
div.author > img {
width: 120px;
height: auto;
}
/* This just feels way better, why's it not default wtf */
button {
cursor: pointer;
}
-Sincerely, Sharkalien
