1
0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2025-01-15 11:45:40 +00:00

Merge branch 'tiddlywiki-com'

This commit is contained in:
Jeremy Ruston 2024-03-10 15:11:03 +00:00
commit 1222bed0de
20 changed files with 629 additions and 484 deletions

View File

@ -4,10 +4,16 @@ tags: Learning
title: Concatenating text and variables using macro substitution title: Concatenating text and variables using macro substitution
type: text/vnd.tiddlywiki type: text/vnd.tiddlywiki
!! Important
<<.from-version "5.3.0">> It is recommended to use [[substituted attributes|Substituted Attribute Values]] or the [[substitute filter operator|substitute Operator]] to concatenate text and variables. <<.from-version "5.3.0">> It is recommended to use [[substituted attributes|Substituted Attribute Values]] or the [[substitute filter operator|substitute Operator]] to concatenate text and variables.
It's a frequent use case in ~TiddlyWiki that you will want to put the results of variables together with various bits of strings of text. This process in some programming languages is often referred to as "concatenating" text. It's a frequent use case in ~TiddlyWiki that you will want to put the results of variables together with various bits of strings of text. This process in some programming languages is often referred to as "concatenating" text.
---
!! What is Wrong
You might, for instance want to set up a template for your customer database, where links will automatically refer to additional contact information about your customer. Inside your tiddler, you might try something like this: You might, for instance want to set up a template for your customer database, where links will automatically refer to additional contact information about your customer. Inside your tiddler, you might try something like this:
<<.bad-example "`[[Additional Info|<<currentTiddler>>-Contact]]`">> <<.bad-example "`[[Additional Info|<<currentTiddler>>-Contact]]`">>

View File

@ -1,6 +1,7 @@
code-body: yes code-body: yes
created: 20150221145803000 created: 20150221145803000
modified: 20240310124126491
title: $:/editions/tw5.com/macro-examples/tags-of-current-tiddler title: $:/editions/tw5.com/macro-examples/tags-of-current-tiddler
type: text/vnd.tiddlywiki type: text/vnd.tiddlywiki
\define tags-of-current-tiddler() {{!!tags}} \procedure tags-of-current-tiddler() {{!!tags}}

View File

@ -1,6 +1,7 @@
code-body: yes
created: 20150228123855000 created: 20150228123855000
modified: 20150228123921000 modified: 20240310133309881
title: $:/editions/tw5.com/macro-examples/tv-get-export-image-link title: $:/editions/tw5.com/macro-examples/tv-get-export-image-link
type: text/vnd.tiddlywiki type: text/vnd.tiddlywiki
\define tv-get-export-image-link(src) https://www.tiddlywiki.com/$src$ \function tv-get-export-image-link(src) [[https://www.tiddlywiki.com/$(src)$]substitute[]]

View File

@ -1,8 +1,9 @@
code-body: yes code-body: yes
created: 20150228120252000 created: 20150228120252000
modified: 20240310124217005
title: $:/editions/tw5.com/macro-examples/tv-wikilink-tooltip title: $:/editions/tw5.com/macro-examples/tv-wikilink-tooltip
type: text/vnd.tiddlywiki type: text/vnd.tiddlywiki
\define tv-wikilink-tooltip() \procedure tv-wikilink-tooltip()
<$transclude field="tooltip">(<$transclude field="caption"/>)</$transclude> <$transclude field="tooltip">(<$transclude field="caption"/>)</$transclude>
\end \end

View File

