[tw5] Re: User Class and Customizing Tiddler Visual Style

[PMario]

On Friday, November 8, 2019 at 10:03:15 AM UTC+1, HC Haase wrote:
>
> Tank you for your help PMario! I could not see it.
> it makes sense, that wikitext can't me interpreted if it has a css type. 
> but how come css works in a text/vnd-tiddlywiki tiddler??
>

By TW-magic :)

The TW startup module render.js contains some code, that builds the DOM 

[tw5] Re: User Class and Customizing Tiddler Visual Style

[HC Haase]

Tank you for your help PMario! I could not see it.
it makes sense, that wikitext can't me interpreted if it has a css type. 
but how come css works in a text/vnd-tiddlywiki tiddler??


-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/da1cb664-ddc5-48d1-85d4-bd5aff17dbb4%40googlegroups.com.

[tw5] Re: User Class and Customizing Tiddler Visual Style

[PMario]

Hi HC,

If you want to use wikitext features as transclusions in style-sheet 
tiddlers you need to make them text/vnd-tiddlywiki and _not_ text/css

Since your first style definition failed, the whole tiddler failed. 

Use the attachment and it should work. 

-mario

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/043e149e-4339-41ed-b499-f8b2286c612b%40googlegroups.com.


stylesheet_semantic_tags-border-colors.json
Description: application/json

[tw5] Re: User Class and Customizing Tiddler Visual Style

[HC Haase]

mandag den 4. november 2019 kl. 17.41.43 UTC+1 skrev David Gifford:
>
> This is all really neat, both Mohammad's original post and Mario's link to 
> stuff I had not seen. Opens up a lot of possibilities.
>
>
> 2. Question: is there a way to use any of this to create custom colored 
> links to the tiddlers so classed? It sure would be nice to have different 
> kinds of tiddlers linked to with links of different colors.
>
>
That could look nice. 
Maybe the scope of the colour could be expanded, so a color change of a 
tiddler would change the tiddler on multiple levels.
 * tagpill (present)
 * icon (present) 
 * links to the tiddler
 * elements of the tiddler or child tiddlers (could be set with a checkbox?)
 ** title
 ** text
 ** background

That would realy make the colours more integrated in the information of the 
wiki
 ** left border

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/9f9ca095-772d-42f1-8b73-5f9d648237ae%40googlegroups.com.

[tw5] Re: User Class and Customizing Tiddler Visual Style

[David Gifford]

This is all really neat, both Mohammad's original post and Mario's link to 
stuff I had not seen. Opens up a lot of possibilities.

A modest suggestion and a question:

1. Suggestion: Mohammad, if you expect other users to remember and use your 
colors, it might be better to use short, easy to remember color names 
instead of things like danger, warning or gainsboro. In my mind, danger and 
warning are easy to confuse. And I wouldn't want to memorize or type out 
anything as long as lemonchiffon. Having them be color names also allows 
the user to determine what each color will be used for, whereas your 
pre-set labels primes users to use them your way.

For example, maybe low-blue and low-pink, etc would be a better option for 
'Low tone' colors. FYI, I use pinkbk and orangebk for my background CSS 
classes. 

Anyway, just suggestions, for what they are worth.

2. Question: is there a way to use any of this to create custom colored 
links to the tiddlers so classed? It sure would be nice to have different 
kinds of tiddlers linked to with links of different colors.

On Friday, November 1, 2019 at 8:27:12 AM UTC-6, Mohammad wrote:
>
> Tiddlywiki from release 5.1.16 has a great feature called user class 
> .
> One can define a *class *field, that is directly inserted into the 
> *ViewTemplate* and it can be used for styling.
>
> This feature is under-documented and have got a little attention, but it 
> is quite powerful in customizing the visual style of tiddlers.
>
>
> Here in Shiraz plugin 2.0.0 beta 7 , a 
> section has been dedicated and several css classes are provided to be used 
> with user class
> to customize tiddlers. Different examples have been provided to see how it 
> works.
>
> demo: Tiddler Custom Style Tutorial 
> 
>
>
> --Mohammad
>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/44b17f16-1fac-4982-bb55-df787c2a4ce6%40googlegroups.com.

[tw5] Re: User Class and Customizing Tiddler Visual Style

[PMario]

On Monday, November 4, 2019 at 11:02:37 AM UTC+1, HC Haase wrote:
 

> [data-tags~="beginner"]{ border-left: 5px solid {{beginner!!color}};}
>
>
Did you tag the above tiddler with $:/tags/Stylesheet ??

I did a test, and it works.

-m

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/12949a32-3b40-4cdd-9685-992e6a19aa15%40googlegroups.com.

[tw5] Re: User Class and Customizing Tiddler Visual Style

[Mohammad]

Hi

On Monday, November 4, 2019 at 1:32:37 PM UTC+3:30, HC Haase wrote:
>
> looks nice.. I like the border colors in the semantic colors.
>
> Do you know if it is possible, in the sylesheets, to make a reference to a 
> tiddler field with the color value instead of harddcoding the color? e.g.
>
> [data-tags~="beginner"]{ border-left: 5px solid {{beginner!!color}};}
>
>
This should work! note in your case beginner should be a tiddler! have you 
created it?
Also you can create a macro to substitute it, like the colour macro used in 
vanilla theme 

