Band-aid formatting on events listing page

Since we allow markdown, we need to somewhat constrain what it looks
like on the site, so we don't end up with events that have headlines
that are bigger than the actual page headlines.

We can probably do something cleaner for this, but this will do as a
start.

diff --git a/media/css/main.css b/media/css/main.css
index 6fc354630de8132a07c14fe34019c745fe6d7410..a4e10556d59b8193c7628c33eaf03290ae8614cb 100644 (file)
--- a/media/css/main.css
+++ b/media/css/main.css
@@ -612,6 +612,23 @@ pre.code {
     border-radius: .25rem;
 }
 
+/* News and events getting markdown from end users */
+#pgContentWrap .newseventwrap h1 {
+    font-size: 1.2em;
+}
+#pgContentWrap .newseventwrap h2 {
+    display: block;
+    font-size: 1.1em;
+}
+#pgContentWrap .newseventwrap h3 {
+    font-size: 1.0em;
+}
+hr.eventseparator {
+    width: 80%;
+    margin-bottom: 1em;
+}
+
+
 /* #STYLEDSELECT */
 
 /**

diff --git a/templates/events/archive.html b/templates/events/archive.html
index 993ba17e713b11a62dc0afd2c1779e3d17881935..1959c65b4c1cffd93dd2fb0e53d97372129d4331 100644 (file)
--- a/templates/events/archive.html
+++ b/templates/events/archive.html
@@ -18,6 +18,7 @@ whatsoever.</em>
 </p>
 {% endif %}
 {%for event in eventblock.events %}
+<hr class="eventseparator">
 <div>
   {% if event.badged %}
     <img src="/media/img/PostgreSQL_Badge1.svg" class="community" alt="PostgreSQL Community Event">
@@ -27,7 +28,7 @@ whatsoever.</em>
 <div>Date: <strong>{{event.displaydate|safe}}</strong></div>
 <div>Location: <strong>{{event.locationstring}}</strong></div>
 {%if event.language%}<div>Language: <strong>{{event.language}}</strong></div>{%endif%}
-<div>
+<div class="newseventwrap">
 {{event.summary|markdown}}
 </div>
 {%endfor%}