신동해

Add main.css, Update index.ejs, Update list.ejs : apply (front) 2.검색결과페이지.png

This diff is collapsed. Click to expand it.
...@@ -16,6 +16,8 @@ ...@@ -16,6 +16,8 @@
16 "body-parser": "^1.19.0", 16 "body-parser": "^1.19.0",
17 "ejs": "^3.1.6", 17 "ejs": "^3.1.6",
18 "express": "^4.17.1", 18 "express": "^4.17.1",
19 - "mongodb": "^3.6.4" 19 + "mongodb": "^3.7.3",
20 + "mongoose": "^5.13.13",
21 + "request": "^2.88.2"
20 } 22 }
21 } 23 }
......
1 +#wrapper{
2 + border: 1px solid #7e8377;
3 + width: 1400px;
4 + padding: 50px;
5 + position: absolute;
6 + top: 150px;
7 + left: 50%;
8 + margin-left: -700px;
9 +}
10 +
11 +#진보{
12 + border: 1px solid #2f00ff;
13 + width: 600px;
14 + float: left;
15 + padding: 10px;
16 +}
17 +
18 +#보수{
19 + border: 1px solid #ff0000;
20 + width: 600px;
21 + float: left;
22 + padding: 10px;
23 + margin-left: 95px;
24 +}
...\ No newline at end of file ...\ No newline at end of file
...@@ -9,22 +9,21 @@ ...@@ -9,22 +9,21 @@
9 <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous"> 9 <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
10 <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/css/bootstrap.min.css" integrity="sha384-zCbKRCUGaJDkqS1kPbPd7TveP5iyJE0EjAuZQTgFLD2ylzuqKfdKlfG/eSrtxUkn" crossorigin="anonymous"> 10 <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/css/bootstrap.min.css" integrity="sha384-zCbKRCUGaJDkqS1kPbPd7TveP5iyJE0EjAuZQTgFLD2ylzuqKfdKlfG/eSrtxUkn" crossorigin="anonymous">
11 11
12 - <title>Hello, world!</title> 12 + <title>OPPOV</title>
13 </head> 13 </head>
14 <body> 14 <body>
15 15
16 - <%- include('nav.html') %>
17 -
18 <!-- 메인페이지 대문 --> 16 <!-- 메인페이지 대문 -->
19 <div class="container mt-4" style="padding: 180px 140px 180px 140px;"> 17 <div class="container mt-4" style="padding: 180px 140px 180px 140px;">
20 <img src="http://khuhub.khu.ac.kr/2018110651/Omniscient-Public-Point-Of-View/uploads/2d3e5b183ab5955354c9188aafc18085/main.png" alt="main" style="display: block; margin:0 auto; top:50px;"/> 18 <img src="http://khuhub.khu.ac.kr/2018110651/Omniscient-Public-Point-Of-View/uploads/2d3e5b183ab5955354c9188aafc18085/main.png" alt="main" style="display: block; margin:0 auto; top:50px;"/>
21 - 19 + <form action="/add" method="GET">
22 <div class="input-group mb-3"> 20 <div class="input-group mb-3">
23 - <input type="text" class="form-control" placeholder="주제 검색" aria-label="주제 검색" aria-describedby="button-addon2"> 21 + <input type="text" class="form-control" placeholder="주제 검색" aria-label="주제 검색" aria-describedby="button-addon2" name = "subject">
24 <div class="input-group-append"> 22 <div class="input-group-append">
25 <button class="btn btn-outline-secondary" type="button" id="button-addon2">검색</button> 23 <button class="btn btn-outline-secondary" type="button" id="button-addon2">검색</button>
26 </div> 24 </div>
27 </div> 25 </div>
26 + </form>
28 </div> 27 </div>
29 28
30 <!-- Optional JavaScript; choose one of the two! --> 29 <!-- Optional JavaScript; choose one of the two! -->
......
...@@ -8,59 +8,44 @@ ...@@ -8,59 +8,44 @@
8 <!-- Bootstrap CSS --> 8 <!-- Bootstrap CSS -->
9 <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/css/bootstrap.min.css" integrity="sha384-zCbKRCUGaJDkqS1kPbPd7TveP5iyJE0EjAuZQTgFLD2ylzuqKfdKlfG/eSrtxUkn" crossorigin="anonymous"> 9 <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/css/bootstrap.min.css" integrity="sha384-zCbKRCUGaJDkqS1kPbPd7TveP5iyJE0EjAuZQTgFLD2ylzuqKfdKlfG/eSrtxUkn" crossorigin="anonymous">
10 10
11 + <!-- custom CSS -->
12 + <link rel="stylesheet" href="../public/main.css">
11 13
12 </head> 14 </head>
13 <body> 15 <body>
16 + <div class="container mt-4">
17 + <img src="http://khuhub.khu.ac.kr/2018110651/Omniscient-Public-Point-Of-View/uploads/ac497e63ac70607366c72d9f92c12c81/word.png" alt="main" style="display: block; margin:0 auto; top:50px;"/>
14 18
15 - <nav class="navbar navbar-expand-lg navbar-light bg-light"> 19 + <div class="input-group mb-3">
16 - <a class="navbar-brand" href="#">Todo App</a> 20 + <input type="text" class="form-control" placeholder="주제 검색" aria-label="주제 검색" aria-describedby="button-addon2">
17 - <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation"> 21 + <div class="input-group-append">
18 - <span class="navbar-toggler-icon"></span> 22 + <button class="btn btn-outline-secondary" type="button" id="button-addon2">검색</button>
19 - </button> 23 + </div>
20 - <div class="collapse navbar-collapse" id="navbarNav"> 24 + </div>
21 - <ul class="navbar-nav">
22 - <li class="nav-item active">
23 - <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
24 - </li>
25 - <li class="nav-item"
26 - <a class="nav-link" href="#">Write</a>
27 - </li>
28 - <li class="nav-item">
29 - <a class="nav-link" href="#">임시</a>
30 - </li>
31 - </ul>
32 </div> 25 </div>
33 - </nav>
34 - <h4 class="ml-2 my-3">서버에서 가져온 할 일 리스트</h4>
35 - <ul class="list-group">
36 - <% for (var i = 0; i < posts.length; i++){ %>
37 - <li class="list-group-item">
38 - <h4>할 일 제목 : <%= posts[i].제목 %></h4>
39 - <p>할일 마감날짜 : <%= posts[i].날짜 %></p>
40 - <button>삭제</button>
41 - </li>
42 - <% } %>
43 - </ul>
44 -
45 - <script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.min.js"></script>
46 - <script>
47 -
48 - $.ajax({
49 - method : 'DELETE',
50 - url : '/delete',
51 - data : {_id : 1} // 요청보낼 때 삭제할 게시물 번호 함께 전송
52 - }).done(function(결과){
53 - // 요청이 성공하면 실행할 것들
54 - })
55 -
56 - </script>
57 26
27 + <div id="wrapper">
28 + <div id = "진보" >
29 + <h4 style = "text-align: center; color:blue; font-weight:bold;">진보</h4>
30 + <h3 style="text-align:center;">
31 + <iframe src="http://localhost:8080/result/progress" width="550" height="600" marginwidth="0" frameborder="2" scrolling="yes">
32 + </iframe>
33 + </h3>
34 + </div>
35 + <div id = "보수">
36 + <h4 style = "text-align: center; color:red; font-weight:bold;">보수</h4>
37 + <h3 style="text-align:center;">
38 + <iframe src="http://localhost:8080/result/liberal" width="550" height="600" marginwidth="0" frameborder="2" scrolling="yes">
39 + </iframe>
40 + </h3>
41 + </div>
42 + </div>
58 43
59 44
60 <!-- Optional JavaScript; choose one of the two! --> 45 <!-- Optional JavaScript; choose one of the two! -->
61 46
62 <!-- Option 1: jQuery and Bootstrap Bundle (includes Popper) --> 47 <!-- Option 1: jQuery and Bootstrap Bundle (includes Popper) -->
63 - <script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script> 48 + <script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.min.js"></script>
64 <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/js/bootstrap.bundle.min.js" integrity="sha384-fQybjgWLrvvRgtW6bFlB7jaZrFsaBXjsOMm/tB9LTS58ONXgqbR9W8oWht/amnpF" crossorigin="anonymous"></script> 49 <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/js/bootstrap.bundle.min.js" integrity="sha384-fQybjgWLrvvRgtW6bFlB7jaZrFsaBXjsOMm/tB9LTS58ONXgqbR9W8oWht/amnpF" crossorigin="anonymous"></script>
65 50
66 <!-- Option 2: Separate Popper and Bootstrap JS --> 51 <!-- Option 2: Separate Popper and Bootstrap JS -->
......