"Warning" macro just like in the tiddlywiki documentation

[Shichiyoo]

Hi all,

I'm trying to recreate the macro that allows you to do this kind of thing: 

by writing <<.warning "does this work">>.

I've already imported the warning image with the same title tiddler ($:/core/images/warning) and I've found the macro definition around the system tiddlers in the original tiddlywiki documentation:

\define .warning(_) <div class="doc-icon-block"><div class="doc-block-icon">{{$:/core/images/warning}}</div> $_$</div>

Problem is I don't know how to make them work. I tried saving this macro in $:/editions/tw5.com/doc-macros, I've tried changing the title, but nothing works. I suspect I'm missing something. Can anyone help?

[Eric Shulman]

On Sunday, November 3, 2019 at 2:17:52 AM UTC-8, Shichiyoo wrote:

I've already imported the warning image with the same title tiddler ($:/core/images/warning) and I've found the macro definition around the system tiddlers in the original tiddlywiki documentation:

\define .warning(_) <div class="doc-icon-block"><div class="doc-block-icon">{{$:/core/images/warning}}</div> $_$</div>

Problem is I don't know how to make them work. I tried saving this macro in $:/editions/tw5.com/doc-macros, I've tried changing the title, but nothing works. I suspect I'm missing something. Can anyone help?

Macros are not defined by where you put them, but rather by *tagging* them with "$:/tags/Macro". In addition, you will also want to define the appropriate CSS classnames "doc-icon-block" and "doc-block-icon".  As with macros, stylesheets are not defined by where you put them, but rather by tagging them with "$:/tags/Stylesheet"

Here's the CSS definitions, copied from $:/editions/tw5.com/doc-styles on http://tiddlywiki.com 

.doc-icon-block {
 border-left: 2px solid <<colour code-border>>;
 margin-left: 3em;
 padding-left: 0.6em;
 position: relative;
}
.doc-block-icon {
 position: absolute;
 left: -3em;
 top: 0.2em;
}
.doc-block-icon .tc-image-tip {
 fill: <<colour primary>>;
}
.doc-block-icon .tc-image-warning {
 fill: <<colour alert-highlight>>;
}

enjoy,

-e

Eric Shulman

TiddlyTools.com: "Small Tools for Big Ideas!" (tm) http://tiddlytools.github.io/

InsideTiddlyWiki: The Missing Manuals http://insidetiddlywiki.tiddlyspot.com/

[Shichiyoo]

Thank you so much!! that worked perfectly :)