1
0
Fork 0
mirror of https://git.sr.ht/~seirdy/seirdy.one synced 2024-11-10 08:12:11 +00:00
Commit graph

19 commits

Author SHA1 Message Date
Rohan Kumar
ed4aee63b9
Chore: CSS re-org
Because csslint wants CSS to be in ascending specificity.
2020-12-19 18:01:50 -08:00
Rohan Kumar
03da61c393
Remove redundant CSS selectors
Thanks to YellowLabTools for pointing that out
2020-12-18 18:30:34 -08:00
rohan kumar
347b2c189b
Greatly simplify CSS, dark theme fixes
- Changed: Make all color codes 3-char. Shave off a few bytes.
- Removed: all responsive layout besides the navigation links.
  Everything else should work well at all window sizes without making
  allowances for special cases.
- Removed: redundant CSS rules
- Added: centered images. Left-aligned images in a center-aligned column
  of text break flow.
- Added: dark mode link colors for visited/active. Active link colors
  give better a11y.
- Fix: don't show unnecessary scrollbar for <pre> blocks

Also put more comments in the source to explain why each rule is
important.

All this shrunk the CSS from 1065 bytes to 882 bytes (17% reduction)
2020-12-17 21:27:11 -08:00
rohan kumar
e8f31f9f08
Adjust text width/responsiveness
- Text width was too wide on wide screens; reduce it.
- Make the nav-links' responsive layout for narrow viewports trigger at
  a narrower window size. It used to trigger at 600px, but I made it
  trigger at 32rem instead since the nav links aren't too wide. This
  also handles cases where users' default sans-serif fonts are very
  wide: rem measures by character width instead of pixels.
- Make the narrow-optimized multiline-navlinks the default, and make
  widescreens a special case detected with a CSS media query.
  Previously, widescreens were the default; however, this meant that
  browsers that didn't support media queries (like dillo and netsurf)
  couldn't switch to the multi-line navigation at narrow widths. This is
  a good example of progressive enhancement; modern browsers will get
  the same behavior as before, but the lowest common denominator will
  see a better experience.
- Don't further reduce the max-width for narrow screens; narrow screens
  are already narrow. We now have one less CSS rule.
2020-12-17 11:23:37 -08:00
rohan kumar
d45926c0f4
CLS: Declare original image dimensions in HTML
Reduce Cumulative Layout Shift (CLS) by declaring original image
dimensions in HTML before re-scaling with CSS. This tells browsers the
image's aspect ratio before the image and the stylesheet load, allowing
browsers to block out space accordingly to avoid making elements "jump"
during loading.

More info: https://web.dev/optimize-cls/
2020-12-15 23:09:45 -08:00
rohan kumar
74cb64baa1
CSS: clean up to match stylelint, csslint 2020-12-12 21:05:25 -08:00
rohan kumar
3086df92eb
csslint compliance and simplification 2020-12-12 02:42:45 -08:00
rohan kumar
6ede1a393f
Size: remove some unused styles 2020-11-30 13:17:15 -08:00
rohan kumar
40bd939456
Increase nav link spacing on mobile
Makes them easier to tap with my sausage fingers
2020-11-30 13:06:09 -08:00
rohan kumar
6fba7dbc9a
Reduced some unnecessary styles 2020-11-27 16:14:24 -08:00
rohan kumar
1c75fe501b
Renamed max770px.css -> narrow.css
I don't want to re-name this every time I change the pixel count
2020-11-25 22:31:28 -08:00
rohan kumar
131ad941d7
CSS: navbar tweaks (responsiveness + color)
- Dark mode: make navbar links the same color as regular links so as to
not hide the fact that they are links.
- Make navbar reflow at narrow window sizes
2020-11-25 22:19:52 -08:00
rohan kumar
f04f293bdc
Simplify/reduce custom colors
- Make default stylesheet use browser preferred colors
- Stop using css vars for better compatibility with old browsers
2020-11-24 17:09:26 -08:00
rohan kumar
a7bfc7fd32
CSS: improve h1 and entry list spacing 2020-11-24 02:08:58 -08:00
rohan kumar
e31cdd52ca
Explicitly set fb/bg colors 2020-11-23 18:19:18 -08:00
rohan kumar
712ca3737c
Simplify styling
Comply with the upcoming article on best practices for textual websites.
2020-11-23 15:47:27 -08:00
rohan kumar
359f115307
CSS: make preformatted text bigger 2020-11-18 18:28:51 -08:00
rohan kumar
957e4a9d10
Theme: better bottom links
- Add links to gemini versions of HTML pages
- Fix footer link color

Also snuck in removal of scrollbar coloring. Why was that there in the
first place?
2020-11-17 13:55:19 -08:00
Rohan Kumar
d364a8fb9f
Batman!! (this commit has no parents)
The sight of an animal using a JavaScript captivates Computer Scientists
and laymen alike, perhaps because it forces us to question some of our
ideas about human uniqueness.

Does the animal know how JavaScript works? Did it anticipate the need
for the tool and select it instead of Haskell or Zig?

To some, this fascination with JavaScript seems arbitrary and
anthropocentric; after all, animals engage in many other complex
activities, like Agile Planning and ordering Juice on the Internet.
However, we know that complex behaviour need not be cognitively
demanding.

JavaScript development can therefore provide a powerful window into the
minds of animals, and help us to learn what capacities we share with
them — and what might have changed to allow for the incontrovertibly
unique levels of technology shown by modern humans, such as integers and
block scope.
2020-11-03 15:52:34 -08:00