feat: add captcha protection to user-facing forms

web/forms.py

@@ -578,6 +578,8 @@ def clean(self):
 
 
 class ReviewForm(forms.ModelForm):
+    captcha = CaptchaField(widget=TailwindCaptchaTextInput)
+
     class Meta:
         model = Review
         fields = ("rating", "comment")
@@ -910,6 +912,7 @@ class SuccessStoryForm(forms.ModelForm):
     content = MarkdownxFormField(
         label="Content", help_text="Use markdown for formatting. You can use **bold**, *italic*, lists, etc."
     )
+    captcha = CaptchaField(widget=TailwindCaptchaTextInput)
 
     class Meta:
         model = SuccessStory
@@ -929,6 +932,8 @@ class Meta:
 class LearnForm(forms.ModelForm):
     """Form for creating and editing waiting rooms."""
 
+    captcha = CaptchaField(widget=TailwindCaptchaTextInput)
+
     class Meta:
         model = WaitingRoom
         fields = ["title", "description", "subject", "topics"]
@@ -1254,6 +1259,7 @@ class ForumTopicForm(forms.Form):
         widget=TailwindURLInput(attrs={"placeholder": "https://github.com/your-org/your-repo/milestone/1"}),
         help_text="Link to a related GitHub milestone (optional)",
     )
+    captcha = CaptchaField(widget=TailwindCaptchaTextInput)
 
     def clean_github_issue_url(self):
         url = self.cleaned_data.get("github_issue_url")
@@ -1308,6 +1314,8 @@ class Meta:
 class BlogPostForm(forms.ModelForm):
     """Form for creating and editing blog posts."""
 
+    captcha = CaptchaField(widget=TailwindCaptchaTextInput)
+
     class Meta:
         model = BlogPost
         fields = ["title", "content", "excerpt", "featured_image", "status", "tags"]
@@ -1664,6 +1672,7 @@ class MemeForm(forms.ModelForm):
         ),
         help_text="If your subject isn't listed, enter a new one here",
     )
+    captcha = CaptchaField(widget=TailwindCaptchaTextInput)
 
     class Meta:
         model = Meme
@@ -1902,6 +1911,8 @@ class Meta:
 
 
 class StudyGroupForm(forms.ModelForm):
+    captcha = CaptchaField(widget=TailwindCaptchaTextInput)
+
     class Meta:
         model = StudyGroup
         fields = ["name", "description", "course", "max_members", "is_private"]
@@ -1915,6 +1926,7 @@ class VideoRequestForm(forms.ModelForm):
         # Only allow href, title and target attributes on anchor tags for security
         "a": ["href", "title", "target"],
     }
+    captcha = CaptchaField(widget=TailwindCaptchaTextInput)
 
     class Meta:
         model = VideoRequest
@@ -1965,6 +1977,7 @@ class SurveyForm(forms.ModelForm):
         widget=TailwindInput(attrs={"placeholder": "Enter survey title"}),
         help_text="Give your survey a clear and descriptive title",
     )
+    captcha = CaptchaField(widget=TailwindCaptchaTextInput)
 
     class Meta:
         model = Survey

web/templates/add_meme.html

@@ -65,13 +65,23 @@ <h1 class="text-2xl font-bold mb-6">Add a New Educational Meme</h1>
               <img id="preview"
                    src=""
                    alt="Preview"
+                   width="1024"
+                   height="768"
                    class="max-h-64 max-w-full object-contain" />
             </div>
             <p class="text-xs text-gray-500 dark:text-gray-400 mt-2 text-center">
               Preview is for reference only and may appear differently on the site.
             </p>
           </div>
         </div>
+        <div>
+          <label for="{{ form.captcha.id_for_label }}"
+                 class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">CAPTCHA</label>
+          {{ form.captcha }}
+          {% if form.captcha.errors %}
+            <p class="text-sm text-red-600 dark:text-red-400 mt-1">{{ form.captcha.errors.0 }}</p>
+          {% endif %}
+        </div>
         {% if form.non_field_errors %}
           <div class="bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded">
             {% for error in form.non_field_errors %}<p>{{ error }}</p>{% endfor %}

web/templates/success_stories/create.html

