diff --git a/_includes/alert b/_includes/alert
new file mode 100644
index 0000000..4921b82
--- /dev/null
+++ b/_includes/alert
@@ -0,0 +1,33 @@
+{% comment %}
+*
+* This include lets you easily display an alert.
+* To use the include no `.html` ending is necessary.
+* You can use five different kinds of alerts:
+*
+* - warning
+* - info
+* - success
+* - alert
+* - text
+*
+* You can even use -tags inside the alert. Beware:
+* Use " and ' properly.
+*
+* Example: {% include alert info='Show an info alert with outstanding information' %}
+*
+{% endcomment %}
+
+
+{% if include.warning %}
+{{ include.warning }}
+{% elsif include.info %}
+{{ include.info }}
+{% elsif include.success %}
+{{ include.success }}
+{% elsif include.alert %}
+{{ include.alert }}
+{% elsif include.text %}
+{{ include.text }}
+{% elsif include.terminal %}
+{{ include.terminal }}
+{% endif %}
diff --git a/_sass/_02_settings_colors.scss b/_sass/_02_settings_colors.scss
index dbd0cae..14afb80 100644
--- a/_sass/_02_settings_colors.scss
+++ b/_sass/_02_settings_colors.scss
@@ -30,7 +30,7 @@ $secondary-color: $ci-6;
$alert-color: $ci-5;
$success-color: $ci-6;
$warning-color: $ci-4;
-$info-color: $ci-2;
+$info-color: $ci-1;
diff --git a/_sass/_09_elements.scss b/_sass/_09_elements.scss
index 3e3fa1b..1039426 100644
--- a/_sass/_09_elements.scss
+++ b/_sass/_09_elements.scss
@@ -58,9 +58,15 @@
border-bottom: 1px solid #fff;
}
.alert-box.terminal {
- background: $grey-16;
+ background: $grey-12;
color: #fff;
- border-color: scale-color($grey-16, $lightness: -14%);
+ border-color: scale-color($grey-12, $lightness: -14%);
+ }
+ .alert-box.text {
+ background-color: $grey-2;
+ text-shadow: 0px 0px 0px rgba(0,0,0,0.9);
+ border-color: scale-color($grey-2, $lightness: -14%);
+ color: $grey-12;
}
.breadcrumbs>.current {
diff --git a/pages/documentation.md b/pages/documentation.md
index 03c1d2a..f5b81ba 100644
--- a/pages/documentation.md
+++ b/pages/documentation.md
@@ -250,6 +250,43 @@ If your content is on Jekyll you can use this include to automatically generate
~~~
+### list-collection.html
+
+This include lets you loop through a collection to list all entries in that collection. If you set »published: false« in front matter of a collection page the page gots filtered out via unless. The following example loops through a collection called *wordpress*.
+
+~~~
+{% raw %}{% include list-collection.html collection='wordpress' %}{% endraw %}
+~~~
+
+
+### alert – Embed an alert in your content
+
+This include lets you easily display an alert. To use the include no `.html` ending is necessary. You can use five different kinds of alerts: `warning`, `info`, `success`, `alert` and `text`.
+
+~~~
+{% raw %}{% include alert warning='This is a warning.' %}
+{% include alert info='An info box.' %}
+{% include alert success='Yeah, you made it!' %}
+{% include alert alert='Danger!' %}
+{% include alert terminal='$ jekyll -serve' %}
+{% include alert text='Just a note!' %}{% endraw %}
+~~~
+
+{% include alert warning='This is a warning.' %}
+{% include alert info='An info box.' %}
+{% include alert success='Yeah, you made it!' %}
+{% include alert alert='Danger!' %}
+{% include alert terminal='$ jekyll -serve' %}
+{% include alert text='Just a note!' %}
+
+You can even use ``-tags inside the alert. Beware: Use " and ' properly.
+
+~~~
+{% raw %}{% include alert info='Feeling Responsive is listed on http://jekyllthemes.org' %}{% endraw %}
+~~~
+
+{% include alert info='Feeling Responsive is listed on http://jekyllthemes.org' %}
+
[Up to table of contents](#toc)
{: .text-right }