Skip to content

Commit d1b43e2

Browse files
committed
feature: 현재 나온 디자인으로 수정
1 parent 035a0de commit d1b43e2

File tree

3 files changed

+867
-286
lines changed

3 files changed

+867
-286
lines changed

templates/insights/index.html

Lines changed: 262 additions & 68 deletions
Original file line numberDiff line numberDiff line change
@@ -1,74 +1,268 @@
11
<!DOCTYPE html>
2-
<html lang="en">
3-
<head>
4-
<meta charset="UTF-8">
5-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6-
<title>Velog Dashboard Weekly</title>
7-
</head>
8-
<body style="margin: 0; padding: 0; background-color: #f5f5f5; font-family: Arial, sans-serif;">
9-
<table width="100%" cellpadding="0" cellspacing="0" style="background-color: #f5f5f5;">
10-
<tr>
11-
<td align="center" style="padding: 20px;">
12-
<table width="100%" cellpadding="0" cellspacing="0" style="max-width: 600px; background-color: white; border-radius: 8px; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);">
13-
<tr>
14-
<td style="padding: 30px;">
15-
<div class="header" style="text-align: center; margin-bottom: 20px;">
16-
<h1 style="text-decoration: underline; margin-bottom: 0; font-size: 32px; color: #333333;">
17-
<span style="color: #63e6be;">Velog Dashboard</span> Weekly
18-
</h1>
19-
<p style="font-size: 14px; color: #666;">
20-
{{s_date}} ~ {{e_date}} 사이의 트렌드를 전달해드려요.
21-
</p>
22-
</div>
2+
<html lang="ko">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<title>Velog Dashboard Weekly Report</title>
7+
<style>
8+
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700;900&display=swap");
9+
* {
10+
margin: 0;
11+
padding: 0;
12+
box-sizing: border-box;
13+
}
14+
body {
15+
font-family: "Noto Sans KR", sans-serif;
16+
background-color: #ebebeb;
17+
margin: 0;
18+
padding: 0;
19+
}
20+
</style>
21+
</head>
22+
<body
23+
style="
24+
margin: 0;
25+
padding: 0;
26+
background-color: #ebebeb;
27+
font-family: 'Noto Sans KR', sans-serif;
28+
"
29+
>
30+
<table
31+
width="100%"
32+
cellpadding="0"
33+
cellspacing="0"
34+
style="background-color: #ebebeb"
35+
>
36+
<tr>
37+
<td align="center" style="padding: 30px 20px">
38+
<table
39+
width="100%"
40+
cellpadding="0"
41+
cellspacing="0"
42+
style="
43+
max-width: 600px;
44+
background-color: #ffffff;
45+
border-radius: 8px;
46+
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
47+
"
48+
>
49+
<tr>
50+
<td style="padding: 50px 25px">
51+
<!-- Header -->
52+
<div
53+
class="header"
54+
style="text-align: center; margin-bottom: 30px"
55+
>
56+
<div style="margin-bottom: 22px">
57+
<div style="margin-bottom: 6px">
58+
<h2
59+
style="
60+
font-size: 24px;
61+
font-weight: 900;
62+
color: #acacac;
63+
margin: 0;
64+
letter-spacing: 0;
65+
"
66+
>
67+
Velog Dashboard
68+
</h2>
69+
</div>
70+
<h1
71+
style="
72+
font-size: 32px;
73+
font-weight: 900;
74+
color: #000000;
75+
margin: 0;
76+
letter-spacing: 0;
77+
"
78+
>
79+
Weekly Report
80+
</h1>
81+
</div>
82+
<p
83+
style="
84+
font-size: 12px;
85+
font-weight: 400;
86+
color: #acacac;
87+
margin: 0;
88+
letter-spacing: 0;
89+
"
90+
>
91+
{{s_date}} ~ {{e_date}} 사이의 트렌드를 전달해드려요
92+
</p>
93+
</div>
2394

