mirrors/TiddlyWiki5
1
0
Fork 0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2025-02-18 20:10:02 +00:00
Code Issues Releases Wiki Activity

Add tabs to the preview

Browse Source
This commit is contained in:
Jeremy Ruston 2025-02-06 22:19:10 +00:00
parent 7c4938293e
commit e87aaff06b
2 changed files with 57 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
core/ui/Palettes/Preview/Tiddler/Body.tid
View File

@ -9,11 +9,34 @@ tags: $:/tags/Preview/Tiddler
</span>
\end link
\procedure tab-button(text)
<span class="tc-palette-preview-thumbnail-tab-button" style.border-color=<<colour tab-border>> style.color=<<colour tab-foreground>> style.background-color=<<colour tab-background>>>
<$text text=<<text>>/>
</span>
\end tab-button
<div class="tc-palette-preview-thumbnail-tiddler-body" style.color=<<colour foreground>>>
<%if [<title>match[HelloThere]] %>
Lorem ipsum dolor sit amet, <<link "consectetur adipiscing elit">>. Cras non arcu ultricies, egestas odio tempus, vestibulum ipsum. Praesent diam lorem, elementum in venenatis eget, tincidunt quis lacus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Etiam efficitur velit tortor, sit amet tristique felis viverra sit amet. <<link "Nullam posuere facilisis purus sed">> consectetur. Integer vel elit euismod, posuere ligula et, dictum tellus. Donec in odio diam. Sed metus magna, placerat at ligula et, imperdiet sagittis ex.
<%else%>
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
<div class="tc-palette-preview-thumbnail-tab-set">
<div class="tc-palette-preview-thumbnail-tab-buttons">
<span class="tc-palette-preview-thumbnail-tab-button" style.border-color=<<colour tab-border-selected>> style.color=<<colour tab-foreground-selected>> style.background-color=<<colour tab-background-selected>>>
Sed
</span>
<<tab-button Metus>>
<<tab-button Magna>>
<<tab-button Placerat>>
<<tab-button Ligula>>
<<tab-button Imperdiet>>
</div>
<div class="tc-palette-preview-thumbnail-tab-divider" style.border-color=<<colour tab-divider>>>
</div>
<div class="tc-palette-preview-thumbnail-tab-content">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras non arcu ultricies, egestas odio tempus, vestibulum ipsum. Praesent diam lorem, elementum in venenatis eget, tincidunt quis lacus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
</div>
</div>
<%endif%>
</div>

33
themes/tiddlywiki/vanilla/base.tid
View File

@ -2943,6 +2943,39 @@ input.tc-palette-manager-colour-input {
line-height: 1.2;
}
.tc-palette-preview-thumbnail-tab-buttons {
font-size: 0.85em;
padding-top: 2em;
}
.tc-palette-preview-thumbnail-tab-button {
display: inline-block;
padding: 1px 1px 1px 1px;
margin-right: 0.3em;
font-weight: normal;
border: none;
background: inherit;
border-left-width: 0.5px;
border-left-style: solid;
border-top-width: 0.5px;
border-top-style: solid;
border-right-width: 0.5px;
border-right-style: solid;
border-top-left-radius: 1px;
border-top-right-radius: 1px;
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
}
.tc-palette-preview-thumbnail-tab-divider {
border-top-width: 0.5px;
border-top-style: solid;
}
.tc-palette-preview-thumbnail-tab-content {
margin-top: 3px;
}
.tc-palette-preview-thumbnail-alert {
position: absolute;
top: 3px;