유희정

complete design

......@@ -22,6 +22,7 @@ router.get('/auth/google',passport.authenticate('google',{ session:false}));
router.get('/auth/google/callback',passport.authenticate('google',{
failureRedirect:'/'
}),function(req, res) {
googleLogin = true;
req.session.googleToken = req.user.accessToken;
if(!req.session.kakaoToken) return res.redirect('/');
else return res.redirect('/calendar');
......@@ -44,6 +45,7 @@ router.get("/kakao", passport.authenticate("kakao-login"));
router.get(
"/oauth/callback",
passport.authenticate("kakao-login",{failureRedirect:'/'}),function(req, res) {
kakaoLogin = true;
req.session.kakaoToken = req.user.accessToken;
if(!req.session.googleToken) return res.redirect('/');
else return res.redirect('/calendar');
......
......@@ -3,40 +3,51 @@
<head>
<link rel='stylesheet' href='/stylesheets/style.css' />
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Jua|Nanum+Brush+Script|Yeon+Sung&display=swap&subset=korean" >
<style>
#d{
background-color: none;
* {
font-weight: light;
-webkit-font-smoothing: antialiased;
font-family: 'Jua', sans-serif;
}
form input {
margin-top: 35px;
background-color: white;
border: 1px solid #772f9c;
line-height: 1;
font-size: 17px;
width: 65%;
padding:10px 15px;
display: block;
line-height: 0;
font-size: 20px;
display: inline-block;
box-sizing: border-box;
padding: 20px 15px;
border-radius: 60px;
color: #772f9c;
font-weight: 100;
letter-spacing: 0.01em;
position: relative;
z-index: 1;
margin-left: 100px;
align-self: flex-end;
width:500px;
}
}
form input:hover, form input:focus {
color: white;
background-color: #772f9c;
}
</style>
<ul><p><a href="/logout"><font size="4">Logout</font></a></p></ul>
<ul><a style="float:right; font-size:20px" href="/logout">Logout</a></ul>
</head>
<body bgcolor="e7ded9">
<center>
<br>
<h1>Calendar ID Lists</h1>
<h1 style="font-size:35px">Calendar Lists</h1>
<p>
<form action="/events" method="POST">
<input id='d' type=hidden name="googleToken" value=<%= googleToken %>>
<input type=hidden name="googleToken" value=<%= googleToken %>>
<br><br>
<input id='d' type=hidden name="kakaoToken" value=<%= kakaoToken %>>
<input type=hidden name="kakaoToken" value=<%= kakaoToken %>>
<br><br>
<% calList.forEach(function(val){ %>
<input id='d' type=submit name="id" value=<%= val.id %>>
<input type=submit name="id" value=<%= val.id %>>
<br><br>
<% }) %>
</form>
......
......@@ -16,6 +16,7 @@
* {
font-weight: light;
-webkit-font-smoothing: antialiased;
font-family: 'Jua', sans-serif;
}
html {
......@@ -141,6 +142,7 @@ form .question input[type="text"]:valid ~ label {
#div_root{
margin:auto;
float:left;
}
#div_top{
width:100%;
......@@ -150,10 +152,11 @@ form .question input[type="text"]:valid ~ label {
#div_center{
width:60%;
float:left;
}
#div_right{
width:40%;
float:right;
float:left;
}
#ls{
transform-origin: left center;
......@@ -193,6 +196,7 @@ form .question input[type="text"]:valid ~ label {
}
</style>
</head>
<a style="float:right; font-size:20px" href="/logout">Logout</a>
<body>
<div id="div_root">
......
......@@ -4,21 +4,62 @@
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Jua|Nanum+Brush+Script|Yeon+Sung&display=swap&subset=korean" >
<title><%= title %></title>
<link rel='stylesheet' href='/stylesheets/style.css' />
<style>
* {
font-weight: light;
-webkit-font-smoothing: antialiased;
font-family: 'Jua', sans-serif;
}
form input {
margin-top: 35px;
background-color: white;
border: 1px solid #772f9c;
line-height: 0;
font-size: 17px;
display: inline-block;
box-sizing: border-box;
padding: 20px 15px;
border-radius: 60px;
color: #772f9c;
font-weight: 100;
letter-spacing: 0.01em;
position: relative;
z-index: 1;
align-self: flex-end;
width:200px;
}
form input:hover, form input:focus {
color: white;
background-color: #772f9c;
}
#title{
font-size:60px;
}
#item2{
font-size:20px;
}
#item3{
flex:left;
}
</style>
</head>
<body bgcolor="#e7ded9">
<div id="container" >
<center>
<div id='item1'><p><font size="7">
<%= title %></font></p><br>
구글 캘린더를 이용한 일정관리 및 알림 서비스<br><br><br><br><br><br><br>
<div id='item1'><p id='title'>
<%= title %></p>
</div>
<br>
<div id='item2'><p><font size="3">Welcome to <%= title %></font></p></div><br>
<span id='item3';">
<form action='/auth/google' method='GET';">
<div ><p id='item2'>Welcome to <%= title %></p></div>
<div style="float:center;align-content:flex-start;margin : 10px;"><img src="calendar.png" width=150px /><img src="talk.png" width=80px/></div>
<P>구글 캘린더를 이용한 일정관리 및 카카오톡 나에게 보내기를 이용한 알림 서비스</P>
<p>구글과 카카오 계정 로그인 후 Reminder-Talk 을 이용해 보세요!</p>
<form action='/auth/google' method='GET'>
<input type="submit" name='submit' value='Google Login'>
</form>
</p>
<form action='/kakao' method='GET'>
<input type="submit" name='submit' value='Kakao Login'>
</form>
......