@ -1,5 +1,5 @@
created: 20150110182600000 created: 20150110182600000
modified: 20230325161424684 modified: 20240224170607731
tags: [[Improving TiddlyWiki Documentation]] tags: [[Improving TiddlyWiki Documentation]]
title: Documentation Macros title: Documentation Macros
type: text/vnd.tiddlywiki type: text/vnd.tiddlywiki
@ -8,167 +8,192 @@ The following macros are used throughout ~TiddlyWiki's documentation. Their name
! General ! General
|!Macro |!Used for |!Example | |Macro |Used for |Example |Rendered|h
|.def |the defining instance of a term |<<.def widget>> | |.def |the defining instance of a term |`<<.def widget>>` |<<.def widget>> |
|.em |minor emphasis within a sentence |<<.em not>> | |.em |minor emphasis within a sentence |`<<.em not>>` |<<.em not>> |
|.place |a placeholder for the user to fill in |<<.place tagname>> | |.place |a placeholder for the user to fill in |`<<.place tagname>>` |<<.place tagname>> |
|.strong |major emphasis within a tiddler |<<.strong Important!>> | |.strong |major emphasis within a tiddler |`<<.strong Important!>>` |<<.strong Important!>> |
|.word |a mention of an ordinary word or phrase |<<.word "hello world">> | |.word |a mention of an ordinary word or phrase |`<<.word "hello world">>` |<<.word "hello world">> |
|.icon |an icon, sized to match the surrounding text |<<.icon "$:/core/images/globe">> | |.icon |an icon, sized to match the surrounding text |`<<.icon "$:/core/images/globe">>` |<<.icon "$:/core/images/globe">> |
! Textboxes
!! Textbox Parameters
; text
: Text to be shown in the box
; title
: A title shown as an HTML STRONG element
; icon
: Core icons can be found at [[Icon Gallery]]
; class
: An optional custom class can be added to the text block. It will overwrite the defaults. To keep the defaults, ''add them'' to the custom class settings.
: ''.note''-macro defaults to `doc-note`
: ''.tip''-macro defaults to `doc-tip`
: ''.warning''-macro defaults to `doc-warning`
!! Textbox Examples
|Macro |Used for |Example |Renderd |h
|^.infoBox |^Text-box with an icon |`<<.infoBox text:"A generic ...">>` |<<.infoBox "A generic text box, with an optional title and a custom icon">> |
|^.note|^Infos with a title |`<<.note text:"Some text ...">>` |<<.note "Some text in a box with a title by default">> |
|^.tip |^hints and tips |`<<.tip text:"Eg: Turn ...">>` |<<.tip "Eg: Turn your screen on, otherwise<br>you won't be able to see much.">> |
|^.warning |^warning advice |`<<.warning text:"Eg: Make a backup ...">>` |<<.warning "Eg: Make a backup of your file<br>before you upgrade.">> |
!Advice
|!Macro |!Used for |!Example |
|^.tip |^hints and tips |<<.tip "Turn your screen on, otherwise<br>you won't be able to see much.">> |
|^.warning |^warning advice |<<.warning "Make a backup of your file<br>before you upgrade.">> |
! Blocks ! Blocks
|!Macro |!Used for |
|.preamble |an introductory sentence that stands apart from the rest of the tiddler |
!Tiddlers and fields |Macro |Example |Used for |h
|.preamble |`<<.preamble "your text comes here">>` |<<.preamble "an introductory sentence that stands apart from the rest of the tiddler">> |
|!Macro |!Used for |!Example | ! Tiddlers and Fields
|.tid |a tiddler title |<<.tid Example>> |
|.tag |a tag |<<.tag Example>> |
|.field |a field name |<<.field example>> |
|.value |a field value |<<.value "example value">> |
|.op |a filter operator |<<.op backlinks>> |
|.var |a variable or macro name |<<.var currentTiddler>> |
|.wid |a widget name |<<.wid list>> |
|.attr |an attribute name |<<.attr filter>> |
|.param |a macro parameter name |<<.param text>> |
|.tiddler-fields |a list of tiddler fields |<<.tiddler-fields "Monday">> |
|Macro |Used for |Example |Rendered |h
|.tid |a tiddler title |`<<.tid Example>>` |<<.tid Example>> |
|.tag |a tag |`<<.tag Example>>` |<<.tag Example>> |
|.field |a field name |`<<.field example>>` |<<.field example>> |
|.value |a field value |`<<.value "example value">>` |<<.value "example value">> |
|.op |a filter operator |`<<.op backlinks>>` |<<.op backlinks>> |
|.var |a variable or macro name |`<<.var currentTiddler>>` |<<.var currentTiddler>> |
|.wid |a widget name |`<<.wid list>>` |<<.wid list>> |
|.attr |an attribute name |`<<.attr filter>>` |<<.attr filter>> |
|.param |a macro parameter name |`<<.param text>>` |<<.param text>> |
|.tiddler-fields |a list of tiddler fields |`<<.tiddler-fields "Monday">>` |<<.tiddler-fields "Monday">> |
! Links ! Links
|!Macro |!Used for |!Example | |!Macro |Used for |Example |Renderd |h
|.link |a link containing WikiText |<<.link "^^an^^ ~~example~~" Example>> | |.link |link containing WikiText |`<<.link "^^an^^ ~~example~~" Example>>` |<<.link "^^an^^ ~~example~~" Example>> |
|.clink |a code link |<<.clink `<$list>` ListWidget>> | |.clink |code link |``<<.clink `<$list>` ListWidget>>`` |<<.clink `<$list>` ListWidget>> |
|.dlink |a link on a defining instance of a term |<<.dlink widget Widgets>> | |.dlink |definition link for a instance of a term |`<<.dlink widget Widgets>>` |<<.dlink widget Widgets>> |
|.dlink-ex |an external link on a defining instance of a term |<<.dlink-ex Example "http://example.com/">> | |.dlink-ex |external link to a defining instance of a term |`<<.dlink-ex Example "http://example.com/">>` |<<.dlink-ex Example "http://example.com/">> |
|.flink |a link to a field |<<.flink ListField>> | |.flink |field link |`<<.flink ListField>>` |<<.flink ListField>> |
|.mlink |a link to a macro |<<.mlink qualify>> | |.mlink |macro link |`<<.mlink qualify>>` |<<.mlink qualify>> |
|.mlink2 |a link to a macro, with specified target |<<.mlink2 foo "Examples of Macros">> | |.mlink2 |macro link with a specified target |`<<.mlink2 foo "Examples of Macros">>` |<<.mlink2 foo "Examples of Macros">> |
|.olink |a link to an operator |<<.olink prefix>> | |.olink |operator link |`<<.olink prefix>>` |<<.olink prefix>> |
|.olink2 |a link to an operator, with specified target |<<.olink2 foo prefix>> | |.olink2 |operator link with specified target |`<<.olink2 foo prefix>>` |<<.olink2 foo prefix>> |
|.vlink |a link to a variable |<<.vlink currentTiddler>> | |.vlink |variable link |`<<.vlink currentTiddler>>` |<<.vlink currentTiddler>> |
|.vlink2 |a link to a variable, with specified target |<<.vlink2 foo "Examples of Variables">> | |.vlink2 |variable link with specified target |`<<.vlink2 foo "Examples of Variables">>` |<<.vlink2 foo "Examples of Variables">> |
|.wlink |a link to a widget |<<.wlink ButtonWidget>> | |.wlink |widget link |`<<.wlink ButtonWidget>>` |<<.wlink ButtonWidget>> |
|.wlink2 |a link to a widget, with specified text |<<.wlink2 foo ButtonWidget>> | |.wlink2 |widget link with specified text |`<<.wlink2 foo ButtonWidget>>` |<<.wlink2 foo ButtonWidget>> |
!Tabs ! Keyboard Shortcuts
|!Macro |!Used for |!Example |
|Macro |Used for |Example |Rendered |h
|.key |a key on the keyboard |`<<.key Escape>>` |<<.key Escape>> |
|.keys |a key combination |`<<.keys Ctrl+Enter>>` |<<.keys Ctrl+Enter>> |
! Doc-Tabs
See: [[CheckboxWidget]]
|Macro |Used for |Example |h
|.doc-tabs |showing a tab set in a documentation tiddler | -- | |.doc-tabs |showing a tab set in a documentation tiddler | -- |
|.doc-tab-link |button to activate a tab | -- | |.doc-tab-link |button to activate a tab | -- |
|.widget-attr-link |button with a widget attribute name to activate a tab | -- | |.widget-attr-link |button with a widget attribute name to activate a tab | -- |
! Sidebar Tabs
!User interface |Macro |Used for |Example |Rendered |h
|.sidebar-tab |the name of a sidebar tab |`<<.sidebar-tab More>>` |<<.sidebar-tab More>> |
|!Macro |!Used for |!Example | |.more-tab |the name of a subtab of the More tab |`<<.more-tab Shadows>>` |<<.more-tab Shadows>> |
|.key |a key on the keyboard |<<.key Escape>> | |.info-tab |the name of a tiddler info tab |`<<.info-tab Fields>>` |<<.info-tab Fields>> |
|.keycombo |a key combination |<<.keycombo Ctrl Enter>> | |.controlpanel-tab |the name of a Control Panel tab |`<<.controlpanel-tab Settings>>` |<<.controlpanel-tab Settings>> |
|.advancedsearch-tab |the name of an Advanced Search tab |`<<.advancedsearch-tab Filter>>` |<<.advancedsearch-tab Filter>> |
!Tabs |.toc-tab |name of the tw5.com TOC tab |`<<.toc-tab>>` |<<.toc-tab>> |
|.example-tab |an example tab name |`<<.example-tab "Notes">>` |<<.example-tab "Notes">> |
|!Macro |!Used for |!Example |
|.sidebar-tab |the name of a sidebar tab |<<.sidebar-tab More>> |
|.more-tab |the name of a subtab of the More tab |<<.more-tab Shadows>> |
|.info-tab |the name of a tiddler info tab |<<.info-tab Fields>> |
|.controlpanel-tab |the name of a Control Panel tab |<<.controlpanel-tab Settings>> |
|.advancedsearch-tab |the name of an Advanced Search tab |<<.advancedsearch-tab Filter>> |
|.toc-tab |name of the tw5.com TOC tab |<<.toc-tab>> |
|.example-tab |an example tab name |<<.example-tab "Notes">> |
!! Parameters for .sidebar-tab !! Parameters for .sidebar-tab
|Open |<<.sidebar-tab Open>> | |Open |`<<.sidebar-tab Open>>` |<<.sidebar-tab Open>> |
|Recent |<<.sidebar-tab Recent>> | |Recent |`<<.sidebar-tab Recent>>` |<<.sidebar-tab Recent>> |
|Tools |<<.sidebar-tab Tools>> | |Tools |`<<.sidebar-tab Tools>>` |<<.sidebar-tab Tools>> |
|More |<<.sidebar-tab More>> | |More |`<<.sidebar-tab More>>` |<<.sidebar-tab More>> |
!! Parameters for .more-tab !! Parameters for .more-tab
|All |<<.more-tab All>> | |All |`<<.more-tab All>>` |<<.more-tab All>> |
|Recent |<<.more-tab Recent>> | |Recent |`<<.more-tab Recent>>` |<<.more-tab Recent>> |
|Tags |<<.more-tab Tags>> | |Tags |`<<.more-tab Tags>>` |<<.more-tab Tags>> |
|Missing |<<.more-tab Missing>> | |Missing |`<<.more-tab Missing>>` |<<.more-tab Missing>> |
|Drafts |<<.more-tab Drafts>> | |Drafts |`<<.more-tab Drafts>>` |<<.more-tab Drafts>> |
|Orphans |<<.more-tab Orphans>> | |Orphans |`<<.more-tab Orphans>>` |<<.more-tab Orphans>> |
|Types |<<.more-tab Types>> | |Types |`<<.more-tab Types>>` |<<.more-tab Types>> |
|System |<<.more-tab System>> | |System |`<<.more-tab System>>` |<<.more-tab System>> |
|Shadows |<<.more-tab Shadows>> | |Shadows |`<<.more-tab Shadows>>` |<<.more-tab Shadows>> |
!! Parameters for .info-tab !! Parameters for .info-tab
|Tools |<<.info-tab Tools>> | |Tools |`<<.info-tab Tools>>` |<<.info-tab Tools>> |
|References |<<.info-tab References>> | |References |`<<.info-tab References>>` |<<.info-tab References>> |
|Tagging |<<.info-tab Tagging>> | |Tagging |`<<.info-tab Tagging>>` |<<.info-tab Tagging>> |
|List |<<.info-tab List>> | |List |`<<.info-tab List>>` |<<.info-tab List>> |
|Listed |<<.info-tab Listed>> | |Listed |`<<.info-tab Listed>>` |<<.info-tab Listed>> |
|Fields |<<.info-tab Fields>> | |Fields |`<<.info-tab Fields>>` |<<.info-tab Fields>> |
|Advanced |<<.info-tab Advanced>> | |Advanced |`<<.info-tab Advanced>>` |<<.info-tab Advanced>> |
!! Parameters for .controlpanel-tab !! Parameters for .controlpanel-tab
|Info |<<.controlpanel-tab Info>> | |Info |`<<.controlpanel-tab Info>>` |<<.controlpanel-tab Info>> |
|Appearance |<<.controlpanel-tab Appearance>> | |Appearance |`<<.controlpanel-tab Appearance>>` |<<.controlpanel-tab Appearance>> |
|Settings |<<.controlpanel-tab Settings>> | |Settings |`<<.controlpanel-tab Settings>>` |<<.controlpanel-tab Settings>> |
|Saving |<<.controlpanel-tab Saving>> | |Saving |`<<.controlpanel-tab Saving>>` |<<.controlpanel-tab Saving>> |
|Plugins |<<.controlpanel-tab Plugins>> | |Plugins |`<<.controlpanel-tab Plugins>>` |<<.controlpanel-tab Plugins>> |
!! Parameters for .advancedsearch-tab !! Parameters for .advancedsearch-tab
|Standard |<<.advancedsearch-tab Standard>> | |Standard |`<<.advancedsearch-tab Standard>>` |<<.advancedsearch-tab Standard>> |
|System |<<.advancedsearch-tab System>> | |System |`<<.advancedsearch-tab System>>` |<<.advancedsearch-tab System>> |
|Shadows |<<.advancedsearch-tab Shadows>> | |Shadows |`<<.advancedsearch-tab Shadows>>` |<<.advancedsearch-tab Shadows>> |
|Filter |<<.advancedsearch-tab Filter>> | |Filter |`<<.advancedsearch-tab Filter>>` |<<.advancedsearch-tab Filter>> |
! Buttons ! Buttons
|!Macro |!Used for |!Example | |Macro |Used for |Example |Rendered |h
|.button |a standard button name and icon |<<.button "new-tiddler">> | |.button |a standard button name and icon |`<<.button "new-tiddler">>` |<<.button "new-tiddler">> |
!! Parameters for .button !! Parameters for .button
!!! Tiddler toolbar !!! Tiddler toolbar
|clone |<<.button "clone">> | |clone |`<<.button "clone">>` |<<.button "clone">> |
|close |<<.button "close">> | |close |`<<.button "close">>` |<<.button "close">> |
|close-others |<<.button "close-others">> | |close-others |`<<.button "close-others">>` |<<.button "close-others">> |
|edit |<<.button "edit">> | |edit |`<<.button "edit">>` |<<.button "edit">> |
|export-tiddler |<<.button "export-tiddler">> | |export-tiddler |`<<.button "export-tiddler">>` |<<.button "export-tiddler">> |
|info |<<.button "info">> | |info |`<<.button "info">>` |<<.button "info">> |
|more-tiddler-actions |<<.button "more-tiddler-actions">> | |more-tiddler-actions |`<<.button "more-tiddler-actions">>` |<<.button "more-tiddler-actions">> |
|new-here |<<.button "new-here">> | |new-here |`<<.button "new-here">>` |<<.button "new-here">> |
|new-journal-here |<<.button "new-journal-here">> | |new-journal-here |`<<.button "new-journal-here">>` |<<.button "new-journal-here">> |
|permalink |<<.button "permalink">> | |permalink |`<<.button "permalink">>` |<<.button "permalink">> |
!!! Edit-mode toolbar !!! Edit-mode toolbar
|cancel |<<.button "cancel">> | |cancel |`<<.button "cancel">>` |<<.button "cancel">> |
|delete |<<.button "delete">> | |delete |`<<.button "delete">>` |<<.button "delete">> |
|save |<<.button "save">> | |save |`<<.button "save">>` |<<.button "save">> |
!!! Page toolbar !!! Page toolbar
|advanced-search |<<.button "advanced-search">> | |advanced-search |`<<.button "advanced-search">>` |<<.button "advanced-search">> |
|close-all |<<.button "close-all">> | |close-all |`<<.button "close-all">>` |<<.button "close-all">> |
|control-panel |<<.button "control-panel">> | |control-panel |`<<.button "control-panel">>` |<<.button "control-panel">> |
|encryption |<<.button "encryption">> | |encryption |`<<.button "encryption">>` |<<.button "encryption">> |
|export-page |<<.button "export-page">> | |export-page |`<<.button "export-page">>` |<<.button "export-page">> |
|full-screen |<<.button "full-screen">> | |full-screen |`<<.button "full-screen">>` |<<.button "full-screen">> |
|home |<<.button "home">> | |home |`<<.button "home">>` |<<.button "home">> |
|import |<<.button "import">> | |import |`<<.button "import">>` |<<.button "import">> |
|language |<<.button "language">> | |language |`<<.button "language">>` |<<.button "language">> |
|more-page-actions |<<.button "more-page-actions">> | |more-page-actions |`<<.button "more-page-actions">>` |<<.button "more-page-actions">> |
|new-journal |<<.button "new-journal">> | |new-journal |`<<.button "new-journal">>` |<<.button "new-journal">> |
|new-tiddler |<<.button "new-tiddler">> | |new-tiddler |`<<.button "new-tiddler">>` |<<.button "new-tiddler">> |
|permaview |<<.button "permaview">> | |permaview |`<<.button "permaview">>` |<<.button "permaview">> |
|refresh |<<.button "refresh">> | |refresh |`<<.button "refresh">>` |<<.button "refresh">> |
|save-wiki |<<.button "save-wiki">> | |save-wiki |`<<.button "save-wiki">>` |<<.button "save-wiki">> |
|storyview |<<.button "storyview">> | |storyview |`<<.button "storyview">>` |<<.button "storyview">> |
|tag-manager |<<.button "tag-manager">> | |tag-manager |`<<.button "tag-manager">>` |<<.button "tag-manager">> |
|theme |<<.button "theme">> | |theme |`<<.button "theme">>` |<<.button "theme">> |

View File

@ -1,8 +1,12 @@
created: 20170126143833588 created: 20170126143833588
modified: 20220704174221300 modified: 20240310123352998
title: $:/deprecated title: $:/deprecated
type: text/vnd.tiddlywiki type: text/vnd.tiddlywiki
Deprecated features of TiddlyWiki are those that have been superseded by newer, improved ways of doing the same thing. Deprecated features of TiddlyWiki are those that have been superseded by newer, improved ways of doing the same thing.
Deprecated features will still work, but are not recommended for new content. Deprecated features will still work, but are not recommended for new content.
Tiddlers tagged $:/deprecated:
<<list-links filter:"[tag[$:/deprecated]]">>

View File