>
> (the above do not work!)
>
> If we could make the semantic color be the same as the color field of the 
> tag, it would follow the color of tag pill and icon for the tag. I think that 
> would look nice, and it would also make it easier to edit corlors.
>
>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/6bf61a24-da18-4dc6-a79c-12a72537a275%40googlegroups.com.

[tw5] Re: User Class and Customizing Tiddler Visual Style

[@TiddlyTweeter]

Mohammad wrote:

>  Tiddlywiki from release 5.1.16 has a great feature called user class 
> . 
> ...

 

> This feature is under-documented and have got a little attention


Right. TBH I think we need a Visual Design Orientated Wiki. That starts 
with visuals and illustrates the many methods in TW to apply CSS by example.

I think a bit-by-bit approach isn't enough. We need better *visual design 
overview* of TW IMO. 

Just thoughts
TT

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/d7e661de-5e80-4295-ace1-bd040155a319%40googlegroups.com.

[tw5] Re: User Class and Customizing Tiddler Visual Style

[HC Haase]

looks nice.. I like the border colors in the semantic colors.

Do you know if it is possible, in the sylesheets, to make a reference to a 
tiddler field with the color value instead of harddcoding the color? e.g.

[data-tags~="beginner"]{ border-left: 5px solid {{beginner!!color}};}

(the above do not work!)

If we could make the semantic color be the same as the color field of the tag, 
it would follow the color of tag pill and icon for the tag. I think that would 
look nice, and it would also make it easier to edit corlors.

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/d6731430-371b-4150-ac95-7d8ff0b045a6%40googlegroups.com.

[tw5] Re: User Class and Customizing Tiddler Visual Style

[PMario]

Hi Tony, 
I think this link 

 
may have what you need. 
have fun!
mario

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/539431bd-747c-4829-8f37-5be41c878c10%40googlegroups.com.

[tw5] Re: User Class and Customizing Tiddler Visual Style

[Mohammad]

Hi Tony,
 I think this can be done using tag and a conditional viewtemplate!

If you look at https://kookma.github.io/TW-Semantic-Colors/

It uses tags for this purpose. for example beginner tag create a blue 
border and like that

If this work for you I can also create the one you asked above or you can 
hack the Semantic colors for your case.

Best
Mohammad

 

On Sunday, November 3, 2019 at 7:26:17 AM UTC+3:30, TonyM wrote:
>
> Mohammad,
>
> Thanks for sharing this. I note multiple classes can be placed in a single 
> tiddlers class field and they are all applied.
>
> An additional style could be used to colour the background of the title 
> which I use myself. However I tend to change the colour according to a 
> condition. For example tiddlers set for archive have a black border around 
> the title and the title background is set to green (new) yellow (in 
> progress) Red (closed), Yellow (Canceled). 
>
> It would be nice to document the way of doing this conditionally if 
> possible in css.
>
> Regards
> Tony 
>
> On Saturday, November 2, 2019 at 1:27:12 AM UTC+11, Mohammad wrote:
>>
>> Tiddlywiki from release 5.1.16 has a great feature called user class 
>> .
>> One can define a *class *field, that is directly inserted into the 
>> *ViewTemplate* and it can be used for styling.
>>
>> This feature is under-documented and have got a little attention, but it 
>> is quite powerful in customizing the visual style of tiddlers.
>>
>>
>> Here in Shiraz plugin 2.0.0 beta 7 , a 
>> section has been dedicated and several css classes are provided to be used 
>> with user class
>> to customize tiddlers. Different examples have been provided to see how 
>> it works.
>>
>> demo: Tiddler Custom Style Tutorial 
>> 
>>
>>
>> --Mohammad
>>
>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/ba69fbbc-3934-4e30-8f6e-a0a3ba1e2762%40googlegroups.com.

[tw5] Re: User Class and Customizing Tiddler Visual Style

[TonyM]

Mohammad,

Thanks for sharing this. I note multiple classes can be placed in a single 
tiddlers class field and they are all applied.

An additional style could be used to colour the background of the title 
which I use myself. However I tend to change the colour according to a 
condition. For example tiddlers set for archive have a black border around 
the title and the title background is set to green (new) yellow (in 
progress) Red (closed), Yellow (Canceled). 

It would be nice to document the way of doing this conditionally if 
possible in css.

Regards
Tony 

On Saturday, November 2, 2019 at 1:27:12 AM UTC+11, Mohammad wrote:
>
> Tiddlywiki from release 5.1.16 has a great feature called user class 
> .
> One can define a *class *field, that is directly inserted into the 
> *ViewTemplate* and it can be used for styling.
>
> This feature is under-documented and have got a little attention, but it 
> is quite powerful in customizing the visual style of tiddlers.
>
>
> Here in Shiraz plugin 2.0.0 beta 7 , a 
> section has been dedicated and several css classes are provided to be used 
> with user class
> to customize tiddlers. Different examples have been provided to see how it 
> works.
>
> demo: Tiddler Custom Style Tutorial 
> 
>
>
> --Mohammad
>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/c687af97-9df8-44a9-ab80-c99e59d83891%40googlegroups.com.