@django-stack/cli 0.10.0 → 0.11.0

package/templates/frontend-templates/website/static/website/global.css

@@ -0,0 +1,232 @@
+/* A small, plain stylesheet: replace it with your own design. */
+:root {
+  --color-bg: #ffffff;
+  --color-text: #1d2420;
+  --color-muted: #5b6862;
+  --color-line: #e3e8e4;
+  --color-accent: #0c4b33;
+  --color-accent-soft: #e8f3ee;
+  --font-body: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
+  --width: 72rem;
+  --width-text: 44rem;
+  color-scheme: light dark;
+}
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    --color-bg: #111614;
+    --color-text: #e6ebe8;
+    --color-muted: #a1aba6;
+    --color-line: #2a322e;
+    --color-accent: #6fcf9f;
+    --color-accent-soft: #1b2a23;
+  }
+}
+
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+}
+
+body {
+  margin: 0;
+  background: var(--color-bg);
+  color: var(--color-text);
+  font-family: var(--font-body);
+  line-height: 1.6;
+}
+
+a {
+  color: var(--color-accent);
+}
+
+img {
+  max-width: 100%;
+  height: auto;
+}
+
+.container {
+  width: min(100% - 2rem, var(--width));
+  margin-inline: auto;
+}
+
+.narrow {
+  width: min(100% - 2rem, var(--width-text));
+  margin-inline: auto;
+}
+
+.muted {
+  color: var(--color-muted);
+}
+
+.prose h2,
+.prose h3 {
+  line-height: 1.25;
+  margin-top: 2em;
+}
+
+.prose blockquote {
+  margin: 2rem 0;
+  padding-left: 1.25rem;
+  border-left: 4px solid var(--color-accent);
+}
+
+.button {
+  display: inline-block;
+  padding: 0.6rem 1.2rem;
+  border-radius: 0.5rem;
+  background: var(--color-accent);
+  color: var(--color-bg);
+  font-weight: 600;
+  text-decoration: none;
+  border: 0;
+  cursor: pointer;
+  font-family: inherit;
+  font-size: inherit;
+}
+
+.grid {
+  display: grid;
+  gap: 2rem;
+  grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr));
+}
+
+.preview-banner {
+  background: #fde68a;
+  color: #422006;
+  padding: 0.5rem 1rem;
+  text-align: center;
+  font-size: 0.9rem;
+}
+
+/* The layout: website/templates/website/base.html */
+.site-header {
+  border-bottom: 1px solid var(--color-line);
+}
+.bar {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 1rem;
+  align-items: center;
+  justify-content: space-between;
+  padding-block: 1rem;
+}
+.brand {
+  font-weight: 700;
+  font-size: 1.2rem;
+  color: inherit;
+  text-decoration: none;
+}
+.brand img {
+  height: 2.5rem;
+  width: auto;
+}
+nav {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 1.25rem;
+}
+nav a {
+  text-decoration: none;
+}
+nav a[aria-current="page"] {
+  font-weight: 600;
+  text-decoration: underline;
+}
+main {
+  min-height: 70vh;
+  padding-block: 2rem 4rem;
+}
+.site-footer {
+  border-top: 1px solid var(--color-line);
+  font-size: 0.9rem;
+}
+.footer-text p {
+  margin: 0;
+}
+
+/* Posts: includes/post_list.html, includes/post_card.html and post.html */
+.card h3 {
+  margin: 0.75rem 0 0.25rem;
+  line-height: 1.3;
+}
+.card h3 a {
+  color: inherit;
+  text-decoration: none;
+}
+.card .cover {
+  width: 100%;
+  aspect-ratio: 16 / 10;
+  object-fit: cover;
+  border-radius: 0.5rem;
+}
+.meta {
+  font-size: 0.9rem;
+  margin: 0;
+}
+.pagination {
+  display: flex;
+  gap: 1.5rem;
+  justify-content: center;
+  margin: 3rem 0;
+}
+article .cover {
+  width: 100%;
+  border-radius: 0.75rem;
+}
+.tags {
+  display: flex;
+  gap: 1rem;
+  margin-top: 3rem;
+}
+
+/* Blocks: templates/website/blocks/ */
+.block-image {
+  margin: 2rem 0;
+}
+.block-image img {
+  border-radius: 0.5rem;
+}
+.block-image figcaption {
+  font-size: 0.9rem;
+  margin-top: 0.5rem;
+}
+.cta {
+  margin: 2.5rem 0;
+  padding: 2rem;
+  border-radius: 0.75rem;
+  background: var(--color-accent-soft);
+}
+.cta h2 {
+  margin-top: 0;
+}
+
+/* The contact form: includes/contact_form.html */
+.contact-form {
+  display: grid;
+  gap: 1rem;
+  max-width: 32rem;
+  margin-top: 2rem;
+}
+.contact-form label {
+  display: grid;
+  gap: 0.25rem;
+  font-weight: 600;
+}
+.contact-form input,
+.contact-form textarea {
+  font: inherit;
+  padding: 0.5rem 0.75rem;
+  border: 1px solid var(--color-line);
+  border-radius: 0.375rem;
+  background: transparent;
+  color: inherit;
+}
+.contact-form button {
+  justify-self: start;
+}
+.contact-form .error {
+  color: #b42318;
+  font-weight: 400;
+}

