신동해

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 @@
"body-parser": "^1.19.0",
"ejs": "^3.1.6",
"express": "^4.17.1",
"mongodb": "^3.6.4"
"mongodb": "^3.7.3",
"mongoose": "^5.13.13",
"request": "^2.88.2"
}
}
......
#wrapper{
border: 1px solid #7e8377;
width: 1400px;
padding: 50px;
position: absolute;
top: 150px;
left: 50%;
margin-left: -700px;
}
#진보{
border: 1px solid #2f00ff;
width: 600px;
float: left;
padding: 10px;
}
#보수{
border: 1px solid #ff0000;
width: 600px;
float: left;
padding: 10px;
margin-left: 95px;
}
\ No newline at end of file
......@@ -9,22 +9,21 @@
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/css/bootstrap.min.css" integrity="sha384-zCbKRCUGaJDkqS1kPbPd7TveP5iyJE0EjAuZQTgFLD2ylzuqKfdKlfG/eSrtxUkn" crossorigin="anonymous">
<title>Hello, world!</title>
<title>OPPOV</title>
</head>
<body>
<%- include('nav.html') %>
<!-- 메인페이지 대문 -->
<div class="container mt-4" style="padding: 180px 140px 180px 140px;">
<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;"/>
<form action="/add" method="GET">
<div class="input-group mb-3">
<input type="text" class="form-control" placeholder="주제 검색" aria-label="주제 검색" aria-describedby="button-addon2">
<input type="text" class="form-control" placeholder="주제 검색" aria-label="주제 검색" aria-describedby="button-addon2" name = "subject">
<div class="input-group-append">
<button class="btn btn-outline-secondary" type="button" id="button-addon2">검색</button>
</div>
</div>
</form>
</div>
<!-- Optional JavaScript; choose one of the two! -->
......
......@@ -8,59 +8,44 @@
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/css/bootstrap.min.css" integrity="sha384-zCbKRCUGaJDkqS1kPbPd7TveP5iyJE0EjAuZQTgFLD2ylzuqKfdKlfG/eSrtxUkn" crossorigin="anonymous">
<!-- custom CSS -->
<link rel="stylesheet" href="../public/main.css">
</head>
<body>
<div class="container mt-4">
<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;"/>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<a class="navbar-brand" href="#">Todo App</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item active">
<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item"
<a class="nav-link" href="#">Write</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">임시</a>
</li>
</ul>
<div class="input-group mb-3">
<input type="text" class="form-control" placeholder="주제 검색" aria-label="주제 검색" aria-describedby="button-addon2">
<div class="input-group-append">
<button class="btn btn-outline-secondary" type="button" id="button-addon2">검색</button>
</div>
</div>
</div>
</nav>
<h4 class="ml-2 my-3">서버에서 가져온 할 일 리스트</h4>
<ul class="list-group">
<% for (var i = 0; i < posts.length; i++){ %>
<li class="list-group-item">
<h4>할 일 제목 : <%= posts[i].제목 %></h4>
<p>할일 마감날짜 : <%= posts[i].날짜 %></p>
<button>삭제</button>
</li>
<% } %>
</ul>
<script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.min.js"></script>
<script>
$.ajax({
method : 'DELETE',
url : '/delete',
data : {_id : 1} // 요청보낼 때 삭제할 게시물 번호 함께 전송
}).done(function(결과){
// 요청이 성공하면 실행할 것들
})
</script>
<div id="wrapper">
<div id = "진보" >
<h4 style = "text-align: center; color:blue; font-weight:bold;">진보</h4>
<h3 style="text-align:center;">
<iframe src="http://localhost:8080/result/progress" width="550" height="600" marginwidth="0" frameborder="2" scrolling="yes">
</iframe>
</h3>
</div>
<div id = "보수">
<h4 style = "text-align: center; color:red; font-weight:bold;">보수</h4>
<h3 style="text-align:center;">
<iframe src="http://localhost:8080/result/liberal" width="550" height="600" marginwidth="0" frameborder="2" scrolling="yes">
</iframe>
</h3>
</div>
</div>
<!-- Optional JavaScript; choose one of the two! -->
<!-- Option 1: jQuery and Bootstrap Bundle (includes Popper) -->
<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>
<script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.min.js"></script>
<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>
<!-- Option 2: Separate Popper and Bootstrap JS -->
......