Skip to content

Commit 1ee5166

Browse files
bmispelonbmispelon
committed
Reapply "Fixed page header structure and used semantic HTML."
This reverts commit f1fca5e.
1 parent 6bc9b87 commit 1ee5166

35 files changed

+213
-160
lines changed

‎blog/views.py

+3-1
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@
1212
class BlogViewMixin:
1313
date_field = "pub_date"
1414
paginate_by = 10
15+
banner_is_title = True
1516

1617
def get_allow_future(self):
1718
return self.request.user.is_staff
@@ -28,6 +29,7 @@ def get_context_data(self, **kwargs):
2829
events_queryset = Event.objects.future().published()
2930

3031
context["events"] = events_queryset[:3]
32+
context["banner_is_title"] = self.banner_is_title
3133

3234
return context
3335

@@ -49,4 +51,4 @@ class BlogDayArchiveView(BlogViewMixin, DayArchiveView):
4951

5052

5153
class BlogDateDetailView(BlogViewMixin, DateDetailView):
52-
pass
54+
banner_is_title = False

‎dashboard/templates/base_dashboard.html

+1-2
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,5 @@
66
{% block title %}{% translate 'Development dashboard' %}{% endblock %}
77
{% block layout_class %}full-width{% endblock %}
88
{% block header %}
9-
<h1 class="visuallyhidden">Development dashboard</h1>
10-
<p>Development <em>dashboard</em></p>
9+
<h1>Development <em>dashboard</em></h1>
1110
{% endblock %}

‎djangoproject/scss/_dark-mode.scss

+3-3
Original file line numberDiff line numberDiff line change
@@ -149,7 +149,7 @@ html[data-theme="light"],
149149
}
150150
}
151151

152-
body [role="contentinfo"] {
152+
body footer {
153153
background: darken($green, 10%);
154154
}
155155

@@ -256,7 +256,7 @@ html[data-theme="dark"] {
256256
}
257257
}
258258

259-
[role="contentinfo"] {
259+
footer {
260260
background: darken($green, 10%);
261261
}
262262
}
@@ -352,7 +352,7 @@ html[data-theme="light"] .theme-toggle .theme-label-when-light {
352352
}
353353
}
354354

