How to know the names of Gnome shell components?

I want to create a custom theme for the Gnome shell. My question is not about creating a theme for the applications. Instead, my question is about styling the top bar, popup trays, dock icons-- which are part of the Gnome shell. Where to get a full documentation of the CSS name, id and class name of those components?

I have tried looking at the stylesheets of some themes, but I cannot figure out which name is associated with which component. For example, this is a part of the stylesheet from Transparent shell theme 3.7 from gnome-look.org :

stage {
    font-family: sfns display, product sans, helvetica, source sans pro, segoe ui, nokia pure text, segoe ui, ubuntu,oxygen, cantarell, sans-serif;
    font-size: 10pt;
    color: #efefef;}

/* links */
.shell-link {
    color: #0000ff;
    text-decoration: underline;}

.shell-link:hover {
    color: #999b9b;}

/*medium 12 pt*/
.nm-dialog-item,
.calendar-month-label,
.calendar-day,
.datemenu-today-button,
.message-list-section-title,
.message-content,
.notification-banner .message-title,
.notification-banner .message-content,
.app-well-menu, {
font-size:100%;
}