@@ -106,6 +106,15 @@ <h1 class="text-2xl font-bold mb-6">
               Draft: Save but don't publish yet. Published: Make visible to everyone.
             </p>
           </div>
+          <!-- CAPTCHA -->
+          <div>
+            <label for="{{ form.captcha.id_for_label }}"
+                   class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">CAPTCHA</label>
+            {{ form.captcha }}
+            {% if form.captcha.errors %}
+              <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ form.captcha.errors }}</p>
+            {% endif %}
+          </div>
         </div>
         <div class="pt-6 flex justify-end space-x-3">
           <a href="{% if is_edit %}{% url 'success_story_detail' slug=success_story.slug %}{% else %}{% url 'success_story_list' %}{% endif %}"

web/templates/videos/submit_request.html

@@ -2,7 +2,9 @@
 
 {% load static %}
 
-{% block title %}Request a Video{% endblock %}
+{% block title %}
+  Request a Video
+{% endblock title %}
 {% block content %}
   <div class="container mx-auto px-4 py-8">
     <div class="max-w-3xl mx-auto">
@@ -42,6 +44,14 @@ <h1 class="text-3xl font-bold mb-4">Request an Educational Video</h1>
               <p class="mt-2 text-sm text-red-600 dark:text-red-500">{{ form.description.errors.0 }}</p>
             {% endif %}
           </div>
+          <div class="mb-6">
+            <label for="{{ form.captcha.id_for_label }}"
+                   class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">CAPTCHA</label>
+            {{ form.captcha }}
+            {% if form.captcha.errors %}
+              <p class="mt-2 text-sm text-red-600 dark:text-red-500">{{ form.captcha.errors.0 }}</p>
+            {% endif %}
+          </div>
           <div class="flex justify-end">
             <a href="{% url 'video_request_list' %}"
                class="bg-gray-200 hover:bg-gray-300 dark:bg-gray-700 dark:hover:bg-gray-600 text-gray-800 dark:text-white font-semibold py-2 px-4 rounded mr-4">
@@ -56,4 +66,4 @@ <h1 class="text-3xl font-bold mb-4">Request an Educational Video</h1>
       </div>
     </div>
   </div>
-{% endblock %}
+{% endblock content %}

web/templates/web/forum/create_topic.html

@@ -85,6 +85,14 @@ <h1 class="text-3xl font-bold mb-4">
               <div class="mt-1 text-sm text-red-600 dark:text-red-400">{{ form.github_milestone_url.errors }}</div>
             {% endif %}
           </div>
+          <div>
+            <label for="{{ form.captcha.id_for_label }}"
+                   class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">CAPTCHA</label>
+            {{ form.captcha }}
+            {% if form.captcha.errors %}
+              <div class="mt-1 text-sm text-red-600 dark:text-red-400">{{ form.captcha.errors }}</div>
+            {% endif %}
+          </div>
           <div class="flex justify-end space-x-4">
             <a href="{% if is_edit %}{% url 'forum_topic' topic.category.slug topic.id %}{% else %}{% url 'forum_category' category.slug %}{% endif %}"
                class="px-4 py-2 border border-gray-300 dark:border-gray-600 rounded text-gray-700 dark:text-gray-300 hover:bg-gray-50 dark:hover:bg-gray-700">

web/templates/web/forum/edit_topic.html

@@ -66,6 +66,14 @@ <h1 class="text-3xl font-bold mb-4">Edit Topic</h1>
               <div class="mt-1 text-sm text-red-600 dark:text-red-400">{{ form.github_milestone_url.errors }}</div>
             {% endif %}
           </div>
+          <div>
+            <label for="{{ form.captcha.id_for_label }}"
+                   class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">CAPTCHA</label>
+            {{ form.captcha }}
+            {% if form.captcha.errors %}
+              <div class="mt-1 text-sm text-red-600 dark:text-red-400">{{ form.captcha.errors }}</div>
+            {% endif %}
+          </div>
           <div class="flex justify-end space-x-4">
             <a href="{% url 'forum_topic' topic.category.slug topic.id %}"
                class="px-4 py-2 border border-gray-300 dark:border-gray-600 rounded text-gray-700 dark:text-gray-300 hover:bg-gray-50 dark:hover:bg-gray-700">