Revising TOC Counter

[grayghostvisuals]

So it seems we can revive this Table of Contents to operate with a counter using regular ol' CSS, but we need heading names for each grouping on the TOC.

Current TOC
1.1 Base Type
1.2 Typographic Scale
1.3 Color
1.4 Word-wrap
2.1 Indenting
2.1 Hyphenation
3.1 Small Capitals
3.2 Drop Capitals
3.3 Unicode Ampersands
3.4 Small Print
4.1 Code Blocks
4.2 Figures
4.3 Block Quotes
4.4 Pull Quotes
4.5 Stats Tabs
4.6 Footnotes
4.7 Definition Lists

Proposed New Way

1. Group Name One
   1.1 item
   1.2 item
   1.3 item
   1.4 item
   2 Group Name Two
   2.1 item
   2.2 item

Demo
http://codepen.io/grayghostvisuals/pen/GFcuH

reference
https://developer.mozilla.org/en-US/docs/CSS/Counters

[grayghostvisuals]

Here is sweet a demo from @hugogiraudel showing how it can also be used for headings.
http://codepen.io/HugoGiraudel/pen/mnavc