Skip to content

Commit 6b8bbfa

Browse files
authored
Update index.html
1 parent 623b9f6 commit 6b8bbfa

1 file changed

Lines changed: 123 additions & 244 deletions

File tree

templates/index.html

Lines changed: 123 additions & 244 deletions
Original file line numberDiff line numberDiff line change
@@ -2,255 +2,134 @@
22
<html lang="en">
33
<head>
44
<meta charset="UTF-8">
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
56
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6-
<title>Example Page</title>
7-
<style>
8-
body {
9-
font-family: Uni Sans, sans-serif;
10-
background-color: #2E3035;
11-
color: #eee;
12-
}
13-
14-
header {
15-
background-color: #111;
16-
color: #eee;
17-
text-align: center;
18-
padding: 1rem;
19-
width: calc(100% - 33%);
20-
}
21-
22-
main {
23-
display: flex;
24-
flex-direction: column; /* change the direction to column */
25-
padding: 1rem;
26-
padding-top: 0rem;
27-
margin-right: 33%;
28-
}
29-
30-
.card {
31-
width: 30%;
32-
background-color: #444;
33-
border: 1px solid #666;
34-
border-radius: 5px;
35-
padding: 2rem;
36-
box-shadow: 0 2px 5px rgba(255, 255, 255, 0.3);
37-
}
38-
39-
h3 {
40-
font-size: 16px;
41-
margin-top: 0rem;
42-
color: #eee;
43-
font-weight: normal;
44-
}
45-
46-
.card p {
47-
font-size: 16px;
48-
line-height: 1.6;
49-
color: #eee;
50-
}
51-
52-
.card button {
53-
display: none; /* hide the button */
54-
}
55-
56-
/* Email buttons */
57-
.email-list {
58-
display: grid;
59-
grid-template-columns: repeat(5, 1fr);
60-
margin: 0rem 0;
61-
justify-content: center;
62-
}
63-
64-
.email-button {
65-
display: flex;
66-
justify-content: center;
67-
align-items: center;
68-
background-color: #4E5058;
69-
color: #FEFEFE;
70-
border: none;
71-
padding: .75rem 2rem;
72-
font-size: .8rem;
73-
font-weight: bold;
74-
cursor: pointer;
75-
position: relative;
76-
}
77-
78-
.email-button:not(:last-child) {
79-
border-right: 1px solid #1E1F22;
80-
}
81-
82-
.email-button:active {
83-
background-color: #666;
84-
}
85-
86-
.email-button:first-child {
87-
border-top-left-radius: 0;
88-
border-bottom-left-radius: 0;
89-
border-top-right-radius: 0;
90-
border-bottom-right-radius: 0;
91-
}
92-
93-
.email-button:last-child {
94-
border-top-right-radius: 0;
95-
border-bottom-right-radius: 5px;
96-
border-top-left-radius: 0;
97-
border-bottom-left-radius: 0;
98-
border-top: 1px solid #1E1F22;
99-
}
100-
101-
.email-button:nth-child(n+6):not(:last-child) {
102-
border-right: 1px solid #1E1F22;
103-
border-top: 1px solid #1E1F22;
104-
}
105-
106-
.email-button:nth-child(5):not(:last-child),
107-
.email-button:nth-child(10):not(:last-child) {
108-
border-right: 0 solid #666;
109-
}
110-
111-
.email-button:nth-child(5):first-child {
112-
border-top-left-radius: 0;
113-
border-bottom-left-radius: 0;
114-
border-top-right-radius: 5px;
115-
border-bottom-right-radius: 5px;
116-
}
117-
118-
.email-button:nth-child(6):first-child {
119-
border-top-left-radius: 5px;
120-
border-bottom-left-radius: 5px;
121-
border-top-right-radius: 0;
122-
border-bottom-right-radius: 0;
123-
}
124-
125-
.email-button:nth-child(1),
126-
.email-button:nth-child(2),
127-
.email-button:nth-child(3),
128-
.email-button:nth-child(4) {
129-
border-bottom-right-radius: 0;
130-
}
131-
132-
.email-button:nth-child(5):not(:first-child),
133-
.email-button:nth-child(6):not(:first-child),
134-
.email-button:nth-child(7),
135-
.email-button:nth-child(8),
136-
.email-button:nth-child(9),
137-
.email-button:nth-child(10):not(:first-child) {
138-
border-top-left-radius: 0;
139-
border-top-right-radius: 0;
140-
border-bottom-left-radius: 0;
141-
border-bottom-right-radius: 0;
142-
}
143-
144-
.email-dropdown {
145-
position: absolute;
146-
top: 100%;
147-
left: 0;
148-
width: 100%;
149-
background-color: #444;
150-
color: #eee;
151-
border: none;
152-
border-radius: 0 0 5px 5px;
153-
padding: 1.5rem 2rem;
154-
font-size: 1.2rem;
155-
font-weight: bold;
156-
cursor: pointer;
157-
display: none;
158-
}
159-
160-
.email-button:active .email-dropdown {
161-
display: block;
162-
}
163-
164-
/* Terminal-like panel */
165-
.terminal-panel {
166-
position: fixed;
167-
top: 0;
168-
right: 0;
169-
width: 33%;
170-
height: 100%;
171-
background-color: black;
172-
color: white;
173-
z-index: 998;
174-
font-family: 'Courier New', Courier, monospace;
175-
font-size: 14px;
176-
line-height: 1.5;
177-
overflow-y: scroll;
178-
border-left: 1px solid #1E1F22;
179-
}
180-
181-
.terminal-panel p {
182-
margin: 0;
183-
padding: 0 .75rem;
184-
}
185-
186-
.terminal-panel input[type="text"] {
187-
display: block;
188-
width: 100%;
189-
padding: 1rem;
190-
background-color: #333;
191-
color: white;
192-
border: none;
193-
outline: none;
194-
}
195-
196-
.terminal-panel input[type="submit"] {
197-
display: none;
198-
}
199-
.code-block {
200-
background-color: #2B2D31;
201-
border: 1px solid #1E1F22;
202-
font-family: Uni Sans, monospace;
203-
font-size: 14px;
204-
padding: 10px;
205-
border-radius: 10px 10px 10px 10px;
206-
}
207-
</style>
208-
209-
7+
<link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}">
2108
</head>
2119
<body>
212-
<main>
213-
<h2>Gmail Summary</h2>
214-
<h3>Preview latest emails:</h3>
215-
<div class="email-list">
216-
<button class="email-button" id="email1">Acme Corporation</button>
217-
<button class="email-button" id="email2">John Doe</button>
218-
<button class="email-button" id="email3">Jane Smith</button>
219-
<button class="email-button" id="email4">XYZ Company</button>
220-
<button class="email-button" id="email5">Mary Johnson</button>
221-
<button class="email-button" id="email6">ABC Inc.</button>
222-
<button class="email-button" id="email7">Sarah Williams</button>
223-
<button class="email-button" id="email8">David Lee</button>
224-
<button class="email-button" id="email9">New Horizons LLC</button>
225-
<button class="email-button" id="email10">Samantha Brown</button>
226-
</div>
227-
<div class="summary">
228-
<p class="code-block">
229-
Fetching latest emails...<br><br>Email IDs: 1811bc9bc6aab2b0, 1811ffd85e3e8023, 18120e5ac28a0061, 18124ccce16ef3be, 1812598efb438247, 181267afffcae575, 1812a0f48b8acbe5, 1812b2e77f0ab5c3, 1812e4c04312b58d, 18136ebf67d52c9b.</p>
230-
<p class="code-block">
231-
Marking emails as read...<br><br>Email IDs: 1811bc9bc6aab2b0, 1811ffd85e3e8023, 18120e5ac28a0061, 18124ccce16ef3be, 1812598efb438247, 181267afffcae575, 1812a0f48b8acbe5, 1812b2e77f0ab5c3, 1812e4c04312b58d, 18136ebf67d52c9b.</p>
232-
<p class="code-block">
233-
Generated prompt for OpenAI....</p>
234-
<p class="code-block">
235-
Generated summary from OpenAI...<br><br>Hey Daniel, I've got a summary of your new emails for you. First, Zoom sent an email about enhancements to the Admin Portal, and the migration to the New Admin Experience will start on June 1. Once it's enabled, you won't be able to switch back. They also sent an email targeted at Zoom Developers, mentioning that the JWT app type will be deprecated by June 2023, and you should migrate to the server-to-server OAuth app type.
236-
237-
StreamYard announced the release of their Greenroom feature on the Business Plan, which lets hosts prepare with guests before going live. You can book a demo if you're interested.
238-
239-
You received four Adobe verification codes, but I'm not sure if you requested them: 832911, 304120, 296077, and 876965. If you didn't request them, you might want to check your account security.
10+
<pre id="terminal" class="blurred">
11+
12+
Initial message_numbers: [b'1', b'2', b'3', b'4', b'5', b'6', b'7', b'8', b'9', b'10', b'11', b'12', b'13', b'14', b'15', b'16', b'17', b'18', b'19', b'20', b'21', b'22', b'23', b'24', b'25', b'26', b'27', b'28', b'29', b'30', b'31', b'32', b'33', b'34', b'35', b'36', b'37', b'38', b'39', b'40', b'41', b'42', b'43', b'44', b'45', b'46', b'47', b'48', b'49', b'50', b'51', b'52', b'53', b'54', b'55', b'56', b'57', b'58', b'59', b'60', b'61', b'62', b'63', b'64', b'65', b'66', b'67', b'68', b'69', b'70', b'71', b'72', b'73', b'74', b'75', b'76', b'77', b'78', b'79', b'80', b'81', b'82', b'83', b'84', b'85', b'86', b'87', b'88', b'89', b'90', b'91', b'92', b'93', b'94', b'95', b'96', b'97', b'98', b'99', b'100', b'101', b'102', b'103', b'104', b'105', b'106', b'107', b'108', b'109', b'110', b'111', b'112', b'113', b'114', b'115', b'116', b'117', b'118', b'119', b'120', b'121', b'122', b'123', b'124', b'125', b'126', b'127', b'128', b'129', b'130', b'131', b'132', b'133', b'134', b'135', b'136', b'137', b'138', b'139', b'140', b'141', b'142', b'143', b'144', b'145', b'146', b'147', b'148', b'149', b'150', b'151', b'152', b'153', b'154', b'155', b'156', b'157', b'158', b'159', b'160', b'161', b'162', b'163', b'164', b'165', b'166', b'167', b'168', b'169', b'170', b'171', b'172', b'173', b'174', b'175', b'176', b'177', b'178', b'179', b'180', b'181', b'182', b'183', b'184', b'185', b'186', b'187', b'188', b'189', b'190', b'191', b'192', b'193', b'194', b'195', b'196', b'197', b'198', b'199', b'200', b'201', b'202', b'203', b'204', b'205', b'206', b'207', b'208', b'209', b'210', b'211', b'212', b'213', b'214', b'215', b'216', b'217', b'218', b'219', b'220', b'221', b'222', b'223', b'224', b'225', b'226', b'227', b'228', b'229', b'230', b'231', b'232', b'233', b'234', b'235', b'236', b'237', b'238', b'239', b'240', b'241', b'242', b'243', b'244', b'245', b'246', b'247', b'248', b'249', b'250', b'251', b'252', b'253', b'254', b'255', b'256', b'257', b'258', b'259', b'260', b'261', b'262', b'263', b'264', b'265', b'266', b'267', b'268', b'269', b'270', b'271', b'272', b'273', b'274', b'275', b'276', b'277', b'278', b'279', b'280', b'281', b'282', b'283', b'284', b'285', b'286', b'287', b'288', b'289', b'290', b'291', b'292', b'293', b'294', b'295', b'296', b'297', b'298', b'299', b'300', b'301', b'302', b'303', b'304', b'305', b'306', b'307', b'308', b'309', b'310', b'311', b'312', b'313', b'314', b'315', b'316', b'317', b'318', b'319', b'320', b'321', b'322', b'323', b'324', b'325', b'326', b'327', b'328', b'329', b'330', b'331', b'332', b'333', b'334', b'335', b'336', b'337', b'338', b'339', b'340', b'341', b'342', b'343', b'344', b'345', b'346', b'347', b'348', b'349', b'350', b'351', b'352', b'353', b'354', b'355', b'356', b'357', b'358', b'359', b'360', b'361', b'362', b'363', b'364', b'365', b'366', b'367', b'368', b'369', b'370', b'371', b'372', b'373', b'374', b'375', b'376', b'377', b'378', b'379', b'380', b'381', b'382', b'383', b'384', b'385', b'386', b'387', b'388', b'389', b'390', b'391', b'392', b'393', b'394', b'395', b'396', b'397', b'398', b'399', b'400', b'401', b'402', b'403', b'404', b'405', b'406', b'407', b'408', b'409', b'410', b'411', b'412', b'413', b'414', b'415', b'416', b'417', b'418', b'419', b'420', b'421', b'422', b'423', b'424', b'425', b'426', b'427', b'428', b'429', b'430', b'431', b'432', b'433', b'434', b'435', b'436', b'437', b'438', b'439', b'440', b'441', b'442', b'443', b'444', b'445', b'446', b'447', b'448', b'449', b'450', b'451', b'452', b'453', b'454', b'455', b'456', b'457', b'458', b'459', b'460', b'461', b'462', b'463', b'464', b'465', b'466', b'467', b'468', b'469', b'470', b'471', b'472', b'473', b'474', b'475', b'476', b'477', b'478', b'479', b'480', b'481', b'482', b'483', b'484', b'485', b'486', b'487', b'488', b'489', b'490', b'491', b'492', b'493', b'494', b'495', b'496', b'497', b'498', b'499', b'500', b'501', b'502', b'503', b'504', b'505', b'506', b'507', b'508', b'509', b'510', b'511', b'512', b'513', b'514', b'515', b'516', b'517', b'518', b'519', b'520', b'521', b'522', b'523', b'524', b'525', b'526', b'527', b'528', b'529', b'530', b'531', b'532', b'533', b'534', b'535', b'536', b'537', b'538', b'539', b'540', b'541', b'542', b'543', b'544', b'545', b'546', b'547', b'548', b'549', b'550', b'551', b'552', b'553', b'554', b'555', b'556', b'557', b'558', b'559', b'560', b'561', b'562', b'563', b'564', b'565', b'566', b'567', b'568', b'569', b'570', b'571', b'572', b'573', b'574', b'575', b'576', b'577', b'578', b'579', b'580', b'581', b'582', b'583', b'584', b'585', b'586', b'587', b'588', b'589', b'590', b'591', b'592', b'593', b'594', b'595', b'596', b'597', b'598', b'599', b'600', b'601', b'602', b'603', b'604', b'605', b'606', b'607', b'608', b'609', b'610', b'611', b'612', b'613', b'614', b'615', b'616', b'617', b'618', b'619', b'620', b'621', b'622', b'623', b'624', b'625', b'626', b'627', b'628', b'629', b'630', b'631', b'632', b'633', b'634', b'635', b'636', b'637', b'638', b'639', b'640', b'641', b'642', b'643', b'644', b'645', b'646', b'647', b'648', b'649', b'650', b'651', b'652', b'653', b'654', b'655', b'656', b'657', b'658', b'659', b'660', b'661', b'662', b'663', b'664', b'665', b'666', b'667', b'668', b'669', b'670', b'671', b'672', b'673', b'674', b'675', b'676', b'677', b'678', b'679', b'680', b'681', b'682', b'683']
13+
Input:
14+
Sender: redacted@gmail.com
15+
Subject: Accepted: Working Session with Daniel / Redacted @ Tue Apr 11, 2023
16+
10am - 11am (CDT) (redacted@email.com)
17+
Body: Not Today Satan.
18+
19+
Working Session with Daniel / Redacted
20+
Tuesday Apr 11, 2023 ⋅ 10am – 11am
21+
Central Time - Chicago
22+
23+
24+
Join Zoom Meeting
25+
https://geniecast.zoom.us/j/883lolnoped5clRDZFRkSDh4dz09
26+
27+
Join by phone
28+
(US) +1 669-555-9171
29+
(US) +1 669-555-6833
30+
31+
32+
Reschedule this event:
33+
meet.mayday.am/1b1985d0-6ed1-4489-a386-22ithinknot6-d26a-46dd-bfab-678cbe755e68/reschedule
34+
35+
Guests
36+
View all guest info
37+
https://calendar.google.com/calendar/event?action=VIEW&eid=XzZoaWowZTlpY2NyNnottodaysatanmYjE3ZGUyOGYyZGVkOTY2ODQ3Mg&ctz=America%2FChicago&hl=en&es=1
38+
39+
~~//~~
40+
Invitation from Google Calendar: https://calendar.google.com/calendar/
41+
42+
You are receiving this email because you are an attendee on the event. To
43+
stop receiving future updates for this event, decline this event.
44+
45+
Forwarding this invitation could allow any recipient to send a response to
46+
the organizer, be added to the guest list, invite others regardless of
47+
their own invitation status, or modify your RSVP.
48+
49+
Learn more https://support.google.com/calendar/answer/37135#forwarding
50+
51+
############################################
52+
# #
53+
# Character count for this email: 1616 #
54+
# Total characters processed so far: 1616 #
55+
# #
56+
############################################
57+
58+
Input:
59+
Sender: Daniel von Seckendorff <redacted@gmail.com>
60+
Subject: This is a test
61+
Body: Banana
62+
63+
-Daniel
64+
65+
############################################
66+
# #
67+
# Character count for this email: 104 #
68+
# Total characters processed so far: 1720 #
69+
# #
70+
############################################
71+
</pre>
72+
<div class="buttons-container">
73+
<button class="terminal-toggle-button" id="terminal-toggle-button">
74+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" fill="white">
75+
<path d="M19 3H8a2 2 0 0 0-2 2v1H4.62A1.5 1.5 0 0 0 3 7.5L3.5 22a1.5 1.5 0 0 0 1.5 1.5H18a2 2 0 0 0 2-2V5a2 2 0 0 0-1-1.73V3zm0 17H6V5h13v15zm-9-7h6v2H10zm0-4h6v2H10zm0 8h6v2H10z"/>
76+
</svg>
77+
</button>
78+
<button class="settings-button" id="settings-button">
79+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" fill="white">
80+
<path d="M19.43 12.98c.04-.32.07-.64.07-.98s-.03-.66-.07-.98l2.11-1.65c.19-.15.24-.42.12-.64l-2-3.46c-.12-.22-.39-.3-.61-.22l-2.49 1c-.52-.4-1.08-.73-1.69-1.01l-.38-2.65C14.46 2.18 14.25 2 14 2h-4c-.25 0-.46.18-.49.42l-.38 2.65c-.61.28-1.17.61-1.69 1.01l-2.49-1c-.23-.09-.49 0-.61.22l-2 3.46c-.13.22-.07.49.12.64l2.11 1.65c-.04.32-.07.65-.07.98s.03.66.07.98l-2.11 1.65c-.19.15-.24.42-.12.64l2 3.46c.12.22.39.3.61.22l2.49-1c.52.4 1.08.73 1.69 1.01l.38 2.65c.03.24.24.42.49.42h4c.25 0 .46-.18.49-.42l.38-2.65c.61-.28 1.17-.61 1.69-1.01l2.49 1c.23.09.49 0 .61-.22l2-3.46c.12-.22.07-.49-.12-.64l-2.11-1.65zm-7 4c-1.66 0-3-1.34-3-3s1.34-3 3-3 3 1.34 3 3-1.34 3-3 3z"/>
81+
</svg>
82+
</button>
83+
</div>
24084

