From 6f21bae4922854b041371d15f0cee3f1e38c3233 Mon Sep 17 00:00:00 2001 From: Eryn Wells Date: Sat, 27 Aug 2022 10:09:55 -0700 Subject: [PATCH 01/60] Move scripts to the bottom of the body --- layouts/_default/baseof.html | 15 +++++++++++++++ layouts/partials/head.html | 15 --------------- 2 files changed, 15 insertions(+), 15 deletions(-) diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html index d89a9b3..4cc3d20 100644 --- a/layouts/_default/baseof.html +++ b/layouts/_default/baseof.html @@ -10,6 +10,21 @@ {{ partial "footer.html" . }} + {{ if and .IsPage (.Page.Scratch.Get "includes_railroad_diagram") }} + + + {{ end }} + + {{ if and .IsPage (.Page.Scratch.Get "includes_p5_sketch") }} + + + {{ end }} + + {{ range $script := .Resources.Match "*.js" }} + {{ $isModule := default true $script.Params.is_module }} + + {{ end }} + - - {{ end }} - - {{ if and .IsPage (.Page.Scratch.Get "includes_p5_sketch") }} - - - {{ end }} - - {{ range $script := .Resources.Match "*.js" }} - {{ $isModule := default true $script.Params.is_module }} - - {{ end }} - {{ if or hugo.IsProduction (eq site.Params.env "production") }} From d281f22242d2debf54dfc19a96f65e1e51eae557 Mon Sep 17 00:00:00 2001 From: Eryn Wells Date: Sat, 27 Aug 2022 10:10:25 -0700 Subject: [PATCH 02/60] Reduce padding on small screens to 2rem --- static/styles/main.css | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/static/styles/main.css b/static/styles/main.css index ee6f355..5602885 100644 --- a/static/styles/main.css +++ b/static/styles/main.css @@ -486,6 +486,10 @@ ul.post-tags li + li { } @media (max-width: 704px) { + :root { + --body-padding: 2rem; + } + html { font-size: 7px; } From 83f95508493733a559d573ee925c9921e5cdfd3d Mon Sep 17 00:00:00 2001 From: Eryn Wells Date: Sat, 3 Sep 2022 15:30:38 -0700 Subject: [PATCH 03/60] New home page! --- content/_index.es.md | 51 +----------- content/_index.md | 60 ++----------- content/home.css | 134 ++++++++++++++++++++++++++++++ layouts/_default/baseof.html | 38 +++++---- layouts/_default/index.html | 17 ++-- static/fonts/Museo_Slab_500.woff | Bin 0 -> 28552 bytes static/fonts/Museo_Slab_500.woff2 | Bin 0 -> 22752 bytes 7 files changed, 174 insertions(+), 126 deletions(-) create mode 100644 content/home.css create mode 100644 static/fonts/Museo_Slab_500.woff create mode 100644 static/fonts/Museo_Slab_500.woff2 diff --git a/content/_index.es.md b/content/_index.es.md index 58544be..b09db21 100644 --- a/content/_index.es.md +++ b/content/_index.es.md @@ -1,48 +1,5 @@ -# Hola! 👋🏻 +--- +title: Eryn Rachel Wells +--- -Me llamo Eryn. Mis pronombres son [ella/ella][p]. Esta es me página personal. Bienvenide. - -Soy una mujer trans y queer. Vivo en San Francisco con mis [dos gatos][cats]. Nací en Seattle, WA, y crecía en Phoenix, AZ. Asistí [Oberlin College][ob] donde obtuve un títolo en informática. {{< tess >}} es mi novia. - -Mi lengua nativa es inglés, y también hablo español pero siempre necesito practicar más. - -## Pasatiempos - -Tengo un gran apetito por probar y aprender pasatiempos nuevos, especialmente -las que combinan varias de mis intereses. - -He sido música para el gran parte de mi vida. Empezé tocar el piano cuando tuve -siete años, toqué la trompeta en colegio, y he tocado algunos otros instrumentos -por el camino. Todavía toco el piano, pero mi obsesión musical hoy en día es mi -sintetizador modular. De vez en cuando, grabo música y espero compartirla aquí, -en este sitio. Por el momento, puedes escuchar mi música en [Bandcamp][bc] o -[SoundCloud][sc]. - -Otros pasatiempos de los años recients incluyen: cerámica, caligrafía, tejido, -horneado pan, ciclismo, fotografía, y astronomía. ¿Uno no puede tener demasiados -pasatiemos, de verdad? - -## Trabajo - -He trabajado como ingeniera de software desde 2011 por varias companías basadas -en San Francisco y Silicon Valley. Hace seis años que he trabajado en Apple, -primero en el equipo iOS Accessibility, y ahora en el equipo Authentication -Experience. - -Echa un vistazo a mi [resumen][r] para más detalles. - -## Decirme Hola - -Puedes encontrarme en muchos rincones del Internet. Estoy más activa en -[Twitter][t] y [Instagram][i]. Publico música en [SoundCloud][sc] y -[Bandcamp][bc]. Y para los proyectos de software, estoy en [GitHub][gh]. - -[p]: http://pronoun.is/she -[cats]: {{< ref "/cats" >}} -[ob]: https://www.oberlin.edu -[r]: {{< ref "/resume" >}} -[t]: https://twitter.com/erynofwales -[i]: https://www.instagram.com/erynofwales/ -[sc]: https://soundcloud.com/purlsnbeeps -[bc]: https://erynwells.bandcamp.com/releases -[gh]: https://github.com/erynofwales \ No newline at end of file +Este es un poco de texto sobre Eryn: quién es, qué le gusta, y por qué existe este sitio. diff --git a/content/_index.md b/content/_index.md index e8e03c9..d7a643a 100644 --- a/content/_index.md +++ b/content/_index.md @@ -1,56 +1,6 @@ -# Hi! 👋🏻 +--- +title: Eryn Rachel Wells +--- -I'm Eryn. My pronouns are [she/her][p]. This is my personal page. Welcome! - -I'm a queer trans woman. I live in San Francisco, CA, on the unceded ancestral -lands of the Ramaytush Ohlone people, with my [two cats][cats]. I was born in -Seattle, WA and grew up in Phoenix, AZ. I attended [Oberlin College][ob] where I -got a degree in Computer Science. {{< tess >}} is my girlfriend. - -I speak English natively, and Spanish too, though I always need more practice. - -## Hobbies - -I have a big appetite for learning new skills, especially things that combine -multiple of my interests. - -I've been a musician for most of my life. I started on the piano at age seven, -played trumpet in high school, and have picked up a smattering of other -instruments along the way. I still play piano occasionally, but my current -musical obsession is my modular synthesizer. I occasionally record things, and -I'm hoping to share them here on this site, but for now, they're on -[SoundCloud][sc] and [Bandcamp][bc]. - -I do try to spend my non-work time away from the computer, but every so often I -get inspired to hack on something. Those projects usually end up on -[GitHub][gh]. - -Other things I've picked up over the years include: ceramics, calligraphy, -knitting, bread baking, bicycling, photography, and astronomy. You can never -have too many hobbies, right? - -## Professional - -I've worked as a software engineer since 2011 for a variety of companies around -the San Francisco Bay Area. I've been at Apple since early 2016, first on the -iOS Accessibility team, and now on the Authentication Experience team. - -Check out my [résumé][r] for more details. - -## Say Hello - -You can find me in lots of other corners of the Internet. I'm most active on -[Twitter][t] and [Instagram][i]. I post music on [SoundCloud][sc] and -[Bandcamp][bc]. I'm on [GitHub][gh] for coding projects. You can also send me an -[email][eml]. - -[p]: http://pronoun.is/she -[cats]: {{< ref "/cats" >}} -[ob]: https://www.oberlin.edu -[r]: {{< ref "/resume" >}} -[t]: https://twitter.com/erynofwales -[i]: https://www.instagram.com/erynofwales/ -[sc]: https://soundcloud.com/purlsnbeeps -[bc]: https://erynwells.bandcamp.com/releases -[gh]: https://github.com/erynofwales -[eml]: mailto:Eryn%20Wells \ No newline at end of file +This is some text about Eryn: who she is, what she likes, and why this website +exists. diff --git a/content/home.css b/content/home.css new file mode 100644 index 0000000..b87ccc9 --- /dev/null +++ b/content/home.css @@ -0,0 +1,134 @@ +:root { + --lt-blue: rgb(69, 212, 243); + --mid-blue: rgb(26, 169, 239); + --dk-blue: rgb(63, 46, 231); + --purple: rgb(161, 49, 232); + --lilac: rgb(187, 121, 245); + + --font-size-min: 8px; + --font-size-max: 16px; +} + +* { box-sizing: border-box; } + +a { + color: var(--mid-blue); + text-decoration: none; +} +a:hover { + text-decoration: underline; + text-underline-offset: 0.12em; +} +a:visited { color: none; } + +body { + display: flex; + font-size: 2rem; + margin: auto; + justify-content: center; +} + +h1 { + font-family: Krungthep, Museo_Slab, Tahoma, sans-serif; + margin: 0; + padding: 0; +} +@media (max-width: 450px) { + h1 { font-size: 4.25rem; } +} + +html { + background-color: #fff; + color: #000; + font-family: Verdana, sans-serif; + font-size: clamp(var(--font-size-min), 2.5vw, var(--font-size-max)); +} +@media (prefers-color-scheme: dark) { + html { + background-color: #000; + color: #fff; + } +} + +main { + align-items: baseline; + display: grid; + grid-template-columns: min-content 3fr; + grid-template-rows: repeat(2, max-content); + grid-template-areas: + "title blurb" + "title nav"; + grid-gap: 2rem; + margin-block-start: 10vh; + max-width: 800px; +} +@media (max-width: 450px) { + main { + grid-template-columns: 1fr; + grid-template-rows: repeat(3, max-content); + grid-template-areas: + "title" + "nav" + "blurb"; + margin-block-start: 5vh; + text-align: center; + } +} + +main h1 { + background: + radial-gradient(circle at 20% 70%, var(--purple), transparent 40%), + radial-gradient(circle at 30% 30%, var(--lt-blue), var(--mid-blue) 20%, transparent 80%), + radial-gradient(ellipse at 95% 20%, var(--dk-blue), var(--mid-blue) 70%, transparent 80%), + radial-gradient(circle at 100% 100%, var(--purple), var(--lilac) 100%), + radial-gradient(circle at 45% 100%, var(--lilac), var(--purple) 60%), + radial-gradient(ellipse at 50% 50%, var(--dk-blue), transparent 80%); + background-clip: text; + color: transparent; + grid-area: title; + letter-spacing: 0.025em; + text-align: end; +} +@media (max-width: 450px) { + main h1 { text-align: center; } +} + +main nav { + align-items: center; + display: flex; + font-size: max(1rem, 75%); + font-variant: small-caps; + grid-area: nav; + height: 100%; + justify-content: center; + letter-spacing: 0.12em; + list-style: none; + text-transform: lowercase; +} + +main nav li { + display: block; + margin-inline-end: 0.5em; +} + +main nav li:first-child::before { + content: ""; +} + +main nav li::before { + content: "•"; + font-size: 60%; + opacity: 80%; + margin-inline-end: 0.5em; +} + +main p { + grid-area: blurb; + margin: 0; + padding: 0; +} + +p { + letter-spacing: 0.025em; + line-height: 1.25; +} diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html index 4cc3d20..20b4cdc 100644 --- a/layouts/_default/baseof.html +++ b/layouts/_default/baseof.html @@ -2,28 +2,34 @@ {{ partial "head.html" . }} - - {{ partial "header.html" . }} -
+ + {{ block "body" . }} + {{ block "header" . }}{{ end }} +
{{ block "main" . }}{{ end }}
- {{ partial "footer.html" . }} + {{ block "footer" . }}{{ end }} + {{ end }} - {{ if and .IsPage (.Page.Scratch.Get "includes_railroad_diagram") }} - - + + {{ block "styles" . }}{{ end }} + {{ if not hugo.IsProduction }} + + {{ end }} + {{ range .Resources.Match "*.css" }} + {{ end }} - {{ if and .IsPage (.Page.Scratch.Get "includes_p5_sketch") }} - - - {{ end }} - - {{ range $script := .Resources.Match "*.js" }} - {{ $isModule := default true $script.Params.is_module }} - - {{ end }} + {{ block "scripts" . }}{{ end }} + + {{ end }} + + {{ if .Page.Scratch.Get "includes_p5_sketch" }} + + + {{ end }} + + {{ range $script := .Resources.Match "*.js" }} + {{ $isModule := default true $script.Params.is_module }} + + {{ end }} +{{ end }} + +{{ define "footer" }} + {{ partial "footer.html" . }} +{{ end }} From 57b0c141c10389ff99e5d57f86e981ff24e877bd Mon Sep 17 00:00:00 2001 From: Eryn Wells Date: Sun, 11 Sep 2022 10:43:23 -0700 Subject: [PATCH 14/60] Continue purging styles from main.css --- static/styles/main.css | 28 +--------------------------- 1 file changed, 1 insertion(+), 27 deletions(-) diff --git a/static/styles/main.css b/static/styles/main.css index 40e5e6b..446ea37 100644 --- a/static/styles/main.css +++ b/static/styles/main.css @@ -55,28 +55,6 @@ } } -a { - color: var(--link-color); - text-decoration: none; -} - -a:hover { - text-decoration: underline; - text-underline-position: from-font; -} - -body { - background-color: var(--body-background-color); - color: var(--body-foreground-color); - display: flex; - flex-direction: column; - font-size: 2rem; - line-height: 1.2; - margin: 0 auto; - max-width: var(--body-width); - padding: 0 var(--body-padding); -} - blockquote { border-inline-start: 4px solid var(--separator-color); padding-inline-start: 2rem; @@ -355,10 +333,6 @@ pre { font-size: 2.5rem; } -.post-list li + li { - margin-top: 2rem; -} - .post-list article { color: gray; font-style: oblique; @@ -475,4 +449,4 @@ ul.post-tags li + li { /* For s that shouldn't break. */ .nobreak { white-space: nowrap; -} \ No newline at end of file +} From fc2bbb21265966e7cdf3a08f1e8698315b239e1a Mon Sep 17 00:00:00 2001 From: Eryn Wells Date: Sun, 11 Sep 2022 10:43:36 -0700 Subject: [PATCH 15/60] Move the old home page content to an about page --- content/about/index.es.md | 50 ++++++++++++++++++++++++++++++++ content/about/index.md | 60 +++++++++++++++++++++++++++++++++++++++ 2 files changed, 110 insertions(+) create mode 100644 content/about/index.es.md create mode 100644 content/about/index.md diff --git a/content/about/index.es.md b/content/about/index.es.md new file mode 100644 index 0000000..7348699 --- /dev/null +++ b/content/about/index.es.md @@ -0,0 +1,50 @@ +--- +title: "Hola! 👋🏻" +--- + +Me llamo Eryn. Mis pronombres son [ella/ella][p]. Esta es me página personal. Bienvenide. + +Soy una mujer trans y queer. Vivo en San Francisco con mis [dos gatos][cats]. Nací en Seattle, WA, y crecía en Phoenix, AZ. Asistí [Oberlin College][ob] donde obtuve un títolo en informática. {{< tess >}} es mi novia. + +Mi lengua nativa es inglés, y también hablo español pero siempre necesito practicar más. + +## Pasatiempos + +Tengo un gran apetito por probar y aprender pasatiempos nuevos, especialmente +las que combinan varias de mis intereses. + +He sido música para el gran parte de mi vida. Empezé tocar el piano cuando tuve +siete años, toqué la trompeta en colegio, y he tocado algunos otros instrumentos +por el camino. Todavía toco el piano, pero mi obsesión musical hoy en día es mi +sintetizador modular. De vez en cuando, grabo música y espero compartirla aquí, +en este sitio. Por el momento, puedes escuchar mi música en [Bandcamp][bc] o +[SoundCloud][sc]. + +Otros pasatiempos de los años recients incluyen: cerámica, caligrafía, tejido, +horneado pan, ciclismo, fotografía, y astronomía. ¿Uno no puede tener demasiados +pasatiemos, de verdad? + +## Trabajo + +He trabajado como ingeniera de software desde 2011 por varias companías basadas +en San Francisco y Silicon Valley. Hace seis años que he trabajado en Apple, +primero en el equipo iOS Accessibility, y ahora en el equipo Authentication +Experience. + +Echa un vistazo a mi [resumen][r] para más detalles. + +## Decirme Hola + +Puedes encontrarme en muchos rincones del Internet. Estoy más activa en +[Twitter][t] y [Instagram][i]. Publico música en [SoundCloud][sc] y +[Bandcamp][bc]. Y para los proyectos de software, estoy en [GitHub][gh]. + +[p]: http://pronoun.is/she +[cats]: {{< ref "/cats" >}} +[ob]: https://www.oberlin.edu +[r]: {{< ref "/resume" >}} +[t]: https://twitter.com/erynofwales +[i]: https://www.instagram.com/erynofwales/ +[sc]: https://soundcloud.com/purlsnbeeps +[bc]: https://erynwells.bandcamp.com/releases +[gh]: https://github.com/erynofwales diff --git a/content/about/index.md b/content/about/index.md new file mode 100644 index 0000000..28ea50c --- /dev/null +++ b/content/about/index.md @@ -0,0 +1,60 @@ +--- +title: "Hi! 👋🏻" +date: 2022-09-03T12:14:32-07:00 +draft: true +--- + +I'm Eryn. My pronouns are [she/her][p]. This is my personal page. Welcome! + +I'm a queer trans woman. I live in San Francisco, CA, on the unceded ancestral +lands of the Ramaytush Ohlone people, with my [two cats][cats]. I was born in +Seattle, WA and grew up in Phoenix, AZ. I attended [Oberlin College][ob] where I +got a degree in Computer Science. {{< tess >}} is my girlfriend. + +I speak English natively, and Spanish too, though I always need more practice. + +## Hobbies + +I have a big appetite for learning new skills, especially things that combine +multiple of my interests. + +I've been a musician for most of my life. I started on the piano at age seven, +played trumpet in high school, and have picked up a smattering of other +instruments along the way. I still play piano occasionally, but my current +musical obsession is my modular synthesizer. I occasionally record things, and +I'm hoping to share them here on this site, but for now, they're on +[SoundCloud][sc] and [Bandcamp][bc]. + +I do try to spend my non-work time away from the computer, but every so often I +get inspired to hack on something. Those projects usually end up on +[GitHub][gh]. + +Other things I've picked up over the years include: ceramics, calligraphy, +knitting, bread baking, bicycling, photography, and astronomy. You can never +have too many hobbies, right? + +## Professional + +I've worked as a software engineer since 2011 for a variety of companies around +the San Francisco Bay Area. I've been at Apple since early 2016, first on the +iOS Accessibility team, and now on the Authentication Experience team. + +Check out my [résumé][r] for more details. + +## Say Hello + +You can find me in lots of other corners of the Internet. I'm most active on +[Twitter][t] and [Instagram][i]. I post music on [SoundCloud][sc] and +[Bandcamp][bc]. I'm on [GitHub][gh] for coding projects. You can also send me an +[email][eml]. + +[p]: http://pronoun.is/she +[cats]: {{< ref "/cats" >}} +[ob]: https://www.oberlin.edu +[r]: {{< ref "/resume" >}} +[t]: https://twitter.com/erynofwales +[i]: https://www.instagram.com/erynofwales/ +[sc]: https://soundcloud.com/purlsnbeeps +[bc]: https://erynwells.bandcamp.com/releases +[gh]: https://github.com/erynofwales +[eml]: mailto:Eryn%20Wells From 3b74c3a256e76eee958b3ef45e0a38f74541dddd Mon Sep 17 00:00:00 2001 From: Eryn Wells Date: Sun, 11 Sep 2022 10:44:13 -0700 Subject: [PATCH 16/60] Add a "narrow" railroad diagram to the audio scope post; add line numbers to the `samples` listing --- content/blog/2022/08/audio-scope-with-p5js/index.md | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/content/blog/2022/08/audio-scope-with-p5js/index.md b/content/blog/2022/08/audio-scope-with-p5js/index.md index d6865b6..105e8a3 100644 --- a/content/blog/2022/08/audio-scope-with-p5js/index.md +++ b/content/blog/2022/08/audio-scope-with-p5js/index.md @@ -91,6 +91,14 @@ Our audio processing graph looks like this: rr.Terminal("destination"))); {{< /figures/railroad >}} +{{< figures/railroad id="audioContextDiagram" class="narrow-only" >}} + return rr.Diagram( + rr.Stack( + rr.Terminal("