24-
<div style="text-align: center; margin: 40px 0;">
25-
<a
26-
href="https://velog-dashboard.kro.kr/?utm_source=email&utm_medium=weekly_analysis&utm_campaign=dashboard_cta"
27-
style="display: inline-block; background: linear-gradient(135deg, #20c997 0%, #17a2b8 100%); color: white; text-decoration: none; padding: 16px 32px; border-radius: 50px; font-weight: 600; font-size: 16px; box-shadow: 0 4px 15px rgba(32, 201, 151, 0.3); transition: all 0.3s ease; border: none;">
28-
📊 velog dashboard에서 전체 통계 체크하기!
29-
</a>
30-
</div>
95+
<!-- CTA Button -->
96+
<div style="text-align: center; margin: 30px 0">
97+
<a
98+
href="https://velog-dashboard.kro.kr/?utm_source=email&utm_medium=weekly_analysis&utm_campaign=dashboard_cta"
99+
style="
100+
display: inline-block;
101+
background: linear-gradient(
102+
90deg,
103+
#63e6be 0%,
104+
#7abbec 100%
105+
);
106+
color: #ffffff;
107+
text-decoration: none;
108+
padding: 16px 32px;
109+
border-radius: 100px;
110+
font-weight: 700;
111+
font-size: 12px;
112+
letter-spacing: 0;
113+
line-height: 14.4px;
114+
"
115+
>
116+
Velog Dashboard에서 전체 통계 체크하기!
117+
</a>
118+
</div>
31119

32-
<div class="insights" style="color: #333333; font-size: 14px; line-height: 1.6;">
33-
{% if is_expired_token_user %}
34-
<div style="background-color: #fff3cd; border: 1px solid #ffeaa7; padding: 15px; border-radius: 6px; margin: 30px 0;">
35-
<p style="font-size: 16px; font-weight: bold; color: #574202; margin: 0 0 10px 0;">
36-
🚨 잠깐, 토큰이 만료 되신 것 같아요!
37-
</p>
38-
<p style="color: #51441b; margin: 0;">
39-
토큰이 만료되면 더 이상 통계를 수집할 수 없어요. 토큰을 재발급 받으시려면
40-
<a href="https://velog-dashboard.kro.kr/?utm_source=email&utm_medium=weekly_analysis&utm_campaign=token_expire" style="color: #63e6be; font-weight: bold;">여기</a>에서 재로그인 해주세요.
41-
</p>
42-
</div>
43-
{% endif %}
120+
<div
121+
class="insights"
122+
style="color: #333333; font-size: 14px; line-height: 1.6"
123+
>
124+
{% endif %} {% if weekly_trend_html %} {{weekly_trend_html}}
125+
{% endif %} {% if not is_expired_token_user and
126+
user_weekly_trend_html %} {{user_weekly_trend_html}} {% endif
127+
%} {% if is_expired_token_user %}
128+
<!-- Token Expired Warning -->
129+
<div style="margin-bottom: 40px">
130+
<h2
131+
style="
132+
font-size: 24px;
133+
font-weight: 900;
134+
color: #000000;
135+
margin-bottom: 20px;
136+
letter-spacing: 0;
137+
"
138+
>
139+
{% if user.username %} {{user.username}}님의 활동 리포트
140+
{% else %} 활동 리포트 {% endif %}
141+
</h2>
142+
<div
143+
style="
144+
background-color: #fffbd7;
145+
border-radius: 8px;
146+
padding: 20px;
147+
margin: 20px 0;
148+
"
149+
>
150+
<p
151+
style="
152+
font-size: 16px;
153+
font-weight: 700;
154+
color: #000000;
155+
margin: 0 0 10px 0;
156+
line-height: 20px;
157+
"
158+
>
159+
🚨 잠시만요, 토큰이 만료된 것 같아요!
160+
</p>
161+
<p
162+
style="
163+
color: #999999;
164+
margin: 0;
165+
font-size: 13px;
166+
font-weight: 500;
167+
line-height: 20px;
168+
letter-spacing: 0;
169+
"
170+
>
171+
토큰이 만료되어 정상적으로 통계를 수집할 수 없었어요.<br />
172+
토큰을 재발급받으시려면
173+
<a
174+
href="https://velog-dashboard.kro.kr/?utm_source=email&utm_medium=weekly_analysis&utm_campaign=token_expire"
175+
style="
176+
color: #999999;
177+
font-weight: bold;
178+
text-decoration: underline;
179+
"
180+
>여기</a
181+
>에서 다시 로그인해주세요.
182+
</p>
183+
</div>
184+
</div>
185+
</div>
186+
</td>
187+
</tr>
188+
</table>
44189

