X-Git-Url: http://aleph1.co.uk/gitweb/?a=blobdiff_plain;ds=sidebyside;f=web%2Fcore%2Fmodules%2Ffilter%2Fcss%2Ffilter.caption.css;fp=web%2Fcore%2Fmodules%2Ffilter%2Fcss%2Ffilter.caption.css;h=c436f1bdb54b415942e1ffba137921bbdda5b4c9;hb=a2bd1bf0c2c1f1a17d188f4dc0726a45494cefae;hp=0000000000000000000000000000000000000000;hpb=57c063afa3f66b07c4bbddc2d6129a96d90f0aad;p=yaffs-website

diff --git a/web/core/modules/filter/css/filter.caption.css b/web/core/modules/filter/css/filter.caption.css
new file mode 100644
index 000000000..c436f1bdb
--- /dev/null
+++ b/web/core/modules/filter/css/filter.caption.css
@@ -0,0 +1,30 @@
+/**
+ * @file
+ * Caption filter: default styling for displaying image captions.
+ */
+
+/**
+ * Essentials, based on http://stackoverflow.com/a/13363408.
+ */
+.caption {
+  display: table;
+}
+.caption > * {
+  display: block;
+  max-width: 100%;
+}
+.caption > figcaption {
+  display: table-caption;
+  caption-side: bottom;
+  max-width: none;
+}
+
+/**
+ * While editing and whenever the caption is empty, show a placeholder.
+ *
+ * Based on http://codepen.io/flesler/pen/AEIFc.
+ */
+.caption > figcaption[contenteditable=true]:empty:before {
+  content: attr(data-placeholder);
+  font-style: italic;
+}