mirror of
https://github.com/Jermolene/TiddlyWiki5
synced 2024-12-27 02:20:28 +00:00
48 lines
1.2 KiB
Plaintext
48 lines
1.2 KiB
Plaintext
|
created: 20241206225533517
|
||
|
|
description: Rendering parameterised SVG for use in stylesheets
|
||
|
|
tags: $:/tags/wiki-test-spec
|
||
|
|
title: TestCases/WikifyWidget/RenderSVGURI
|
||
|
|
type: text/vnd.tiddlywiki-multiple
|
||
|
|
|
||
|
|
title: Narrative
|
||
|
|
|
||
|
|
The core svg icons use a parameter widget, making their use in stylesheets impossible without wikify.
|
||
|
|
+
|
||
|
|
title: Output
|
||
|
|
|
||
|
|
* https://tiddlywiki.com/
|
||
|
|
* [[TW5|http://tiddlywiki.com/]]
|
||
|
|
* [[Mail me|mailto:me@where.net]]
|
||
|
|
* [[Open file|file:///c:/users/me/index.html]]
|
||
|
|
|
||
|
|
<style>{{Stylesheet}}</style>
|
||
|
|
+
|
||
|
|
title: Stylesheet
|
||
|
|
|
||
|
|
\rules except dash
|
||
|
|
\procedure link-icon(protocol,img)
|
||
|
|
<$tiddler tiddler=<<img>> >
|
||
|
|
<$wikify name="svg" text={{!!text}} mode="inline" output="html">
|
||
|
|
<$text text=`
|
||
|
|
[href*="$(protocol)$"]{
|
||
|
|
--mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg">$(svg)$</svg>');
|
||
|
|
}
|
||
|
|
`/>
|
||
|
|
</$wikify>
|
||
|
|
</$tiddler>
|
||
|
|
\end
|
||
|
|
|
||
|
|
.tc-tiddlylink-external:after{
|
||
|
|
width:.7rem;
|
||
|
|
aspect-ratio:1;
|
||
|
|
background:currentColor;
|
||
|
|
display: inline-block;
|
||
|
|
mask: center / contain no-repeat var(--mask);
|
||
|
|
margin-inline:.5ch;
|
||
|
|
content:"";
|
||
|
|
}
|
||
|
|
|
||
|
|
<<link-icon "http:" "$:/core/images/open-window">>
|
||
|
|
<<link-icon "https:" "$:/core/images/locked-padlock">>
|
||
|
|
<<link-icon "mailto:" "$:/core/images/mail">>
|
||
|
|
<<link-icon "file:" "$:/core/images/file">>
|