New 'note' shortcode with 4 specific display:

  * warning (red)
  * important (yellow)
  * tip (green)
  * normal (blue)

5 files changed, 36 insertions, 0 deletions

diff --git a/static/css/main.css b/static/css/main.css
index 70b1cd3..dbe2d78 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -25,3 +25,39 @@ a.internal {
   color: #080;
   text-decoration: none;
 }
+
+div.note {
+  margin: 2em;
+  border-radius: 20px;
+  text-align: justify;
+  vertical-align: middle;
+  border-collapse: collapse;
+  margin-left: auto;
+  margin-right: auto;
+  width: 70% !important;
+  min-height: 40px;
+  clear: both;
+  padding: 15px 20px 15px 80px;
+  background-position: 20px 50%;
+  background-repeat: no-repeat;
+}
+
+div.warning {
+  background-color: #fdd;
+  background-image: url("/img/warning.png");
+}
+
+div.important {
+  background-color: #ffc;
+  background-image: url("/img/important.png");
+}
+
+div.tip {
+  background-color: #dfd;
+  background-image: url("/img/tip.png");
+}
+
+div.normal {
+  background-color: #eef;
+  background-image: url("/img/note.png");
+}
diff --git a/static/img/important.png b/static/img/important.png
new file mode 100644
index 0000000..dc8c8a4
--- /dev/null
+++ b/static/img/important.png
diff --git a/static/img/note.png b/static/img/note.png
new file mode 100644
index 0000000..df1e0a9
--- /dev/null
+++ b/static/img/note.png
diff --git a/static/img/tip.png b/static/img/tip.png
new file mode 100644
index 0000000..2000f20
--- /dev/null
+++ b/static/img/tip.png
diff --git a/static/img/warning.png b/static/img/warning.png
new file mode 100644
index 0000000..3c8a37d
--- /dev/null
+++ b/static/img/warning.png