12Lists and notes

The num­bered list in the pre­vi­ous sec­tion uses the index ver­sion of the Con­course font; it pro­vides index num­bers with a cir­cu­lar sur­round, like this:

1 2 3 4 5 6 7 8 9 10 11 12 13

If you are using the open source fonts sup­plied with the web­site (rather than the paid for Eq­uity fonts), the chances are that you are using the PS-Index font that I made.

It looks like this:

A B C D E F G H I J K L M

I cre­ated 26 char­ac­ters (font de­sign­ers call them glyphs) and mapped them to the fol­low­ing char­ac­ters:

Side-by-side with the Con­course Index font it looks like this:

Now the main dif­fer­ence is that the Con­course Index font is mapped to the num­bers (with some clever jig­gery-pok­ery when a dou­ble digit is en­tered).

My font is nowhere near as clever as that (I don’t know how lig­a­tures work and I think that that is how the Con­course Index han­dles the dou­ble dig­its); I just mapped 26 index char­ac­ters to the let­ters A to Z

Now you may be won­der­ing how this helps with the num­bered lists, these list use num­bers (start­ing at 1 and going up to how­ever many en­tries are in the list) so what’s the use of map­ping the char­ac­ters to the let­ters?

Well, num­bered lists don’t have to use num­bers, they can also use let­ters:

There are var­i­ous op­tions for this, in this case it is using up­per­case let­ters, it could use lower case (a, b, c,…, &c.), Roman nu­mer­als (i, ii, iii, iv, v,…, &c.) and lots of other things. I want to use the up­per­case let­ters op­tion. This will use the let­ters start­ing with A, B, C, D,… and once it gets to Z, it will carry on with AA, AB, AC…&c.

You can prob­a­bly see where this is going. If the list uses the let­ters A to Z in order and if I tell it to use a font where the A to Z char­ac­ters are mapped to glyphs that go from A to Z then it will look just like the Con­course Index ver­sion (at least if you only have 26 list en­tries).

And that is just what I’ve done; in the open source font ver­sion, the PS-Index font is used in place of the Con­course Index font. The prob­lem is to tell the list to use up­per­case let­ter rather than num­bers.

I do this at the end of the style.​css file in the open source font ver­sion of that file; this is where I mod­ify cer­tain char­ac­ter styles to ma­nip­u­late the open source fonts, mak­ing them look bet­ter.

It is ac­tu­ally very easy; I just add an­other prop­erty to the list-num class:

.list-num { list-style-type: upper-alpha; }

The list-style-type: upper-alpha tells the list to start with up­per­case let­ters rather than num­bers — and that’s all there is to it.

It looks like this:

Side-by-side they look like this:

• Again, the main restriction of the open source font version is that a numbered list can only have 26 entries.