Skip to content

Commit 12d155f

Browse files
committed
add files
1 parent 2966b29 commit 12d155f

File tree

18 files changed

+425
-151
lines changed

18 files changed

+425
-151
lines changed

404.html

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,10 +6,10 @@
66

77
<section class="section-lg">
88
<div class="container text-center">
9-
<h1 style="font-size: 120px; font-weight: 700; color: #e8e8ed; margin-bottom: 0;">404</h1>
10-
<h2 style="margin-bottom: 16px;">Page Not Found</h2>
11-
<p class="text-muted" style="margin-bottom: 32px;">The page you're looking for doesn't exist or has been moved.</p>
12-
<div class="btn-group" style="justify-content: center;">
9+
<h1 class="error-code mb-1">404</h1>
10+
<h2 class="mb-2">Page Not Found</h2>
11+
<p class="text-muted mb-4">The page you're looking for doesn't exist or has been moved.</p>
12+
<div class="btn-group btn-group-center">
1313
<a href="{{ '/' | relative_url }}" class="btn btn-primary">Go Home</a>
1414
<a href="{{ '/research/' | relative_url }}" class="btn btn-secondary">View Research</a>
1515
</div>

_includes/head.html

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,12 @@
22
<meta name="viewport" content="width=device-width, initial-scale=1">
33
<title>{% if page.title %}{{ page.title }} | {% endif %}{{ site.title }}</title>
44
<meta name="description" content="{{ page.description | default: site.description | strip_html | truncate: 160 }}">
5+
<meta name="theme-color" content="#2563eb">
56

67
<!-- Preconnect for performance -->
8+
<link rel="preconnect" href="https://fonts.googleapis.com">
79
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
10+
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
811

912
<!-- Styles -->
1013
<link rel="stylesheet" href="{{ '/assets/css/main.css' | relative_url }}">

_includes/header.html

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,18 +5,18 @@
55
AI & Global Development Lab
66
</a>
77

8-
<button class="nav-toggle" aria-label="Toggle navigation" aria-expanded="false">
8+
<button class="nav-toggle" type="button" aria-label="Toggle navigation" aria-expanded="false" aria-controls="primary-navigation">
99
<span></span>
1010
<span></span>
1111
<span></span>
1212
</button>
1313

14-
<ul class="nav-menu">
14+
<ul class="nav-menu" id="primary-navigation">
1515
{% for item in site.data.navigation.main %}
1616
{% if item.external %}
1717
<li><a href="{{ item.url }}" target="_blank" rel="noopener">{{ item.title }}</a></li>
1818
{% else %}
19-
<li><a href="{{ item.url | relative_url }}" {% if page.url == item.url %}class="active"{% endif %}>{{ item.title }}</a></li>
19+
<li><a href="{{ item.url | relative_url }}" {% if page.url == item.url %}class="active" aria-current="page"{% endif %}>{{ item.title }}</a></li>
2020
{% endif %}
2121
{% endfor %}
2222
</ul>

_layouts/default.html

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,9 +4,10 @@
44
{% include head.html %}
55
</head>
66
<body>
7+
<a class="skip-link" href="#main-content">Skip to content</a>
78
{% include header.html %}
89

9-
<main>
10+
<main id="main-content">
1011
{{ content }}
1112
</main>
1213

_layouts/page.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ <h1>{{ page.title }}</h1>
1212
</div>
1313

1414
<section class="section">
15-
<div class="container {% if page.narrow %}container-narrow{% endif %}">
15+
<div class="container prose {% if page.narrow %}container-narrow{% endif %}">
1616
{{ content }}
1717
</div>
1818
</section>

_sass/_base.scss

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@ html {
1515
-webkit-font-smoothing: antialiased;
1616
-moz-osx-font-smoothing: grayscale;
1717
scroll-behavior: smooth;
18+
scroll-padding-top: 88px;
1819
}
1920

2021
body {
@@ -23,6 +24,12 @@ body {
2324
line-height: $line-height-relaxed;
2425
color: $color-black;
2526
background-color: $color-white;
27+
background-image:
28+
radial-gradient(1000px 520px at 18% -10%, rgba($color-accent-2, 0.18) 0%, rgba($color-white, 0) 60%),
29+
radial-gradient(1100px 560px at 85% -18%, rgba($color-accent, 0.18) 0%, rgba($color-white, 0) 58%),
30+
radial-gradient(900px 520px at 55% 0%, rgba($color-accent, 0.06) 0%, rgba($color-white, 0) 72%);
31+
background-repeat: no-repeat;
32+
text-rendering: optimizeLegibility;
2633
min-height: 100vh;
2734
display: flex;
2835
flex-direction: column;
@@ -82,3 +89,21 @@ html:focus-within {
8289
transition-duration: 0.01ms !important;
8390
}
8491
}
92+
93+
// Skip link (accessibility)
94+
.skip-link {
95+
position: absolute;
96+
left: $space-2;
97+
top: $space-2;
98+
padding: 10px 14px;
99+
background-color: $color-black;
100+
color: $color-white;
101+
border-radius: $radius-md;
102+
transform: translateY(-160%);
103+
transition: transform $transition-fast;
104+
z-index: 1000;
105+
106+
&:focus {
107+
transform: translateY(0);
108+
}
109+
}

0 commit comments

Comments
 (0)