Skip to content

Commit dedb8a0

Browse files
committed
Update stuff
1 parent ae4cab2 commit dedb8a0

9 files changed

Lines changed: 523 additions & 62 deletions

File tree

.gitignore

Lines changed: 233 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,233 @@
1+
# Created by https://www.toptal.com/developers/gitignore/api/node,jekyll,ruby,vim
2+
# Edit at https://www.toptal.com/developers/gitignore?templates=node,jekyll,ruby,vim
3+
4+
### Jekyll ###
5+
_site/
6+
.sass-cache/
7+
.jekyll-cache/
8+
.jekyll-metadata
9+
# Ignore folders generated by Bundler
10+
.bundle/
11+
vendor/
12+
13+
### Node ###
14+
# Logs
15+
logs
16+
*.log
17+
npm-debug.log*
18+
yarn-debug.log*
19+
yarn-error.log*
20+
lerna-debug.log*
21+
.pnpm-debug.log*
22+
23+
# Diagnostic reports (https://nodejs.org/api/report.html)
24+
report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
25+
26+
# Runtime data
27+
pids
28+
*.pid
29+
*.seed
30+
*.pid.lock
31+
32+
# Directory for instrumented libs generated by jscoverage/JSCover
33+
lib-cov
34+
35+
# Coverage directory used by tools like istanbul
36+
coverage
37+
*.lcov
38+
39+
# nyc test coverage
40+
.nyc_output
41+
42+
# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
43+
.grunt
44+
45+
# Bower dependency directory (https://bower.io/)
46+
bower_components
47+
48+
# node-waf configuration
49+
.lock-wscript
50+
51+
# Compiled binary addons (https://nodejs.org/api/addons.html)
52+
build/Release
53+
54+
# Dependency directories
55+
node_modules/
56+
jspm_packages/
57+
58+
# Snowpack dependency directory (https://snowpack.dev/)
59+
web_modules/
60+
61+
# TypeScript cache
62+
*.tsbuildinfo
63+
64+
# Optional npm cache directory
65+
.npm
66+
67+
# Optional eslint cache
68+
.eslintcache
69+
70+
# Optional stylelint cache
71+
.stylelintcache
72+
73+
# Microbundle cache
74+
.rpt2_cache/
75+
.rts2_cache_cjs/
76+
.rts2_cache_es/
77+
.rts2_cache_umd/
78+
79+
# Optional REPL history
80+
.node_repl_history
81+
82+
# Output of 'npm pack'
83+
*.tgz
84+
85+
# Yarn Integrity file
86+
.yarn-integrity
87+
88+
# dotenv environment variable files
89+
.env
90+
.env.development.local
91+
.env.test.local
92+
.env.production.local
93+
.env.local
94+
95+
# parcel-bundler cache (https://parceljs.org/)
96+
.cache
97+
.parcel-cache
98+
99+
# Next.js build output
100+
.next
101+
out
102+
103+
# Nuxt.js build / generate output
104+
.nuxt
105+
dist
106+
107+
# Gatsby files
108+
.cache/
109+
# Comment in the public line in if your project uses Gatsby and not Next.js
110+
# https://nextjs.org/blog/next-9-1#public-directory-support
111+
# public
112+
113+
# vuepress build output
114+
.vuepress/dist
115+
116+
# vuepress v2.x temp and cache directory
117+
.temp
118+
119+
# Docusaurus cache and generated files
120+
.docusaurus
121+
122+
# Serverless directories
123+
.serverless/
124+
125+
# FuseBox cache
126+
.fusebox/
127+
128+
# DynamoDB Local files
129+
.dynamodb/
130+
131+
# TernJS port file
132+
.tern-port
133+
134+
# Stores VSCode versions used for testing VSCode extensions
135+
.vscode-test
136+
137+
# yarn v2
138+
.yarn/cache
139+
.yarn/unplugged
140+
.yarn/build-state.yml
141+
.yarn/install-state.gz
142+
.pnp.*
143+
144+
### Node Patch ###
145+
# Serverless Webpack directories
146+
.webpack/
147+
148+
# Optional stylelint cache
149+
150+
# SvelteKit build / generate output
151+
.svelte-kit
152+
153+
### Ruby ###
154+
*.gem
155+
*.rbc
156+
/.config
157+
/coverage/
158+
/InstalledFiles
159+
/pkg/
160+
/spec/reports/
161+
/spec/examples.txt
162+
/test/tmp/
163+
/test/version_tmp/
164+
/tmp/
165+
166+
# Used by dotenv library to load environment variables.
167+
# .env
168+
169+
# Ignore Byebug command history file.
170+
.byebug_history
171+
172+
## Specific to RubyMotion:
173+
.dat*
174+
.repl_history
175+
build/
176+
*.bridgesupport
177+
build-iPhoneOS/
178+
build-iPhoneSimulator/
179+
180+
## Specific to RubyMotion (use of CocoaPods):
181+
#
182+
# We recommend against adding the Pods directory to your .gitignore. However
183+
# you should judge for yourself, the pros and cons are mentioned at:
184+
# https://guides.cocoapods.org/using/using-cocoapods.html#should-i-check-the-pods-directory-into-source-control
185+
# vendor/Pods/
186+
187+
## Documentation cache and generated files:
188+
/.yardoc/
189+
/_yardoc/
190+
/doc/
191+
/rdoc/
192+
193+
## Environment normalization:
194+
/.bundle/
195+
/vendor/bundle
196+
/lib/bundler/man/
197+
198+
# for a library or gem, you might want to ignore these files since the code is
199+
# intended to run in multiple environments; otherwise, check them in:
200+
# Gemfile.lock
201+
# .ruby-version
202+
# .ruby-gemset
203+
204+
# unless supporting rvm < 1.11.0 or doing something fancy, ignore this:
205+
.rvmrc
206+
207+
# Used by RuboCop. Remote config files pulled in from inherit_from directive.
208+
# .rubocop-https?--*
209+
210+
### Vim ###
211+
# Swap
212+
[._]*.s[a-v][a-z]
213+
!*.svg # comment out if you don't need vector files
214+
[._]*.sw[a-p]
215+
[._]s[a-rt-v][a-z]
216+
[._]ss[a-gi-z]
217+
[._]sw[a-p]
218+
219+
# Session
220+
Session.vim
221+
Sessionx.vim
222+
223+
# Temporary
224+
.netrwhist
225+
*~
226+
# Auto-generated tag files
227+
tags
228+
# Persistent undo
229+
[._]*.un~
230+
231+
# End of https://www.toptal.com/developers/gitignore/api/node,jekyll,ruby,vim
232+
.design
233+
.agents

