Override some CSS classes from django-admin in the markdown previews

We don't want to use django style headlines and margins in the preview,
we want something that looks a bit more like the main site. It's not
going to be exact (e.g. the colors will still be wrong), but it will
be a lot closer than without this.

diff --git a/media/css/showdown_preview.css b/media/css/showdown_preview.css
index ba7a5dd9ff74fdc2fc02cd8409dda013000bcc49..9ea1299208c55865ba3e4c9e2a62c939168d2da2 100644 (file)
--- a/media/css/showdown_preview.css
+++ b/media/css/showdown_preview.css
@@ -10,3 +10,13 @@ div.markdownpreview p {
    padding-left: 0px !important;
 }
 
+/* Override some things from django admin interface */
+div.adminmarkdownpreview h2 {
+    background: none !important;
+    color: rgb(102, 102, 102) !important;
+    font-size: 22px !important;
+}
+
+div.adminmarkdownpreview ul,ol {
+   margin-left: 0px !important;
+}
\ No newline at end of file

diff --git a/media/js/showdown_preview.js b/media/js/showdown_preview.js
index 2a79c32a3041da46d37641f0ed9326d9355d59d8..7bda15f9ba81a898201ec25000cd20bb74f015d6 100644 (file)
--- a/media/js/showdown_preview.js
+++ b/media/js/showdown_preview.js
@@ -22,6 +22,7 @@ function attach_showdown_preview(objid, admin) {
                obj.style.marginRight = '10px';
                obj.style.width = newdiv.style.width = "400px";
                obj.style.height = newdiv.style.height = "200px";
+               newdiv.className = newdiv.className + ' adminmarkdownpreview';
        }
 
        obj.preview_div = newdiv;