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 }}