-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
150 lines (126 loc) · 5.56 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
<!DOCTYPE html>
<html lang="en">
<head>
<title>Google Calendar Link Generator</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="Quickly create links for Google Calendar events, with timezone handling.">
<link rel="stylesheet" href="/css/main.css">
<link href="https://fonts.googleapis.com/css?family=Lato|Nunito+Sans|Roboto|Roboto+Mono|Roboto+Slab" rel="stylesheet">
<script type="text/javascript" src="/js/jquery-3.2.1.js"></script>
<script type="text/javascript" src="/js/clipboard.js-master/dist/clipboard.min.js"></script>
<script type="text/javascript" src="/js/form.js"></script>
<script type="text/javascript" src="/js/form-resize.js"></script>
<script async src="https://analytics.eu.umami.is/script.js" data-website-id="7ac7236d-993c-40d9-8dc4-430e1265bf4e"></script>
</head>
<body>
<div class="container"><!-- main flexbox container -->
<div class="header"><!-- item 1 in MAIN container -->
<div class="header-content">
<h1>Create a Link to a Google Calendar Event</h1>
</div>
</div>
<div class="page-body"><!-- item 2 in MAIN container // Begin Body Container-->
<div class="col1"><!-- left column in main container -->
<h2>Fill out your event details</h2>
<div class="form-container">
<form NAME="calendarInput" ACTION="" METHOD="GET" class="form">
<input type="text" NAME="eventName" VALUE="Event Name">
<br />
<input type="text" name="eventLocation" value="Event Location">
<br />
<select class="dropdown" name="eventMonth">
<option value="01">January</option>
<option value="02">February</option>
<option value="03">March</option>
<option value="04">April</option>
<option value="05">May</option>
<option value="06">June</option>
<option value="07">July</option>
<option value="08">August</option>
<option value="09">September</option>
<option value="10">October</option>
<option value="11">November</option>
<option value="12">December</option>
</select>
<select name="eventDay" class="dropdown">
<option value="01">1</option>
<option value="02">2</option>
<option value="03">3</option>
<option value="04">4</option>
<option value="05">5</option>
<option value="06">6</option>
<option value="07">7</option>
<option value="08">8</option>
<option value="09">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
</select>
<select name="eventYear" class="dropdown">
<option value="2023">2023</option>
<option value="2024">2024</option>
<option value="2025">2025</option>
<option value="2026">2026</option>
<option value="2027">2027</option>
<option value="2028">2028</option>
<option value="2029">2029</option>
<option value="2030">2030</option>
<option value="2031">2031</option>
<option value="2032">2032</option>
</select>
<br />
<input class="time" id="startTime" name="eventStartTime" type="time" required="true" value="19:00">
to
<input class="time" id="endTime" name="eventEndTime" type="time" value="20:00" required="true">
<br />
<span class="label label-day">All day?</span><input type="checkbox" id="allDay" value="1">
<br />
<textarea class="box" name="eventDetails" cols="35" rows="5">Describe your event.</textarea>
<br />
<div class="btn-container">
<button type="button" class="btn btn-create" onClick="writeText(this.form)">Create Link</button>
</div>
</div>
</div>
<div class="col2"><!-- right column in main container -->
<h2>Copy your link</h2>
<!-- output GCal link -->
<div class="form-container">
<textarea class="box" id="outputBox" type="text" name="gCalOutput" readonly cols="35" rows="5"></textarea><br>
<div class="btn-container">
<button type="button" class="btn btn-copy" data-clipboard-action="copy" data-clipboard-target="#outputBox">Copy</button>
</div>
</form>
</div>
</div>
</div>
<footer class="footer"><!-- item 3 in MAIN container -->
<div class="footer-content">
<p>Google <a href="https://www.google.com/policies/privacy/partners/">privacy & terms</a>. This site is not affiliated with Google or Google Calendar. <a href="https://robertbrucecarter.com/contact/">Report bugs</a>.</p>
</div>
</footer>
</div>
</div>
</body>
</html>