@ -1,25 +1,35 @@
title: $:/editions/tw5.com/TiddlerInfo/Sources title: $:/editions/tw5.com/TiddlerInfo/Sources
tags: $:/tags/TiddlerInfo tags: $:/tags/TiddlerInfo
caption: Sources caption: Sources
code-body: yes
\define static-link-base() \function static-link-base() [[https://tiddlywiki.com/static/$(title)$.html]substitute[]]
https://tiddlywiki.com/static/$(title)$.html
\function github-link-base()
[[https://github.com/Jermolene/TiddlyWiki5/blob/tiddlywiki-com/editions/tw5.com/tiddlers/$(title)$]substitute[]]
\end \end
\define make-static-link() \procedure make-static-link()
\whitespace trim
<$set name="title" filter="[<currentTiddler>encodeuricomponent[]encodeuricomponent[]]" select="0"> <$set name="title" filter="[<currentTiddler>encodeuricomponent[]encodeuricomponent[]]" select="0">
<a href=<<static-link-base>> class="tc-tiddlylink-external" target="_blank" rel="noopener noreferrer"><$text text=<<static-link-base>>/></a> <a href=<<static-link-base>>
class="tc-tiddlylink-external"
target="_blank"
rel="noopener noreferrer"
>
<$text text=<<static-link-base>>/>
</a>
</$set> </$set>
\end \end
\define github-link-base() \procedure make-github-link()
https://github.com/Jermolene/TiddlyWiki5/blob/tiddlywiki-com/editions/tw5.com/tiddlers/$(title)$ <$set name="title" value={{{ [[$:/config/OriginalTiddlerPaths]getindex<currentTiddler>] }}}>
\end
\define make-github-link()
<$set name="title" value={{$:/config/OriginalTiddlerPaths##$(currentTiddler)$}}>
<$set name="title" filter="[<title>encodeuricomponent[]]" select="0"> <$set name="title" filter="[<title>encodeuricomponent[]]" select="0">
<a href=<<github-link-base>> class="tc-tiddlylink-external" target="_blank" rel="noopener noreferrer"><$text text=<<github-link-base>>/></a> <a href=<<github-link-base>>
class="tc-tiddlylink-external"
target="_blank"
rel="noopener noreferrer"
>Direct link to <$text text=<<currentTiddler>>/> on github.com</a>
</$set> </$set>
</$set> </$set>
\end \end
@ -30,7 +40,7 @@ A static HTML representation of this tiddler is available at the URL:
* <<make-static-link>> * <<make-static-link>>
Help us to improve the documentation by sending a ~GitHub pull request for this tiddler: Help us to improve the documentation by suggesting changes to this tiddler using the [[TiddlyWiki Docs PR Maker|https://saqimtiaz.github.io/tw5-docs-pr-maker/]]
* <<make-github-link>> * <<make-github-link>>

View File

@ -1,186 +1,33 @@
created: 20150117152607000 created: 20150117152607000
modified: 20230325141733992 modified: 20240229155550000
tags: $:/tags/Macro tags: $:/tags/Macro
title: $:/editions/tw5.com/doc-macros title: $:/editions/tw5.com/doc-macros
code-body: yes
type: text/vnd.tiddlywiki type: text/vnd.tiddlywiki
\define .concat(1,2,3,4,5) $1$$2$$3$$4$$5$ \whitespace trim
\define .def(_) <dfn class="doc-def">$_$</dfn> \function .concat(1,2,3,4,5) [[$(1)$$(2)$$(3)$$(4)$$(5)$]substitute[]]
\define .em(_) <em class="doc-em">$_$</em> \function .word(_) [["]] [<_>] =[["]] +[join[]]
\define .strong(_) <strong class="doc-strong">$_$</strong>
\define .place(_) <code class="doc-place">$_$</code>
\define .word(_) "$_$"
\define .preamble(_) :.doc-preamble $_$ \procedure .def(_) <dfn class="doc-def"><<_>></dfn>
\define .note(_) \procedure .em(_) <em class="doc-em"><<_>></em>
@@.doc-note \procedure .strong(_) <strong class="doc-strong"><<_>></strong>
;Note \procedure .place(_) <code class="doc-place"><<_>></code>
: $_$ \procedure .preamble(_) <dl><dd class="doc-preamble"><<_>></dd></dl>
@@
\end
\define .tid(_) <code class="doc-tiddler">$_$</code> \procedure .tid(_) <code class="doc-tiddler"><<_>></code>
\define .tag(_) <code class="doc-tag">$_$</code> \procedure .tag(_) <code class="doc-tag"><<_>></code>
\define .field(_) <code class="doc-field">$_$</code> \procedure .field(_) <code class="doc-field"><<_>></code>
\define .value(_) <code class="doc-value">$_$</code> \procedure .value(_) <code class="doc-value"><<_>></code>
\define .op(_) <code class="doc-operator">$_$</code> \procedure .op(_) <code class="doc-operator"><<_>></code>
\define .var(_) <code class="doc-var">$_$</code> \procedure .var(_) <code class="doc-var"><<_>></code>
\define .wid(_) <code class="doc-widget">$$_$</code> \procedure .wid(_) <code class="doc-widget"><$macrocall $name=".concat" 1="$" 2=<<_>>/></code>
\define .attr(_) <code class="doc-attr">$_$</code> \procedure .attr(_) <code class="doc-attr"><<_>></code>
\define .param(_) <code class="doc-param">$_$</code> \procedure .param(_) <code class="doc-param"><<_>></code>
\define .mtitle(_) $_$ Macro \procedure .tiddler-fields(tiddler)
\define .otitle(_) $_$ Operator <$tiddler tiddler=<<tiddler>>>
\define .vtitle(_) $_$ Variable
\define .link(_,to) <$link to="$to$">$_$</$link>
\define .clink(_,to) <span class="doc-clink"><<.link """$_$""" "$to$">></span>
\define .dlink(_,to) <$macrocall $name=".link" _=<<.def "$_$">> to="$to$">/>
\define .dlink-ex(_,to) <a href="$to$" class="tc-tiddlylink-external" target="_blank" rel="noopener noreferrer"><<.def "$_$">></a>
\define .flink(to) <$macrocall $name=".link" _=<<.field {{$to$!!caption}}>> to="$to$"/>
\define .mlink(_,to) <$macrocall $name=".link" _=<<.var "$_$">> to=<<.mtitle "$_$">>/>
\define .mlink2(_,to) <$macrocall $name=".link" _=<<.var "$_$">> to="$to$"/>
\define .olink(_) <$macrocall $name=".link" _=<<.op "$_$">> to=<<.otitle "$_$">>/>
\define .olink2(_,to) <$macrocall $name=".link" _=<<.op "$_$">> to=<<.otitle "$to$">>/>
\define .vlink(_,to) <$macrocall $name=".link" _=<<.var "$_$">> to=<<.vtitle "$_$">>/>
\define .vlink2(_,to) <$macrocall $name=".link" _=<<.var "$_$">> to="$to$"/>
\define .wlink(to) <$macrocall $name=".link" _=<<.wid {{$to$!!caption}}>> to="$to$"/>
\define .wlink2(_,to) <$macrocall $name=".link" _="$_$" to="$to$"/>
\define .key(_) <span class="doc-key">$_$</span>
\define .combokey(_) <$macrocall $name=".if" cond="$_$" then=<<.key '$_$'>>/>
\define .keycombo(1,2,3,4) <<.combokey "$1$">><<.if "$2$" +>><<.combokey "$2$">><<.if "$3$" +>><<.combokey "$3$">><<.if "$4$" +>><<.combokey "$4$">>
\define .tab(_) <span class="doc-tab">{{$_$!!caption}}</span>
\define .sidebar-tab(_) <<.tab "$:/core/ui/SideBar/$_$">>
\define .more-tab(_) <<.tab "$:/core/ui/MoreSideBar/$_$">>
\define .info-tab(_) <<.tab "$:/core/ui/TiddlerInfo/$_$">>
\define .controlpanel-tab(_) <<.tab "$:/core/ui/ControlPanel/$_$">>
\define .advancedsearch-tab(_) <<.tab "$:/core/ui/AdvancedSearch/$_$">>
\define .toc-tab() <<.tab "TableOfContents">>
\define .example-tab(_) <span class="doc-tab">$_$</span>
\define .doc-tabs()
<$macrocall $name="tabs"
tabsList="[tag<currentTiddler>description[tab]]"
default={{{ [tag<currentTiddler>first[]] }}}
explicitState={{{ [<currentTiddler>addprefix[$:/state/tab/]] }}}
class={{{ [[doc-tabs]] [<currentTiddler>encodeuricomponent[]escapecss[]addprefix[doc-tabs-]] +[join[ ]] }}} />
\end
\define .doc-tab-link(text, target, tooltip:"", class:"")
<!-- figure out where the addressed doc-tabs are -->
<$tiddler tiddler={{{ [<currentTiddler>search:text[.doc-tabs]] :else[<currentTiddler>tags[]search:text[.doc-tabs]first[]] :else[<currentTiddler>] }}} >
<$button class={{{ [[tc-btn-invisible tc-tiddlylink]] [<__class__>] +[join[ ]] }}}
set={{{ [<currentTiddler>addprefix[$:/state/tab/]] }}}
setTo=<<__target__>>
tooltip=<<__tooltip__>>>
<<__text__>>
<!-- if tiddler with tabs is open, scroll to tabs, otherwise open that tiddler (relevant from within tab subtiddlers) -->
<$list filter="[[$:/StoryList]contains<currentTiddler>]" variable="ignore" emptyMessage="<$action-navigate />">
<$action-sendmessage $message="tm-scroll" selector={{{ [<currentTiddler>encodeuricomponent[]addprefix[.doc-tabs-]] }}} />
</$list>
<$action-sendmessage $message="tm-scroll" selector={{{ [<currentTiddler>encodeuricomponent[]escapecss[]addprefix[.doc-tabs-]] }}} />
</$button>
</$tiddler>
\end
\define .widget-attr-link(text, target)
<$macrocall $name=".doc-tab-link"
text={{{ [[<code class="doc-attr">]] [<__text__>] [[</code>]] +[join[]] }}}
class="doc-tab-link"
target=<<__target__>>
tooltip={{{ [[Show more information about the ']] [<__text__>] [[' attribute]] +[join[]] }}} />
\end
\define .button(_) <span class="doc-button">{{$:/core/ui/Buttons/$_$!!caption}}</span>
\define .icon(_) <span class="doc-icon">{{$_$}}</span>
\define .tip(_) <div class="doc-icon-block"><div class="doc-block-icon">{{$:/core/images/tip}}</div> $_$</div>
\define .warning(_) <div class="doc-icon-block"><div class="doc-block-icon">{{$:/core/images/warning}}</div> $_$</div>
\define .state-prefix() $:/state/editions/tw5.com/
\define .lorem()
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
\end
\define .toc-lorem()
This is an example tiddler. See [[Table-of-Contents Macros (Examples)]].
<<.lorem>>
\end
\define .example(n,eg,egvar:NO-SUCH-VAR)
<div class="doc-example">
<$reveal default="$egvar$" type="match" text="NO-SUCH-VAR">
<$macrocall $name="copy-to-clipboard-above-right" src="""$eg$"""/>
<$codeblock code="""$eg$"""/>
</$reveal>
<$reveal default="$egvar$" type="nomatch" text="NO-SUCH-VAR">
<!-- allow an example to contain """ -->
<$macrocall $name="copy-to-clipboard-above-right" src=<<$egvar$>>/>
<$codeblock code=<<$egvar$>>/>
</$reveal>
<$list filter="[title<.state-prefix>addsuffix{!!title}addsuffix[/]addsuffix[$n$]]" variable=".state">
<$reveal state=<<.state>> type="nomatch" text="show">
<dl>
<dd><$button set=<<.state>> setTo="show">Try it</$button></dd>
</dl>
</$reveal>
<$reveal state=<<.state>> type="match" text="show">
<dl>
<dd><$button set=<<.state>> setTo="">Hide</$button></dd>
</dl>
<blockquote class="doc-example-result">
<$reveal default="$egvar$" type="match" text="NO-SUCH-VAR">
$$$text/vnd.tiddlywiki
$eg$
$$$
</$reveal>
<$reveal default="$egvar$" type="nomatch" text="NO-SUCH-VAR">
<<$egvar$>>
</$reveal>
</blockquote>
</$reveal>
</$list>
\end
\define .bad-example(eg)
<table class="doc-bad-example">
<tbody>
<tr class="evenRow">
<td><span style="font-size:1.5em;">&#9888;</span> Warning:<br> Don't do it this way!</td>
<td>
$eg$
</td>
</tr>
</tbody>
</table>
\end
\define .link-badge(text,link,colour)
<a href=<<__link__>> class="doc-link-badge" style="background-color:$colour$;" target="_blank" rel="noopener noreferrer"><$text text=<<__text__>>/></a>
\end
\define .link-badge-added(link,colour:#ffe246) <<.link-badge "added" """$link$""" """$colour$""">>
\define .link-badge-addendum(link,colour:#fcc84a) <<.link-badge "addendum" """$link$""" """$colour$""">>
\define .link-badge-extended(link,colour:#f9a344) <<.link-badge "extended" """$link$""" """$colour$""">>
\define .link-badge-fixed(link,colour:#ffa86d) <<.link-badge "fixed" """$link$""" """$colour$""">>
\define .link-badge-here(link,colour:#d88e63) <<.link-badge "here" """$link$""" """$colour$""">>
\define .link-badge-hide(link,colour:#9d959f) <<.link-badge "hide" """$link$""" """$colour$""">>
\define .link-badge-improved(link,colour:#7593c7) <<.link-badge "improved" """$link$""" """$colour$""">>
\define .link-badge-modified(link,colour:#7f99c9) <<.link-badge "modified" """$link$""" """$colour$""">>
\define .link-badge-removed(link,colour:#a9aabc) <<.link-badge "removed" """$link$""" """$colour$""">>
\define .link-badge-renamed(link,colour:#b4b995) <<.link-badge "renamed" """$link$""" """$colour$""">>
\define .link-badge-updated(link,colour:#91ba66) <<.link-badge "updated" """$link$""" """$colour$""">>
\define .tiddler-fields(tiddler)
<$tiddler tiddler=<<__tiddler__>>>
<div class="doc-tiddler-fields"> <div class="doc-tiddler-fields">
<h2> <h2>
<$link> <$link>
@ -196,24 +43,188 @@ $eg$
</$tiddler> </$tiddler>
\end \end
\define .banner-credits(credit,url) \function .mtitle(_) [<_>] Macro +[join[ ]]
<img src=<<__url__>> width="140" style="float:left;margin-right:0.5em;"/> \function .otitle(_) [<_>] Operator +[join[ ]]
\function .vtitle(_) [<_>] Variable +[join[ ]]
$credit$ \procedure .link(_,to) <$link to=<<to>> ><<_>></$link>
\procedure .clink(_,to) <span class="doc-clink"><$link to=<<to>>><<_>></$link></span>
<div style="clear:both;"> \procedure .dlink(_,to) <$link to=<<to>>><$macrocall $name=".def" _=<<_>>/></$link>
\procedure .dlink-ex(_,to) <a href=<<to>> class="tc-tiddlylink-external" target="_blank" rel="noopener noreferrer"><$macrocall $name=".def" _=<<_>>/></a>
\procedure .flink(to) <$macrocall $name=".link" _=`<<.field {{$(to)$!!caption}}>>` to=<<to>>/>
\procedure .mlink(_) <$link to={{{ [.mtitle<_>] }}}><$macrocall $name=".var" _=<<_>>/> </$link>
\procedure .mlink2(_,to) <$link to=<<to>>><$macrocall $name=".var" _=<<_>>/> </$link>
\procedure .olink(_) <$link to={{{ [.otitle<_>] }}}><$macrocall $name=".op" _=<<_>>/> </$link>
\procedure .olink2(_,to) <$link to={{{ [.otitle<to>] }}}><$macrocall $name=".op" _=<<_>>/> </$link>
\procedure .vlink(_) <$link to={{{ [.vtitle<_>] }}}><$macrocall $name=".var" _=<<_>>/> </$link>
\procedure .vlink2(_,to) <$link to=<<to>>><$macrocall $name=".var" _=<<_>>/></$link>
\procedure .wlink(to) <$link to=<<to>> > <$macrocall $name=".wid" _={{{ [<to>get[caption]] }}}> </$link>
\procedure .wlink2(_,to) <$link to=<<to>> ><<_>></$link>
\procedure .key(_) <span class="doc-key"><<_>></span>
\procedure .keys(_) <span class="doc-key"><<_>></span>
\procedure .tab(_) <span class="doc-tab"><$transclude $tiddler=<<_>> $field=caption ><<_>></$transclude></span>
\procedure .sidebar-tab(_) <$macrocall $name=".tab" _=`$:/core/ui/SideBar/$(_)$`/>
\procedure .more-tab(_) <$macrocall $name=".tab" _=`$:/core/ui/MoreSideBar/$(_)$`/>
\procedure .info-tab(_) <$macrocall $name=".tab" _=`$:/core/ui/TiddlerInfo/$(_)$`/>
\procedure .controlpanel-tab(_) <$macrocall $name=".tab" _=`$:/core/ui/ControlPanel/$(_)$`/>
\procedure .advancedsearch-tab(_) <$macrocall $name=".tab" _=`$:/core/ui/AdvancedSearch/$(_)$`/>
\procedure .toc-tab() <$macrocall $name=".tab" _="TableOfContents"/>
\procedure .example-tab(_) <span class="doc-tab"><<_>></span>
\procedure .doc-tabs()
<$macrocall $name="tabs"
tabsList="[tag<currentTiddler>description[tab]]"
default={{{ [tag<currentTiddler>first[]] }}}
explicitState={{{ [<currentTiddler>addprefix[$:/state/tab/]] }}}
class={{{ [[doc-tabs]] [<currentTiddler>encodeuricomponent[]escapecss[]addprefix[doc-tabs-]] +[join[ ]] }}} />
\end
\procedure .doc-tab-link(text, target, tooltip:"", class:"")
<!-- figure out where the addressed doc-tabs are -->
<$tiddler tiddler={{{ [<currentTiddler>search:text[.doc-tabs]] :else[<currentTiddler>tags[]search:text[.doc-tabs]first[]] :else[<currentTiddler>] }}} >
<$button class={{{ [[tc-btn-invisible tc-tiddlylink]] [<class>] +[join[ ]] }}}
set={{{ [<currentTiddler>addprefix[$:/state/tab/]] }}}
setTo=<<target>>
tooltip=<<tooltip>>>
<<text>>
<!-- if tiddler with tabs is open, scroll to tabs, otherwise open that tiddler (relevant from within tab subtiddlers) -->
<$list filter="[[$:/StoryList]contains<currentTiddler>]" variable="ignore" emptyMessage="<$action-navigate />">
<$action-sendmessage $message="tm-scroll" selector={{{ [<currentTiddler>encodeuricomponent[]addprefix[.doc-tabs-]] }}} />
</$list>
<$action-sendmessage $message="tm-scroll" selector={{{ [<currentTiddler>encodeuricomponent[]escapecss[]addprefix[.doc-tabs-]] }}} />
</$button>
</$tiddler>
\end
\procedure .widget-attr-link(text, target)
<$macrocall $name=".doc-tab-link"
text={{{ [[<code class="doc-attr">]] [<text>] [[</code>]] +[join[]] }}}
class="doc-tab-link"
target=<<target>>
tooltip={{{ [[Show more information about the ']] [<text>] [[' attribute]] +[join[]] }}} />
\end
\procedure .button(_) <span class="doc-button"><$transclude $tiddler=`$:/core/ui/Buttons/$(_)$` $field="caption" ><<_>></$transclude></span>
\procedure .icon(_) <span class="doc-icon"><$transclude $tiddler=<<_>>/></span>
\procedure .infoBox(text:"", title, icon:"$:/core/images/info-button", class, iconSize:"1.4rem")
\function _f.tipClass() [[doc-icon-block]] [<class>!is[blank]then<class>] +[join[ ]]
<div class=<<_f.tipClass>>>
<%if [<title>!is[blank]] %><div>''<<title>>''</div><% endif %>
<div class="doc-block-icon"><$transclude $tiddler=<<icon>> size=<<iconSize>>/></div>
<<text>>
</div> </div>
\end \end
\define .contributors(usernames) \procedure .note(_:"", title:"Note", icon:"$:/core/images/info-button", class:"doc-note", iconSize:"22pt")
<$macrocall $name=".infoBox" text=<<_>> title=<<title>> icon=<<icon>> class=<<class>> iconSize=<<iconSize>>/>
\end
\procedure .tip(_:"", title:"Tip" , icon:"$:/core/images/tip", class:"doc-tip", iconSize:"22pt")
<$macrocall $name=".infoBox" text=<<_>> title=<<title>> icon=<<icon>> class=<<class>> iconSize=<<iconSize>>/>
\end
\procedure .warning(_:"", title:"Warning", icon:"$:/core/images/warning", class:"doc-warning", iconSize:"22pt")
<$macrocall $name=".infoBox" text=<<_>> title=<<title>> icon=<<icon>> class=<<class>> iconSize=<<iconSize>>/>
\end
\procedure .state-prefix() $:/state/editions/tw5.com/
\procedure .lorem()
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
\end
\procedure .toc-lorem()
This is an example tiddler. See [[Table-of-Contents Macros (Examples)]].
<<.lorem>>
\end
\procedure .example(n,eg,egvar)
<$let eg={{{ [<egvar>!is[blank]getvariable[]] :else[<eg>] }}}>
<div class="doc-example">
<$macrocall $name="copy-to-clipboard-above-right" src=<<eg>>/>
<$codeblock code=<<eg>>/>
<$list filter=`[title<.state-prefix>addsuffix{!!title}addsuffix[/]addsuffix[$(n)$]]` variable=".state">
<$reveal state=<<.state>> type="nomatch" text="show">
<dl>
<dd><$button set=<<.state>> setTo="show">Try it</$button></dd>
</dl>
</$reveal>
<$reveal state=<<.state>> type="match" text="show">
<dl>
<dd><$button set=<<.state>> setTo="">Hide</$button></dd>
</dl>
<blockquote class="doc-example-result">
<<eg>>
</blockquote>
</$reveal>
</$list>
</div>
</$let>
\end
\procedure .bad-example(eg)
<table class="doc-bad-example">
<tbody>
<tr class="evenRow">
<td>
<span class="tc-small-gap-right" style="font-size:1.5em;">&#9888;</span>
Warning:<br> Don't do it this way!
</td>
<td>
<$transclude $variable="eg" $mode="block"/>
</td>
</tr>
</tbody>
</table>
\end
\procedure .link-badge(text,link,colour)
<a href=<<link>> class="doc-link-badge" style.background-color=<<colour>> target="_blank" rel="noopener noreferrer">
<$text text=<<text>>/>
</a>
\end
<!-- TODO use $:/palette colour settings -->
\procedure .link-badge-added(link,colour:#ffe246) <$macrocall $name=".link-badge" text="added" link=<<link>> colour=<<colour>>/>
\procedure .link-badge-addendum(link,colour:#fcc84a) <$macrocall $name=".link-badge" text="addendum" link=<<link>> colour=<<colour>>/>
\procedure .link-badge-extended(link,colour:#f9a344) <$macrocall $name=".link-badge" text="extended" link=<<link>> colour=<<colour>>/>
\procedure .link-badge-fixed(link,colour:#ffa86d) <$macrocall $name=".link-badge" text="fixed" link=<<link>> colour=<<colour>>/>
\procedure .link-badge-here(link,colour:#d88e63) <$macrocall $name=".link-badge" text="here" link=<<link>> colour=<<colour>>/>
\procedure .link-badge-hide(link,colour:#9d959f) <$macrocall $name=".link-badge" text="hide" link=<<link>> colour=<<colour>>/>
\procedure .link-badge-improved(link,colour:#7593c7) <$macrocall $name=".link-badge" text="improved" link=<<link>> colour=<<colour>>/>
\procedure .link-badge-modified(link,colour:#7f99c9) <$macrocall $name=".link-badge" text="modified" link=<<link>> colour=<<colour>>/>
\procedure .link-badge-removed(link,colour:#a9aabc) <$macrocall $name=".link-badge" text="removed" link=<<link>> colour=<<colour>>/>
\procedure .link-badge-renamed(link,colour:#b4b995) <$macrocall $name=".link-badge" text="renamed" link=<<link>> colour=<<colour>>/>
\procedure .link-badge-updated(link,colour:#91ba66) <$macrocall $name=".link-badge" text="updated" link=<<link>> colour=<<colour>>/>
\procedure .banner-credits(credit,url)
<img src=<<url>> width="140" style="float:left;margin-right:0.5em;"/>
<<credit>>
<div style="clear:both;"/>
\end
\procedure .contributors(usernames)
<ol class="doc-github-contributors"> <ol class="doc-github-contributors">
<$list filter="[enlist<__usernames__>sort[]]" variable="username"> <$list filter="[enlist<usernames>sort[]]" variable="username">
<li> <li>
<a href={{{ [[https://github.com/]addsuffix<username>] }}} class="tc-tiddlylink-external" target="_blank" rel="noopener noreferrer"><img src={{{ [[https://github.com/]addsuffix<username>addsuffix[.png?size=64]] }}} width="64" height="64"/><span class="doc-github-contributor-username">@<$text text=<<username>>/></span></a> <a href={{{ [[https://github.com/]addsuffix<username>] }}} class="tc-tiddlylink-external" target="_blank" rel="noopener noreferrer">
<img src={{{ [[https://github.com/]addsuffix<username>addsuffix[.png?size=64]] }}} width="64" height="64"/>
<span class="doc-github-contributor-username">
@<$text text=<<username>>/>
</span>
</a>
</li> </li>
</$list> </$list>
</ol> </ol>
\end \end
<pre><$view field="text"/></pre>

View File

@ -1,3 +1,4 @@
code-body: yes
created: 20150117152612000 created: 20150117152612000
modified: 20240223123123497 modified: 20240223123123497
tags: $:/tags/Stylesheet tags: $:/tags/Stylesheet
@ -31,6 +32,7 @@ type: text/vnd.tiddlywiki
color: <<color very-muted-foreground>>; color: <<color very-muted-foreground>>;
font-style: normal; font-style: normal;
font-weight: bold; font-weight: bold;
padding: 0;
} }
.doc-button, .doc-button,
@ -85,7 +87,6 @@ td svg {
.doc-preamble { .doc-preamble {
border: 2px solid <<colour code-border>>; border: 2px solid <<colour code-border>>;
color: <<colour very-muted-foreground>>; color: <<colour very-muted-foreground>>;
font-size: 90%;
margin-left: 0; margin-left: 0;
padding: 0.5em 0.7em; padding: 0.5em 0.7em;
} }
@ -164,19 +165,37 @@ tr.doc-table-subheading {
} }
.doc-icon-block { .doc-icon-block {
border-left: 2px solid <<colour code-border>>; border-left: 4px solid <<colour blockquote-bar>>;
margin-left: 3em; margin: 15px 0 15px 3em;
padding-left: 0.6em; padding-left: 0.6em;
position: relative; position: relative;
} }
.doc-block-icon { .doc-block-icon {
position: absolute; position: absolute;
left: -3em; left: -3em;
top: 0.2em; top: 0.2em;
} }
.doc-icon-block.doc-note {
border-left: 4px solid <<colour blockquote-bar>>;
background: <<colour blockquote-bar>>11;
}
.doc-icon-block.doc-tip {
border-left: 4px solid <<colour primary>>;
background: <<colour primary>>11;
}
.doc-icon-block.doc-warning {
border-left: 4px solid <<colour alert-highlight>>;
background: <<colour alert-highlight>>11;
}
.doc-block-icon .tc-image-tip { .doc-block-icon .tc-image-tip {
fill: <<colour primary>>; fill: <<colour primary>>;
} }
.doc-block-icon .tc-image-warning { .doc-block-icon .tc-image-warning {
fill: <<colour alert-highlight>>; fill: <<colour alert-highlight>>;
} }
@ -246,7 +265,6 @@ a.doc-deprecated-version.tc-tiddlylink {
height: 1em; height: 1em;
} }
.doc-tiddler-fields table, .doc-tiddler-fields table,
.doc-tiddler-fields h2 { .doc-tiddler-fields h2 {
margin: 0.5em 0; margin: 0.5em 0;

View File

@ -1,10 +1,10 @@
title: $:/editions/tw5.com/download-empty title: $:/editions/tw5.com/download-empty
code-body: yes code-body: yes
\define saveTiddlerFilter() \procedure saveTiddlerFilter()
[[$:/core]] [[$:/isEncrypted]] [[$:/themes/tiddlywiki/snowwhite]] [[$:/themes/tiddlywiki/vanilla]] -[[$:/boot/boot.css]] -[type[application/javascript]library[yes]] -[[$:/boot/boot.js]] -[[$:/boot/bootprefix.js]] +[sort[title]] [[$:/core]] [[$:/isEncrypted]] [[$:/themes/tiddlywiki/snowwhite]] [[$:/themes/tiddlywiki/vanilla]] -[[$:/boot/boot.css]] -[type[application/javascript]library[yes]] -[[$:/boot/boot.js]] -[[$:/boot/bootprefix.js]] +[sort[title]]
\end \end
\define savingEmpty()
yes \procedure savingEmpty() yes
\end
{{$:/core/templates/tiddlywiki5.html}} {{$:/core/templates/tiddlywiki5.html}}

View File

@ -1,27 +1,28 @@
code-body: yes code-body: yes
created: 20230316112235083 created: 20230316112235083
list-before: $:/core/ui/ViewTemplate/body list-before: $:/core/ui/ViewTemplate/body
modified: 20230326145802667 modified: 20240229161432000
tags: $:/tags/ViewTemplate tags: $:/tags/ViewTemplate
title: $:/editions/tw5.com/filter-run-template title: $:/editions/tw5.com/filter-run-template
type: text/vnd.tiddlywiki type: text/vnd.tiddlywiki
\define .op-place()
<$macrocall $name=".if"
cond="""$(op-name)$"""
then="<<.place '$(op-name)$'>> = "
else=""/>
\end
\define .op-row()
<$macrocall $name=".if"
cond="""$(op-body)$"""
then="""<tr><th align="left">$(op-head)$</th><td><<.op-place>>$(op-body)$</td></tr>"""
else=""/>
\end
\whitespace trim \whitespace trim
\procedure .op-place()
<% if [<op-name>!is[blank]] %>
<$macrocall $name=".place" _=<<op-name>> /><span class="tc-tiny-gap">=</span>
<% endif %>
\end
\procedure .op-row()
<% if [<op-body>!is[blank]] %>
<tr>
<th align="left"><<op-head>></th>
<td><<.op-place>><<op-body>></td>
</tr>
<% endif %>
\end
<$list filter="[all[current]tag[Named Filter Run Prefix]]"> <$list filter="[all[current]tag[Named Filter Run Prefix]]">
<$let op-head="" op-body="" op-name=""> <$let op-head="" op-body="" op-name="">
<table class="doc-table"> <table class="doc-table">

View File

@ -1,17 +1,24 @@
created: 20150117152607000 created: 20150117152607000
modified: 20230617183916622 modified: 20240229132501000
tags: $:/tags/Macro tags: $:/tags/Macro
code-body: yes
title: $:/editions/tw5.com/operator-macros title: $:/editions/tw5.com/operator-macros
\define .operator-examples(op,text:"Examples") <$link to="$op$ Operator (Examples)">$text$</$link>
\whitespace trim
\procedure .operator-examples(op,text:"Examples") <$link to=`$(op)$ Operator (Examples)`><<text>></$link>
\procedure .operator-example-tryit-actions() <$action-setfield $tiddler=<<.state>> text="show" filter=<<eg>>/> \procedure .operator-example-tryit-actions() <$action-setfield $tiddler=<<.state>> text="show" filter=<<eg>>/>
\procedure .operator-example(n,eg,ie) \procedure .operator-example(n,eg,ie)
<div class="doc-example"> <div class="doc-example">
<$list filter="[title<.state-prefix>addsuffix{!!title}addsuffix[/]addsuffix<n>]" variable=".state"> <$list filter="[title<.state-prefix>addsuffix{!!title}addsuffix[/]addsuffix<n>]" variable=".state">
<$reveal state=<<.state>> type="nomatch" text="show"> <$reveal state=<<.state>> type="nomatch" text="show">
<code><$text text=<<eg>>/></code> <code><$text text=<<eg>>/></code>
<$macrocall $name=".if" cond=<<ie>> then={{{[[<dd>&rarr; ]addsuffix<ie>addsuffix[</dd>]]}}}/> <% if [<ie>!is[blank]] %>
<dd>&rarr;&nbsp;<<ie>></dd>
<% endif %>
<dl> <dl>
<dd><$button actions=<<.operator-example-tryit-actions>>>Try it</$button></dd> <dd><$button actions=<<.operator-example-tryit-actions>>>Try it</$button></dd>
</dl> </dl>
@ -27,26 +34,33 @@ title: $:/editions/tw5.com/operator-macros
</dd> </dd>
</dl> </dl>
<blockquote class="doc-example-result"> <blockquote class="doc-example-result">
<ul><$list filter={{{[<.state>get[filter]]}}} emptyMessage="(empty)"> <ul>
<$list filter={{{[<.state>get[filter]]}}} emptyMessage="(empty)">
<li><$link><$view field="title"/></$link></li> <li><$link><$view field="title"/></$link></li>
</$list></ul> </$list>
</ul>
</blockquote> </blockquote>
</$reveal> </$reveal>
</$list> </$list>
</div>
\end \end
\define .inline-operator-example(eg) \procedure .inline-operator-example(eg)
<code><$text text=<<__eg__>>/></code> evaluates to <$list filter=<<__eg__>> emptyMessage="(empty)"> <code><$text text=<<currentTiddler>>/></code> </$list> <code>
<$text text=<<eg>>/>
</code>
<span class="tc-tiny-gap">evaluates to</span>
<$list filter=<<eg>> emptyMessage="(empty)">
<code class="tc-tiny-gap-left"><$text text=<<currentTiddler>>/></code>
</$list>
\end \end
\define .this-is-operator-example() This example tiddler is used to illustrate some of the [[Filter Operators]]. \define .this-is-operator-example() This example tiddler is used to illustrate some of the [[Filter Operators]].
\define .using-days-of-week() These examples make use of the [[Days of the Week]] tiddler. \define .using-days-of-week() These examples make use of the [[Days of the Week]] tiddler.
\define .s-matching-is-case-sensitive() In looking for matches for <<.place S>>, capital and lowercase letters are treated as different. \define .s-matching-is-case-sensitive() In looking for matches for <<.place S>>, capital and lowercase letters are treated as different.
\define .node-only-operator() \procedure .node-only-operator()
<$macrocall $name=".note" _="This operator is <<.em not>> available when ~TiddlyWiki is running in a web browser."/> <$macrocall $name=".note" _="This operator is <<.em not>> available when ~TiddlyWiki is running in a web browser."/>
\end \end
<pre><$view field="text"/></pre>

View File

@ -1,26 +1,26 @@
created: 20150203173506000 created: 20150203173506000
modified: 20240229155612000
list-before: $:/core/ui/ViewTemplate/body list-before: $:/core/ui/ViewTemplate/body
modified: 20230602181119360
tags: $:/tags/ViewTemplate tags: $:/tags/ViewTemplate
code-body: yes code-body: yes
title: $:/editions/tw5.com/operator-template title: $:/editions/tw5.com/operator-template
\define .op-place()
<$macrocall $name=".if"
cond="""$(op-name)$"""
then="<<.place '$(op-name)$'>> = "
else=""/>
\end
\define .op-row()
<$macrocall $name=".if"
cond="""$(op-body)$"""
then="""<tr><th align="left">$(op-head)$</th><td><<.op-place>>$(op-body)$</td></tr>"""
else=""/>
\end
\whitespace trim \whitespace trim
\procedure .op-place()
<% if [<op-name>!is[blank]] %>
<$macrocall $name=".place" _=<<op-name>> /><span class="tc-tiny-gap">=</span>
<% endif %>
\end
\procedure .op-row()
<% if [<op-body>!is[blank]] %>
<tr>
<th align="left"><<op-head>></th><td><<.op-place>><<op-body>></td>
</tr>
<% endif %>
\end
<$list filter="[all[current]tag[Filter Operators]]"> <$list filter="[all[current]tag[Filter Operators]]">
<$let op-head="" op-body="" op-name=""> <$let op-head="" op-body="" op-name="">
<table class="doc-table before-tiddler-body"> <table class="doc-table before-tiddler-body">

View File

@ -1,21 +1,26 @@
created: 20150228114241000 created: 20150228114241000
modified: 20220227210136243 modified: 20220227210136243
tags: $:/tags/Macro tags: $:/tags/Macro
code-body: yes
title: $:/editions/tw5.com/variable-macros title: $:/editions/tw5.com/variable-macros
\define .variable-examples(v,text:"Examples") <$link to="$v$ Variable (Examples)">$text$</$link> \procedure .variable-examples(v,text:"Examples") <$link to=`$(v)$ Variable (Examples)`><<text>></$link>
\define .macro-examples(m,text:"Examples") <$link to="$m$ Macro (Examples)">$text$</$link> \procedure .macro-examples(m,text:"Examples") <$link to=`$(m)$ Macro (Examples)`><<text>></$link>
\define .widget-examples(w,text:"Examples") <$link to="$w$ Widget (Examples)">$text$</$link> \procedure .widget-examples(w,text:"Examples") <$link to=`$(w)$ Widget (Examples)`><<text>></$link>
\define .js-macro-link(_) [[$_$|https://tiddlywiki.com/dev/index.html#JavaScript%20Macros]] \procedure .js-macro-link(_)
<a href="https://tiddlywiki.com/dev/index.html#JavaScript%20Macros"
\define .this-is-static-link-variable() <<.tip "This variable has no useful effect when ~TiddlyWiki is running in a browser, as the `href` attribute is ignored there -- links between tiddlers are performed by JavaScript instead. The variable comes into play when one is using the [[Node.js configuration|TiddlyWiki on Node.js]] to [[generate a static version|RenderTiddlersCommand]] of a wiki.">> class="tc-tiddlylink-external"
target="_blank"
\define .this-is-toolbar-config-variable(configTiddler) rel="noopener noreferrer"
><$text text=<<_>>/></a>
It can be set to <<.value yes>> or <<.value no>> prior to transcluding such a button.
The standard page template sets it to the value found in [[$configTiddler$]], with the result that this becomes the default for the whole page. The user can adjust this default by using a tickbox on the <<.controlpanel-tab Settings>> tab of the [[Control Panel|$:/ControlPanel]].
\end \end
<pre><$view field="text"/></pre> \procedure .this-is-static-link-variable() <<.note "This variable has no useful effect when ~TiddlyWiki is running in a browser, as the `href` attribute is ignored there -- links between tiddlers are performed by JavaScript instead. The variable comes into play when one is using the [[Node.js configuration|TiddlyWiki on Node.js]] to [[generate a static version|RenderTiddlersCommand]] of a wiki.">>
\procedure .this-is-toolbar-config-variable(configTiddler)
\whitespace notrim
It can be set to <<.value yes>> or <<.value no>> prior to transcluding such a button.
The standard page template sets it to the value found in <$link to=<<configTiddler>>><<configTiddler>></$link>, with the result that this becomes the default for the whole page. The user can adjust this default by using a tickbox on the <<.controlpanel-tab Settings>> tab of the [[Control Panel|$:/ControlPanel]].
\end

View File

@ -1,21 +1,38 @@
code-body: yes code-body: yes
created: 20161008085627406 created: 20161008085627406
modified: 20231206135257498 modified: 20240229155633000
tags: $:/tags/Macro tags: $:/tags/Macro
title: $:/editions/tw5.com/version-macros title: $:/editions/tw5.com/version-macros
type: text/vnd.tiddlywiki type: text/vnd.tiddlywiki
\procedure .from-version-reference() 5.3.0 \whitespace trim
\function tf.from-version-reference() 5.3.0
\procedure .from-version-template(class, text) \procedure .from-version-template(class, text)
<$link to={{{ [<version>addprefix[Release ]] }}} class=<<class>> >@@.tc-tiny-gap-right {{$:/core/images/info-button}}@@<<text>><<version>></$link> <$link to={{{ [<version>addprefix[Release ]] }}} class=<<class>> >
<span class="tc-tiny-gap-right">
{{$:/core/images/info-button}}
</span>
<<text>><<version>>
</$link>
\end \end
\procedure .from-version(version) \procedure .from-version(version)
<$list filter="[<version>compare:version:gteq<.from-version-reference>]"><<.from-version-template "doc-from-version doc-from-version-new" "New in v">></$list> <% if [<version>compare:version:gteq<tf.from-version-reference>] %>
<$list filter="[<version>compare:version:lt<.from-version-reference>]"><<.from-version-template "doc-from-version" "Introduced in v">></$list> <<.from-version-template "doc-from-version doc-from-version-new" "New in v">>
<% else %>
<<.from-version-template "doc-from-version" "Introduced in v">>
<% endif %>
\end \end
\define .deprecated-since(version, superseded:"TODO-Link") \procedure .deprecated-since(version, superseded:"TODO-Link")
<$link to="Deprecated - What does it mean" class="doc-deprecated-version tc-btn-invisible">{{$:/core/images/warning}} Deprecated since: <$text text=<<__version__>>/></$link> (see <$link to=<<__superseded__>>><$text text=<<__superseded__>>/></$link>) <$link to="Deprecated - What does it mean" class="doc-deprecated-version tc-btn-invisible">
{{$:/core/images/warning}}
<span class="tc-tiny-gap">Deprecated since:</span>
<$text text=<<version>>/>
</$link>
<span class="tc-tiny-gap-left">
(see <$link class="tc-tiny-gap-left" to=<<superseded>>><$text text=<<superseded>>/></$link>)
</span>
\end \end

View File

@ -1,104 +1,96 @@
code-body: yes code-body: yes
created: 20150117184156000 created: 20150117184156000
modified: 20220617122915793 modified: 20240229155641000
tags: $:/tags/Macro tags: $:/tags/Macro
title: $:/editions/tw5.com/wikitext-macros title: $:/editions/tw5.com/wikitext-macros
type: text/vnd.tiddlywiki type: text/vnd.tiddlywiki
\define activatePluginTab() \whitespace trim
\procedure activatePluginTab()
<$action-setfield $tiddler="$:/state/tab-1749438307" text="$:/core/ui/ControlPanel/Plugins"/> <$action-setfield $tiddler="$:/state/tab-1749438307" text="$:/core/ui/ControlPanel/Plugins"/>
<$action-navigate $to="$:/ControlPanel"/> <$action-navigate $to="$:/ControlPanel"/>
\end \end
\define activateTiddlerWindow() \procedure activateTiddlerWindow()
<$action-sendmessage $message="tm-open-window" <$action-sendmessage $message="tm-open-window" $param=<<currentTiddler>> windowTitle="Side by Side View" width="800" height="600" />
$param=<<currentTiddler>> windowTitle="Side by Side View"
width="800" height="600" />
\end \end
\define controlPanel-plugin-link() \procedure controlPanel-plugin-link()
<$button actions=<<activatePluginTab>> class="tc-btn-invisible tc-tiddlylink"> <$button actions=<<activatePluginTab>> class="tc-btn-invisible tc-tiddlylink">
{{$:/core/images/options-button}} ~ControlPanel {{$:/core/images/options-button}} ~ControlPanel
</$button> </$button>
\end \end
\define open-tiddler-in-window() \procedure open-tiddler-in-window()
\whitespace notrim
<$button actions=<<activateTiddlerWindow>> class="tc-btn-invisible tc-tiddlylink"> <$button actions=<<activateTiddlerWindow>> class="tc-btn-invisible tc-tiddlylink">
open ''this'' tiddler in a new window open ''this'' tiddler in a new window
</$button> </$button>
\end \end
\define activateEditionWindow(url) \procedure activateEditionWindow(url)
<$action-sendmessage $message="tm-open-external-window" <$action-sendmessage $message="tm-open-external-window" $param=<<url>> windowName="_edition" windowFeatures="width=800 height=600" />
$param="""$url$""" windowName="_edition"
windowFeatures="width=800 height=600" />
\end \end
\define open-external-window(url) \procedure open-external-window(url)
<$button actions=<<activateEditionWindow """$url$""">> class="tc-btn-invisible tc-tiddlylink"> \whitespace notrim
<$button actions=<<activateEditionWindow <<url>> class="tc-btn-invisible tc-tiddlylink">
open the ''example edition'' in a new window open the ''example edition'' in a new window
</$button> </$button>
\end \end
\define wikitext-example(src) \procedure wikitext-example(src)
<div class="doc-example"> <div class="doc-example">
<$macrocall $name="copy-to-clipboard-above-right" src=<<src>>/>
<$macrocall $name="copy-to-clipboard-above-right" src=<<__src__>>/> <$codeblock code=<<src>>/>
<p>
<$codeblock code=<<__src__>>/>
That renders as: That renders as:
</p>
<$macrocall $name="__src__"/> <$transclude $variable="src" $mode="block"/>
<p>
... and the underlying HTML is: ... and the underlying HTML is:
</p>
<$wikify name="html" text=<<__src__>> output="html"> <$wikify name="html" text=<<src>> output="html">
<$codeblock code=<<html>>/> <$codeblock code=<<html>>/>
</$wikify> </$wikify>
</div> </div>
\end \end
\define wikitext-example-without-html(src) \procedure wikitext-example-without-html(src)
<div class="doc-example"> <div class="doc-example">
<$macrocall $name="copy-to-clipboard-above-right" src=<<src>>/>
<$macrocall $name="copy-to-clipboard-above-right" src=<<__src__>>/> <$codeblock code=<<src>>/>
<p>
<$codeblock code=<<__src__>>/>
That renders as: That renders as:
</p>
<$macrocall $name="__src__"/> <$macrocall $name="src"/>
</div> </div>
\end \end
\define wikitext-example-table-header() <thead><tr><th/><th>wiki text</th><th>renders as</th></tr></thead> \procedure wikitext-example-table-header() <thead><tr><th/><th>wiki text</th><th>renders as</th></tr></thead>
\define wikitext-example-table-row(id, code) \procedure wikitext-example-table-row(id, code)
<tr> <tr>
<th><<__id__>></th><td><$codeblock code=<<__code__>>/></td><td> <th><<id>></th>
<td><$codeblock code=<<code>>/></td>
<<__code__>> <td><<code>></td>
</td>
</tr> </tr>
\end \end
\define tw-code(tiddler) \procedure tw-code(tiddler)
<$codeblock language={{$tiddler$!!type}} code={{$tiddler$}}/> <$codeblock language={{$tiddler$!!type}} code={{$tiddler$}}/>
\end \end
\define tw-code-link(tiddler) \procedure tw-code-link(tiddler)
[[$tiddler$]]: [[$tiddler$]]:
<<tw-code $tiddler$>> <<tw-code $tiddler$>>
\end \end
\define flex-card(class,bordercolor:"",backgroundcolor:"",textcolor:"",imageField:"image",captionField:"caption",subtitle:"",descriptionField:"description",linkField:"link") \procedure flex-card(class,bordercolor:"",backgroundcolor:"",textcolor:"",imageField:"image",captionField:"caption",subtitle:"",descriptionField:"description", inkField:"link")
\whitespace trim <$link class={{{ [<class>addprefix[tc-card ]] }}} to={{{ [<currentTiddler>get<linkField>else<currentTiddler>] }}}>
<$link class={{{ [<__class__>addprefix[tc-card ]] }}} to={{{ [<currentTiddler>get<__linkField__>else<currentTiddler>] }}}> <div class="tc-card-accent" style.borderTop={{{ [<bordercolor>!is[blank]addprefix[5px solid ]] }}} style.background={{!!background}} style.backgroundColor=<<backgroundcolor>> style.color=<<textcolor>> style.fill=<<textcolor>>>
<div class="tc-card-accent" style.borderTop={{{ [<__bordercolor__>!is[blank]addprefix[5px solid ]] }}} style.background={{!!background}} style.backgroundColor=<<__backgroundcolor__>> style.color=<<__textcolor__>> style.fill=<<__textcolor__>>>
<$list filter="[<currentTiddler>has[ribbon-text]]" variable="ignore"> <$list filter="[<currentTiddler>has[ribbon-text]]" variable="ignore">
<div class="tc-card-ribbon-wrapper"> <div class="tc-card-ribbon-wrapper">
<div class="tc-card-ribbon" style.backgroundColor={{{ [<currentTiddler>get[ribbon-color]else[red]] }}}> <div class="tc-card-ribbon" style.backgroundColor={{{ [<currentTiddler>get[ribbon-color]else[red]] }}}>
@ -108,21 +100,21 @@ That renders as:
</div> </div>
</div> </div>
</$list> </$list>
<$list filter="[<currentTiddler>has<__imageField__>]" variable="ignore"> <$list filter="[<currentTiddler>has<imageField>]" variable="ignore">
<div class="tc-card-image"> <div class="tc-card-image">
<$image source={{{ [<currentTiddler>get<__imageField__>] }}}/> <$image source={{{ [<currentTiddler>get<imageField>] }}}/>
</div> </div>
</$list> </$list>
<div class="tc-card-title"><$transclude field=<<__captionField__>>><$view field="title"/></$transclude></div> <div class="tc-card-title"><$transclude field=<<captionField>>><$view field="title"/></$transclude></div>
<$list filter="[<__subtitle__>!is[blank]]" variable="ignore"> <$list filter="[<subtitle>!is[blank]]" variable="ignore">
<div class="tc-card-subtitle"> <div class="tc-card-subtitle">
<$text text=<<__subtitle__>>/> <$text text=<<subtitle>>/>
</div> </div>
</$list> </$list>
<div class="tc-card-icon"><$transclude tiddler={{!!icon}}/></div> <div class="tc-card-icon"><$transclude tiddler={{!!icon}}/></div>
<div class="tc-card-body-wrapper"> <div class="tc-card-body-wrapper">
<div class="tc-card-body"> <div class="tc-card-body">
<$transclude field=<<__descriptionField__>> mode="block"/> <$transclude field=<<descriptionField>> mode="block"/>
</div> </div>
<div class="tc-card-body-clear"> <div class="tc-card-body-clear">
</div> </div>

View File

@ -6,11 +6,12 @@ type: text/vnd.tiddlywiki
!! Introduction !! Introduction
A <<.def variable>> is a snippet of text that can be accessed by name. The text is referred to as the variable's <<.def value>>. * A <<.def variable>> is a ''snippet of text'' that can be accessed by name.
* The text is referred to as the variable's <<.def value>>.
Variables are defined by [[widgets|Widgets]]. Several core widgets define variables, the most common being the <<.wlink SetWidget>>, <<.wlink LetWidget>> and <<.wlink ListWidget>> widgets. Variables are defined by [[widgets|Widgets]]. Several core widgets define variables, the most common being the <<.wlink LetWidget>>, <<.wlink SetWidget>> and <<.wlink ListWidget>> widgets.
The values of variables are available to descendant widgets, including transcluded content. For example, within each tiddler in the main story river the variable "currentTiddler" is set to the title of the tiddler. The values of variables are available to descendant widgets, including transcluded content. For example, within each tiddler in the main story river the variable <<.var currentTiddler>> is set to the title of the tiddler.
Variables can also be overwritten by descendent widgets defining variables of the same name, thus binding a different snippet to that name for the scope of the children of the widget. Variables can also be overwritten by descendent widgets defining variables of the same name, thus binding a different snippet to that name for the scope of the children of the widget.

View File

@ -1,11 +1,17 @@
created: 20150228124038000 created: 20150228124038000
modified: 20240310134432122
tags: [[tv-get-export-image-link Variable]] [[Variable Examples]] tags: [[tv-get-export-image-link Variable]] [[Variable Examples]]
title: tv-get-export-image-link Variable (Examples) title: tv-get-export-image-link Variable (Examples)
type: text/vnd.tiddlywiki type: text/vnd.tiddlywiki
This example fetches [[the TiddlyWiki icon|https://www.tiddlywiki.com/favicon.ico]]: This example fetches [[the TiddlyWiki icon|https://www.tiddlywiki.com/favicon.ico]]
<$importvariables filter="$:/editions/tw5.com/macro-examples/tv-get-export-image-link"> <$importvariables filter="$:/editions/tw5.com/macro-examples/tv-get-export-image-link">
<$codeblock code={{$:/editions/tw5.com/macro-examples/tv-get-export-image-link}}/> <$codeblock code={{$:/editions/tw5.com/macro-examples/tv-get-export-image-link}}/>
<$macrocall $name=".example" n="1" eg="""[img[favicon.ico]]"""/> <$macrocall $name=".example" n="1" eg="""[img[favicon.ico]]"""/>
</$importvariables> </$importvariables>
Also see:
* [[substitute Operator]]
* [[Substituted Attribute Values]]

View File

@ -1,13 +1,13 @@
created: 20150228122257000
modified: 20150228130940000
title: tv-get-export-image-link Variable
tags: Variables [[Core Variables]] [[Configuration Variables]]
type: text/vnd.tiddlywiki
caption: tv-get-export-image-link caption: tv-get-export-image-link
created: 20150228122257000
modified: 20240310133708578
tags: Variables [[Core Variables]] [[Configuration Variables]]
title: tv-get-export-image-link Variable
type: text/vnd.tiddlywiki
The <<.def tv-get-export-image-link>> [[variable|Variables]] controls the value of the `src` attribute on the HTML `img` element generated by the <<.wlink ImageWidget>> widget when the value of its `source` attribute is not the title of a tiddler. The <<.def tv-get-export-image-link>> [[variable|Variables]] controls the value of the `src` attribute on the HTML `img` element generated by the <<.wlink ImageWidget>> widget when the value of its `source` attribute is not the title of a tiddler.
The variable should be a [[macro|Macros]] with the following parameter: The variable should be a [[function|Functions]] with the following parameter:
;src ;src
: The value of the `source` attribute -- equivalent to the image name specified in <$link to="Images in WikiText">the shorthand syntax</$link> `[img[source]]` : The value of the `source` attribute -- equivalent to the image name specified in <$link to="Images in WikiText">the shorthand syntax</$link> `[img[source]]`

View File

@ -25,6 +25,38 @@ Any content of the `<$image>` widget is ignored.
The width and the height can be specified as pixel values (eg "23" or "23px") or percentages (eg "23%"). They are both optional; if not provided the browser will use CSS rules to size the image. The width and the height can be specified as pixel values (eg "23" or "23px") or percentages (eg "23%"). They are both optional; if not provided the browser will use CSS rules to size the image.
! Responsive images and `<map>`
[[Image maps area|https://developer.mozilla.org/en-US/docs/Web/HTML/Element/area]] coordinates are numbers of CSS pixels, therefore they do not scale. If you want to use responsive images, you can use a `svg` and `foreignObject`:
<svg viewBox="0 0 330 333" xmlns="http://www.w3.org/2000/svg" width="50%">
<foreignObject width="100%" height="100%">
[img[Tiddler Fishes.svg]]
</foreignObject>
<g transform="translate(-216 -290)" >
<a href="#:[[Orange fish]]">
<title>Orange fish</title>
<path opacity="0" d="m309.4 403.5c-2.3-1.6-4-3.3-5.3-5.2-.4-.9-.7-1.8-1-2.8-.9-3.4-1.4-7.5-.9-11.3.1-1 .3-1.9.5-2.8.8-2 1.8-3.9 2.9-5.7.3-.3.6-.6.9-.8.4-.4.9-.7 1.4-1l1.3-.6 5-.3c4.1-.3 8-.9 11.9-1.7 10.9-2.3 20.8-6.6 29.5-13.1 2.4-1.8 4.7-3.9 6.8-6.1-1.6 6.2-2.5 11.8-9 19.5 5.7 1.6 11.6 4 13.6-6 3.8 5.9 8.9 3.1 9.8-5.3 5.4 6.7 8.4 3 8.4-4.3 6.4 5.2 10.6.8 12.2-5.5-4.9-1.1-20 2.4-25.1-6.7.1 0 .2-.1.3-.1 3-1.3 6.6-2.1 10.2-2.4 1.5-.1 3-.1 4.5-.1l2.5-.2c1.5-.1-.3-.1 1.1-.2.6 0 1.3-.1 1.9-.1.8-.1 1.6-.2 2.4-.3.7.1 1.5.2 2.2.3 1.4.1 3.1.2 4.2-.5.4-.2.5-.6.6-1.1.1-.4.1-.7.2-1.1.6-4.3.1-8.7-1.4-12.3-.5-1.1-1.1-2.1-1.7-3.1-3.5-5.1-9.1-8.1-14.9-9.6-1.4-.4-2.9-.6-4.5-.8-2.1-.2-4.3-.3-6.4-.2-6.9.3-13.2 2.1-18.8 4.9.9-4.4 4.8-10.5 7.7-14.5-.7-.3-1.5-.4-2.3-.4-5.5-.2-11.8 5.4-13.8 10.9-4.2-4.5-13.8.9-12.9 5-7.8-2.9-11.5 2.7-9.6 9.3-4.6-.2-9.6 3-9 8.1 8.3-5.1 13.4.8 15.3 6.6-1.1 1.3-2.2 2.6-3.4 3.8-4.4 4.6-9.4 8.3-14.6 11.3-5.3 3-10.9 5.4-17.1 6.5-2.9.5-6.1.8-9.1.3-3.4-1-6.2-3-8.6-6.3-.5-.8-1.1-1.8-1.4-2.4l-1 .8c-1.7 1.9-3.2 3.8-4.4 6-.9 1.7-1.8 3.5-2.1 5.6-.4 2.9.4 5.5 2.1 7.4 2.4 2.6 5.8 3.9 9.1 4.7 1 .2 2 .5 3 .6l2 .3-.5 1.9c-.4 1.4-.6 2.8-.8 4.3-.6 5 .6 9.7 4.2 12.8 1 .9 2.2 1.6 3.4 2.2 1.6.7 3.3 1.2 5.1 1.5 2.1.3 4.6.4 6.8 0 1 .1 2.1.2 3.8.2 1.3 0 1.9.1 2.6.1z"/>
</a>
<a href="#:[[Cyan fish]]">
<title>Cyan fish</title>
<path opacity="0" d="m273.6 408.6c-3.2-.2-6.1 2.4-7.2 5.5-4.8-3.6-10.5-2.3-10.6 5-3.1-2-10.5 4.1-8.1 9-5.8 0-13.5 4.5-13.5 10 .8-.2 1.6-.4 2.4-.6 5.4-1.3 12.3-2.2 14.6 0-.6.5-1.2.9-1.9 1.4-2.3 1.9-4.6 3.8-6.9 5.9-5.1 4.8-9.3 10-12.3 15.9-.8 1.5-1.3 3.1-1.9 4.7-.7 2.2-1.4 4.5-1.9 6.9-.5 2.2-.8 4.5-1 6.9-.1 1.7-.2 3.5-.1 5.3.3 10.7 4.6 19.5 11.6 26.8 1.2 1.3 2.6 2.5 3.9 3.7.7.6 1.5 1.2 2.3 1.8 1 .8 2 1.6 3 2.4 2.9 2.4 5.6 4.9 8.3 7.6 5.6 5.5 10.4 11.5 15.3 17.4.8 1 1.6 2 2.4 3 .5.6 1.2.5 1.6.1 2.2-1.6 1.7-4.8 1.2-7.2-.1-.6-.3-1.3-.5-1.9-.7-2.1-1.5-4.2-2.2-6.3-.6-3.1-1.1-6-1.7-9.6-1.6-1.9-1.2-4 .1-6.3-.3 1.1-.1 2.3.4 3.2.2.3.5.8.8 1-.9-1-1.2-2.6-.7-4 .3-1.1 1.1-2.1 1.9-3 2.2-2.5 4.9-4.6 7.3-6.8 1.8-1.6 3.6-3.4 4.5-5.5.1-.1.1-.3.2-.4l.1-.1c-.1-.1-.2-.2-.3-.2-.1-.1-.2-.2-.3-.3 0 0 0 0 0 0 0 0 0-.1.1-.1 0 0-.1 0-.1.1-.3-.2-.5-.5-.8-.7l-.1 0c-.1 0-.4.3-.5.3-.7.4-1.4.8-2.1 1.2-3 1.8-6.1 3.5-9.3 4.9-2.6 1.1-5.3 2.3-8.2 2.9-1.6.4-3.3.7-5.1.8-2.5.1-4.6-.2-6.6-1.1-.5-.2-1.1-.5-1.6-.9-3.1-2.2-4.8-5.5-5.8-9.1l-.7-3.5 0-.1c.1-1.2.3-2.4.7-3.5.9-2.8 2.6-5.4 4.6-7.7 4-4.3 8.6-7.6 13.3-10.6l2.1-1.3c-1.7 2.6-3.9 5.3-7.7 8.2 4.5 2.4 9.2 5.6 12.7-2.5 2.2 5.8 7 4.4 9.4-2.7 3.3 6.7 6.6 4.2 8-2.1 4.5 5.7 8.9 2.7 11.4-2.4-2.8-1.3-10.1-1.6-15.3-4.6l5.4-1.1.2 0c.1 0 .3 0 .4 0 .5 0 .9-.1 1.4-.1 1-.1 2-.1 3-.2 3.2-.2 6.5-.3 9.7-.4 4.1-.2 8.2-.3 12.3-.7 3.1-.3 6.1-.7 9-1.2.3-.1.7-.2 1.1-.4 1.1-.4 2.2-1 3.2-1.6-.4.2-.8.3-1.2.4.6-.3 1.1-.6 1.5-1 .2 0 .3 0 .5-.1.2-.1.5-.3.7-.4.7-.4 1.4-.8 2-1.2 1-.7 2-1.7 1.9-3 0-.2-.1-.5-.2-.7-.4-1.1-1.6-1.8-2.6-2.4l-4.8-2.5-.1-.2c-1.1-1.3-2.1-2.6-3.4-3.9-3.8-3.9-8.1-7.2-12.4-10-5.5-3.6-11.3-6.4-17.6-8.3-3.1-.9-6.3-1.5-9.7-1.7-1.4-.1-2.8-.1-4.2.1-.3 0-.6.1-1 .1-.1-.1-.3-.2-.4-.3-4.6-3.2-9-9.7-1.7-15.4-.7-.4-1.5-.6-2.2-.6z"/>
</a>
<a href="#:[[Purple fish]]">
<title>Purple fish</title>
<path opacity="0" d="m426 385.2c-2.2 0-4.3 1.7-5.4 4.5-2.7-2.3-7.3-2.8-9.4.5 7.5.9 7.8 6.9 6.2 11.4-1.6.4-3.1.8-4.7 1.4-3.1 1.1-6.4 3-9.1 4.9-3.4 2.4-6.4 5.1-9.1 8-2.4 2.6-4.6 5.3-6.5 8.2-1.6 2.4-3 4.7-4.3 7.2l-1.2 2.9-2.2 2c-.8.7-1.5 1.5-2.1 2.3-.3.5-.8 1.1-.8 1.8 0 .2 0 .4 0 .6.3 1.2 1.4 1.8 2.4 2.1.7.2 1.4.4 2 .5.3 0 .5.1.7.1.3.1.6 0 .9-.1.7.2 1.3.3 2 .4l-2 0c1.3.3 2.8.7 4.2.5 2.7-.3 5.3-.7 8-1.2 3.6-.7 7.1-1.6 10.7-2.5 2.8-.7 5.6-1.5 8.4-2.1.9-.2 1.8-.4 2.6-.6.3-.1.7-.1 1-.2.6-.1 1.2-.1 1.9-.2.2 0 .3 0 .5 0-3.4 4.6-10.7 7-12.9 8.9 3.5 3.7 8 5.2 10.4-.8.9 1.7 2 3 3 3.7.1.1.2.1.3.2 1.8 1 3.4 0 4.2-4.1 3.8 5.4 8.3 5.4 8.7-.1 5.1 6.1 8.3 2.2 11.5-1-5.6-2.2-8.4-4.7-11-7.3.6 0 1.3 0 1.9 0 .5 0 1.1 0 1.6.1.1 0 .5 0 .6 0l2.6.4c.9.1 1.9.2 2.8.2 2.5.1 5 .2 7.5.2 3.1.1 6.2.2 9.4.5 2.9.2 5.7.5 8.5 1 7.9 1.4 16.3 4.1 21.2 10.5 4.7 6.2 5 13.6 4 20.3-.2 1.5-.5 3-.8 4.5-.2.7-.3 1.4-.5 2 0 .1-.1.2-.1.3.1.4.4.9.6 1.3 0 0 .2.1.2.1.3.2.6.3.9.4 1.8.6 3.8.6 5.6-.3 2.6-1.2 4.1-3.2 5.5-5.4 2.6-4 4.1-9.1 4.3-13.9 0-.6 0-1.1 0-1.7-.1-1.8-.4-4.1-1.8-5.7-.7-.8-1.4-1.1-2.4-1.4-.6-.6-1.3-1.2-2-1.8 1.8-.8 3.4-1.6 4.9-2.4.2-.1.4-.2.6-.2 1.9-.8 3.9-1.9 5.4-3.1 2-1.5 3.7-3.5 4.8-5.7.1-.2.2-.3.2-.5.1-.3.3-.6.4-1 0-.1.1-.2.1-.4.2-.6.4-1.3.6-2 .3-1.6.4-3.2.2-4.8-.2-1.4-.5-2.8-1.3-4.2-.4-.7-.9-1.3-1.6-1.6-1.5-.6-3.3-.3-4.9-.1-.9.1-1.9.3-2.8.5-1.3.3-2.7.6-4.1.9-5 1.1-10.2 2.3-15.2 2.1-2.3-.1-5-.3-7.1-1.5-1.7-1-3-2.4-4.5-3.7-1.3-1.1-2.6-2.2-3.9-3.2-6.1-4.9-12.7-9-19.8-12.5-3.6-1.8-7.6-3.2-11.6-4.2-.7-.2-1.5-.3-2.2-.5.1-3.4 8.3-6.3 13.4-7.8-2.5-4.2-10.5-4.2-14.9-1.5-.4-4.8-8.8-6.2-10.3-3.2-1.5-2.4-3.2-3.5-5-3.5z"/>
</a>
<a href="#:[[Green fish]]">
<title>Green fish</title>
<path opacity="0" d="m358.4 492.9c1-2.3 1.8-4.5 2.3-6.7.6-1.7.9-3.4.7-5.2-.1-.5-.1-1.3-.4-1.7-.5-.6-1.2-.7-1.9-1-.5-.2-.9-.3-1.4-.5-5-1.6-10.2-2.7-15.6-2.7-.8 0-1.5 0-2.3.1-2.6.2-5.5.8-8.1 1.7-4.6 1.7-8.4 4.6-11.4 8.2-3.7 4.3-6.3 9.6-8.2 14.9-.1-.2-.1-.3-.2-.5-1.7-4.5-1.7-12.1-1.5-17.4-6.6 1.5-10 11.8-8.4 18.7-6.4-1.6-11.8 8.8-8.6 12-8.7 1.9-8.8 9.1-3.2 13.9-4.2 2.5-6.8 8.3-3.4 12.5 4.3-8.8 11.6-7.3 16.7-3.6-0 .1-.1.3-.1.4-1 4.7-2 9.3-3.5 13.9-1.4 4.7-3.2 9.5-6.2 13.7-1.6 2.2-3.4 4.1-5.5 5.6-1.4 1-2.9 1.8-4.7 2.4-5.3 1.8-10.5 1.4-15.3.4-.9-.2-1.8-.4-2.7-.6-.9-.2-1.9-.4-2.8-.9-.2-.1-.3-.2-.5-.3-3.1-2.4-5.8-5.8-7.7-10.3-0-.3-.1-.6-.1-.9-0 .3 0 .5 0 .8-.2-.6-.5-1.2-.7-1.8-6 3.5-5.4 14.4 3.7 29.2-1.2 8.8.1 17.4 4 25.7-.1.3-.2.6-.3.9 2.2-6 5.3-12 9.4-17.2 4.5-5.7 10.1-10.1 16.3-13.6 10.3-5.8 22.4-9.4 32.9-15 7.1-3.8 13.4-8.3 18.6-14.4 2.1-2.4 4-5.1 5.7-8 1-1.8 1.9-3.5 2.6-5.4.4-1.1.7-2.3 1.1-3.5 1.2 3.2 2.1 7 2.4 12.1 5.6-2.9 12-5.3 6.3-14.6 7.3 1.8 9.3-4.1 3.8-11.3 9.1 1.3 8.8-3.8 3.5-9.5 8.8-.6 8.9-7.1 5.5-13.2-3.4 2-9.3 10-16.5 12.7-.3.1-.6.2-.8.3.3-1.5.5-3 .8-4.5.4-1.9.8-3.8 1.4-5.6.6-1.9 1.2-4 2.1-5.9.3-.4.6-.9.9-1.3.2-.5.4-1 .6-1.5zm-89.3 80.9c0 0 .1 0 .1 0 .7.2 1.3.3 2 .4-.7-.1-1.4-.3-2.1-.5zm-.2 22.4c-1.5 2.3-2.9 4.8-4.1 7.3-.6 1.3-1.1 2.6-1.6 4 1.3-3.7 2.8-7.4 5.8-11.3z"/>
</a>
<a href="#:[[Blue fish]]">
<title>Blue fish</title>
<path opacity="0" d="m411 458.4c-1.1 0-2.2.2-3.1.7 3.4 3.7 8.3 9.9 8.6 13.7-.2 0-.3-.1-.4-.2-2.6-1.5-5.3-2.9-8.1-4.1-2.3-1-4.6-2-7.1-2.7-2.8-.8-5.9-1.1-8.8-1.3-4.8-.4-9.6-.4-14.1.2-1.1.2-2.3.3-3.4.8-.2.1-.5.4-.5.7 0 .1 0 .1 0 .2-.4 2.7-.1 5.9.6 9.3-.3-.9-.6-1.7-.9-2.6.2.9.5 1.7.8 2.6.1.5.3 1 .5 1.5.6 2.7 1.5 5.6 2.5 8.5.5 1.3 1.3 3.1 2.3 5 1.7 3.4 3.6 6.7 6 9.8.6.8 1.2 1.6 1.9 2.4 0 0 0 0 0 0-.4.1-.8.2-1.2.3-2 .4-4.1.5-6.1.3-.2 0-.3 0-.4 0-2.5-.2-4.8-.6-6.8-.9 0 0 0 0 0 0-.1 0-.1 0-.1 0-.6-.1-1.1-.1-1.5-.2-.2 0-.3 0-.5 0-.5 0-.9 0-1.3 0 .1.7.2 1.4.4 2.1.1.6.3 1.2.6 1.8.1.3.2.6.4.9.1.2.3.4.4.7 0 0 0 0 .1 0 .1.3.3.5.5.7.3.4.7.7 1.2.9.5.3 1 .5 1.5.6.3 0 .6 0 .9 0 .3 0 .6-.1.9-.1.6-.1 1.3-.4 2-.7.4-.2.8-.4 1.2-.7-.1.9-.2 1.6-.2 2.3 0 .7 0 1.4.1 1.9.1.3.1.6.2.9.1.2.1.5.2.7 0 0 0 0 0 0 .1.2.2.4.4.6.1.1.2.3.3.4.2.1.3.3.5.3.2.1.4.2.6.2 0 0 0 0 0 0 .2 0 .4.1.6 0 .2 0 .4 0 .7-.1.2-.1.5-.2.7-.3 0 0 0 0 .1 0 .2-.2.5-.3.8-.5 0 0 0 0 0 0 .3-.2.6-.4.9-.7 0 0 0 0 0 0 .4-.3.7-.6 1-.9 0 .5 0 .9 0 1.4 0 .4.1.8.1 1.2.1.4.1.8.2 1.2.1.3.2.7.3 1 .1.3.2.6.3.9.2.2.3.5.5.7.1.3.3.5.5.6.1.2.3.4.5.5.2.2.4.3.6.4 0 0 0 0 0 0 .2.1.4.1.6.2.3 0 .5 0 .7 0 .2 0 .5 0 .7-.1.2-.1.5-.2.7-.3 0 0 .1 0 .1 0 .2-.1.4-.3.7-.4 0 0 0 0 0-.1.3-.1.5-.3.8-.6 0 0 0 0 0 0 0 0 0 0 0 0 .2-.2.5-.5.7-.8.1.6.1 1.1.2 1.6 0 0 0 0 0 0 0 0 0 0 0 0 .1.5.1.9.3 1.4.1.4.2.7.3 1.1.2.3.3.6.5.9.2.3.3.5.5.8.2.2.4.4.6.5.1.1.1.1.1.1.2.1.4.3.7.4.2.1.4.2.7.3 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .3.1.5.2.8.2 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .3.1.6.1.9.1 0 0 0 0 0 0 .6.1 1.2 0 1.8 0 .6-.1 1.3-.1 1.9-.2.7-.1 1.3-.2 2-.3-.5-.7-.8-1.3-1.2-2 0 0-.1-.1-.1-.1-.3-.6-.6-1.1-.8-1.6-.1-.2-.2-.5-.3-.7-.2-.3-.4-.7-.5-1.1-.1-.2-.2-.4-.2-.5-.2-.4-.3-.8-.5-1.2 0-.1-.1-.3-.1-.5-.2-.4-.3-.8-.4-1.2-.1-.1-.1-.2-.1-.3-.4-1.6-.7-3.2-.9-4.7 2.6 1 5.5 1.7 8.4 2.2 4.7.9 9.5 1.5 13.3 3.6 3.2 1.7 5.3 5 6.3 8.4.4 1.1.7 2.3.9 3.5.1.5.1.9.2 1.4l.1.3-1.1 1.7c-2.9 5.7-3.5 13.6-2.9 19.8.1 1.4.4 2.8.6 4.2.4 1.8.9 3.5 1.5 5.1.8 2.2 1.8 4.4 2.9 6.5 1.5 2.6 3.2 5.3 5.1 7.7 1.6 2 3.3 3.8 5.1 5.5 1.2 1.1 2.5 2.1 4 2.9 1 .5 2.4 1 3.5.6l.2 0c.1-.3.2-.6.2-1 .1-.3.2-.6.2-.9.1-.2.1-.3.2-.5 0 0-.3-.2-.4-.3-.2-.2-.4-.5-.6-.8-1.1-1.4-1.8-2.9-2.4-4.5-1.4-3.4-2.3-7-2.5-10.7-.1-2.5.2-5.9 2.1-7.5l.6-.4 2.2 2c2.9 2.3 6.3 4.2 10.4 4.3.5 0 1 0 1.5 0 .6-.1 1.1-.2 1.6-.3.2 0 .5-.1.7-.2 2.8-.6 5.7-1.9 8.4-4.1l1.4-3.1c.3-.5.6-1 .9-1.5-.2.3-.4.6-.6.9l.5-1.1c.2 0 .4 0 .6-.1-.2 0-.4.1-.6.1l0-.1c-.3.1-.6.1-.9.2-1.3 0-2.6.1-3.9-.1-11.9-1.3-19-11.9-22-22-.3-1.1-.6-2.2-.8-3.3l-.6-3 .3-1.2c.3-1.2.6-2.4.7-3.6.5-3.4.6-6.7.2-9.8-.7-6.6-3.1-12.8-6.7-18.5-.2-5.8 3.5-15.6 13.2-11.1 0-4.5-4.7-6.8-8.7-6.2 1.1-6-2.8-10.6-9.4-7.3.4-3.7-8.5-7.6-11.8-3.2-2.2-4.3-7.6-8.3-12.2-8.3z"/>
</a>
</g>
</svg>
! Image Status Classes ! Image Status Classes
<<from-version "5.2.2">> The following CSS classes are automatically added to the `<img>` element to indicate the status of the image. Note that only one of these classes will be added at the same time. <<from-version "5.2.2">> The following CSS classes are automatically added to the `<img>` element to indicate the status of the image. Note that only one of these classes will be added at the same time.