package/templates/frontend-templates/website/templates/website/404.html

@@ -0,0 +1,10 @@
+{% extends "website/base.html" %}
+{% load stack %}
+{% block seo %}{% seo not_found site %}{% endblock %}
+{% block content %}
+  <section class="narrow">
+    <h1>Page not found</h1>
+    <p>The page you are looking for does not exist or has moved.</p>
+    <p><a href="/">Go to the home page</a></p>
+  </section>
+{% endblock %}

package/templates/frontend-templates/website/templates/website/base.html

@@ -0,0 +1,44 @@
+{% load static stack %}<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <link rel="icon" href="{% static 'website/favicon.svg' %}" type="image/svg+xml">
+    <link rel="alternate" type="application/rss+xml" title="{{ site.site_name|default:'RSS' }}" href="/rss.xml">
+    <link rel="stylesheet" href="{% static 'website/global.css' %}">
+    {% block seo %}{% seo page site %}{% endblock %}
+    {% if analytics_website_id %}<script defer src="/_a/script.js" data-website-id="{{ analytics_website_id }}"></script>{% endif %}
+  </head>
+  <body>
+    {% if preview %}
+      <div class="preview-banner">Preview: drafts are shown. <a href="/preview/exit">Leave preview</a></div>
+    {% endif %}
+    <header class="site-header">
+      <div class="container bar">
+        <a class="brand" href="/">
+          {% if site.logo %}{% image site.logo size="thumbnail" alt=site.site_name eager=True %}{% else %}{{ site.site_name }}{% endif %}
+        </a>
+        <nav aria-label="Main">
+          {% for item in main_menu.items.blocks %}
+            {% with href=item|link_href %}
+              <a href="{{ href }}"{% if href|is_current:request.path %} aria-current="page"{% endif %}>{{ item.value.label }}</a>
+            {% endwith %}
+          {% endfor %}
+        </nav>
+      </div>
+    </header>
+    <main>
+      {% block content %}{% endblock %}
+    </main>
+    <footer class="site-footer">
+      <div class="container bar muted">
+        {% if site.footer_text %}<div class="footer-text">{{ site.footer_text|safe }}</div>{% endif %}
+        <nav aria-label="Footer">
+          {% for item in footer_menu.items.blocks %}<a href="{{ item|link_href }}">{{ item.value.label }}</a>{% endfor %}
+          {% for name, url in site.social_links.items %}<a href="{{ url }}" rel="me">{{ name }}</a>{% endfor %}
+        </nav>
+      </div>
+    </footer>
+    {% block scripts %}{% endblock %}
+  </body>
+</html>

package/templates/frontend-templates/website/templates/website/blocks/call_to_action.html

@@ -0,0 +1,5 @@
+<aside class="cta">
+  <h2>{{ value.title }}</h2>
+  {% if value.text %}<p>{{ value.text }}</p>{% endif %}
+  <a class="button" href="{{ value.button_url }}">{{ value.button_label }}</a>
+</aside>

package/templates/frontend-templates/website/templates/website/blocks/image.html

@@ -0,0 +1,4 @@
+{% load stack %}<figure class="block-image">
+  {% image value.image size="content" sizes="(min-width: 48rem) 44rem, 100vw" %}
+  {% if value.caption %}<figcaption class="muted">{{ value.caption }}</figcaption>{% endif %}
+</figure>

