diff --git a/core/ui/AlertTemplate.tid b/core/ui/AlertTemplate.tid
index 234a4d29a..601275409 100644
--- a/core/ui/AlertTemplate.tid
+++ b/core/ui/AlertTemplate.tid
@@ -1,4 +1,8 @@
title: $:/core/ui/AlertTemplate
-
<$button message="tw-delete-tiddler" class="btn-invisible">{{$:/core/images/delete-button}}$button>
<$view field="component"/> - <$view field="modified" format="date" template="0hh:0mm:0ss DD MM YYYY"/> <$reveal type="nomatch" state="!!count" text="">(count: <$view field="count"/>)$reveal>
<$view field="text"/>
+<$button message="tw-delete-tiddler" class="btn-invisible">{{$:/core/images/delete-button}}$button>
<$view field="component"/> - <$view field="modified" format="date" template="0hh:0mm:0ss DD MM YYYY"/> <$reveal type="nomatch" state="!!count" text="">(count: <$view field="count"/>)$reveal>
+
+<$transclude/>
+
+
diff --git a/editions/tw5.com/tiddlers/Features.tid b/editions/tw5.com/tiddlers/Features.tid
index 98cf4f790..839b5e3b6 100644
--- a/editions/tw5.com/tiddlers/Features.tid
+++ b/editions/tw5.com/tiddlers/Features.tid
@@ -4,12 +4,15 @@ tags: introduction
title: Features
type: text/vnd.tiddlywiki
+\define alert-demo()
+<$fieldmangler tiddler="SampleAlert"><$set name="currentTiddler" value="SampleAlert"><$button message="tw-add-tag" param="$:/tags/Alert" class="btn btn-inverse">alerts$button>$set>$fieldmangler>
+\end
* The ability to save changes on almost any desktop HTML5 compatible-browser, with custom apps to enable [[Saving on iPad/iPhone]] and [[Android|Saving on Android]], and a cross-platform [[Firefox extension|Saving with TiddlyFox]] that even runs on Android
* [[Bitmap images|Motovun Jack.jpg]] and [[SVG images|UsingSVG]] are first-class citizens alongside text
* Concise and expressive WikiText that generates semantic HTML
* Integrated [[AES encryption|Saving with Encryption]]
* TiddlyWiki isn't just a wiki - you can build custom applications with it like this TaskManagementExample
-* Familiar user interface elements like <$button message="tw-modal" param="SampleWizard" class="btn btn-inverse">wizards$button> and <$button message="tw-notify" param="SampleNotification" class="btn btn-inverse">notifications$button>
+* Familiar user interface elements like <>, <$button message="tw-modal" param="SampleWizard" class="btn btn-inverse">wizards$button> and <$button message="tw-notify" param="SampleNotification" class="btn btn-inverse">notifications$button>
* Easily [[import|ImportTiddlers]] content via drag and drop, copy and paste, or browsing for local files
* Clone existing tiddlers (for example, <$button message="tw-new-tiddler" param=<>>clone this tiddler$button>)
* TiddlyWiki is [[surprisingly scalable|Scalability]] to many thousands of tiddlers and megabytes of content
diff --git a/editions/tw5.com/tiddlers/mechanisms/AlertMechanism.tid b/editions/tw5.com/tiddlers/mechanisms/AlertMechanism.tid
index 88657e020..b5138e0c2 100644
--- a/editions/tw5.com/tiddlers/mechanisms/AlertMechanism.tid
+++ b/editions/tw5.com/tiddlers/mechanisms/AlertMechanism.tid
@@ -6,6 +6,8 @@ type: text/vnd.tiddlywiki
Alerts are displayed as yellow boxes overlaying the main TiddlyWiki window. Each one corresponds to a tiddler with the tag [[$:/tags/Alert]]. Clicking the delete icon on an alert deletes the corresponding tiddler.
+Here's a demo <$fieldmangler tiddler="SampleAlert"><$set name="currentTiddler" value="SampleAlert"><$button message="tw-add-tag" param="$:/tags/Alert" class="btn btn-inverse">alert$button>$set>$fieldmangler>.
+
Alert tiddlers should have the following fields:
|!Field |!Description |
@@ -14,4 +16,3 @@ Alert tiddlers should have the following fields:
|modified |Date of the alert (used for ordering the alerts on screen) |
|component |Component name associated with the alert |
|tags |Must include [[$:/tags/Alert]] |
-
diff --git a/editions/tw5.com/tiddlers/samples/SampleAlert.tid b/editions/tw5.com/tiddlers/samples/SampleAlert.tid
new file mode 100644
index 000000000..7ee3de9c2
--- /dev/null
+++ b/editions/tw5.com/tiddlers/samples/SampleAlert.tid
@@ -0,0 +1,6 @@
+title: SampleAlert
+component: demo
+
+This is a demonstration alert.
+
+Note that the trashcan icon deletes the tiddler containing this alert. You can also remove it by opening the tiddler SampleAlert and editing it to remove the tag [[$:/tags/Alert]].
diff --git a/themes/tiddlywiki/snowwhite/base.tid b/themes/tiddlywiki/snowwhite/base.tid
index 727832f1d..682b72c0a 100644
--- a/themes/tiddlywiki/snowwhite/base.tid
+++ b/themes/tiddlywiki/snowwhite/base.tid
@@ -121,6 +121,12 @@ canvas.tw-edit-bitmapeditor {
<>;
}
+
+.tw-alert {
+ <>
+ <>
+}
+
.tw-notification {
<>
<>
diff --git a/themes/tiddlywiki/vanilla/base.tid b/themes/tiddlywiki/vanilla/base.tid
index fab3e6315..5af64ab30 100644
--- a/themes/tiddlywiki/vanilla/base.tid
+++ b/themes/tiddlywiki/vanilla/base.tid
@@ -926,17 +926,16 @@ canvas.tw-edit-bitmapeditor {
position: fixed;
top: 0;
left: 0;
- right: 0;
+ max-width: 500px;
z-index: 20000;
}
.tw-alert {
position: relative;
- <>
margin: 28px;
padding: 14px 14px 14px 14px;
- border: 3px solid #DBB727;
- background-color: rgb(250, 210, 50);
+ border: 2px solid #B99E2F;
+ background-color: rgb(255, 228, 118);
}
.tw-alert-toolbar {
@@ -945,8 +944,12 @@ canvas.tw-edit-bitmapeditor {
right: 14px;
}
+.tw-alert-toolbar svg {
+ fill: #B99E2F;
+}
+
.tw-alert-subtitle {
- color: #DBB727;
+ color: #B99E2F;
font-weight: bold;
}