mirrors/TiddlyWiki5
1
0
Fork 0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2024-11-26 19:47:20 +00:00
Code Issues Releases Wiki Activity

Add alert preview

Browse Source
This commit is contained in:
Jeremy Ruston 2024-11-17 14:45:52 +00:00
parent b2d0c22d75
commit 32ac67166a
2 changed files with 46 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
core/ui/Palettes/Preview/Alert.tid Normal file
View File

@ -0,0 +1,17 @@
title: $:/core/ui/Palettes/Preview/Alert
tags: $:/tags/Preview/Page
\whitespace trim
<$colour.div class="tc-palette-preview-thumbnail-alert" styleName="background-color" styleColour="alert-background">
<$colour.div class="tc-palette-preview-thumbnail-alert-border" styleName="border-color" styleColour="alert-border">
<$colour.div class="tc-palette-preview-thumbnail-alert-subtitle">
Lorem Ipsum
<$colour.div class="tc-palette-preview-thumbnail-alert-highlight">
(Count: 1)
</$colour.div>
</$colour.div>
<$colour.div class="tc-palette-preview-thumbnail-alert-body">
Lorem Ipsum Dolor Sit Amet Consectetur Adipiscing Elit Sed Do Eiusmod Tempor Incididunt.
</$colour.div>
</$colour.div>
</$colour.div>

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

@ -2939,6 +2939,7 @@ input.tc-palette-manager-colour-input {
.tc-palette-preview-thumbnail { .tc-palette-preview-thumbnail {
display: inline-block; display: inline-block;
position: relative;
padding: 0.5em 0.5em 0 0.5em; padding: 0.5em 0.5em 0 0.5em;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
@ -2947,6 +2948,34 @@ input.tc-palette-manager-colour-input {
line-height: 1.2; line-height: 1.2;
} }
.tc-palette-preview-thumbnail-alert {
position: absolute;
top: 3px;
left: 3px;
width: 15em;
font-size: 2px;
border-radius: 2px;
}
.tc-palette-preview-thumbnail-alert-border {
border-width: 1px;
border-style: solid;
padding: 3px;
border-radius: 2px;
}
.tc-palette-preview-thumbnail-alert-subtitle {
}
.tc-palette-preview-thumbnail-alert-highlight {
}
.tc-palette-preview-thumbnail-alert-body {
}
.tc-palette-preview-thumbnail-story { .tc-palette-preview-thumbnail-story {
flex-grow: 2; flex-grow: 2;
} }