WDD 331R Advanced CSS - Postprocessing the Cascade
Color scheme
Mural painted by my friend Sean Jones for the Gundam 22 Memorial, Yokota Air Base 2023
Konbanwa!
My name is Harrison Merrill, and I'm a senior at BYU-I studying software development technology with an
emphasis in web development. I live in the future (by about 14 hours) - specifically, I live in Okinawa Japan
with my wife, two boys (ages 6 and 2), and dogs. My wife works for the US Air Force as a maintainer (mechanic)
for C-130J's, and we have previously lived in Tachikawa, Tokyo, Japan, doing the same work, meaning we have
lived in Japan for 8 consecutive years (and I admit that I am still functionally illiterate).
I also volunteer as a key support liaison for the 1stSOAMXS, and as the branch activity committee chair, both
of which mostly involve me cooking for and feeding large groups of people. When groups get over a certain size,
that almost always means smoking several pork butts, brisket, hot dogs, and mac & cheese, or otherwise making
hawaiian style food, but for smaller groups I lean heavily on asian-pacific, italian, mexican, and french
cooking styles. When I need to relax and do something that isn't school, family, community, or beach oriented, I
spend my time learning new recipes and cooking techniques, painting miniature figurines, watching films, and
playing various types of video, board, and tabletop games.
Each unit of this class required completing multiple tasks. Document icons signify assignments, where we were
given varying amounts of scaffolding or restrictions on our code while we demonstrated out understanding.
Meanwhile, earning-ears icons denote teaching demos that were entirely reliant on our own creativity and
approach to design and showcase in order to record a teaching video to explain a concept to our team. By
browsing from earlier to later units, our growth as students and developers can be seen by the consistently
improving techniques used and advanced concepts demonstrated. This page serves as the final and primary
demonstration of a well styled web page.
Unit 1: Foundations and the Modern CSS Landscape
This unit focused on CSS fundamentals, setting up the GitHub portfolio, and learning about the cascade,
responsive design, preprocessors, modern CSS features, custom properties, CSS math functions, and native
nesting.
Unit 2: Cascade Control, Architecture, and Tooling
This unit introduced file architecture patterns for CSS, including css layering, import, and token usage,
as well as exploring modern selectors and build tools to bundle and optimize our stylesheets.
This unit focused on visual polish, including modern color functions, layers, shadows, gradients, filters,
and backdrop effects, as well as building automatic support for light and dark modes.
This unit taught us to master CSS Grid with named areas, overlapping tracks, and auto-fit patterns, and
then moved on to subgrid alignment, container queries, advanced flex techniques, and sticky positioning.
This unit focused on polishing details, including establishing a modular type scale with fluid sizing,
loading web fonts efficiently, writing print stylesheets to produce clean documents, and styling forms with
token discipline.
This unit rounded out our CSS toolkit with animation and SVG skills, including the building of SVG sprites
and learning responsible animation with reduced-motion support. It was also our portfolio ramp as we built
out our final portfolio for presentation and grading. While some of this portfolio was established in
earlier units, it was all finished here, including this homepage, and the resume and contact pages.