Event List Page List Layout

Use this code to Code Injection > Footer

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
  $('.eventlist-event').each(function() {
    var eventitle = $(this).find('h1.eventlist-title');
    var eventmeta = $(this).find('ul.eventlist-meta.event-meta')
   $(eventmeta).appendTo(eventitle);
  });
});
</script>
<style>
  @media screen and (min-width:768px) {
a.eventlist-column-thumbnail.content-fill {
    display: none;
}
  .eventlist-column-info {
    width: 100% !important;
}
    /* title - metadata */
h1.eventlist-title {
    float: left !important;
    width: 40% !important;
    margin-right: 3% !important;
}
    /* excerpt */
    .eventlist-excerpt {
    float: left;
    width:40%;
}
    .eventlist-event {
    border-bottom: 1px solid gray;
}
  }
</style>

Result