_includes/toc.html

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
{% assign toc_variant = include.variant | default: "desktop" %} {% if
2+
page.chapters %}
3+
<nav class="toc toc--{{ toc_variant }}" aria-label="Guide contents">
4+
{% if toc_variant == "mobile" %}
5+
<p class="toc__heading">Contents</p>
6+
{% endif %}
7+
<ol class="toc__list">
8+
{% for chapter in page.chapters %}
9+
<li class="toc__item">
10+
<a class="toc__link" href="#{{ chapter.id }}">{{ chapter.title }}</a>
11+
</li>
12+
{% endfor %}
13+
</ol>
14+
</nav>
15+
{% endif %}

_layouts/guide.html

Lines changed: 5 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -5,15 +5,9 @@
55
<div class="guide-layout">
66
<article class="guide-content">{{ content }}</article>
77

8-
{% if page.chapters %}
9-
<nav class="toc" aria-label="Guide contents">
10-
<ol class="toc__list">
11-
{% for chapter in page.chapters %}
12-
<li class="toc__item">
13-
<a class="toc__link" href="#{{ chapter.id }}">{{ chapter.title }}</a>
14-
</li>
15-
{% endfor %}
16-
</ol>
17-
</nav>
18-
{% endif %}
8+
{% include toc.html variant="desktop" %}
199
</div>
10+
11+
{% if page.chapters %}
12+
<script src="{{ "/js/guide-toc.js" | relative_url }}"></script>
13+
{% endif %}

