otherUser.ejs 2.99 KB
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Document</title>
    <link
      href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css"
      rel="stylesheet"
    />
    <link rel="icon" type="image/x-icon" href="assets/favicon.ico" />
    <!-- Font Awesome icons (free version)-->
    <script
      src="https://use.fontawesome.com/releases/v5.15.4/js/all.js"
      crossorigin="anonymous"
    ></script>
    <!-- Simple line icons-->
    <link
      href="https://cdnjs.cloudflare.com/ajax/libs/simple-line-icons/2.5.5/css/simple-line-icons.min.css"
      rel="stylesheet"
    />
    <!-- Google fonts-->
    <link
      href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,700,300italic,400italic,700italic"
      rel="stylesheet"
      type="text/css"
    />
    <link rel="preconnect" href="https://fonts.googleapis.com" />
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    <link
      href="https://fonts.googleapis.com/css2?family=Corinthia:wght@700&family=Jua&family=Anton&family=Fuzzy+Bubbles:wght@700&display=swap"
      rel="stylesheet"
    />
    <link rel="stylesheet" href="/stylesheets/styles.css" />
    <style>
      .title-fontA {
        font-family: 'Fuzzy Bubbles', cursive;
      }
      .title-fontB {
        font-family: 'Anton', sans-serif;
      }
      .noneuser {
        font-family: 'Jua', sans-serif;
      }
    </style>
  </head>
  <body>
    <div class="navbar navbar-expand-lg navbar-light bgtop">
      <div class="container text-center mx-4 my-1">
        <a class="navbar-brand title-fontA" href="/daySelect">Health Assistant</a>
      </div>
      <div class="mx-3">
        <a class="otherUser title-fontB" href="/otherUser">OTHER</a>
      </div>
      <div class="mx-3">
        <a class="otherUser title-fontB" href="/myHealth">MY</a>
      </div>
      <div class="mx-3">
        <a class="otherUser title-fontB" href="/auth/logout/kakao">LOGOUT</a>
      </div>
    </div>
    <div class="container">
      <% if(userlist.length ==0) { %>
        <div class="mt-5 text-center noneuser">
        <h1>비슷한 체형의 사용자가 없습니다!</h1>
      </div>
        <% } else { %>
      <div class="row row-cols-1 row-cols-md-4 g-4 mt-4">
        
          <% for(let i =0; i <userlist.length; i++) { %>
              <div class="col">
          <a href="/otherUser/show/<%= userlist[i].username %>">
            <div class="card" style="width: 75%">
              <div class="card-body">
                <h5 class="card-title text-center">
                  <%= userlist[i].username[0] %>**
                </h5>
                <p class="card-text"></p>
                <p><%= userlist[i].userHeight %></p>
                <p><%= userlist[i].userWeight %></p>
              </div>
            </div>
          </a>
        </div>
         <% }} %>
         
      </div>
    </div>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
  </body>
</html>