<%- include('header.ejs') %>

<main>
    <button id="agreebutton">agree notification</button>
    
    <h2>Welcome to Plant Parents!</h2>
    <p>Find the specific plant for your environment, less chances of dying, more happy plants and people</p>

    <section>
        <h3>Recent uploads</h3>
        <ul id="plantinfocard">
            <li><%- mostRecentPlant.planttype %></li>
            <li><img src="/uploadedplantimg/<%= mostRecentPlant.plantimg.filename %>" alt="<%= mostRecentPlant.plantimg.originalname %>"></li>
            <li>
                <% if(mostRecentPlant.sunlight == 0 || mostRecentPlant.sunlight == 1) { %> 
                    <img src="/img/icons/shadow.svg" alt="shadow">
                    fullshadow

                <% } else if(mostRecentPlant.sunlight == 2) { %>
                    <img src="/img/icons/halfshadowsun.svg" alt="half shadow half sun">
                    halfshadow

                <% } else if(mostRecentPlant.sunlight == 3 || mostRecentPlant.sunlight == 4) { %>
                    <img src="/img/icons/sun.svg" alt="fullsun">
                    fullsun
                    
                    <% } %>
            </li>
            <li>
                <% if(mostRecentPlant.water == 0 || mostRecentPlant.water == 1) { %> 
                    <img src="/img/icons/singledrop.svg" alt="shadow">
                    1x per week

                <% } else if(mostRecentPlant.water == 2) { %>
                    <img src="/img/icons/doubledrop.svg" alt="half shadow half sun">
                   2x per week

                <% } else if(mostRecentPlant.water == 3 || mostRecentPlant.water == 4) { %>
                    <img src="/img/icons/triodrop.svg" alt="fullsun">
                    3x per week
                    
                    <% } %>
            </li>
            <li>
                <img src="/img/icons/skilllevel.svg" alt="skill-level">
                <%- mostRecentPlant.carelevel %>
            </li>

        </ul>
        
        <a href="/feed" id="feedbutton" >Discover all plants!</a>
    </section>

    <q></q>

</main>

<%- include('footer.ejs') %>