Skip to content

Commit 153a6ed

Browse files
six-standardsix-standard
committed
refactor: 템플릿 개선
1 parent 83919a8 commit 153a6ed

File tree

4 files changed

+356
-802
lines changed

4 files changed

+356
-802
lines changed

‎templates/insights/index.html‎

Lines changed: 90 additions & 199 deletions
Original file line numberDiff line numberDiff line change
@@ -4,184 +4,96 @@
44
<meta charset="UTF-8" />
55
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
66
<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>
217
</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"
8+
<body style="margin: 0; padding: 0; background-color: #ebebeb; font-family: 'Apple SD Gothic Neo', 'Malgun Gothic', '맑은 고딕', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;">
9+
<table
10+
width="100%"
11+
cellpadding="0"
12+
cellspacing="0"
13+
style="background-color: #ebebeb; box-sizing: border-box;"
3514
>
3615
<tr>
37-
<td align="center" style="padding: 30px 20px">
38-
<table
16+
<td
17+
align="center"
18+
style="padding: 30px 20px; box-sizing: border-box;"
19+
>
20+
<table
3921
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-
"
22+
cellpadding="0"
23+
cellspacing="0"
24+
style="max-width: 600px; background-color: #ffffff; border-radius: 8px; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);"
4825
>
4926
<tr>
50-
<td style="padding: 50px 25px">
27+
<td style="padding: 50px 25px; box-sizing: border-box;">
5128
<!-- Header -->
52-
<div
53-
class="header"
54-
style="text-align: center; margin-bottom: 30px"
29+
<div
30+
class="header"
31+
style="text-align: center; margin-bottom: 30px; box-sizing: border-box;"
5532
>
56-
<div style="margin-bottom: 8px">
57-
<div>
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-
>
33+
<div style="margin-bottom: 8px; box-sizing: border-box;">
34+
<h2 style="font-size: 24px; font-weight: 900; color: #63E6BE; margin: 0; letter-spacing: 0; box-sizing: border-box;">
35+
Velog Dashboard
36+
</h2>
37+
<h1 style="font-size: 32px; font-weight: 900; color: #000000; margin: 0; letter-spacing: 0; box-sizing: border-box;">
7938
Weekly Report
8039
</h1>
8140
</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}} 사이의 트렌드를 전달해드려요
41+
<p style="font-size: 12px; font-weight: 500; color: #acacac; margin: 0; letter-spacing: 0; box-sizing: border-box;">
42+
<span style="font-weight: 700; text-decoration: underline">{{s_date}} ~ {{e_date}}</span> 사이의 트렌드를 전달해드려요
9243
</p>
9344
</div>
9445

