In my free time, I tend to enjoy pen and paper RPGs, and one of the games I particularly enjoy is Shadowrun (currently in its 5th edition). There is a common problem though; the source book for this game is poorly organized, and finding anything specific is extremely time consuming.

As a side project, I have been organizing that data in a personal site, something that I can link up common terms and potentially create search functionality for. It is not complete yet; there are a few pages I need to add data to, and I have yet to add links where the book had page references (the large yellow Ps in the text are to show where this needs to be done). The actual content in this is obviously not my own.

At this point, the site is entirely HTML and CSS, but there are some things in it I am proud of:

CSS Tables

I created these tables to show item and ability details. They’re styled after the tables in the sourcebook, and required the use of nth-child selectors and some creative class naming to get the background colors to behave this way. This particular styling is also contained in its own sheet, so I can link it up to whatever page I want a table like this on.

Anchors and Links Directly to Topics

I’ve anchored every topic in this so far, and the links in my table of contents jump directly to whatever topic I’m looking for.

The full SRD can be foundĀ here.

Leave a comment