Fix schedule rendering

src/Schedule.jsx

@@ -35,7 +35,8 @@ export default function Schedule({
     return (<>
         {isLoading && <>Loading... <progress value={loadingProgress} /></>}
         <div className="schedule">
-            {halls && <table style={{
+            {header && <>
+                <table style={{
                     textAlign: 'center',
                 }}>
                     <thead>
@@ -55,9 +56,11 @@ export default function Schedule({
                             {header.map(hall => <th key={hall.id}>{hall.name}</th>)}
                         </tr>
                     </tfoot>
-            </table>}
+                </table>
                 <div className="separator"/>
-            {tracks && <table style={{
+            </>}
+            {tracks && <>
+                <table style={{
                     textAlign: 'center',
                 }}>
                     <tbody>
@@ -70,7 +73,9 @@ export default function Schedule({
                             <td className={'schedule-'.concat(code)}>{name}</td>
                         </tr>)}
                     </tbody>
-            </table>}
+                </table>
+                <div className="separator" />
+            </>}
             {events && tracks && Object.entries(events).map(([eventId, event]) => <section key={eventId} id={'lecture-'.concat(eventId)}>
                 <p>
                     <strong>{event.title}</strong>
@@ -95,7 +100,7 @@ export default function Schedule({
                         <a href={event.feedback_url}>Submit feedback</a>
                     </strong>
                 </p>
-                <hr />
+                <div className="separator" />
             </section>)}
             {speakers && <>
                 <div>

src/Schedule.scss

@@ -1,5 +1,6 @@
 .schedule {
   table {
+    text-align: center;
     width: 100%;
     font-size: 0.8em;
     margin: 0 0 3em 0;