feat: add supporters page

Signed-off-by: Frost Ming <[email protected]>

pycon/settings/base.py

@@ -26,6 +26,7 @@
 INSTALLED_APPS = [
     "base",
     "home",
+    "supporter",
     "search",
     "bakery",
     "wagtailbakery",

pycon/static/css/pycon.css

@@ -47,6 +47,17 @@ a:hover {
     border-bottom-color: #ffd43b;
 }
 
+main {
+    margin: 0 10px;
+}
+
+@media (min-width: 1200px) {
+    main {
+        margin: 0 auto;
+        width: 1200px;
+    }
+}
+
 .content {
     overflow: hidden;
 }
@@ -206,10 +217,26 @@ footer i {
     background-color: #ffffff;
     border-radius: 10px;
     box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1), 0 0 20px rgba(0, 0, 0, 0.05);
-    padding: 2rem;
     position: relative;
+    padding: 1rem;
     z-index: 1;
-    max-width: 1200px;
-    margin: 0 auto;
 }
 
+@media (min-width: 992px) {
+    .card {
+        padding: 1rem 2rem;
+    }
+}
+
+.title {
+    border: 2px solid #4B8BBE;  /* Python blue */
+    background-color: #FFD43B;  /* Python yellow */
+    color: white;  /* White text */
+    text-shadow:  2px  2px 0 #4B8BBE;  /* Python blue outline */
+    padding: 20px;
+    margin-bottom: 20px;
+    display: inline-block;
+    font-weight: bold;
+    border-radius: 10px;  /* Rounded corners */
+    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);  /* Subtle shadow */
+}

pycon/templates/components/navbar.html

@@ -3,7 +3,7 @@
     {% get_site_root as site_root %}
     <ul>
         <li><a href="{% pageurl site_root %}" class="nav-link">首页</a></li>
-        <li><a href="#" class="nav-link">赞助</a></li>
+        <li><a href="/2024/supporter" class="nav-link">赞助</a></li>
         <li><a href="https://jsj.top/f/Ej6XBX" class="nav-link">演讲</a></li>
         <li><a href="https://jsj.top/f/BYWgq6" class="nav-link">志愿者</a></li>
     </ul>

supporter/blocks.py

@@ -0,0 +1,29 @@
+from wagtail.blocks import (
+    CharBlock,
+    ListBlock,
+    RichTextBlock,
+    StreamBlock,
+    StructBlock,
+    URLBlock,
+)
+from wagtail.images.blocks import ImageChooserBlock
+
+
+class SupporterBlock(StructBlock):
+    name = CharBlock(required=True)
+    description = CharBlock(required=False)
+    logo = ImageChooserBlock(required=False)
+    url = URLBlock(required=False)
+
+
+class SupporterListBlock(StructBlock):
+    heading = CharBlock(required=True)
+    supporters = ListBlock(SupporterBlock())
+
+    class Meta:
+        template = "supporter/blocks/supporter-list.html"
+
+
+class SupporterStreamBlock(StreamBlock):
+    paragraph = RichTextBlock(required=False)
+    supporters = ListBlock(SupporterListBlock())

supporter/migrations/0001_initial.py

@@ -0,0 +1,28 @@
+# Generated by Django 5.1.1 on 2024-10-08 09:55
+
+import django.db.models.deletion
+import wagtail.fields
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    initial = True
+
+    dependencies = [
+        ('wagtailcore', '0094_alter_page_locale'),
+    ]
+
+    operations = [
+        migrations.CreateModel(
+            name='SupporterPage',
+            fields=[
+                ('page_ptr', models.OneToOneField(auto_created=True, on_delete=django.db.models.deletion.CASCADE, parent_link=True, primary_key=True, serialize=False, to='wagtailcore.page')),
+                ('body', wagtail.fields.StreamField([('paragraph', 0), ('supporters', 8)], block_lookup={0: ('wagtail.blocks.RichTextBlock', (), {'required': False}), 1: ('wagtail.blocks.CharBlock', (), {'required': True}), 2: ('wagtail.blocks.CharBlock', (), {'required': False}), 3: ('wagtail.images.blocks.ImageChooserBlock', (), {'required': False}), 4: ('wagtail.blocks.URLBlock', (), {'required': False}), 5: ('wagtail.blocks.StructBlock', [[('name', 1), ('description', 2), ('logo', 3), ('url', 4)]], {}), 6: ('wagtail.blocks.ListBlock', (5,), {}), 7: ('wagtail.blocks.StructBlock', [[('heading', 1), ('supporters', 6)]], {}), 8: ('wagtail.blocks.ListBlock', (7,), {})}, help_text='Add supporters to the page.')),
+            ],
+            options={
+                'abstract': False,
+            },
+            bases=('wagtailcore.page',),
+        ),
+    ]