_sass/components.scss

Lines changed: 81 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -118,20 +118,6 @@
118118
border-bottom: 1px solid var(--color-border-subtle);
119119
}
120120

121-
// Guide link paragraphs: make the guide link prominent
122-
h2 + p > a:only-child {
123-
font-family: var(--font-display);
124-
font-size: var(--font-size-lg);
125-
font-weight: var(--font-weight-bold);
126-
color: var(--color-accent);
127-
text-decoration: none;
128-
129-
&:hover {
130-
color: var(--color-accent-hover);
131-
text-decoration: underline;
132-
}
133-
}
134-
135121
// Voices list
136122
h2 ~ ul {
137123
list-style: none;
@@ -150,6 +136,65 @@
150136
}
151137
}
152138

139+
.guide-links {
140+
display: grid;
141+
grid-template-columns: 1fr;
142+
gap: var(--space-5);
143+
margin-block: var(--space-5) var(--space-8);
144+
}
145+
146+
.guide-link {
147+
padding-block: var(--space-5);
148+
border-block: 1px solid var(--color-border-subtle);
149+
150+
& + & {
151+
border-top: 0;
152+
margin-top: calc(var(--space-5) * -1);
153+
}
154+
155+
&__label {
156+
margin-bottom: var(--space-2);
157+
color: var(--color-text-tertiary);
158+
font-size: var(--font-size-sm);
159+
font-weight: var(--font-weight-semibold);
160+
letter-spacing: var(--letter-spacing-caps);
161+
line-height: var(--line-height-snug);
162+
text-transform: uppercase;
163+
}
164+
165+
h3 {
166+
margin-bottom: var(--space-3);
167+
font-size: var(--font-size-xl);
168+
}
169+
170+
a {
171+
color: var(--color-accent);
172+
text-decoration: none;
173+
174+
&:hover {
175+
color: var(--color-accent-hover);
176+
text-decoration: underline;
177+
text-decoration-thickness: 1px;
178+
text-underline-offset: 4px;
179+
}
180+
}
181+
182+
p:last-child {
183+
color: var(--color-text-secondary);
184+
}
185+
}
186+
187+
.status-note {
188+
display: inline-block;
189+
margin-bottom: var(--space-4);
190+
color: var(--color-accent);
191+
font-size: var(--font-size-sm);
192+
font-weight: var(--font-weight-semibold);
193+
letter-spacing: var(--letter-spacing-caps);
194+
line-height: var(--line-height-snug);
195+
text-transform: uppercase;
196+
}
197+
153198
.index-aside {
154199
display: none;
155200
}
@@ -205,10 +250,29 @@
205250
}
206251

207252
// ── Table of contents ─────────────────────────────────────────────────────
208-
// Hidden on mobile, shown as sticky side rail on desktop.
209253

210254
.toc {
211-
display: none; // shown via media query at desktop width
255+
&--desktop {
256+
display: none; // shown via media query at desktop width
257+
}
258+
259+
&--mobile {
260+
display: block;
261+
margin-block: var(--space-6) var(--space-7);
262+
padding: var(--space-4);
263+
border-block: 1px solid var(--color-toc-border);
264+
}
265+
}
266+
267+
.toc__heading {
268+
margin-bottom: var(--space-3);
269+
color: var(--color-text-secondary);
270+
font-family: var(--font-body);
271+
font-size: var(--font-size-sm);
272+
font-weight: var(--font-weight-semibold);
273+
letter-spacing: var(--letter-spacing-caps);
274+
line-height: var(--line-height-snug);
275+
text-transform: uppercase;
212276
}
213277

214278
.toc__list {
@@ -294,7 +358,7 @@
294358
justify-content: space-between;
295359
gap: var(--space-4);
296360
font-size: var(--font-size-sm);
297-
color: var(--color-text-tertiary);
361+
color: var(--color-text-secondary);
298362

299363
a {
300364
color: var(--color-text-secondary);

0 commit comments

Comments
 (0)