9546
<!-- 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-
"
47+
<div style="text-align: center; margin: 30px 0; box-sizing: border-box;">
48+
<a
49+
href="https://velog-dashboard.kro.kr/?utm_source=email&utm_medium=weekly_analysis&utm_campaign=dashboard_cta"
50+
style="display: inline-block; background: linear-gradient(90deg, #63e6be 0%, #7abbec 100%); color: #ffffff; text-decoration: none; padding: 16px 32px; border-radius: 100px; font-weight: 900; font-size: 12px; letter-spacing: 0; line-height: 14.4px; box-sizing: border-box;"
11551
>
11652
Velog Dashboard에서 전체 통계 체크하기!
11753
</a>
11854
</div>
11955

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>
56+
<div
57+
class="insights"
58+
style="color: #333333; font-size: 14px; line-height: 1.6; box-sizing: border-box;"
59+
>
60+
{% if weekly_trend_html %}
61+
{{weekly_trend_html}}
62+
{% endif %}
63+
64+
{% if not is_expired_token_user and user_weekly_trend_html %}
65+
{{user_weekly_trend_html}}
66+
{% endif %}
67+
68+
{% if is_expired_token_user %}
69+
<!-- Token Expired Warning -->
70+
<div style="margin-bottom: 40px; box-sizing: border-box;">
71+
<h2 style="font-size: 24px; font-weight: 900; color: #000000; margin-bottom: 20px; letter-spacing: 0; box-sizing: border-box;">
72+
{% if user.username %}
73+
{{user.username}}님의 활동 리포트
74+
{% else %}
75+
활동 리포트
76+
{% endif %}
77+
</h2>
78+
<div style="background-color: #fffbd7; border-radius: 8px; padding: 20px; margin: 20px 0; box-sizing: border-box;">
79+
<p style="font-size: 16px; font-weight: 800; color: #000000; margin: 0 0 10px 0; line-height: 20px; box-sizing: border-box;">
80+
🚨 잠시만요, 토큰이 만료된 것 같아요!
81+
</p>
82+
<p style="color: #999999; margin: 0; font-size: 13px; font-weight: 500; line-height: 20px; letter-spacing: 0; box-sizing: border-box;">
83+
토큰이 만료되어 정상적으로 통계를 수집할 수 없었어요.<br />
84+
토큰을 재발급받으시려면
85+
<a
86+
href="https://velog-dashboard.kro.kr/?utm_source=email&utm_medium=weekly_analysis&utm_campaign=token_expire"
87+
style="color: #999999; font-weight: bold; text-decoration: underline; box-sizing: border-box;"
88+
>
89+
여기
90+
</a>
91+
에서 다시 로그인해주세요.
92+
</p>
93+
</div>
18394
</div>
184-
</div>
95+
{% endif %}
96+
18597
</div>
18698
</td>
18799
</tr>
@@ -190,22 +102,9 @@
190102
<!-- Footer - Outside content box -->
191103
<div
192104
class="footer"
193-
style="
194-
margin-top: 20px;
195-
text-align: center;
196-
width: 100%;
197-
max-width: 600px;
198-
"
105+
style="margin-top: 20px; text-align: center; width: 100%; max-width: 600px;"
199106
>
200-
<div
201-
style="
202-
display: flex;
203-
align-items: center;
204-
justify-content: center;
205-
margin-bottom: 10px;
206-
gap: 10px;
207-
"
208-
>
107+
<div style="display: flex; align-items: center; justify-content: center; margin-bottom: 10px; gap: 10px;">
209108
<svg
210109
width="20"
211110
height="20"
@@ -214,51 +113,43 @@
214113
fill="none"
215114
xmlns="http://www.w3.org/2000/svg"
216115
>
217-
<rect width="20" height="20" rx="0.46875" fill="#1EC996" />
116+
<rect
117+
width="20"
118+
height="20"
119+
rx="0.46875"
120+
fill="#1EC996"
121+
/>
218122
<path
219123
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"
220124
fill="white"
221125
/>
222126
</svg>
223127

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-
>
128+
<span style="font-size: 15px; font-weight: 700; color: #4d4d4d; letter-spacing: 0; line-height: 18px;">
129+
Velog Dashboard
130+
</span>
234131
</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-
>
132+
<p style="font-size: 12px; font-weight: 500; color: #4d4d4d; margin: 0; letter-spacing: 0; line-height: 14.4px;">
245133
<a
246134
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
135+
style="color: #4d4d4d; text-decoration: underline; box-sizing: border-box;"
249136
>
137+
대시보드 보러가기
138+
</a>
250139
&nbsp;&nbsp;|&nbsp;&nbsp;
251140
<a
252141
href="https://nuung.notion.site/terms-of-service"
253-
style="color: #4d4d4d; text-decoration: underline"
254-
>서비스 이용약관</a
142+
style="color: #4d4d4d; text-decoration: underline; box-sizing: border-box;"
255143
>
144+
서비스 이용약관
145+
</a>
256146
&nbsp;&nbsp;|&nbsp;&nbsp;
257147
<a
258148
href="https://nuung.notion.site/privacy-policy"
259-
style="color: #4d4d4d; text-decoration: underline"
260-
>개인정보처리방침</a
149+
style="color: #4d4d4d; text-decoration: underline; box-sizing: border-box;"
261150
>
151+
개인정보처리방침
152+
</a>
262153
</p>
263154
</div>
264155
</td>

0 commit comments

Comments
 (0)