241-
Lastly, you've successfully paid for a subscription to Film Impact's Essentials Collection for $15, and it will renew every month, with the next charge on 7/4/22.
24285

243-
That's all for now, and remember, what do you call an alligator in a vest? An investigator! Have a great day, Daniel!</p>
244-
<p class="code-block">
245-
Sending summary to Elevenlabs...</p>
246-
</div>
247-
</main>
86+
<div class="centered-container">
87+
<h2>Next Summary: 0 emails</h2>
88+
<div class="senders-container">
89+
<div class="senders-header">
90+
<span>Senders</span>
91+
<span class="arrow" id="arrow">&#x25BC;</span>
92+
</div>
93+
<div class="senders-text" id="senders-text">This is a placeholder of a unique senders payload.
94+
</div>
95+
</div>
96+
<div class="run-button" id="run-button">
97+
Run
98+
</div>
99+
<div class="info-container">
100+
<span>Variable Quantity = true</span>
101+
<span>Max Characters = 25,000</span></span>
102+
</div>
103+
</div>
104+
<div class="settings-container hidden">
105+
<h2>Settings</h2>
106+
<div class="settings-menu">
107+
<div class="settings-item">
108+
<div class="settings-header">
109+
<span>OpenAI</span>
110+
<span class="arrow" id="openai-arrow">&#x25BC;</span>
111+
</div>
112+
<div class="settings-text" id="openai-text">
113+
<div class="input-container">
114+
<input type="text" class="api-key-input" id="api-key-input" placeholder="enter your API key"/>
115+
</div>
116+
</div>
117+
</div>
118+
<div class="settings-item">
119+
<div class="settings-header">
120+
<span>Connected Accounts</span>
121+
<span class="arrow" id="accounts-arrow">&#x25BC;</span>
122+
</div>
123+
<div class="settings-text" id="accounts-text">
124+
<div class="account-actions">
125+
<button class="account-action-btn add-account">Add Account</button>
126+
<button class="account-action-btn remove-account">Remove Account</button>
127+
</div>
128+
<p>Enable IMAP for accounts. Use application passwords when possible.</p>
129+
</div>
248130

249-
<!-- Terminal-like panel -->
250-
<div class="terminal-panel">
251-
<br>
252-
<p>Logs of gmailsummary.py will appear here...</p>
253131
</div>
132+
</div>
133+
<script src="{{ url_for('static', filename='scripts.js') }}"></script>
254134
</body>
255-
256-
</html>
135+
</html>

0 commit comments

Comments
 (0)