Skip to content

Commit 324fc06

Browse files
ray-oxdray-oxd
committed
DBC22-2879: polishing
1 parent 8c5630d commit 324fc06

File tree

9 files changed

+127
-104
lines changed

9 files changed

+127
-104
lines changed

‎src/backend/apps/authentication/templates/email/email_verification.html

Lines changed: 83 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,83 @@
1-
<p>
2-
Please click the link below to verify your email address: \n
3-
{{verification_url}}
4-
</p>
1+
<!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+
<meta http-equiv="X-UA-Compatible" content="ie=edge">
7+
<title>Email Verification</title>
8+
</head>
9+
<body style="margin:0; padding:0; font-family:Arial, sans-serif; font-size:16px; line-height:1.5rem; color:#2D2D2D;">
10+
<table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#F1F8FE" style="padding:50px">
11+
<tr>
12+
<td align="center" valign="top">
13+
<!-- Email container -->
14+
<table width="620" cellspacing="0" cellpadding="0" border="0" align="center" bgcolor="#FFFFFF" style="padding:24px; border-top: 4px solid #013366">
15+
<!-- Logo Header -->
16+
<tr>
17+
<td>
18+
<a href="https://beta.drivebc.ca/" target="_blank" rel="noopener noreferrer" style="display:inline-block">
19+
<img src="cid:drivebclogo" alt="DriveBC Logo" />
20+
</a>
21+
</td>
22+
</tr>
23+
<!-- Body -->
24+
<tr>
25+
<td>
26+
<table>
27+
<tr>
28+
<td style="font-size:2rem;font-weight:700;padding-top:30px">
29+
Almost there!
30+
</td>
31+
</tr>
32+
<tr>
33+
<td style="padding-top:30px; padding-bottom:24px">
34+
To finish creating your account, we need you to verify your email.
35+
Once verified, you’ll be able to save cameras and routes that matter to you, and setup personalized notifications for delays that could affect a trip.
36+
</td>
37+
</tr>
38+
</table>
39+
<table>
40+
<tr>
41+
<td align="center" bgcolor="#255A90" style="border-radius:4px; width: 160px;">
42+
<a href={{ verification_url }} style="color:#ffffff; text-decoration: none; font-size: 0.875rem; font-weight: 700">
43+
<div style="padding: 12px">
44+
Verify email
45+
</div>
46+
</a>
47+
</td>
48+
</tr>
49+
</table>
50+
<table>
51+
<tr>
52+
<td style="font-weight:700; padding-top: 24px">
53+
If you didn’t initiate this request, please disregard this email.
54+
</td>
55+
</tr>
56+
</table>
57+
</td>
58+
</tr>
59+
<!-- Footer -->
60+
<tr>
61+
<td >
62+
<table>
63+
<tr>
64+
<td style="padding-top:30px">
65+
Your DriveBC team.
66+
</td>
67+
</tr>
68+
<tr>
69+
<td style="padding-top:30px; font-size:0.75rem; color:#605E5C">
70+
Add notifications@drivebc.ca to your address book to ensure that you receive these notifications to your inbox.
71+
</td>
72+
</tr>
73+
</table>
74+
</td>
75+
</tr>
76+
77+
</tr>
78+
</table>
79+
</td>
80+
</tr>
81+
</table>
82+
</body>
83+
</html>

‎src/backend/apps/authentication/views.py

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
import os
2+
from email.mime.image import MIMEImage
13
from pathlib import Path
24

35
import environ
@@ -170,6 +172,16 @@ def post(self, request):
170172
env("DRIVEBC_FEEDBACK_EMAIL_DEFAULT"),
171173
[request.user.email]
172174
)
175+
176+
# Attach image with Content-ID
177+
image_path = os.path.join(BASE_DIR, 'src', 'backend', 'static', 'images', 'drivebclogo.png')
178+
with open(image_path, 'rb') as image_file:
179+
img = MIMEImage(image_file.read(), _subtype="png")
180+
img.add_header('Content-ID', '<drivebclogo>')
181+
img.add_header('X-Attachment-Id', 'drivebclogo.png')
182+
img.add_header('Content-Disposition', 'inline', filename='drivebclogo.png')
183+
msg.attach(img)
184+
173185
msg.attach_alternative(html, 'text/html')
174186
msg.send()
175187

‎src/backend/apps/event/tasks.py

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -198,7 +198,7 @@ def send_event_notifications(updated_event_ids):
198198
html = render_to_string('email/event_updated.html', context)
199199

