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 notification preview

Browse Source
This commit is contained in:
Jeremy Ruston 2024-11-17 16:10:57 +00:00
parent 32ac67166a
commit b0828cc099
4 changed files with 34 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
core/ui/Palettes/Preview/Alert.tid
View File

@ -4,14 +4,16 @@ 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 styleName="color" styleColour="foreground">
<$colour.div class="tc-palette-preview-thumbnail-alert-subtitle" styleName="color" styleColour="alert-muted-foreground">
Lorem Ipsum
<$colour.div class="tc-palette-preview-thumbnail-alert-highlight" styleName="color" styleColour="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 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>

11
core/ui/Palettes/Preview/Notification.tid Normal file
View File

@ -0,0 +1,11 @@
title: $:/core/ui/Palettes/Preview/Notification
tags: $:/tags/Preview/Page
\whitespace trim
<$colour.div class="tc-palette-preview-thumbnail-notification" styleName="background-color" styleColour="notification-background">
<$colour.div class="tc-palette-preview-thumbnail-notification-border" styleName="border-color" styleColour="notification-border">
<$colour.div class="tc-palette-preview-thumbnail-notification-body" styleName="color" styleColour="foreground">
Lorem Ipsum Dolor Sit Amet Consectetur
</$colour.div>
</$colour.div>
</$colour.div>

2
core/wiki/tags/PreviewPage.tid
View File

@ -1,2 +1,2 @@
title: $:/tags/Preview/Page
list: $:/core/ui/Palettes/Preview/Alert $:/core/ui/Palettes/Preview/Story $:/core/ui/Palettes/Preview/Sidebar
list: $:/core/ui/Palettes/Preview/Alert $:/core/ui/Palettes/Preview/Notification $:/core/ui/Palettes/Preview/Story $:/core/ui/Palettes/Preview/Sidebar

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

@ -2952,7 +2952,7 @@ input.tc-palette-manager-colour-input {
position: absolute;
top: 3px;
left: 3px;
width: 15em;
width: 35em;
font-size: 2px;
border-radius: 2px;
}
@ -2964,16 +2964,20 @@ input.tc-palette-manager-colour-input {
border-radius: 2px;
}
.tc-palette-preview-thumbnail-alert-subtitle {
.tc-palette-preview-thumbnail-notification {
position: absolute;
right: 3px;
top: 3px;
width: 25em;
font-size: 2px;
border-radius: 2px;
}
.tc-palette-preview-thumbnail-alert-highlight {
}
.tc-palette-preview-thumbnail-alert-body {
.tc-palette-preview-thumbnail-notification-border {
border-width: 1px;
border-style: solid;
padding: 3px;
border-radius: 2px;
}
.tc-palette-preview-thumbnail-story {