Weeknotes 25:24

Posted 7 hours ago

Week of June 8–14

Image solution

On Monday, I was recreating some content as we move over the French version of Revive Our Hearts from WordPress to Django. One of the pieces of content was an image with a caption that the French team wanted centered on the page. There was also an image with caption that was floated left allowing the page content to flow around it. I knew that I wanted to put the image and caption inside a figure. And I wanted a solution that would size the figure to be the same width as the image so that it could be centered on the page or floated to the left of the content. I knew there was situations were the caption text would be wider than the image so I needed a way for the caption to wrap to width of the image.

I was curious if someone had come up with a “CSS trick” for this type of component. So I asked a couple of CSS wizards on Bluesky. My initial post set off a chain of responses by many people who I did not mention in my original post. I put together a summary of the responses along with Codepen examples and weighed in on my favorite of the solutions.

Read my article, Having figure match width of contained image

From scratch

I was excited to be handed a project where I had the chance to build something from scratch. I was also given some creative license to determine how to translate a print newsletter design into a webpage. Having worked for agencies the past 15 years, I have been use to building sites from scratch on a regular basis. But my new role is more of working with an existing product (site). There should be some more opportunities in the future to build some landing pages or microsites. I reimagined a page component but not yet a full page. I reallly enjoyed the experience and look forward to more opportunities in the months ahead.

Two months

I hit the two month milestone working for Revive Our Hearts this week. I had wanted to write a post about it and reflect a bit on the new job. I had already been thinking about sharing an update and my initial impressions. Doing it on the two month milestone made sense but I was not in a writing mood at night. Plus there was a lot of activity in my house so my attention was drawn elsewhere.

Full house

We had a full house of people last week as my son’s girlfriend came down to go to a concert with my son and my youngest daughter. They went to see Stray Kids in Atlanta on Tuesday night. My daughter has been looking forward to this since she first heard over 18 months go that they were planning to tour the US. She has been very excited over the past few months as she prepared for the concert. She made over 70 bracelets to pass out to other concert goers. She also bought a light stick and a friend of hers did her nails with icons on each finger related to a Stray Kids song. She really enjoyed the concert and said it was one of her best days ever.

A mockup of what my daughter wanted painted on her nails on her left hand. Different icons represent different songs or albums of Stray Kids.
A mockup of what my daughter wanted painted on her nails on her right hand. Different icons represent different songs or albums of Stray Kids.
A pile of 70 beaded bracelets that my daughter made to give out to other Stay members at the Stray Kids concert.
View of the stage before the Stray Kids started performing in concert at Truist Park.

When they returned home on Wednesday, they brought another houseguest, Marta. She was living with the host family that my son stayed with in Barcelona a year ago. Marta is visiting the states and happy coincidence, flew into Atlanta so they were able to pick her up and bring her back to Chattanooga. We enjoyed getting to know Marta, who lives in Sweden but is originally from Latvia. We always enjoy getting to know internationals especially from Europe because we have spent so much time there in the past. I enjoyed getting to know more about Marta and about her two countries of citizenship. I had gotten to know several different Swedish exchange students in my high school.

With the full house, I worked out of a different location. I relocated my desk downstairs to our dining room to work for the week. The dining room is right underneath my office. I use to refer to this space as my summer office as I moved down a couple of times when my oldest daughter was home for the summer and used my office as her bedroom for the summer. It refreshing to work from a different space and it gave me a energy boost for the week.

Unexpected opportunity

I saved the best for last. On Tuesday, I got a message over Bluesky from the CSS Tricks account. Geoff Graham, editor of CSS Tricks. was reaching out to tell me to express appreciation for my writing, especially during the challenging year of unemployment as I shared the things I was learning in the process. He expressed interest in having me write for CSS Tricks in the future. CSS Tricks has played an important role in my journey as a developer and it is an honor to be asked to contribute.

Geoff and I met on Thursday. It was a fun conversation of getting to know each other and talk about our mutual passion for front-end along with our concerns about the direction things are going. It was great to connect with a kindred spirit and to discuss more about what a partnership with CSS Tricks would look like. Wow. It is such an honor to be recognized and to be given the opportunity to share the wisdom and experience I have gained. Always a privilege to be able to give back. I can’t wait to see how this unfolds.

Articles I read

What I listened to

Are we losing our craft? (Kevin Powell) – Kevin takes a look at Salma’s article, The promise that wasn’t kept, and Ensloppification by David Bushell. I mentioned Salma’s article (and video) a couple of weeks ago. I had skimmed through David’s article.

What I watched

Why visual website builders didn’t take off (Salma Alam-Naylor)

  • Adam Argyle’s talk, Ultimate Scroller, from CSS Day (you can buy access to the archived talks)
  • M*A*S*H (MeTV)
  • NCIS (Netflix)
  • Runaway Jury (Netflix)
  • Pacer-Thunder Game 2 of NBA Finals (ABC)
  • Pacer-Thunder Game 3 of NBA Finals (ABC)
  • Pacer-Thunder Game 4 of NBA Finals (ABC) – I watched the final quarter with my son. We were disappointed that the Pacers blew the lead and the chance to be up 3-1

Books I am reading

Walking

  • Sunday – 4.18 miles in 1 hour 16 minutes
  • Monday – 1.6 miles in 30 minutes – I needed to walk around and clear my head during the workday

What I played

MLB The Show 20 (Twins) – I went 3-1 this week. I played a series against the Rays and swept them. Playing against that team that I played MLB The Show with in 2020-21 brought back some fun memories. One of my favorite seasons that I have played on the game.

Comment on this post