박종현

Update design

......@@ -2,42 +2,66 @@
margin: 0 auto;
width: 500px;
height: 500px;
border: 15px solid rgb(158, 111, 170);
border: 15px solid rgb(163, 151, 198);
border-radius: 50%;
}
.dday {
padding: 50px 0;
padding: 20px 0;
}
.wrapper {
margin: 0 auto;
padding: 30px;
padding: 20px;
max-width: 1170px;
}
.dDayFont {
font-size: 650%;
}
h1 {
font-size: 40px;
color : rgb(180, 74, 102);
font-size: 80px;
color : rgb(241, 49, 38);
font-family: 'Gowun Dodum', sans-serif;
}
h2 {
color :rgb(2, 2, 2);
color :white;
font-weight: lighter;
font-family: 'Gowun Dodum', sans-serif;
}
h3 {
font-size: 50px;
color : rgb(241, 49, 38);
font-family: 'Gowun Dodum', sans-serif;
}
#title {
color: rgb(191, 185, 211);
font-size: 50px;
font-family: 'Jeju Hallasan';
font-family: 'Tiro Devanagari Marathi', serif;
font-weight: 600;
}
#activity {
width:fit-content;
width:1000px;
height:fit-content;
border-radius: 40px 80px / 80px 40px;
border-radius: 10p 10px / 10px 10px;
background-color: rgba(197, 97, 201, 0.486);
}
body {
background: linear-gradient(rgb(255, 255, 255), rgb(255, 228, 250), rgb(254, 210, 255));
}
\ No newline at end of file
margin-top: 100px;
margin-bottom: 100px;
margin-left: 50px;
margin-right: 50px;
background-color: rgb(78, 76, 76);
}
#background{
width : 80%;
height : 80%;
border: 15px solid rgb(229, 220, 231);
border-radius : 30px 30px / 30px 30px;
}
.box {
margin : 50px;
padding : 20px;
border : 1px solid rgb(248, 239, 249);
border-radius : 20px;
background-color: rgb(255, 255, 255);
}
......
......@@ -11,6 +11,7 @@ var year = "2022";
var month = "09";
var operation = "getHoliDeInfo";
// Do not modify the values
var SERVEICE_KEY =
"qBtJy2Prw8CCnAiijUM7VkuaA9MZozHuiQI4FbEGYdUDPz4%2FM%2FuxegGjNBWK0aWQHvSslVHwIZQwNWh57WgRTA%3D%3D";
......@@ -26,6 +27,7 @@ var dateName = [];
var locdate = [];
var tempArr = [];
// To run EJS engine
app.set("views", __dirname + "/views");
app.set("view engine", "ejs");
......
......@@ -14,21 +14,21 @@
</head>
<center>
<body>
<div id="title">공휴일 카운터</div>
<div id="title">When Is Next Holiday?</div>
<br><br>
<div class="wrapper">
<div class="circle">
<p class="dday">
<span>
<h2>오늘로부터 가장 가까운 휴일은</h2>
<h1>[<%= data[0] %>]</h1>
<h2>오늘로부터 가장 가까운 공휴일은</h2>
<h2> <%= data[1][0] %><%= data[1][1] %><%= data[1][2] %><%= data[1][3] %>/<%= data[1][4] %><%= data[1][5] %>/<%= data[1][6] %><%= data[1][7] %></h2>
<h3>[<%= data[0] %>]</h3>
<h1>D - <%= data[2] %></h1>
<h2><%= data[0] %>의 날짜 : <%= data[1] %></h2>
</span>
</span>
</p>
</div>
</div>
<h2> <%= data[0] %> 에 추천하는 활동 목록입니다.</h2> <!--recommend activity 추가파트 시작-->
<h2> [<%= data[0] %>] 추천 활동</h2> <!--recommend activity 추가파트 시작-->
<div id="activity">
<% if (data[1] == '20220601') { %>
......