concerning the {display:none} value for title, subtitle

[barro...@gmail.com]

With custom styling by data tag to override styling for only certain tiddlers to hide title and subtitle; the custom stylesheet attempt is effecting all tiddlers.  I was assuming its a global modifier but I get the same effect with trying to adjust normal css values such as font size for the title.  So one would thinnk, the custom override for certian tiddlers wasn't working but the first css value, padding, is effecting only the data tagged tiddlers as desired.  So I must be erring with the cryptic chirology (ie coding : ) )

1) using $:/tags/Stylesheet tag for the custom stylesheet tiddler, text/css content type

2) using the data tags with the usual css listing format (spaces removed for this post)

eg, this all thats in the text body of the tiddler, no <style>
[data-tags~="#externalviewer"],
[data-tags~="#externalcontent"] {padding: 0px;} h2.tc-title {font-size: .75em;}

a) with the [data-tags~=""] I seen expressed as both [data-tags*=""] and [data-tags~=""], tried both.

b) initial tried h2.tc-title {display:none;) in place of h2.tc-title {font-size: .75em;}

[PMario]

On Saturday, May 26, 2018 at 1:24:51 AM UTC+2, barro...@gmail.com wrote:

You use 2 different rules.

1) ... only for tiddlers tagged

[data-tags~="#externalviewer"],
[data-tags~="#externalcontent"] {padding: 0px;}

2) ... global

h2.tc-title {font-size: .75em;}

IMO it does what you defined. Everything which is inside { } is 1 rule.

-mario

[barro...@gmail.com]

Thank you very much for the reply and clarification. So I had invoked global (which wasn't my intention, was trying to keep it all styling for data tagged tiddlers) when I separated the padding and title into 2 separate rules.  Now to figure out how to get them as one rule.  Each tc element has its own set of {} which seem to make it a separate rule.  Please have patience, I'm more on application side, I learn enough coding to apply something to my use, so I'm figuring it out by trial and error.

As Agent Cooper would say, you have a " damned fine" piece of software here, the guilty parties should be proud.

[barro...@gmail.com]

putting the [data-tags~=""] in front of each rule seemed to be the least painful method, trying to combine into one rule was causing unpredictable results (like losing the stylesheet tiddler)

I can find out the meaning of the *, ~ suffixes to data-tags in the Attribute Selectors page at the main wiki documentation site?

[PMario]

On Saturday, May 26, 2018 at 12:34:18 PM UTC+2, barro...@gmail.com wrote:

putting the [data-tags~=""] in front of each rule seemed to be the least painful method, trying to combine into one rule was causing unpredictable results (like losing the stylesheet tiddler)

I can find out the meaning of the *, ~ suffixes to data-tags in the Attribute Selectors page at the main wiki documentation site?

see: https://tiddlywiki.com/#Custom%20styles%20by%20data-tiddler-title

-m

[barro...@gmail.com]

see: https://tiddlywiki.com/#Custom%20styles%20by%20data-tiddler-title

Excellent, I'm on the right track then.  Been studying those pages as well as the ones at tb5, especially the use of the browser's inspect element.  I recognize your name from quite a few of threads I have read here-- I appreciate your patience and assistance.

just a minor note-- the suggested css shorthand for combining similiar rules, ie

[data-tags*="xyz"] .tc-title, .tc-subtitle {display: none;}

didn't work for me, I had to separate them into separate rules?  Was I correct with that?

[PMario]

What you wrote is equivalent to

[data-tags*="xyz"] .tc-title {

  display: none;

}

.tc-subtitle {

  display: none;

}

But that's probably not what you wanted.

 

[data-tags*="xyz"] .tc-title,

[data-tags*="xyz"] .tc-subtitle {

  display: none;

}

It's much more readable and clear, what's meant

-m

[PMario]

Info about CSS can be found here: https://developer.mozilla.org/en-US/docs/Learn/CSS/Introduction_to_CSS/Selectors

BUT be aware, that TiddlyWiki doesn't use ID-selectors, since IDs have to be unique, which is hard to achieve with several tiddlers open at the same time. 

That's why we use class-selectors most of the time.

have fun!

mario

[barro...@gmail.com]

yep beat you there : ), went there following the TB5 custom styling pages to brush up, not fully indoctrinated in HTML 5/CSS 3, still a html 4 hold over.  I'm more on the app/creative side and due to time constraints, learn just enough to get what I want from the coding.

it was there that I noticed all the tc elements were classes.

have fun!

definitely will : ) I replace my old top iframe navigator for multi media and web content with Tiddlywiki, its leaps and bounds beyond what I achieved.