diff --git a/layouts/shortcodes/block_color.html b/layouts/shortcodes/block_color.html
new file mode 100644
index 0000000..3b8df70
--- /dev/null
+++ b/layouts/shortcodes/block_color.html
@@ -0,0 +1,3 @@
+
+
{{ .Inner | markdownify }}
+
diff --git a/static/css/style.css b/static/css/style.css
index de552f5..9f74131 100644
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -383,6 +383,30 @@ article .post-content {
padding-top: 10px;
}
+.page-content .block_color {
+ padding-right: 15px;
+ padding-left: 50px;
+ border-radius: 10px;
+ background-repeat: no-repeat;
+ background-size: 30px;
+ background-position: 10px 10px;
+}
+.page-content .block_red {
+ border: 1px dashed #b64f4f;
+ background-color: #2f2525;
+ background-image: url("/img/warning.svg");
+}
+.page-content .block_blue {
+ border: 1px dashed #3b5f72;
+ background-color: #24282f;
+ background-image: url("/img/info.svg");
+}
+.page-content .block_green {
+ border: 1px dashed #50a243;
+ background-color: #272f26;
+ background-image: url("/img/ok.svg");
+}
+
.page-content hr {
border: none;
width: 30px;
diff --git a/static/img/info.svg b/static/img/info.svg
new file mode 100644
index 0000000..47298ab
--- /dev/null
+++ b/static/img/info.svg
@@ -0,0 +1,71 @@
+
+
diff --git a/static/img/ok.svg b/static/img/ok.svg
new file mode 100644
index 0000000..094d879
--- /dev/null
+++ b/static/img/ok.svg
@@ -0,0 +1,71 @@
+
+
diff --git a/static/img/warning.svg b/static/img/warning.svg
new file mode 100644
index 0000000..392587a
--- /dev/null
+++ b/static/img/warning.svg
@@ -0,0 +1,71 @@
+
+