supporter/models.py

@@ -0,0 +1,21 @@
+from wagtail.admin.panels import FieldPanel
+from wagtail.fields import StreamField
+from wagtail.models import Page
+
+from supporter.blocks import SupporterStreamBlock
+
+# Create your models here.
+
+
+class SupporterPage(Page):
+    parent_page_types = ["home.HomePage"]
+
+    body = StreamField(
+        SupporterStreamBlock(),
+        use_json_field=True,
+        help_text="Add supporters to the page.",
+    )
+
+    content_panels = Page.content_panels + [
+        FieldPanel("body"),
+    ]

supporter/static/css/supporter.css

@@ -0,0 +1,58 @@
+
+
+.supporter-list {
+    background-color: #f8f8f8;
+    border: 2px solid #4B8BBE;
+    border-radius: 10px;
+    padding: 20px;
+    margin-top: 20px;
+}
+
+.supporter-list h2 {
+    color: #4B8BBE;
+    font-size: 24px;
+    margin-bottom: 20px;
+    text-align: center;
+}
+
+.supporter-list ul {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: center;
+}
+
+.supporter-list .supporter {
+    background-color: white;
+    border: 1px solid #ddd;
+    border-radius: 5px;
+    margin: 10px;
+    padding: 15px;
+    width: 240px;
+    text-align: center;
+    transition: transform 0.2s, box-shadow 0.2s;
+}
+
+.supporter-list .supporter:hover {
+    transform: translateY(-5px);
+    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
+}
+
+.supporter-list .supporter img {
+    max-width: 100%;
+    height: auto;
+    margin-bottom: 10px;
+}
+
+.supporter-list .supporter-info p {
+    margin: 5px 0;
+}
+
+.supporter-list .supporter-info p:first-child {
+    font-weight: bold;
+    color: #4B8BBE;
+}
+
+.block-supporters ul {
+    list-style-type: none;
+    padding: 0;
+}

supporter/templates/supporter/blocks/supporter-list.html

@@ -0,0 +1,19 @@
+{% load wagtailcore_tags wagtailimages_tags %}
+
+<div class="supporter-list">
+    <h2>{{ self.heading }}</h2>
+    <ul>
+        {% for supporter in self.supporters %}
+            <li class="supporter">
+                <a href="{{ supporter.url }}" target="_blank">
+                    {% if supporter.logo %}
+                        {% image supporter.logo width-240 %}
+                    {% endif %}
+                    <div class="supporter-info">
+                        <p>{{ supporter.name }}</p>
+                    </div>
+                </a>
+            </li>
+        {% endfor %}
+    </ul>
+</div>

supporter/templates/supporter/supporter_page.html

@@ -0,0 +1,18 @@
+{% extends "base.html" %}
+{% load static %}
+{% load wagtailcore_tags %}
+
+{% block extra_css %}
+<link rel="stylesheet" href="{% static 'css/supporter.css' %}">
+{% endblock %}
+
+{% block content %}
+<main>
+    <h1 class="title">{{ page.title }}</h1>
+    <div class="card">
+        <div class="card-body">
+            {{ page.body }}
+        </div>
+    </div>
+</main>
+{% endblock %}