107107 .required {
108108 color : red;
109109 }
110+ .error-message {
111+ color : # ff4d4d ;
112+ background-color : # ffe6e6 ;
113+ border : 1px solid # ff9999 ;
114+ padding : 10px 20px ;
115+ border-radius : 5px ;
116+ margin-bottom : 15px ;
117+ font-weight : bold;
118+ text-align : center;
119+ box-shadow : 0 2px 4px rgba (0 , 0 , 0 , 0.1 );
120+ }
110121 </ style >
111122</ head >
112123< body >
113124 < div class ="emoji "> ✈️</ div >
114125 < h1 > Manual Flight Entry</ h1 >
115126 < p > Enter your flight details manually</ p >
116127
128+ {% if error %}
129+ < div class ="error-message ">
130+ {{ error }}
131+ </ div >
132+ {% endif %}
133+
117134 < div class ="form-container ">
118135 < form action ="/create_manual_event " method ="post ">
119136 < div class ="form-row ">
@@ -152,11 +169,11 @@ <h1>Manual Flight Entry</h1>
152169 < div class ="form-row ">
153170 < div class ="form-group ">
154171 < label for ="scheduled_departure "> Departure Time: < span class ="required "> *</ span > </ label >
155- < input type ="text " id ="scheduled_departure " name ="scheduled_departure " required placeholder =" yyyy-mm-dd hh:mm " pattern =" \d{4}-\d{2}-\d{2} \d{2}:\d{2} " title =" Format: yyyy-mm-dd hh:mm (24-hour) " >
172+ < input type ="datetime-local " id ="scheduled_departure " name ="scheduled_departure " required >
156173 </ div >
157174 < div class ="form-group ">
158175 < label for ="scheduled_arrival "> Arrival Time: < span class ="required "> *</ span > </ label >
159- < input type ="text " id ="scheduled_arrival " name ="scheduled_arrival " required placeholder =" yyyy-mm-dd hh:mm " pattern =" \d{4}-\d{2}-\d{2} \d{2}:\d{2} " title =" Format: yyyy-mm-dd hh:mm (24-hour) " >
176+ < input type ="datetime-local " id ="scheduled_arrival " name ="scheduled_arrival " required >
160177 </ div >
161178 </ div >
162179
@@ -165,44 +182,18 @@ <h1>Manual Flight Entry</h1>
165182 < label for ="origin_timezone "> Origin Timezone: < span class ="required "> *</ span > </ label >
166183 < select id ="origin_timezone " name ="origin_timezone " required >
167184 < option value =""> Select timezone...</ option >
168- < option value ="America/New_York "> America/New_York (EST/EDT)</ option >
169- < option value ="America/Chicago "> America/Chicago (CST/CDT)</ option >
170- < option value ="America/Denver "> America/Denver (MST/MDT)</ option >
171- < option value ="America/Los_Angeles "> America/Los_Angeles (PST/PDT)</ option >
172- < option value ="America/Anchorage "> America/Anchorage (AKST/AKDT)</ option >
173- < option value ="Pacific/Honolulu "> Pacific/Honolulu (HST)</ option >
174- < option value ="Europe/London "> Europe/London (GMT/BST)</ option >
175- < option value ="Europe/Paris "> Europe/Paris (CET/CEST)</ option >
176- < option value ="Europe/Berlin "> Europe/Berlin (CET/CEST)</ option >
177- < option value ="Asia/Tokyo "> Asia/Tokyo (JST)</ option >
178- < option value ="Asia/Shanghai "> Asia/Shanghai (CST)</ option >
179- < option value ="Asia/Dubai "> Asia/Dubai (GST)</ option >
180- < option value ="Asia/Singapore "> Asia/Singapore (SGT)</ option >
181- < option value ="Asia/Hong_Kong "> Asia/Hong_Kong (HKT)</ option >
182- < option value ="Australia/Sydney "> Australia/Sydney (AEDT/AEST)</ option >
183- < option value ="UTC "> UTC</ option >
185+ {% for tz_name, tz_display in timezones %}
186+ < option value ="{{ tz_name }} "> {{ tz_display }}</ option >
187+ {% endfor %}
184188 </ select >
185189 </ div >
186190 < div class ="form-group ">
187191 < label for ="destination_timezone "> Destination Timezone: < span class ="required "> *</ span > </ label >
188192 < select id ="destination_timezone " name ="destination_timezone " required >
189193 < option value =""> Select timezone...</ option >
190- < option value ="America/New_York "> America/New_York (EST/EDT)</ option >
191- < option value ="America/Chicago "> America/Chicago (CST/CDT)</ option >
192- < option value ="America/Denver "> America/Denver (MST/MDT)</ option >
193- < option value ="America/Los_Angeles "> America/Los_Angeles (PST/PDT)</ option >
194- < option value ="America/Anchorage "> America/Anchorage (AKST/AKDT)</ option >
195- < option value ="Pacific/Honolulu "> Pacific/Honolulu (HST)</ option >
196- < option value ="Europe/London "> Europe/London (GMT/BST)</ option >
197- < option value ="Europe/Paris "> Europe/Paris (CET/CEST)</ option >
198- < option value ="Europe/Berlin "> Europe/Berlin (CET/CEST)</ option >
199- < option value ="Asia/Tokyo "> Asia/Tokyo (JST)</ option >
200- < option value ="Asia/Shanghai "> Asia/Shanghai (CST)</ option >
201- < option value ="Asia/Dubai "> Asia/Dubai (GST)</ option >
202- < option value ="Asia/Singapore "> Asia/Singapore (SGT)</ option >
203- < option value ="Asia/Hong_Kong "> Asia/Hong_Kong (HKT)</ option >
204- < option value ="Australia/Sydney "> Australia/Sydney (AEDT/AEST)</ option >
205- < option value ="UTC "> UTC</ option >
194+ {% for tz_name, tz_display in timezones %}
195+ < option value ="{{ tz_name }} "> {{ tz_display }}</ option >
196+ {% endfor %}
206197 </ select >
207198 </ div >
208199 </ div >
0 commit comments