[tw5] Titlebar CSS

Google Group (Read Only)
#1

I’m trying to figure out how to reduce the size of the titlebar via CSS (including the buttons) and am stuck trying to understand how the CSS works.

In developer tools when I inspect the area, I see this (below). When I uncheck the font-size there, it actually gets bigger and doesn’t seem to affect the buttons
image.png

And then when I uncheck the font-size here - it greatly shrinks it (yay) but way too much
image.png

My poor understanding of CSS made me think that the strikeout meant that it was overridden by something else anyways, but it seems to change things - oh well.

Question is what I can add to a tiddler tagged with the $:/tags/Stylesheet to reduce the size a bit? I’m trying this and it’s not doing anything…

tc-site-title { font-size: 0.5em; }

tc-titlebar { font-size: 0.5em; }

#2

Hi @stobot – first thing to check, without actually delving into which styling affects the heading, is: your stylesheet needs a dot before a class name:

.tc-site-title { font-size: 0.5em; }

For the tiddler title, since there are other things than the title in the titlebar, we want to select the h2 within it specifically:

.tc-titlebar h2 {
font-size: 0.7em;
}

Hope that helps,

Chris

#3

Dangit - embarrassed it was something I should’ve seen - thanks Chris, appreciate the help!!

#4

I struggle with that one – what if I missed something I should know? Since usually the worst you’ll get in this group is silence, at least it’s a pretty safe place to ask when you’re stuck.

Best,
Chris