355-
[role="banner"] [role="navigation"] li:last-child {
355+
header nav li:last-child {
356356
@include respond-max(768px) {
357357
display: none;
358358
}

‎djangoproject/scss/_dashboard.scss

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
#dashboard {
2-
.full-width [role="main"] {
2+
.full-width main {
33
margin: 0 auto;
44
text-align: center;
55
}

‎djangoproject/scss/_print.scss

+5-5
Original file line numberDiff line numberDiff line change
@@ -62,11 +62,11 @@
6262
.news-search,
6363
.backtotop,
6464
.nav-pagination,
65-
[role="contentinfo"]>.container,
66-
[role="contentinfo"] .logo,
65+
footer>.container,
66+
footer .logo,
6767
.thanks,
6868
[role="complementary"],
69-
[role="navigation"],
69+
nav,
7070
.form-input {
7171
display: none !important;
7272
}
@@ -75,8 +75,8 @@
7575
text-indent: 0 !important;
7676
}
7777

78-
[role="contentinfo"],
79-
[role="contentinfo"] .copyright {
78+
footer,
79+
footer .copyright {
8080
margin: 0 !important;
8181
padding: 0 !important;
8282
}

‎djangoproject/scss/_style.scss

+35-18
Original file line numberDiff line numberDiff line change
@@ -122,7 +122,7 @@ h1 {
122122
color: var(--body-fg);
123123
}
124124

125-
[role="main"] & {
125+
main & {
126126
@include font-size(32);
127127
margin: 40px 0px 30px;
128128
color: var(--body-fg);
@@ -159,7 +159,7 @@ h2 {
159159
}
160160
}
161161

162-
[role="main"] & {
162+
main & {
163163
margin-top: 40px;
164164
margin-bottom: 15px;
165165
}
@@ -174,20 +174,24 @@ h3 {
174174

175175
[role="complementary"] &,
176176
.layout-secondary & {
177-
@include font-size(18);
177+
@include font-size(20);
178+
border-bottom: 1px solid var(--hairline-color);
178179
font-weight: 400;
179180
padding-bottom: 15px;
181+
margin-top: 30px;
182+
183+
&:first-of-type {
184+
margin-top: inherit;
185+
}
180186

181187
&:first-child {
182188
@include respond-min(768px) {
183-
margin-top: 12px;
189+
margin-top: 20px;
184190
}
185191
}
186-
}
187-
188-
[role="complementary"] & {
189-
@include font-size(18);
190-
border-bottom: 1px solid var(--hairline-color);
192+
.full-width & {
193+
@include font-size(24);
194+
}
191195
}
192196
}
193197

@@ -236,7 +240,7 @@ a:focus {
236240
p {
237241

238242
//increase top margin if first item in container
239-
[role="main"]>&:first-child {
243+
main>&:first-child {
240244
margin-top: 30px;
241245
}
242246
}
@@ -274,7 +278,7 @@ blockquote {
274278
//------------------- Layout
275279

276280

277-
[role="main"] {
281+
main {
278282
//Main column. Left aligned by default. See /styleguide for explanation.
279283
background: var(--white-color);
280284
padding: 1px 10px 40px;
@@ -447,7 +451,7 @@ blockquote {
447451

448452
//------------------- Site Chrome (Header/Footer)
449453

450-
[role="banner"] {
454+
header {
451455
// Includes global navigation, logo, and tagline at top of document
452456
@include clearfix;
453457
background: $green-dark;
@@ -529,7 +533,7 @@ blockquote {
529533
}
530534
}
531535

532-
[role="navigation"] {
536+
nav {
533537
width: 100%;
534538
background: $green-dark;
535539
transition: max-height 0.3s ease-out;
@@ -584,6 +588,10 @@ blockquote {
584588
display: block;
585589
text-decoration: none;
586590

591+
&:visited {
592+
color: var(--menu);
593+
}
594+
587595
&:active,
588596
&:hover {
589597
color: var(--secondary-accent);
@@ -697,6 +705,7 @@ blockquote {
697705
line-height: 1.3;
698706
padding: 1px 0 6px;
699707
margin: .45em 0 .35em;
708+
letter-spacing: -1px;
700709

701710
em {
702711
font-style: normal;
@@ -715,6 +724,7 @@ blockquote {
715724
a {
716725
font-weight: 300;
717726
color: var(--secondary-accent);
727+
text-decoration: none;
718728
}
719729

720730
a.cta,
@@ -864,7 +874,7 @@ blockquote {
864874

865875
}
866876

867-
[role="contentinfo"] {
877+
footer {
868878
// Global Footer at bottom of page
869879
@include clearfix;
870880
@include sans-serif;
@@ -912,7 +922,7 @@ blockquote {
912922

913923
}
914924

915-
h2 {
925+
h3 {
916926
@include font-size(16);
917927
border-top: 1px solid var(--hairline-color);
918928
color: var(--menu);
@@ -942,10 +952,15 @@ blockquote {
942952
color: var(--menu);
943953
text-decoration: none;
944954

955+
&:visited {
956+
color: var(--menu);
957+
}
958+
945959
&:hover,
946960
&:active,
947961
&:focus {
948962
text-decoration: underline;
963+
color: var(--menu);
949964
}
950965
}
951966
}
@@ -2558,7 +2573,7 @@ table.docutils th {
25582573
}
25592574
}
25602575

2561-
+h2 {
2576+
+h3 {
25622577
margin-top: 34px;
25632578
}
25642579
}
@@ -3582,7 +3597,9 @@ ul.corporate-members li {
35823597
border-radius: 20px;
35833598
}
35843599

3585-
.community-cta svg, h3 {
3586-
color: var(--community-img-fg);
3600+
.community-cta {
3601+
svg, h3 {
3602+
color: var(--community-img-fg);
3603+
}
35873604
}
35883605
}

‎djangoproject/templates/accounts/edit_profile.html

+1-2
Original file line numberDiff line numberDiff line change
@@ -34,9 +34,8 @@ <h1>{% translate "Edit your profile" %}</h1>
3434
{% endblock %}
3535

3636
{% block content-related %}
37-
<h1 class="visuallyhidden">{% translate "Additional Information" %}</h1>
3837
<div role="complementary">
39-
<h2>{% translate "Help" %}</h2>
38+
<h2 id="aside-header">{% translate "Help" %}</h2>
4039

4140
<p>{% translate "Use this form to edit your profile." %}</p>
4241

‎djangoproject/templates/accounts/user_profile.html

+1-2
Original file line numberDiff line numberDiff line change
@@ -4,9 +4,8 @@
44
{% block title %}{% firstof user_obj.profile.name user_obj.username %}{% endblock %}
55

66
{% block content-related %}
7-
<h1 class="visuallyhidden">{% translate "Additional Information" %}</h1>
87
<div role="complementary">
9-
<h2>
8+
<h2 id="aside-header">
109
{% if user_obj == user %}
1110
{% translate "This is you!" %}
1211
{% else %}

‎djangoproject/templates/aggregator/index.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
{% block layout_class %}column-container sidebar-right{% endblock %}
55

66
{% block content %}
7-
7+
<h1>{% translate "Community" %}</h1>
88
<h2 class="community-title">{% translate "Get Help" %}</h2>
99
<div class="community-cta-wrapper">
1010
<a href="https://forum.djangoproject.com/" class="community-cta-a">

‎djangoproject/templates/aggregator/local-django-community.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
{% regroup django_communities|dictsort:"continent" by continent as grouped_django_communities %}
88

99

10-
<h2>{% translate "Local Django Communities" %}</h2>
10+
<h1>{% translate "Local Django Communities" %}</h1>
1111

1212
<p>{% blocktranslate trimmed %}Something missing? <a href="https://github.com/django/djangoproject.com/issues/new?assignees=&amp;labels=type%3Acommunity&amp;projects=&amp;template=community_request.md">Suggest your community{% endblocktranslate %}</a>.</p>
1313

‎djangoproject/templates/base.html

+4-4
Original file line numberDiff line numberDiff line change
@@ -49,11 +49,11 @@
4949

5050
{% include "includes/header.html" %}
5151

52-
<div class="copy-banner">
52+
<section class="copy-banner">
5353
<div class="container {% block header-classes %}{% endblock %}">
5454
{% block header %}{% endblock %}
5555
</div>
56-
</div>
56+
</section>
5757

5858
{% comment %}
5959
Replace the div#billboard below with banner using the skeleton here to
@@ -72,7 +72,7 @@
7272
<div id="billboard">{% block billboard %}{% endblock %}</div>
7373

7474
<div class="container {% block layout_class %}{% endblock %}">
75-
<div role="main">
75+
<main>
7676

7777
{% block messages %}
7878
{% if messages %}
@@ -89,7 +89,7 @@
8989

9090
{% block content %}{% endblock %}
9191
<a href="#top" class="backtotop"><i class="icon icon-chevron-up"></i> Back to Top</a>
92-
</div>
92+
</main>
9393

9494
{% block content-related %}{% endblock %}
9595
{% block content-extra %}{% endblock %}

‎djangoproject/templates/base_2col.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,9 @@
66
{% endblock %}
77
</div>
88
<!-- END #content-main -->
9-
<div id="content-related" class="sidebar">
9+
<aside id="content-related" class="sidebar" aria-labelledby="aside-header">
1010
{% block content-related %}
1111
{% endblock %}
12-
</div>
12+
</aside>
1313
<!-- END #content-related -->
1414
{% endblock %}

‎djangoproject/templates/base_3col.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,9 @@
66
{% block content %}{% endblock %}
77
</div>
88
<!-- END #content-main -->
9-
<div id="content-related" class="sidebar">
9+
<aside id="content-related" class="sidebar" aria-labelledby="aside-header">
1010
{% block content-related %}{% endblock %}
11-
</div>
11+
</aside>
1212
<!-- END #content-related -->
1313
</div>
1414
<!-- END #subwrap -->

‎djangoproject/templates/base_community.html

+4-5
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,6 @@
88
{% block title %}{% translate "Django Community" %}{% endblock %}
99

1010
{% block header %}
11-
<h1 class="visuallyhidden">{% translate "Community" %}</h1>
1211
<p>
1312
{% if community_stats.age %}
1413
{% blocktranslate trimmed with age=community_stats.age %}
@@ -22,11 +21,11 @@ <h1 class="visuallyhidden">{% translate "Community" %}</h1>
2221
{% endblock %}
2322

2423
{% block content-related %}
25-
<h1 class="visuallyhidden">{% translate "Additional Information" %}</h1>
2624
<div role="complementary">
25+
<h2 class="visuallyhidden" id="aside-header">{% translate "Additional Information" %}</h2>
2726
{% donation_snippet %}
2827

29-
<h2>{% translate "More Help" %}</h2>
28+
<h3>{% translate "More Help" %}</h3>
3029
<dl class="list-links">
3130
<dt>
3231
<a href="{% url 'document-detail' lang='en' version='stable' url='faq' host 'docs' %}">
@@ -42,7 +41,7 @@ <h2>{% translate "More Help" %}</h2>
4241
<dd>{% translate "Chat with other Django users like it's 1999" %}</dd>
4342
</dl>
4443

45-
<h2>{% translate "Dive In" %}</h2>
44+
<h3>{% translate "Dive In" %}</h3>
4645
<dl class="list-links">
4746
<dt><a href="https://code.djangoproject.com/">{% translate "Ticket System" %}</a></dt>
4847
<dd>{% translate "View and update bug reports" %}</dd>
@@ -52,7 +51,7 @@ <h2>{% translate "Dive In" %}</h2>
5251
<dd>{% translate "Get updated for each code and ticket change" %}</dd>
5352
</dl>
5453

55-
<h2>{% translate "More Links" %}</h2>
54+
<h3>{% translate "More Links" %}</h3>
5655
<dl class="list-links">
5756
<dt><a href="https://www.djangopackages.com/" rel="nofollow">{% translate "Django Packages" %}</a></dt>
5857
<dd>{% translate "Find third-party packages to supercharge your project" %}</dd>

0 commit comments

Comments
 (0)