유희정 / Reminder-Talk

Go to a project
Toggle navigation Toggle navigation pinning
유희정
cddef1be 1 parent c2639dba

complete design

Inline Side-by-side
Showing 7 changed files with 81 additions and 23 deletions
...@@ -22,6 +22,7 @@ router.get('/auth/google',passport.authenticate('google',{ session:false})); ...@@ -22,6 +22,7 @@ router.get('/auth/google',passport.authenticate('google',{ session:false}));
22 router.get('/auth/google/callback',passport.authenticate('google',{ 22 router.get('/auth/google/callback',passport.authenticate('google',{
23 failureRedirect:'/' 23 failureRedirect:'/'
24 }),function(req, res) { 24 }),function(req, res) {
25 + googleLogin = true;
25 req.session.googleToken = req.user.accessToken; 26 req.session.googleToken = req.user.accessToken;
26 if(!req.session.kakaoToken) return res.redirect('/'); 27 if(!req.session.kakaoToken) return res.redirect('/');
27 else return res.redirect('/calendar'); 28 else return res.redirect('/calendar');
...@@ -44,6 +45,7 @@ router.get("/kakao", passport.authenticate("kakao-login")); ...@@ -44,6 +45,7 @@ router.get("/kakao", passport.authenticate("kakao-login"));
44 router.get( 45 router.get(
45 "/oauth/callback", 46 "/oauth/callback",
46 passport.authenticate("kakao-login",{failureRedirect:'/'}),function(req, res) { 47 passport.authenticate("kakao-login",{failureRedirect:'/'}),function(req, res) {
48 + kakaoLogin = true;
47 req.session.kakaoToken = req.user.accessToken; 49 req.session.kakaoToken = req.user.accessToken;
48 if(!req.session.googleToken) return res.redirect('/'); 50 if(!req.session.googleToken) return res.redirect('/');
49 else return res.redirect('/calendar'); 51 else return res.redirect('/calendar');
......
...@@ -3,40 +3,51 @@ ...@@ -3,40 +3,51 @@
3 <head> 3 <head>
4 <link rel='stylesheet' href='/stylesheets/style.css' /> 4 <link rel='stylesheet' href='/stylesheets/style.css' />
5 <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Jua|Nanum+Brush+Script|Yeon+Sung&display=swap&subset=korean" > 5 <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Jua|Nanum+Brush+Script|Yeon+Sung&display=swap&subset=korean" >
6 +
6 <style> 7 <style>
7 - #d{ 8 + * {
8 - background-color: none; 9 + font-weight: light;
10 + -webkit-font-smoothing: antialiased;
11 + font-family: 'Jua', sans-serif;
12 +}
13 + form input {
14 + margin-top: 35px;
15 + background-color: white;
9 border: 1px solid #772f9c; 16 border: 1px solid #772f9c;
10 - line-height: 1; 17 + line-height: 0;
11 - font-size: 17px; 18 + font-size: 20px;
12 - width: 65%; 19 + display: inline-block;
13 - padding:10px 15px;
14 - display: block;
15 box-sizing: border-box; 20 box-sizing: border-box;
21 + padding: 20px 15px;
16 border-radius: 60px; 22 border-radius: 60px;
17 color: #772f9c; 23 color: #772f9c;
18 font-weight: 100; 24 font-weight: 100;
19 letter-spacing: 0.01em; 25 letter-spacing: 0.01em;
20 position: relative; 26 position: relative;
21 z-index: 1; 27 z-index: 1;
22 - margin-left: 100px; 28 + align-self: flex-end;
29 + width:500px;
23 } 30 }
24 -} 31 + form input:hover, form input:focus {
32 + color: white;
33 + background-color: #772f9c;
34 + }
35 +
25 </style> 36 </style>
26 - <ul><p><a href="/logout"><font size="4">Logout</font></a></p></ul> 37 + <ul><a style="float:right; font-size:20px" href="/logout">Logout</a></ul>
27 </head> 38 </head>
28 <body bgcolor="e7ded9"> 39 <body bgcolor="e7ded9">
29 <center> 40 <center>
30 <br> 41 <br>
31 - <h1>Calendar ID Lists</h1> 42 + <h1 style="font-size:35px">Calendar Lists</h1>
32 <p> 43 <p>
33 <form action="/events" method="POST"> 44 <form action="/events" method="POST">
34 - <input id='d' type=hidden name="googleToken" value=<%= googleToken %>> 45 + <input type=hidden name="googleToken" value=<%= googleToken %>>
35 <br><br> 46 <br><br>
36 - <input id='d' type=hidden name="kakaoToken" value=<%= kakaoToken %>> 47 + <input type=hidden name="kakaoToken" value=<%= kakaoToken %>>
37 <br><br> 48 <br><br>
38 <% calList.forEach(function(val){ %> 49 <% calList.forEach(function(val){ %>
39 - <input id='d' type=submit name="id" value=<%= val.id %>> 50 + <input type=submit name="id" value=<%= val.id %>>
40 <br><br> 51 <br><br>
41 <% }) %> 52 <% }) %>
42 </form> 53 </form>
......
...@@ -16,6 +16,7 @@ ...@@ -16,6 +16,7 @@
16 * { 16 * {
17 font-weight: light; 17 font-weight: light;
18 -webkit-font-smoothing: antialiased; 18 -webkit-font-smoothing: antialiased;
19 + font-family: 'Jua', sans-serif;
19 } 20 }
20 21
21 html { 22 html {
...@@ -141,6 +142,7 @@ form .question input[type="text"]:valid ~ label { ...@@ -141,6 +142,7 @@ form .question input[type="text"]:valid ~ label {
141 142
142 #div_root{ 143 #div_root{
143 margin:auto; 144 margin:auto;
145 + float:left;
144 } 146 }
145 #div_top{ 147 #div_top{
146 width:100%; 148 width:100%;
...@@ -150,10 +152,11 @@ form .question input[type="text"]:valid ~ label { ...@@ -150,10 +152,11 @@ form .question input[type="text"]:valid ~ label {
150 #div_center{ 152 #div_center{
151 width:60%; 153 width:60%;
152 float:left; 154 float:left;
155 +
153 } 156 }
154 #div_right{ 157 #div_right{
155 width:40%; 158 width:40%;
156 - float:right; 159 + float:left;
157 } 160 }
158 #ls{ 161 #ls{
159 transform-origin: left center; 162 transform-origin: left center;
...@@ -193,6 +196,7 @@ form .question input[type="text"]:valid ~ label { ...@@ -193,6 +196,7 @@ form .question input[type="text"]:valid ~ label {
193 } 196 }
194 </style> 197 </style>
195 </head> 198 </head>
199 + <a style="float:right; font-size:20px" href="/logout">Logout</a>
196 <body> 200 <body>
197 <div id="div_root"> 201 <div id="div_root">
198 202
......
...@@ -4,21 +4,62 @@ ...@@ -4,21 +4,62 @@
4 <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Jua|Nanum+Brush+Script|Yeon+Sung&display=swap&subset=korean" > 4 <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Jua|Nanum+Brush+Script|Yeon+Sung&display=swap&subset=korean" >
5 <title><%= title %></title> 5 <title><%= title %></title>
6 <link rel='stylesheet' href='/stylesheets/style.css' /> 6 <link rel='stylesheet' href='/stylesheets/style.css' />
7 + <style>
8 +
9 +* {
10 + font-weight: light;
11 + -webkit-font-smoothing: antialiased;
12 + font-family: 'Jua', sans-serif;
13 +}
14 + form input {
15 + margin-top: 35px;
16 + background-color: white;
17 + border: 1px solid #772f9c;
18 + line-height: 0;
19 + font-size: 17px;
20 + display: inline-block;
21 + box-sizing: border-box;
22 + padding: 20px 15px;
23 + border-radius: 60px;
24 + color: #772f9c;
25 + font-weight: 100;
26 + letter-spacing: 0.01em;
27 + position: relative;
28 + z-index: 1;
29 + align-self: flex-end;
30 + width:200px;
31 + }
32 + form input:hover, form input:focus {
33 + color: white;
34 + background-color: #772f9c;
35 + }
36 + #title{
37 + font-size:60px;
38 + }
39 + #item2{
40 + font-size:20px;
41 + }
42 + #item3{
43 + flex:left;
44 + }
45 +</style>
46 +
7 </head> 47 </head>
8 <body bgcolor="#e7ded9"> 48 <body bgcolor="#e7ded9">
9 <div id="container" > 49 <div id="container" >
10 <center> 50 <center>
11 - <div id='item1'><p><font size="7"> 51 + <div id='item1'><p id='title'>
12 - <%= title %></font></p><br> 52 + <%= title %></p>
13 - 구글 캘린더를 이용한 일정관리 및 알림 서비스<br><br><br><br><br><br><br>
14 </div> 53 </div>
15 - <br> 54 +
16 - <div id='item2'><p><font size="3">Welcome to <%= title %></font></p></div><br> 55 + <div ><p id='item2'>Welcome to <%= title %></p></div>
17 - <span id='item3';"> 56 + <div style="float:center;align-content:flex-start;margin : 10px;"><img src="calendar.png" width=150px /><img src="talk.png" width=80px/></div>
18 - <form action='/auth/google' method='GET';"> 57 + <P>구글 캘린더를 이용한 일정관리 및 카카오톡 나에게 보내기를 이용한 알림 서비스</P>
58 + <p>구글과 카카오 계정 로그인 후 Reminder-Talk 을 이용해 보세요!</p>
59 +
60 + <form action='/auth/google' method='GET'>
19 <input type="submit" name='submit' value='Google Login'> 61 <input type="submit" name='submit' value='Google Login'>
20 </form> 62 </form>
21 - </p>
22 <form action='/kakao' method='GET'> 63 <form action='/kakao' method='GET'>
23 <input type="submit" name='submit' value='Kakao Login'> 64 <input type="submit" name='submit' value='Kakao Login'>
24 </form> 65 </form>
......