45-
{% if weekly_trend_html %}
46-
{{weekly_trend_html}}
47-
{% endif %}
48-
49-
{% if not is_expired_token_user and user_weekly_trend_html %}
50-
{{user_weekly_trend_html}}
51-
{% endif %}
52-
</div>
190+
<!-- Footer - Outside content box -->
191+
<div
192+
class="footer"
193+
style="
194+
margin-top: 20px;
195+
text-align: center;
196+
width: 100%;
197+
max-width: 600px;
198+
"
199+
>
200+
<div
201+
style="
202+
display: flex;
203+
align-items: center;
204+
justify-content: center;
205+
margin-bottom: 10px;
206+
gap: 10px;
207+
"
208+
>
209+
<svg
210+
width="20"
211+
height="20"
212+
style="border-radius: 2px"
213+
viewBox="0 0 20 20"
214+
fill="none"
215+
xmlns="http://www.w3.org/2000/svg"
216+
>
217+
<rect width="20" height="20" rx="0.46875" fill="#1EC996" />
218+
<path
219+
d="M4.52499 5.81977L5.63155 12.4487H5.70632L9.36355 5.81977H10.1646L5.89451 13.4137H5.07206L3.7239 5.81977H4.52499ZM12.2818 13.4137H9.55815L11.0191 5.81977H13.7749C16.1034 5.81977 17.2495 7.24625 16.7955 9.60623C16.3374 11.9872 14.6424 13.4137 12.2818 13.4137ZM11.4206 12.0606H12.4781C13.9521 12.0606 14.8664 11.3054 15.1933 9.60623C15.5182 7.91753 14.8924 7.17283 13.4291 7.17283H12.361L11.4206 12.0606Z"
220+
fill="white"
221+
/>
222+
</svg>
53223

54-
<hr style="border: none; border-top: 1px solid #eee; margin: 30px 0;">
55-
56-
<div class="footer" style="margin-top: 20px; text-align: center;">
57-
<a href="https://velog-dashboard.kro.kr/main?utm_source=email&utm_medium=weekly_analysis&utm_campaign=dashboard_cta" style="color: #63e6be; font-size: 12px; margin: 0 5px; text-decoration: none;">
58-
대시보드 보러가기
59-
</a>
60-
<a href="https://nuung.notion.site/terms-of-service" style="color: #666; font-size: 12px; margin: 0 5px; text-decoration: none;">
61-
서비스 이용약관
62-
</a>
63-
<a href="https://nuung.notion.site/privacy-policy" style="color: #666; font-size: 12px; margin: 0 5px; text-decoration: none;">
64-
개인정보처리방침
65-
</a>
66-
</div>
67-
</td>
68-
</tr>
69-
</table>
70-
</td>
71-
</tr>
224+
<span
225+
style="
226+
font-size: 15px;
227+
font-weight: 500;
228+
color: #4d4d4d;
229+
letter-spacing: 0;
230+
line-height: 18px;
231+
"
232+
>Velog Dashboard</span
233+
>
234+
</div>
235+
<p
236+
style="
237+
font-size: 12px;
238+
font-weight: 300;
239+
color: #4d4d4d;
240+
margin: 0;
241+
letter-spacing: 0;
242+
line-height: 14.4px;
243+
"
244+
>
245+
<a
246+
href="https://velog-dashboard.kro.kr/main?utm_source=email&utm_medium=weekly_analysis&utm_campaign=dashboard_cta"
247+
style="color: #4d4d4d; text-decoration: underline"
248+
>대시보드 바로가기</a
249+
>
250+
&nbsp;&nbsp;|&nbsp;&nbsp;
251+
<a
252+
href="https://nuung.notion.site/terms-of-service"
253+
style="color: #4d4d4d; text-decoration: underline"
254+
>서비스 이용약관</a
255+
>
256+
&nbsp;&nbsp;|&nbsp;&nbsp;
257+
<a
258+
href="https://nuung.notion.site/privacy-policy"
259+
style="color: #4d4d4d; text-decoration: underline"
260+
>개인정보처리방침</a
261+
>
262+
</p>
263+
</div>
264+
</td>
265+
</tr>
72266
</table>
73-
</body>
74-
</html>
267+
</body>
268+
</html>

0 commit comments

Comments
 (0)