package/templates/frontend-templates/website/templates/website/blocks/quote.html

@@ -0,0 +1,4 @@
+<blockquote class="prose">
+  <p>{{ value.text }}</p>
+  {% if value.attribution %}<footer class="muted">{{ value.attribution }}</footer>{% endif %}
+</blockquote>

package/templates/frontend-templates/website/templates/website/blocks/text.html

@@ -0,0 +1,2 @@
+{# HTML from a Content Studio HTMLField: sanitized with an allowlist when it is saved. #}
+<div class="prose">{{ value.body|safe }}</div>

package/templates/frontend-templates/website/templates/website/home.html

@@ -0,0 +1,8 @@
+{% extends "website/base.html" %}
+{% block content %}
+  <section class="container">
+    <h1>{{ site.site_name|default:"Latest posts" }}</h1>
+    {% if site.tagline %}<p class="muted">{{ site.tagline }}</p>{% endif %}
+    {% include "website/includes/post_list.html" with base="/" %}
+  </section>
+{% endblock %}

package/templates/frontend-templates/website/templates/website/includes/contact_form.html

@@ -0,0 +1,21 @@
+{% comment %}
+  The contact form posts to its own page. The view saves a FormSubmission,
+  which the admin lists, after the captcha (unless CAPTCHA=off) and the
+  rate limit per IP address (PUBLIC_WRITE_THROTTLE_RATE).
+{% endcomment %}
+<form class="contact-form" method="post" action="{{ request.path }}">
+  {% csrf_token %}
+  {% if sent %}<p class="status" role="status">Thank you, your message was sent.</p>{% endif %}
+  {% for error in form.non_field_errors %}<p class="status error" role="alert">{{ error }}</p>{% endfor %}
+  {% for field in form %}
+    {% if field.name == "captcha" %}
+      {{ field }}
+      {% for error in field.errors %}<p class="error">{{ error }}</p>{% endfor %}
+    {% else %}
+      <label>{{ field.label }} {{ field }}
+        {% for error in field.errors %}<span class="error">{{ error }}</span>{% endfor %}
+      </label>
+    {% endif %}
+  {% endfor %}
+  <button class="button" type="submit">Send</button>
+</form>

package/templates/frontend-templates/website/templates/website/includes/post_card.html

@@ -0,0 +1,9 @@
+{% load stack %}<article class="card">
+  <a href="{{ post.get_absolute_url }}">{% image post.cover size="card" sizes="(min-width: 40rem) 22rem, 100vw" class_name="cover" %}</a>
+  <h3><a href="{{ post.get_absolute_url }}">{{ post.title }}</a></h3>
+  <p class="muted meta">
+    {% if post.published_at %}<time datetime="{{ post.published_at|date:'c' }}">{{ post.published_at|date:"M j, Y" }}</time>{% endif %}
+    {% if post.author %}<span> · {{ post.author.name }}</span>{% endif %}
+  </p>
+  {% if post.excerpt %}<p>{{ post.excerpt }}</p>{% endif %}
+</article>

package/templates/frontend-templates/website/templates/website/includes/post_list.html

@@ -0,0 +1,11 @@
+{% if not posts %}<p class="muted">No posts yet.</p>{% endif %}
+<div class="grid">
+  {% for post in posts %}{% include "website/includes/post_card.html" %}{% endfor %}
+</div>
+{% if posts.paginator.num_pages > 1 %}
+  <nav class="pagination" aria-label="Pages">
+    {% if posts.has_previous %}<a href="{% if posts.previous_page_number == 1 %}{{ base }}{% else %}{{ base }}?page={{ posts.previous_page_number }}{% endif %}">← Newer</a>{% endif %}
+    <span class="muted">Page {{ posts.number }} of {{ posts.paginator.num_pages }}</span>
+    {% if posts.has_next %}<a href="{{ base }}?page={{ posts.next_page_number }}">Older →</a>{% endif %}
+  </nav>
+{% endif %}

package/templates/frontend-templates/website/templates/website/page.html

@@ -0,0 +1,10 @@
+{% extends "website/base.html" %}
+{% load stack %}
+{% block content %}
+  <article class="narrow">
+    <h1>{{ page.title }}</h1>
+    {% blocks page.body %}
+    {% if form %}{% include "website/includes/contact_form.html" %}{% endif %}
+  </article>
+{% endblock %}
+{% block scripts %}{% if form %}{{ form.media }}{% endif %}{% endblock %}

package/templates/frontend-templates/website/templates/website/post.html

@@ -0,0 +1,20 @@
+{% extends "website/base.html" %}
+{% load stack %}
+{% block seo %}{% seo post site type="article" %}{% endblock %}
+{% block content %}
+  <article class="narrow">
+    <p class="muted">
+      {% if post.published_at %}<time datetime="{{ post.published_at|date:'c' }}">{{ post.published_at|date:"F j, Y" }}</time>{% endif %}
+      {% if post.author %}<span> · {{ post.author.name }}</span>{% endif %}
+      {% for category in post.categories.all %}<span> · <a href="{{ category.get_absolute_url }}">{{ category.name }}</a></span>{% endfor %}
+    </p>
+    <h1>{{ post.title }}</h1>
+    {% image post.cover size="content" sizes="(min-width: 48rem) 44rem, 100vw" class_name="cover" eager=True %}
+    {% blocks post.body %}
+    {% with tags=post.tags.all %}
+      {% if tags %}
+        <p class="tags">{% for tag in tags %}<a href="{{ tag.get_absolute_url }}">#{{ tag.name }}</a>{% endfor %}</p>
+      {% endif %}
+    {% endwith %}
+  </article>
+{% endblock %}

package/templates/frontend-templates/website/templates/website/post_list.html

@@ -0,0 +1,11 @@
+{% extends "website/base.html" %}
+{% load stack %}
+{% block seo %}{% seo seo_page site %}{% endblock %}
+{% block content %}
+  <section class="container">
+    {% if label %}<p class="muted">{{ label }}</p>{% endif %}
+    <h1>{{ title }}</h1>
+    {% if description %}<p>{{ description }}</p>{% endif %}
+    {% include "website/includes/post_list.html" with base=request.path %}
+  </section>
+{% endblock %}

package/templates/frontend-templates/website/templates/website/robots.txt

@@ -0,0 +1,5 @@
+User-agent: *
+Disallow: /admin/
+Disallow: /preview
+
+Sitemap: {{ site_url }}/sitemap.xml

package/templates/frontend-templates/website/templates/website/rss.xml

@@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<rss version="2.0">
+  <channel>
+    <title>{{ site.site_name|default:"Blog" }}</title>
+    <description>{% firstof site.seo_description site.tagline "" %}</description>
+    <link>{{ site_url }}/</link>
+    {% for post in posts %}<item>
+      <title>{{ post.title }}</title>
+      <link>{{ site_url }}{{ post.get_absolute_url }}</link>
+      <guid isPermaLink="true">{{ site_url }}{{ post.get_absolute_url }}</guid>
+      {% if post.excerpt %}<description>{{ post.excerpt }}</description>{% endif %}
+      {% if post.published_at %}<pubDate>{{ post.published_at|date:"r" }}</pubDate>{% endif %}
+    </item>
+    {% endfor %}
+  </channel>
+</rss>

package/templates/frontend-templates/website/templates/website/sitemap.xml

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+  <url><loc>{{ site_url }}/</loc></url>
+  <url><loc>{{ site_url }}/blog</loc></url>
+  {% for page in pages %}<url><loc>{{ site_url }}{{ page.get_absolute_url }}</loc>{% if page.published_at %}<lastmod>{{ page.published_at|date:"Y-m-d" }}</lastmod>{% endif %}</url>
+  {% endfor %}{% for post in posts %}<url><loc>{{ site_url }}{{ post.get_absolute_url }}</loc>{% if post.published_at %}<lastmod>{{ post.published_at|date:"Y-m-d" }}</lastmod>{% endif %}</url>
+  {% endfor %}
+</urlset>

package/templates/frontend-templates/website/tests/test_site.py

@@ -0,0 +1,102 @@
+"""
+Tests of the site's pages: every route renders, drafts show only in
+preview, a save empties the page cache, redirects work and the contact form
+needs a captcha token. Run them with `{{pm_run}} test` at the project root.
+"""
+
+import pytest
+from django.conf import settings
+from django.core.cache import cache
+from django.test import Client
+from django_stack.contrib.captcha.testing import captcha_token
+from django_stack.contrib.site.preview import PREVIEW_COOKIE
+from django_stack.preview import make_preview_token
+
+from content.models import FormSubmission, Page, Post
+from content.seed import seed
+
+pytestmark = pytest.mark.django_db
+
+
+@pytest.fixture
+def seeded(settings, tmp_path):
+    settings.MEDIA_ROOT = tmp_path
+    cache.clear()
+    seed()
+
+
+@pytest.fixture
+def client():
+    return Client()
+
+
+@pytest.mark.parametrize(
+    "path", ["/", "/about", "/about/team", "/blog", "/blog?page=2", "/category/news", "/tag/django", "/contact"]
+)
+def test_pages_render(client, seeded, path):
+    response = client.get(path)
+    assert response.status_code == 200
+    assert "<title>" in response.content.decode()
+    assert "script-src 'self'" in response["Content-Security-Policy"]
+
+
+def test_post(client, seeded):
+    post = Post.objects.published().first()
+    html = client.get(f"/blog/{post.slug}").content.decode()
+    assert f"<h1>{post.title}</h1>" in html
+    assert '<meta property="og:type" content="article">' in html
+
+
+@pytest.mark.parametrize(
+    ("path", "content_type"),
+    [("/rss.xml", "application/rss+xml"), ("/sitemap.xml", "application/xml"), ("/robots.txt", "text/plain")],
+)
+def test_feeds(client, seeded, path, content_type):
+    response = client.get(path)
+    assert response.status_code == 200
+    assert response["Content-Type"].startswith(content_type)
+    assert settings.SITE_URL in response.content.decode()
+
+
+def test_not_found_and_redirects(client, seeded):
+    response = client.get("/does-not-exist")
+    assert response.status_code == 404
+    assert "Page not found" in response.content.decode()
+    redirect = client.get("/old-about")
+    assert redirect.status_code == 301
+    assert redirect["Location"] == "/about"
+
+
+def test_drafts_only_in_preview(client, seeded):
+    assert Page.objects.filter(path="draft").exists()
+    assert client.get("/draft").status_code == 404
+    client.cookies[PREVIEW_COOKIE] = make_preview_token()
+    response = client.get("/draft")
+    assert response.status_code == 200
+    assert "preview-banner" in response.content.decode()
+
+
+def test_a_save_empties_the_page_cache(client, seeded):
+    assert client.get("/about")["X-Cache"] == "MISS"
+    assert client.get("/about")["X-Cache"] == "HIT"
+    about = Page.objects.get(path="about")
+    about.title = "Changed"
+    about.save()
+    response = client.get("/about")
+    assert response["X-Cache"] == "MISS"
+    assert "<h1>Changed</h1>" in response.content.decode()
+
+
+def test_contact_form(client, seeded):
+    data = {"name": "Ada", "email": "ada@example.com", "message": "Hello", "captcha": captcha_token()}
+    response = client.post("/contact", data)
+    assert response.status_code == 302
+    assert FormSubmission.objects.filter(email="ada@example.com").exists()
+    assert "Thank you" in client.get(response["Location"]).content.decode()
+
+
+@pytest.mark.skipif(not settings.DJANGO_STACK["CAPTCHA"], reason="the captcha is off")
+def test_contact_form_needs_a_captcha(client, seeded):
+    response = client.post("/contact", {"name": "Ada", "email": "ada@example.com", "message": "Hello"})
+    assert response.status_code == 400
+    assert not FormSubmission.objects.exists()

package/templates/frontend-templates/website/urls.py

@@ -0,0 +1,17 @@
+from django.urls import include, path, re_path
+
+from . import views
+
+urlpatterns = [
+    path("", include("django_stack.contrib.site.urls")),  # /preview and /preview/exit
+    path("", views.home, name="home"),
+    path("blog", views.blog, name="blog"),
+    path("blog/<slug:slug>", views.post, name="post"),
+    path("category/<slug:slug>", views.category, name="category"),
+    path("tag/<slug:slug>", views.tag, name="tag"),
+    path("rss.xml", views.rss, name="rss"),
+    path("sitemap.xml", views.sitemap, name="sitemap"),
+    path("robots.txt", views.robots, name="robots"),
+    # Pages at their path, such as /about or /about/team.
+    re_path(r"^(?P<path>[\w-]+(?:/[\w-]+)*)/?$", views.page, name="page"),
+]