index.ejs

<% layout("/layouts/boilerplate") %>

    <h3>All Listings</h3>
    <!-- <form method="GET" action="/listings/new">
        <button type="submit">Create New Listing</button>
    </form> -->

   <div class="row row-cols-lg-3 row-cols-md-2 row-cols-sm-1">
        <% for (let listing of allListings) { %>
            <a href="/listings/<%=listing._id %>" class="listing-link"> 
            <div class="card col" >
                <img src="<%= listing.image.url %>" class="card-img-top" alt="listing_image"style="height: 20rem"/>
                <div class="card-image-overlay"></div>
                <div class="card-body">
                    <p class="card-text">
                       <b> <%= listing.title %> <br></b>
                        <%= listing.price %> / night
                    </p>
                </div>
            </div>
        </a>
        <% } %>
   </div>