New "plain" page style for most logged out pages

This commit is contained in:
Andrew Godwin 2022-12-22 13:06:35 -08:00
parent c890382b30
commit a058140d11
14 changed files with 174 additions and 61 deletions

View file

@ -4,7 +4,7 @@ import httpx
from asgiref.sync import async_to_sync
from django import forms
from django.utils.decorators import method_decorator
from django.views.generic import FormView
from django.views.generic import FormView, TemplateView
from core.ld import canonicalise
from users.decorators import admin_required
@ -46,3 +46,13 @@ class JsonViewer(FormView):
context["result"] = result
context["raw_result"] = raw_result
return self.render_to_response(context)
class NotFound(TemplateView):
template_name = "404.html"
class ServerError(TemplateView):
template_name = "500.html"

View file

@ -7,33 +7,32 @@ from django.utils.safestring import mark_safe
from django.views.generic import TemplateView, View
from django.views.static import serve
from activities.services.timeline import TimelineService
from activities.views.timelines import Home
from core.decorators import cache_page
from core.models import Config
from users.models import Identity
def homepage(request):
if request.user.is_authenticated:
return Home.as_view()(request)
else:
return LoggedOutHomepage.as_view()(request)
return About.as_view()(request)
@method_decorator(cache_page(public_only=True), name="dispatch")
class LoggedOutHomepage(TemplateView):
class About(TemplateView):
template_name = "index.html"
template_name = "about.html"
def get_context_data(self):
service = TimelineService(self.request.identity)
return {
"about": mark_safe(
"current_page": "about",
"content": mark_safe(
markdown_it.MarkdownIt().render(Config.system.site_about)
),
"identities": Identity.objects.filter(
local=True,
discoverable=True,
).order_by("-created")[:20],
"posts": service.local()[:10],
}

View file

@ -122,8 +122,13 @@ main {
border-radius: 5px;
}
.no-sidebar main {
box-shadow: none;
max-width: 800px;
}
footer {
width: 900px;
max-width: 900px;
margin: 0 auto;
padding: 0 0 10px 0;
color: var(--color-text-duller);
@ -131,6 +136,10 @@ footer {
font-size: 90%;
}
.no-sidebar footer {
max-width: 800px;
}
footer a {
border-bottom: 1px solid var(--color-text-duller);
margin-right: 5px;
@ -141,6 +150,10 @@ header {
height: 50px;
}
.no-sidebar header {
justify-content: center;
}
header .logo {
font-family: "Raleway";
font-weight: bold;
@ -155,6 +168,10 @@ header .logo {
z-index: 10;
}
.no-sidebar header .logo {
border-radius: 5px;
}
header .logo:hover {
border-bottom: 3px solid rgba(255, 255, 255, 0.3);
}
@ -173,6 +190,10 @@ header menu {
z-index: 10;
}
.no-sidebar header menu {
flex-grow: 0;
}
header menu a {
padding: 10px 20px 4px 20px;
color: #eee;
@ -180,6 +201,10 @@ header menu a {
border-bottom: 3px solid rgba(0, 0, 0, 0);
}
.no-sidebar header menu a {
margin: 0 10px;
}
body.has-banner header menu a {
background: rgba(0, 0, 0, 0.5);
border-right: 0;
@ -190,6 +215,12 @@ header menu a.selected {
border-bottom: 3px solid var(--color-highlight);
}
.no-sidebar header menu a:hover:not(.logo) {
border-bottom: 3px solid rgba(0, 0, 0, 0);
background-color: var(--color-bg-menu);
border-radius: 5px;
}
header menu a i {
font-size: 24px;
display: inline-block;
@ -225,10 +256,6 @@ header menu a.identity {
width: 250px;
}
body.no-sidebar header menu a.identity {
display: none;
}
header menu a.identity i {
display: inline-block;
vertical-align: middle;
@ -341,10 +368,6 @@ nav a i {
border-radius: 0 0 5px 0;
}
body.no-sidebar .right-column {
display: none;
}
.right-column h2 {
background: var(--color-highlight);
padding: 8px 10px;
@ -357,7 +380,43 @@ img.emoji {
height: 0.8em;
}
/* Generic markdown styling */
/* Generic markdown styling and sections */
.no-sidebar section {
max-width: 700px;
background: var(--color-bg-box);
box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1);
margin: 25px auto 45px auto;
padding: 5px 15px;
}
.no-sidebar section.shell {
background: none;
box-shadow: none;
padding: 0;
}
.no-sidebar #main-content>h1 {
max-width: 700px;
margin: 25px auto 5px auto;
font-weight: bold;
font-size: 120%;
text-transform: uppercase;
color: var(--color-text-main);
}
.no-sidebar h1+section {
margin-top: 0;
}
.markdown .banner {
width: calc(100% + 30px);
height: auto;
object-fit: cover;
margin: -5px -15px 10px -15px;
border-radius: 5px 0 0 0;
display: block;
}
.markdown p {
margin: 4px 0 10px 0;
@ -461,6 +520,11 @@ img.emoji {
/* Forms */
.no-sidebar form {
max-width: 500px;
margin: 40px auto;
}
fieldset {
border: 0;
background: var(--color-bg-box);
@ -1256,14 +1320,14 @@ form .post {
top: 50px;
}
header {
body:not(.no-sidebar) header {
height: var(--md-header-height);
position: fixed;
width: 100%;
z-index: 9;
}
header menu a {
body:not(.no-sidebar) header menu a {
background: rgba(0, 0, 0, 0.5);
}
@ -1274,7 +1338,11 @@ form .post {
border-radius: 0;
}
footer {
.no-sidebar main {
margin: 20px auto 20px auto;
}
body:not(.no-sidebar) footer {
position: fixed;
bottom: 0;
right: 0;
@ -1284,12 +1352,12 @@ form .post {
text-align: right;
}
footer a {
body:not(.no-sidebar) footer a {
display: block;
border: 0;
}
header .logo {
body:not(.no-sidebar) header .logo {
border-radius: 0;
}
@ -1342,7 +1410,7 @@ form .post {
display: none;
}
footer {
body:not(.no-sidebar) footer {
display: none;
}

View file

@ -17,7 +17,6 @@ urlpatterns = [
path("local/", timelines.Local.as_view(), name="local"),
path("federated/", timelines.Federated.as_view(), name="federated"),
path("search/", search.Search.as_view(), name="search"),
path("debug/json/", debug.JsonViewer.as_view(), name="debug_json"),
path("tags/<hashtag>/", timelines.Tag.as_view(), name="tag"),
path("explore/", explore.Explore.as_view(), name="explore"),
path("explore/tags/", explore.ExploreTag.as_view(), name="explore-tag"),
@ -190,11 +189,7 @@ urlpatterns = [
path("identity/select/", identity.SelectIdentity.as_view()),
path("identity/create/", identity.CreateIdentity.as_view()),
# Flat pages
path(
"about/",
core.FlatPage.as_view(title="About This Server", config_option="site_about"),
name="about",
),
path("about/", core.About.as_view(), name="about"),
path(
"pages/privacy/",
core.FlatPage.as_view(title="Privacy Policy", config_option="policy_privacy"),
@ -210,6 +205,10 @@ urlpatterns = [
core.FlatPage.as_view(title="Server Rules", config_option="policy_rules"),
name="rules",
),
# Debug aids
path("debug/json/", debug.JsonViewer.as_view(), name="debug_json"),
path("debug/404/", debug.NotFound.as_view(), name="not_found"),
path("debug/500/", debug.ServerError.as_view(), name="server_error"),
# Media/image proxy
path(
"proxy/identity_icon/<identity_id>/",

View file

@ -1,6 +1,8 @@
{% extends "base.html" %}
{% extends "base_plain.html" %}
{% block content %}
<h1>Page Not Found</h1>
<p>Sorry about that.</p>
<section class="markdown">
<p>Sorry about that.</p>
</section>
{% endblock %}

View file

@ -1,6 +1,8 @@
{% extends "base.html" %}
{% extends "base_plain.html" %}
{% block content %}
<h1>Internal Server Error</h1>
<p>Sorry about that.</p>
<h1>Internal Error</h1>
<section class="markdown">
<p>Sorry about that. We'll try to have this working again soon.</p>
</section>
{% endblock %}

19
templates/about.html Normal file
View file

@ -0,0 +1,19 @@
{% extends "base_plain.html" %}
{% block title %}Welcome{% endblock %}
{% block content %}
<section class="markdown">
<img class="banner" src="{{ config.site_banner }}">
{{ content }}
</section>
{% if not request.user.is_authenticated %}
<h1>Recent Posts</h1>
<section class="posts shell">
{% for post in posts %}
{% include "activities/_post.html" %}
{% endfor %}
</section>
{% endif %}
{% endblock %}

View file

@ -1,9 +1,7 @@
{% extends "base.html" %}
{% extends "base_plain.html" %}
{% block title %}Login{% endblock %}
{% block body_class %}no-sidebar{% endblock %}
{% block content %}
<form action="." method="POST">
{% csrf_token %}

View file

@ -1,4 +1,4 @@
{% extends "base.html" %}
{% extends "base_plain.html" %}
{% block title %}Create Account{% endblock %}

View file

@ -23,6 +23,7 @@
<a id='skip-to-main' class='screenreader-text' href='#main-content'>Skip to Content</a>
<a id='skip-to-nav' class='screenreader-text' href='#side-navigation'>Skip to Navigation</a>
<main>
{% block body_main %}
<header>
<a class="logo" href="/">
<img src="{{ config.site_icon }}" width="32">
@ -73,6 +74,7 @@
</div>
</div>
{% endblock %}
{% endblock %}
</main>
<footer>

29
templates/base_plain.html Normal file
View file

@ -0,0 +1,29 @@
{% extends "base.html" %}
{% block body_class %}no-sidebar{% endblock %}
{% block body_main %}
<header>
<menu>
{% if not request.user.is_authenticated and current_page == "about" and config.signup_allowed %}
<a href="/auth/signup/">Sign Up</a>
{% else %}
<a href="/">Home</a>
{% endif %}
<a class="logo" href="/">
<img src="{{ config.site_icon }}" width="32">
{{ config.site_name }}
</a>
{% if request.user.is_authenticated %}
<a href="javascript:history.back()">Back</a>
{% else %}
<a href="/auth/login/">Login</a>
{% endif %}
</menu>
</header>
<div id="main-content">
{% block content %}
{% endblock %}
</div>
{% endblock %}

View file

@ -1,10 +1,10 @@
{% extends "base.html" %}
{% extends "base_plain.html" %}
{% block title%}{{ title }}{% endblock %}
{% block content %}
<h1>{{ title }}</h1>
<div class="markdown">
{{ content }}
</div>
<section class="markdown">
{{ content }}
</section>
{% endblock %}

View file

@ -1,15 +0,0 @@
{% extends "base.html" %}
{% block title %}Welcome{% endblock %}
{% block content %}
<div class="about">
<img class="banner" src="{{ config.site_banner }}">
{{ about }}
</div>
<h2>People</h2>
{% for identity in identities %}
{% include "activities/_identity.html" %}
{% endfor %}
{% endblock %}

View file

@ -35,7 +35,7 @@ class Signup(FormView):
class form_class(forms.Form):
email = forms.EmailField(
help_text="We will send a link to this email to set your password and create your account",
help_text="We will send a link to this email to create your account.",
)
def __init__(self, *args, **kwargs):