How does tiddlywiki knows where to apply CSS classes defined inside theme?

[talha131]

I am using material theme by JD

http://j.d.material.tiddlyspot.com/

The stylesheet is here

http://j.d.material.tiddlyspot.com/#%24%3A%2Fthemes%2Fjd%2FMaterial%2FStylesheet

It has a class div.tc-tab-content.jd-lists-body.

When you inspect the tiddlywiki in the browser you can see that this class is applied to the sidebar content

My question is how does TW knows which CSS class or selector is to be applied to which component?

In theme source code, I don’t see any where that says apply div.tc-tab-content.jd-lists-body to this specific div.

Usually you declare CSS classes in the html for example

<div class="example-class">
<p id="talha">
Lorem ispum
</p>
</div>

Where is the part <div class="tc-tab-content jd-lists-body">

​

[FrD]

Hi,

Have a look at $:/themes/jd/Material/Template/Header-Sidebar,

and search for "jd-lists-body".

Regards

FrD

[Eric Shulman]

On Tuesday, February 26, 2019 at 6:35:34 AM UTC-8, talha131 wrote:

I am using material theme by JD

http://j.d.material.tiddlyspot.com/

The stylesheet is here

http://j.d.material.tiddlyspot.com/#%24%3A%2Fthemes%2Fjd%2FMaterial%2FStylesheet

It has a class div.tc-tab-content.jd-lists-body.

My question is how does TW knows which CSS class or selector is to be applied to which component?

In theme source code, I don’t see any where that says apply div.tc-tab-content.jd-lists-body to this specific div.

Searching in the "system" tab for "jd-lists" finds this matching tiddler:

$:/themes/jd/Material/Template/Header-Sidebar

Edit that tiddler and you will find this:

<$macrocall $name="tabs" tabsList="[all[shadows+tiddlers]tag[$:/tags/SideBar]!has[draft.of]]" default={{$:/config/DefaultSidebarTab}} state="$:/state/tab/sidebar" class="jd-lists-body"/>

Note the class="jd-lists-body" param.  That class is assigned to the <div>'s of the tabset when they are rendered.

hope this helps,

-e

[talha131]

Oops! Talk about missing the obvious.

Thank you FrD.

​

[talha131]

Yes it does help. Thank you Eric.