[Events] readability improvement, banner spacing

build_pages.py

@@ -36,7 +36,7 @@ def main():
                 f.write(html)
                 f.close()
             with open(f'pages/en/{page["name"]}.html') as f:
-                pageHtml = "<div><img src='/img/students_bug.jpg' alt='Students found the bug' /></div>"
+                pageHtml = "<div class='cover-wrap'><img src='/img/students_bug.jpg' alt='Students found the bug' /></div>"
                 pageHtml += f.read()
                 html = buildPage(page['name'], page['titleEN'], pageHtml, page['style'], templateEN)
                 f = open(f'site/en/{page["name"]}.html', 'w')

site/styles/events.css

@@ -23,8 +23,8 @@
 }
 
 .date {
-  width: 250px;
-  font-size: 0.9em;
+  width: 220px;
+  font-size: 0.75em;
   overflow-x: hidden;
   white-space: nowrap;
 }
@@ -32,24 +32,32 @@
 .title {
   border-left: 2px solid var(--border);
   font-weight: bold;
-  padding-left: 1rem;
+  padding-left: 2rem;
   padding-right: 0.5em;
 }
 
 .place {
-  font-size: 0.9em;
+  font-size: 0.7em;
+  opacity: 0.7;
+  &:before {
+    content: "-";
+    margin-right: 12px;
+  }
 }
 
 .types {
-  font-size: 0.9em;
+  font-size: 0.8em;
   margin-left: auto;
   font-style: italic;
+  letter-spacing: 2px;
+  font-weight: 900;
+  opacity: 0.7;
 }
 
 @media screen and (max-width: 1160px) {
   .event {
     flex-direction: column;
-    margin-bottom: 1rem;
+    margin-bottom: 2.2rem;
     border-left: 3px solid var(--border);
     &:hover {
       border-bottom: none;
@@ -71,6 +79,9 @@
   .title {
     border-left: none;
   }
+  .place:before {
+    display: none;
+  }
 
   .types {
     margin-left: 0;