mirror of
https://github.com/Jermolene/TiddlyWiki5
synced 2024-12-25 01:20:30 +00:00
Simplify the link panels
This commit is contained in:
parent
4eb2e3d3b4
commit
2186a393a7
@ -2,32 +2,20 @@ title: $:/core/macros/thumbails
|
|||||||
tags: $:/tags/Macro
|
tags: $:/tags/Macro
|
||||||
|
|
||||||
\define thumbnail(link,icon,color,background-color,image,caption,width:"280",height:"157")
|
\define thumbnail(link,icon,color,background-color,image,caption,width:"280",height:"157")
|
||||||
<$link to="""$link$""">
|
<$link to="""$link$"""><div class="tc-thumbnail-wrapper">
|
||||||
<div class="tc-thumbnail-wrapper">
|
<div class="tc-thumbnail-image" style="width:$width$px;height:$height$px;"><$reveal type="nomatch" text="" default="""$image$""" tag="div" style="width:$width$px;height:$height$px;">
|
||||||
<div class="tc-thumbnail-image" style="width:$width$px;height:$height$px;">
|
|
||||||
<$reveal type="nomatch" text="" default="""$image$""" tag="div" style="width:$width$px;height:$height$px;">
|
|
||||||
[img[$image$]]
|
[img[$image$]]
|
||||||
</$reveal>
|
</$reveal><$reveal type="match" text="" default="""$image$""" tag="div" class="tc-thumbnail-background" style="width:$width$px;height:$height$px;background-color:$background-color$;"></$reveal></div><div class="tc-thumbnail-icon" style="fill:$color$;">
|
||||||
<$reveal type="match" text="" default="""$image$""" tag="div" class="tc-thumbnail-background" style="width:$width$px;height:$height$px;background-color:$background-color$;">
|
|
||||||
</$reveal>
|
|
||||||
</div>
|
|
||||||
<div class="tc-thumbnail-icon" style="fill:$color$;">
|
|
||||||
$icon$
|
$icon$
|
||||||
</div>
|
</div><div class="tc-thumbnail-caption">
|
||||||
<div class="tc-thumbnail-caption">
|
|
||||||
$caption$
|
$caption$
|
||||||
</div>
|
</div></div></$link>
|
||||||
</div></$link>
|
|
||||||
\end
|
\end
|
||||||
|
|
||||||
\define thumbnail-right(link,icon,color,background-color,image,caption,width:"280",height:"157")
|
\define thumbnail-right(link,icon,color,background-color,image,caption,width:"280",height:"157")
|
||||||
<div class="tc-thumbnail-right-wrapper">
|
<div class="tc-thumbnail-right-wrapper"><<thumbnail """$link$""" """$icon$""" """$color$""" """$background-color$""" """$image$""" """$caption$""" """$width$""" """$height$""">></div>
|
||||||
<<thumbnail """$link$""" """$icon$""" """$color$""" """$background-color$""" """$image$""" """$caption$""" """$width$""" """$height$""">>
|
|
||||||
</div>
|
|
||||||
\end
|
\end
|
||||||
|
|
||||||
\define list-thumbnails(filter,width:"280",height:"157")
|
\define list-thumbnails(filter,width:"280",height:"157")
|
||||||
<$list filter="""$filter$""">
|
<$list filter="""$filter$"""><$macrocall $name="thumbnail" link={{!!link}} icon={{!!icon}} color={{!!color}} background-color={{!!background-color}} image={{!!image}} caption={{!!caption}} width="""$width$""" height="""$height$"""/></$list>
|
||||||
<$macrocall $name="thumbnail" link={{!!link}} icon={{!!icon}} color={{!!color}} background-color={{!!background-color}} image={{!!image}} caption={{!!caption}} width="""$width$""" height="""$height$"""/>
|
|
||||||
</$list>
|
|
||||||
\end
|
\end
|
||||||
|
@ -1656,15 +1656,13 @@ body.tc-dirty span.tc-dirty-indicator, body.tc-dirty span.tc-dirty-indicator svg
|
|||||||
}
|
}
|
||||||
|
|
||||||
/*
|
/*
|
||||||
** YouTube macros
|
** Thumbnail macros
|
||||||
*/
|
*/
|
||||||
|
|
||||||
.tc-thumbnail-wrapper {
|
.tc-thumbnail-wrapper {
|
||||||
position: relative;
|
position: relative;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
border: 1px solid <<colour muted-foreground>>;
|
margin: 0;
|
||||||
border-radius: 3px;
|
|
||||||
margin: 2px;
|
|
||||||
vertical-align: top;
|
vertical-align: top;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -1694,7 +1692,6 @@ body.tc-dirty span.tc-dirty-indicator, body.tc-dirty span.tc-dirty-indicator svg
|
|||||||
|
|
||||||
.tc-thumbnail-background {
|
.tc-thumbnail-background {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
border-radius: 2px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.tc-thumbnail-icon svg,
|
.tc-thumbnail-icon svg,
|
||||||
@ -1727,8 +1724,6 @@ body.tc-dirty span.tc-dirty-indicator, body.tc-dirty span.tc-dirty-indicator svg
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
filter: alpha(opacity=0.9);
|
filter: alpha(opacity=0.9);
|
||||||
opacity: 0.9;
|
opacity: 0.9;
|
||||||
border-bottom-left-radius: 2px;
|
|
||||||
border-bottom-right-radius: 2px;
|
|
||||||
line-height: 1.4;
|
line-height: 1.4;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user