diff --git a/bookwyrm/static/css/bookwyrm.css b/bookwyrm/static/css/bookwyrm.css
index ae4d53d6..8c4acc86 100644
--- a/bookwyrm/static/css/bookwyrm.css
+++ b/bookwyrm/static/css/bookwyrm.css
@@ -194,27 +194,43 @@ html {
min-height: 96px;
}
-/** Quotes
+/** Statuses: Quotes
+ *
+ * \e906: icon-quote-open
+ * \e905: icon-quote-close
+ *
+ * The `content` class on the blockquote allows to apply styles to markdown
+ * generated HTML in the quote: https://bulma.io/documentation/elements/content/
+ *
+ * ```html
+ *
+ *
+ * User generated quote in markdown…
+ *
+ *
+ *
— Book Title by Author
+ *
+ * ```
******************************************************************************/
-.quote blockquote {
+.quote > blockquote {
position: relative;
padding-left: 2em;
}
-.quote blockquote::before,
-.quote blockquote::after {
+.quote > blockquote::before,
+.quote > blockquote::after {
font-family: 'icomoon';
position: absolute;
}
-.quote blockquote::before {
+.quote > blockquote::before {
content: "\e906";
top: 0;
left: 0;
}
-.quote blockquote::after {
+.quote > blockquote::after {
content: "\e905";
right: 0;
}
diff --git a/bookwyrm/templates/snippets/status/status_content.html b/bookwyrm/templates/snippets/status/status_content.html
index df562c48..94c420cb 100644
--- a/bookwyrm/templates/snippets/status/status_content.html
+++ b/bookwyrm/templates/snippets/status/status_content.html
@@ -28,7 +28,7 @@
{% if status.quote %}
-
{{ status.quote | safe }}
+
{{ status.quote | safe }}
— {% include 'snippets/book_titleby.html' with book=status.book %}