added tool tips

Author: Mole1424

templates/events/form.html

@@ -98,8 +98,18 @@ <h1>Create Event</h1>
                         <div id="custom-icon-preview" class="d-none form-image"></div>
                     </div>
                     <fieldset class="form-floating">
-                        <input type="text" name="icon" id="icon" class="form-control last-border" placeholder="ph-calendar" list="icon-list">
-                        <label for="icon">Event Phosphor Icon</label>
+                        <input 
+                            type="text" 
+                            name="icon" 
+                            id="icon" 
+                            class="form-control last-border" 
+                            placeholder="ph-calendar" 
+                            list="icon-list"
+                            data-bs-toggle="tooltip"
+                            data-bs-html="true"
+                            data-bs-title="Enter a <a href='https://phosphoricons.com/' target='_blank'>Phosphor Icon</a> name or a <a href='https://github.com/UWCS/fulcrum/tree/main/static/icons' target='_blank'>custom icon</a> (upload files here if you want)"
+                        >
+                        <label for="icon">Event Icon</label>
                         <datalist id="icon-list">
                             {% for icon in icons %}
                                 <option value="{{ icon }}">
@@ -119,7 +129,17 @@ <h1>Create Event</h1>
                     </div>
                     <div class="input-group-text">#</div>
                     <fieldset class="form-floating">
-                        <input type="text" name="text_colour" id="text_colour" class="form-control last-border" placeholder="#000000" list="colour-list">
+                        <input 
+                            type="text"
+                            name="text_colour"
+                            id="text_colour"
+                            class="form-control last-border"
+                            placeholder="#000000"
+                            list="colour-list"
+                            data-bs-toggle="tooltip"
+                            data-bs-html="true"
+                            data-bs-title="Enter a hex colour code or a <a href='https://github.com/UWCS/fulcrum/blob/main/config.py' target='_blank'>predefined colour</a>"
+                        >
                         <label for="text_colour">Event Colour</label>
                         <datalist id="colour-list">
                             {% for colour in colours %}
@@ -183,4 +203,9 @@ <h1>Create Event</h1>
     {% endfor %}
 </div>
 
+<script>
+    const tooltipTriggerList = document.querySelectorAll('[data-bs-toggle="tooltip"]')
+    const tooltipList = [...tooltipTriggerList].map(tooltipTriggerEl => new bootstrap.Tooltip(tooltipTriggerEl))
+</script>
+
 {% endblock %}