Skip to content
This repository was archived by the owner on May 2, 2024. It is now read-only.

Commit b6614b6

Browse files
mtrythalldrewbrew
andauthored
💅 2023 theme (#75)
* Starts color configuration and content clean up * Minor updates to styles * Bold date card text. Center nav. * Adds button style * Better hero. Remove dead files. * Fix hero map image * Footer, rounds out cards, carry design throughout * Minor design tweaks to padding * Center sponsor text * Remove bottom white space on subpages * Add Mastodon to footer and color * Removes old images. Updates avatars. * Dropdowns should be wider --------- Co-authored-by: Drew Winstel <[email protected]>
1 parent d417109 commit b6614b6

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

74 files changed

+25582
-849
lines changed

.all-contributorsrc

+2-2
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@
1414
"login": "mtrythall",
1515
"name": "Michael Trythall",
1616
"avatar_url": "https://avatars2.githubusercontent.com/u/84750?v=3",
17-
"profile": "http://mtrythall.com",
17+
"profile": "https://yupgup.com",
1818
"contributions": []
1919
},
2020
{
@@ -203,7 +203,7 @@
203203
"login": "jonitrythall",
204204
"name": "Joni Trythall ",
205205
"avatar_url": "https://avatars0.githubusercontent.com/u/5723303?v=4",
206-
"profile": "http://jonibologna.com/",
206+
"profile": "https://yupgup.com",
207207
"contributions": []
208208
},
209209
{

.ruby-version

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
2.7.8

_includes/footer.html

+8
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,14 @@
1818

1919
<div class="row column">
2020
<ul class="social-icons">
21+
<li>
22+
<a class="mastodon" href="https://fosstodon.org/@djangocon">
23+
<svg class="social-icon">
24+
<title>Mastodon</title>
25+
<use xlink:href="#mastodon-icon"></use>
26+
</svg>
27+
</a>
28+
</li>
2129
<li>
2230
<a class="twitter" href="https://twitter.com/djangocon">
2331
<svg class="social-icon">

_includes/nav.html

+10-5
Original file line numberDiff line numberDiff line change
@@ -53,9 +53,14 @@
5353
</ul>
5454
</li>
5555
<li><a href="/news/">News</a></li>
56-
{% comment %}<li>
57-
<a href="{{ site.ticket_link }}" class="button hollow">
58-
Buy Tickets
59-
</a>
56+
<li>
57+
<span>
58+
<a href="{{ site.ticket_link }}" class="button hollow">
59+
Buy Tickets
60+
</a>
61+
62+
<a href="{{ site.ticket_link }}" class="button theme-brand-color2">
63+
Buy Tickets
64+
</a>
65+
</span>
6066
</li>
61-
{% endcomment %}

_includes/social-icons.html

+1
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@
1111
<symbol id="web-icon" viewBox="0 0 64.5 64.5">
1212
<path d="M32.2 0C14.5 0 0 14.5 0 32.2 0 50 14.5 64.5 32.2 64.5 50 64.5 64.5 50 64.5 32.2 64.5 14.5 50 0 32.2 0zM57.2 45.3C57.2 45.3 57.2 45.3 57.2 45.3l-6.7 0c1.1-3.6 1.7-7.4 1.9-11.1h8C60.1 38.1 59 41.9 57.2 45.3zM34.4 60.4V49.3H45c-2.1 4.9-4.5 8.5-5.9 10.4C37.6 60 36 60.2 34.4 60.4zM25.5 59.7c-1.4-1.8-3.8-5.4-5.9-10.4h10.8v11.1C28.8 60.3 27.1 60.1 25.5 59.7zM7.3 45.3c-1.8-3.4-2.9-7.2-3.2-11.1h8.1c0.2 3.8 0.8 7.5 1.9 11.1L7.3 45.3C7.3 45.3 7.3 45.3 7.3 45.3zM7.5 18.8C7.5 18.8 7.5 18.8 7.5 18.8l6.7 0c-1.2 3.7-1.8 7.6-2 11.5H4.1C4.4 26.3 5.5 22.4 7.5 18.8zM30.5 4.1v10.8H19.9c1.5-3.3 3.5-6.7 6.1-10.2C27.4 4.4 28.9 4.2 30.5 4.1zM38.7 4.7c2.6 3.5 4.5 6.9 6 10.2H34.4V4.1C35.8 4.3 37.3 4.4 38.7 4.7zM46.2 18.8c1.3 3.7 2 7.6 2.2 11.5h-14V18.8C34.4 18.8 46.2 18.8 46.2 18.8zM30.5 18.8v11.5H16.2c0.2-3.6 0.8-7.5 2.2-11.5H30.5zM16.2 34.2h14.3v11.1H18.2C17 41.7 16.4 38 16.2 34.2zM34.4 45.3V34.2h14c-0.2 3.8-0.9 7.5-2 11.1C46.4 45.3 34.4 45.3 34.4 45.3zM52.4 30.3c-0.1-3.9-0.8-7.7-2-11.5H57c0 0 0 0 0 0 1.9 3.5 3.1 7.5 3.3 11.5C60.4 30.3 52.4 30.3 52.4 30.3zM54.5 14.9h-5.5c-1.1-2.7-2.4-5.3-3.9-7.8C48.7 9 51.9 11.6 54.5 14.9zM19.7 7c-1.6 2.5-2.9 5.2-4 7.9H10C12.6 11.6 15.9 8.9 19.7 7zM9.7 49.3h5.6c1.1 2.8 2.4 5.4 3.9 8C15.5 55.3 12.3 52.6 9.7 49.3zM45.4 57.2c1.5-2.5 2.8-5.2 3.8-7.9h5.5C52.3 52.6 49.1 55.2 45.4 57.2z"/>
1313
</symbol>
14+
1415
{% comment %}
1516
<symbol id="instagram-icon" viewBox="0 0 33.196 33.196">
1617
<path d="M16.549 33.196c-2.463-.098-5.023-.098-7.486-.196-2.364-.099-4.434-.887-6.206-2.463-1.576-1.576-2.463-3.448-2.66-5.615C0 23.346 0 21.671 0 20.096v-8.669c0-1.576.098-3.054.492-4.63C1.477 3.054 3.939.887 7.683.295 9.456 0 11.328 0 13.101 0h8.669c1.576 0 3.251.099 4.827.492 3.645 1.084 5.713 3.546 6.305 7.191.295 1.772.295 3.645.295 5.418v8.668c0 1.576-.099 3.054-.492 4.63-.985 3.743-3.448 5.911-7.191 6.502-1.772.295-3.645.295-5.418.295h-3.547zm14.283-16.647c-.099-1.379 0-2.856-.099-4.235 0-1.379-.098-2.759-.196-4.138-.296-2.955-2.167-5.023-5.024-5.517-1.576-.295-3.152-.295-4.729-.295h-8.472c-1.379 0-2.758.099-4.137.196-1.378.099-2.561.592-3.546 1.478-1.478 1.281-1.97 2.857-2.068 4.729-.099 1.872-.197 3.646-.099 5.517 0 3.35 0 6.601.099 9.949 0 1.576.493 2.955 1.576 4.236 1.28 1.478 2.955 2.068 4.827 2.167 4.039.099 8.077.099 12.116.099 1.28 0 2.66-.099 3.94-.197s2.562-.591 3.546-1.478c1.379-1.28 1.971-2.955 2.069-4.729.098-2.66.197-5.221.197-7.782z"/><path d="M24.922 16.45c0 4.63-3.743 8.275-8.274 8.275s-8.274-3.744-8.274-8.275c0-4.63 3.645-8.274 8.274-8.373 4.629.099 8.274 3.842 8.274 8.373zm-8.275-5.319c-2.955 0-5.418 2.364-5.418 5.319s2.364 5.418 5.319 5.418 5.418-2.364 5.418-5.319c.099-2.955-2.363-5.418-5.319-5.418zM25.316 9.851c-1.084 0-1.971-.788-1.971-1.872 0-1.083.887-1.97 1.872-1.97 1.083 0 1.97.887 1.97 1.97a1.87 1.87 0 0 1-1.871 1.872z"/>

_includes/styleguide/hero-example1.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@
2424
Director, Application Development PonyCorp
2525
</cite>
2626
</blockquote>
27-
<a href="#TODO" class="button hollow theme-brand-color8">Join Rory. Buy your ticket</a>
27+
<a href="#TODO" class="button hollow theme-brand-color1">Join Rory. Buy your ticket</a>
2828
</div>
2929

3030
</div>

_includes/styleguide/styleguide-branding.html

+1-3
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,5 @@ <h1>Branding Guidelines</h1>
77
<p><img class="styleguide-logo" src="https://djangocon.github.io/resources/us-2023/logos/black.svg" alt="DjangoCon US logo"></p>
88
<h3>Typefaces</h3>
99
<ul>
10-
<li><a href="https://fonts.google.com/specimen/Lilita+One">Lilita One</a> - Typeface for logo</li>
11-
<li><a href="https://fonts.google.com/specimen/Rubik">Rubik</a> - Used for headings</li>
12-
<li><a href="https://fonts.google.com/specimen/Karla">Karla</a> - Used in body copy throughout website</li>
10+
<li><a href="https://fonts.google.com/specimen/Plus+Jakarta+Sans">Plus Jakarta Sans</a> - Used in body copy throughout website</li>
1311
</ul>

_includes/styleguide/themes-example1.html

-8
Original file line numberDiff line numberDiff line change
@@ -22,14 +22,6 @@ <h2 class="text-center">Headline</h2>
2222
<h2 class="text-center">Headline</h2>
2323
<p class="text-center">This section has `theme-brand-color6` applied.</p>
2424
</section>
25-
<section class="section-pad theme-brand-color7">
26-
<h2 class="text-center">Headline</h2>
27-
<p class="text-center">This section has `theme-brand-color7` applied.</p>
28-
</section>
29-
<section class="section-pad theme-brand-color8">
30-
<h2 class="text-center">Headline</h2>
31-
<p class="text-center">This section has `theme-brand-color8` applied.</p>
32-
</section>
3325
<section class="section-pad theme-light-gray">
3426
<h2 class="text-center">Headline</h2>
3527
<p class="text-center">This section has `theme-light-gray` applied.</p>

_layouts/base.html

+8-2
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,9 @@
1010
{% assign youtube_id = page.video_url | replace:"https://youtu.be/",""%}
1111
{% include youtube-embed-head.html id=youtube_id %}
1212
{% endif %}
13-
<link href="https://fonts.googleapis.com/css?family=Karla:400,400i,700|Rubik:400,500&amp;display=swap" rel="stylesheet">
13+
<link rel="preconnect" href="https://fonts.googleapis.com">
14+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
15+
<link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,400;0,600;0,700;1,400;1,600;1,700&display=swap" rel="stylesheet">
1416
<link rel="stylesheet" href="/static/main.css">
1517

1618
<!-- favicon
@@ -24,7 +26,11 @@
2426

2527
<div class="off-canvas-wrapper">
2628
<div class="off-canvas-wrapper-inner" data-off-canvas-wrapper>
27-
<div class="off-canvas position-right" id="offCanvasRight" data-off-canvas data-position="right">
29+
<div
30+
class="off-canvas position-right"
31+
id="offCanvasRight"
32+
data-off-canvas
33+
data-position="right">
2834
<ul class="vertical menu drilldown" data-drilldown>
2935
{% include nav.html %}
3036
</ul>

_layouts/home.html

+52-73
Original file line numberDiff line numberDiff line change
@@ -2,10 +2,10 @@
22
layout: base
33
---
44

5-
<header class="header">
6-
<div class="row">
5+
<header class="home-hero">
6+
<div class="row theme-brand-color1">
77
<div class="header-text">
8-
<h1>Five days of talks, sprints, and tutorials in Durham, North Carolina</h1>
8+
<h1>Join us for <strong>five days</strong> of inspiration, education, and networking opportunities</h1>
99

1010
<div class="event-info-detail">
1111
<strong
@@ -21,68 +21,55 @@ <h1>Five days of talks, sprints, and tutorials in Durham, North Carolina</h1>
2121
<a class="button" href="{{ site.ticket_link }}">Buy Tickets</a>
2222
<a class="button" href="{{ site.cfp_application }}">Submit Talk</a>
2323

24-
<a class="button" href="https://emails.djangocon.us/sendy/subscription?f=Gs892S6cdJ676370nkSBxLOWzUsgYKPBcwkEMMvt0rr70f3IeA7634kuMTKJCLrdcgOQHQHdzwqLwvmcETbcm6KWtu9g">Join Mailing List</a>
2524
{% comment %}
25+
<a class="button" href="https://emails.djangocon.us/sendy/subscription?f=Gs892S6cdJ676370nkSBxLOWzUsgYKPBcwkEMMvt0rr70f3IeA7634kuMTKJCLrdcgOQHQHdzwqLwvmcETbcm6KWtu9g">Join Mailing List</a>
2626
<a class="button" href="/schedule/">Conference Schedule</a>
2727
{% endcomment %}
2828
</div>
2929
</div>
3030
</header>
3131

3232

33-
<div class="home-content">
3433

35-
<section class="section-pad curve1 theme-brand-color3">
36-
<div class="row column xlarge-9">
37-
<p class="lead column large-9 large-centered text-center">Join us for a source of inspiration, education and networking opportunities. Our team is making sure that participating in DjangoCon US is easy for you!</p>
38-
39-
<div class="date-card medium-4 column">
40-
<a href="/tutorials/">
41-
<div class="dates">
42-
<div class="month">October</div>
43-
<div class="days">15</div>
44-
</div>
45-
<div class="details">
46-
<h2 class="date-card-title">Tutorials</h2>
47-
<p>One day, numerous tutorials</p>
48-
</div>
49-
</a>
50-
</div>
51-
<div class="date-card medium-4 column">
52-
<a href="/talks/">
53-
<div class="dates">
54-
<div class="month">October</div>
55-
<div class="days">16-18</div>
56-
</div>
57-
<div class="details">
58-
<h2 class="date-card-title">Talks</h2>
59-
<p>Dozens of talks chosen by the community</p>
60-
</div>
61-
</a>
62-
</div>
63-
<div class="date-card medium-4 column">
64-
<a href="/sprints/">
65-
<div class="dates">
66-
<div class="month">October</div>
67-
<div class="days">19-20</div>
68-
</div>
69-
<div class="details">
70-
<h2 class="date-card-title">Sprints</h2>
71-
<p>Team up to work on Django!</p>
72-
</div>
73-
</a>
74-
</div>
34+
<div class="row column xlarge-9 theme-brand-color5 section-pad">
35+
<div class="date-card medium-4 column">
36+
<a href="/tutorials/">
37+
<div class="dates">
38+
<div class="month">October</div>
39+
<div class="days card-bg-1">15</div>
40+
</div>
41+
<div class="details">
42+
<h2 class="date-card-title">Tutorials</h2>
43+
<p>One day, numerous tutorials</p>
44+
</div>
45+
</a>
46+
</div>
47+
<div class="date-card medium-4 column">
48+
<a href="/talks/">
49+
<div class="dates">
50+
<div class="month">October</div>
51+
<div class="days card-bg-2">16-18</div>
52+
</div>
53+
<div class="details">
54+
<h2 class="date-card-title">Talks</h2>
55+
<p>Dozens of talks chosen by the community</p>
56+
</div>
57+
</a>
58+
</div>
59+
<div class="date-card medium-4 column">
60+
<a href="/sprints/">
61+
<div class="dates">
62+
<div class="month">October</div>
63+
<div class="days card-bg-3">19-20</div>
64+
</div>
65+
<div class="details">
66+
<h2 class="date-card-title">Sprints</h2>
67+
<p>Team up to work on Django!</p>
68+
</div>
69+
</a>
7570
</div>
76-
</section>
77-
78-
{% comment %}
79-
<div class="photo-hero-inline tint-brand-color1">
80-
<img
81-
src="/static/img/attendees.jpg"
82-
alt="Attendees holding a sign for DjangoCon 2019"
83-
/>
8471
</div>
85-
{% endcomment %}
72+
8673

8774
<section class="section-pad">
8875
<div class="row column v-pad-bottom text-center">
@@ -133,43 +120,35 @@ <h3 class="card-title">Code of Conduct</h3>
133120
</div>
134121
</section>
135122

136-
<section class="news-section section-pad theme-brand-color4 back">
123+
<section class="news-section section-pad theme-brand-color3">
137124
<div class="row column v-pad-bottom">
138125
<h2 class="text-center">Latest News</h2>
139126
</div>
140127

141128
<div class="news row">
142129
{% for post in site.posts limit:12 %}
143130
{% unless post.hidden %}
144-
<article class="news-title medium-4 column">
145-
<div class="card {% if post.category == "Sponsorship" %}card-theme-brand-color3{% else %}card-theme-brand-color2{% endif %}">
146-
<div class="card-section">
147-
<span class="post-meta">{{ post.date | date: "%b %-d, %Y" }}</span>
148-
<h3>
149-
<a href="{{ post.url | prepend: site.baseurl }}">{{ post.title | escape }}</a>
150-
</h3>
131+
<article class="news-title medium-4 column">
132+
<div class="card {% cycle "card-bg-1", "card-bg-2", "card-bg-3", "card-bg-4" %} {% if post.category == 'Sponsorship' %}card-theme-brand-color3{% else %}card-theme-brand-color2{% endif %}">
133+
<div class="card-section">
134+
<span class="post-meta">{{ post.date | date: "%b %-d, %Y" }}</span>
135+
<h3>
136+
<a href="{{ post.url | prepend: site.baseurl }}">{{ post.title | escape }}</a>
137+
</h3>
138+
</div>
151139
</div>
152-
</div>
153-
</article>
140+
</article>
154141
{% endunless %}
155142
{% endfor %}
156143
</div>
157144

158145
<div class="row v-pad-top">
159146
<div class="medium-4 column medium-centered text-center">
160-
<a class="button" href="/news/">Read More News</a>
147+
<a class="button theme-brand-color1" href="/news/">Read More News</a>
161148
</div>
162149
</div>
163150
</section>
164151

165152
{% include sponsor-footer.html %}
166153

167-
<div class="photo-hero-inline curve-top tint-brand-color1">
168-
<img
169-
src="/static/img/courtyard-crowd.jpg"
170-
alt="The crowd of DjangoCon 2019 attendees"
171-
loading="lazy"
172-
/>
173-
</div>
174-
175154
</div><!-- end .content -->

_layouts/speaker-template.html

+3-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,9 @@
44
<meta charset="utf-8">
55
<meta http-equiv="x-ua-compatible" content="ie=edge">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7-
<link href="https://fonts.googleapis.com/css?family=Karla:400,400i,700|Rubik:400,500&amp;display=swap" rel="stylesheet">
7+
<link rel="preconnect" href="https://fonts.googleapis.com">
8+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
9+
<link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,400;0,600;0,700;1,400;1,600;1,700&display=swap" rel="stylesheet">
810
<link rel="stylesheet" href="/static/main.css">
911
</head>
1012
<body class="{{ page.layout }}-page">

0 commit comments

Comments
 (0)