200200
msg = EmailMultiAlternatives(
201-
f'DriveBC route update: {saved_route.label}',
201+
f'DriveBC route update: {saved_route.label}' if saved_route.label else 'DriveBC route update',
202202
text,
203203
env("DRIVEBC_FEEDBACK_EMAIL_DEFAULT"),
204204
[saved_route.user.email]
@@ -207,7 +207,7 @@ def send_event_notifications(updated_event_ids):
207207
# Attach image with Content-ID
208208
image_path = os.path.join(BASE_DIR, 'src', 'backend', 'static', 'images', 'drivebclogo.png')
209209
with open(image_path, 'rb') as image_file:
210-
img = MIMEImage(image_file.read(), _subtype="svg+xml")
210+
img = MIMEImage(image_file.read(), _subtype="png")
211211
img.add_header('Content-ID', '<drivebclogo>')
212212
img.add_header('X-Attachment-Id', 'drivebclogo.png')
213213
img.add_header('Content-Disposition', 'inline', filename='drivebclogo.png')

‎src/backend/apps/event/templates/email/email-verification.html

Lines changed: 0 additions & 83 deletions
This file was deleted.

‎src/backend/apps/event/templates/email/event_updated.html

Lines changed: 2 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -55,7 +55,6 @@
5555
<table width="100%">
5656
<tr>
5757
<td bgcolor="#FFE4E5" style="padding:12px; border-radius:4px; font-size: 0.875rem; font-weight:700; color:#D8292F">
58-
<img src="data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' fill='none' viewBox='0 0 22 22'%3e%3crect width='13.477' height='13.477' x='1.414' y='11' fill='white' rx='3' transform='rotate(-45 1.414 11)'/%3e%3crect width='13.477' height='13.477' x='1.414' y='11' stroke='%23CE3E39' stroke-width='2' rx='3' transform='rotate(-45 1.414 11)'/%3e%3cpath fill='%23CE3E39' d='M11.944 6.603c0-.61-.448-1.103-1-1.103-.553 0-1 .494-1 1.103v5.351c0 .61.447 1.103 1 1.103.552 0 1-.494 1-1.103V6.603Zm-2 8.795c0 .608.447 1.102 1 1.102.552 0 1-.494 1-1.102 0-.61-.448-1.103-1-1.103-.553 0-1 .494-1 1.103Z'/%3e%3c/svg%3e" alt="Major current event" style="vertical-align:middle; margin-right: 8px; margin-top: -4px" />
5958
{{ event.event_type }}
6059
</td>
6160
</tr>
@@ -64,11 +63,6 @@
6463
{{ event.highway_segment_names }}
6564
</td>
6665
</tr>
67-
<tr>
68-
<td style="font-size: 0.875rem; font-weight:700; color:#464341; padding: 0 12px">
69-
{{ event.direction }}
70-
</td>
71-
</tr>
7266
<tr>
7367
<td style="padding:12px">
7468
<table width="100%">
@@ -77,7 +71,7 @@
7771
Location
7872
</td>
7973
<td>
80-
{{ event.location }}
74+
{{ event.location_description }}
8175
</td>
8276
</tr>
8377
<tr>
@@ -93,7 +87,7 @@
9387
Description
9488
</td>
9589
<td>
96-
{{ event.location_description }}
90+
{{ event.description }}
9791
</td>
9892
</tr>
9993
<tr>

‎src/frontend/src/pages/AccountPage.js

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,10 @@
11
import React, {useContext, useEffect, useRef, useState} from 'react';
22

3+
// Navigation
4+
import { useNavigate } from 'react-router-dom';
5+
36
// External imports
7+
import Button from "react-bootstrap/Button";
48
import Container from 'react-bootstrap/Container';
59

610
// Internal imports
@@ -12,7 +16,9 @@ import PageHeader from '../PageHeader';
1216
import './AccountPage.scss';
1317

1418
export default function AccountPage() {
19+
/* Setup */
1520
// Navigation
21+
const navigate = useNavigate();
1622
const params = new URLSearchParams(window.location.search);
1723

1824
// Context
@@ -24,6 +30,7 @@ export default function AccountPage() {
2430
// States
2531
const [verified, setVerified] = useState(params.get('verified'));
2632

33+
// Effects
2734
useEffect(() => {
2835
if (!authContext.loginStateKnown) {
2936
return;
@@ -71,6 +78,17 @@ export default function AccountPage() {
7178
This email address has not been verified. Email notifications for
7279
saved routes will be disabled until verification
7380
is complete.
81+
82+
<br/>
83+
84+
<Button
85+
className='btn btn-outline-primary'
86+
tabIndex={0}
87+
onClick={() => navigate('/verify-email')}
88+
onKeyPress={() => navigate('/verify-email')}>
89+
90+
<b>Verify email address</b>
91+
</Button>
7492
</p>
7593
}
7694
</div>

‎src/frontend/src/pages/AccountPage.scss

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -42,6 +42,10 @@
4242
color: $MyAccountWarningText;
4343
padding: 0.5rem 1rem;
4444
font-size: 0.875rem;
45+
46+
.btn {
47+
margin-top: 1rem;
48+
}
4549
}
4650
}
4751
}

‎src/frontend/src/pages/SavedRoutesPage.js

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ import { memoize } from 'proxy-memoize';
1111
// External imports
1212
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
1313
import { faStar as faStarOutline, faXmark } from '@fortawesome/pro-regular-svg-icons';
14+
import Button from "react-bootstrap/Button";
1415

1516
// Internal imports
1617
import { AuthContext } from '../App';
@@ -84,14 +85,14 @@ export default function SavedRoutesPage() {
8485
{authContext.email} has not been verified. Email notifications for saved routes will be disabled until
8586
verification is complete.
8687

87-
<div
88-
className='verify-link'
88+
<Button
89+
className='btn btn-outline-primary verify-link'
8990
tabIndex={0}
9091
onClick={() => navigate('/verify-email?my_routes=true')}
9192
onKeyPress={() => navigate('/verify-email?my_routes=true')}>
9293

9394
<b>Verify email address</b>
94-
</div>
95+
</Button>
9596
</div>
9697
}
9798

‎src/frontend/src/pages/SavedRoutesPage.scss

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,19 +6,17 @@
66
.not-verified, .verified {
77
background-color: $MyAccountWarning;
88
color: $MyAccountWarningText;
9-
padding: 1rem 4rem;
9+
padding: 0.5rem 4rem;
1010
font-size: 0.875rem;
1111

1212
@media (max-width: 992px) {
1313
padding: 1rem 0.75rem;
1414
}
1515

1616
.verify-link {
17-
text-decoration: underline;
18-
cursor: pointer;
17+
margin-bottom: 0;
1918

2019
@media (min-width: 992px) {
21-
display: inline;
2220
margin-left: 1rem;
2321
}
2422

0 commit comments

Comments
 (0)