<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Housepin</title>
    <meta charset="utf-8" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1, shrink-to-fit=no"
    />

    <link
      href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap"
      rel="stylesheet"
    />

    <link
      rel="stylesheet"
      href="<%- baseUrl %>/css/open-iconic-bootstrap.min.css"
    />
    <link rel="stylesheet" href="<%- baseUrl %>/css/animate.css" />
    <link
      rel="icon"
      type="image/x-icon"
      href="<%- baseUrl %>/images/favicon.png"
    />

    <link rel="stylesheet" href="<%- baseUrl %>/css/owl.carousel.min.css" />
    <link
      rel="stylesheet"
      href="<%- baseUrl %>/css/owl.theme.default.min.css"
    />
    <link rel="stylesheet" href="<%- baseUrl %>/css/magnific-popup.css" />

    <link rel="stylesheet" href="<%- baseUrl %>/css/aos.css" />

    <link rel="stylesheet" href="<%- baseUrl %>/css/ionicons.min.css" />

    <link rel="stylesheet" href="<%- baseUrl %>/css/bootstrap-datepicker.css" />
    <link rel="stylesheet" href="<%- baseUrl %>/css/jquery.timepicker.css" />

    <link rel="stylesheet" href="<%- baseUrl %>/css/flaticon.css" />
    <link rel="stylesheet" href="<%- baseUrl %>/css/icomoon.css" />
    <link rel="stylesheet" href="<%- baseUrl %>/css/style.css" />
    <link
      rel="stylesheet"
      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css"
      integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA=="
      crossorigin="anonymous"
      referrerpolicy="no-referrer"
    />
    <style>
      @media screen and (max-width: 991.98px) {
        .ftco-navbar-light {
          background: white !important;
        }
        .navbar-brand {
          color: black !important;
        }
        .nav-link {
          color: black !important;
        }
        .ftco-navbar-light .navbar-toggler {
          color: black !important;
        }
      }
    </style>
  </head>
  <body>
    <nav
      class="navbar navbar-expand-lg navbar-dark ftco_navbar bg-dark ftco-navbar-light"
      id="ftco-navbar"
    >
      <div class="container">
        <div class="logobox">
          <img
            src="<%- baseUrl %>/images/logo.png"
            style="height: 20px; width: 29px"
            alt=""
          /><a class="navbar-brand" href="/">Housepin</a>
        </div>

        <button
          class="navbar-toggler"
          type="button"
          data-toggle="collapse"
          data-target="#ftco-nav"
          aria-controls="ftco-nav"
          aria-expanded="false"
          aria-label="Toggle navigation"
        >
          <span class="oi oi-menu"></span> Menu
        </button>

        <div class="collapse navbar-collapse" id="ftco-nav">
          <ul class="navbar-nav ml-auto">
            <li class="nav-item <% if(endPoint == ''){ %>active<% } %>">
              <a href="/" class="nav-link">Home</a>
            </li>

            <!-- <li class="nav-item <% if(endPoint == 'services'){ %>active<% } %>">
              <a href="/services" class="nav-link">Services</a>
            </li> -->
            <!-- <li class="nav-item <% if(endPoint == 'agents'){ %>active<% } %>">
              <a href="/agents" class="nav-link">Agent</a>
            </li> -->
            <li
              class="nav-item <% if(endPoint == 'properties'){ %>active<% } %>"
            >
              <a href="/properties" class="nav-link">Listing</a>
            </li>
            <li class="nav-item <% if(endPoint == 'faq'){ %>active<% } %>">
              <a href="/faq" class="nav-link">FAQ</a>
            </li>
            <li class="nav-item <% if(endPoint == 'contacts'){ %>active<% } %>">
              <a href="/contacts" class="nav-link">Contact Us</a>
            </li>
            <li class="nav-item <% if(endPoint == 'about'){ %>active<% } %>">
              <a href="/about" class="nav-link">About Us</a>
            </li>
            <li class="nav-item">
              <a href="<%- baseUrl %>/apk/housepin.apk" class="nav-link">Download Apk</a>
            </li>
            <% if(!user?.userName){ %>
            <li
              class="nav-item m-2 <% if(endPoint == 'contacts'){ %>active<% } %>"
            >
              <a
                href="/login"
                class="nav-link btn btn-primary py-2 px-3"
                style="color: white !important"
                >Login/Signup</a
              >
            </li>
            <% } %> <% if(user?.userName){ %>
            <li class="nav-item dropdown">
              <a
                class="nav-link dropdown-toggle"
                href="#"
                id="navbarDropdownMenuLink"
                role="button"
                data-toggle="dropdown"
                aria-haspopup="true"
                aria-expanded="false"
              >
                <img
                  src="<%- baseUrl %>/images/profile-image.png"
                  width="40"
                  height="40"
                  class="rounded-circle"
                />
              </a>
              <div
                class="dropdown-menu"
                aria-labelledby="navbarDropdownMenuLink"
              >
                <a class="dropdown-item" href="/profile">Profile</a>
                <a class="dropdown-item" href="/properties/add-property"
                  >Add Property</a
                >
                <a class="dropdown-item" href="/properties/my-properties"
                  >My Properties</a
                >
                <a class="dropdown-item" href="/bookmark">Bookmark</a>
                <a class="dropdown-item" href="/logout">Log Out</a>
              </div>
            </li>
            <% } %>
          </ul>
        </div>
      </div>
    </nav>
    <!-- END nav -->