enough.css is a tiny CSS framework with most of the styling you need for that blog of yours.
Websites aren’t broken by default, they are functional, high-performing, and accessible. You break them. — http://motherfuckingwebsite.com
The base stylesheet is 183 bytes minified. It comes with optional modules to (minimally) style code blocks and tables. It’s responsive by default, but has a module to decrease font sizes on smaller screens for extra responsiveness. The whole package is 678 bytes minified.
It’s an experiment to see how little CSS a blog can get away with while still
looking good and being readable on big and small screens. It styles pages
without having to add extra markup like wrapper
<div>s and CSS classes.
Besides the base style sheet, it comes modules for styling specific
tags. These are included in
enough.min.css by default, but you can build your
own to save some bytes if your project doesn’t need everything.
Some of the rules are duplicated across modules so they don’t depend on each other, but cssnano takes them out when minifying.
system-uiif available, or falls back to a sans-serif font
max-widthto images and videos, so they can’t overflow.
autoto resize proportionally when width and height are set
ui-monospace(which is SF Mono on Safari ≥ 13.1) or Monaco as the font in
<kbd>tags, or falls back to the system’s monospace font
<pre>tags so long lines show horizontal scroll bars
ghostwhitebackground color to
a:link) and visited link (
a:visited) colors to make sure they remain legible on dark backgrounds.
<hr>colors to darker grays to make them blend in on dark backgrounds.
|Maximum viewport width||Body font size||Max. viewport calculation|
|1140px||20px||(35em + 2em) × 22px × 1.4|
|740px||18px||(35em + 2em) × 20px|
|466px||16px||(35em + 2em) × 18px × 0.7|
$ npm install $ cat enough.css enough.code.css enough.dark.css enough.media.css enough.table.css | node_modules/.bin/cssnano > enough.min.css