October 28, 2021
Week of October 10-23
Monday was launch day for the Achieving Cross-Border Government Innovation site for the OECD Observatory of Public Sector Innovation and the Mohammed Bin Rashid Centre for Government Innovation. As I mentioned in my last post, this is the third year of my involvement in building a digital story for this partnership.
The last week of development was a bit hectic. I was already feeling the crunch when I had to make an unexpected trip to Nashville on Tuesday. I had to take my oldest back to school. My wife had planned to do it but was not feeling well so I stepped in. I knew when I made the decision that I would need to work later that day when I got home and later into the night. (I just want to say how thankful I am to have the flexibility in my job to do this. My team leads trust me to get my work done and give me the freedom to make this kind of decisions.)
We also had to make some changes to the design and layout based on client feedback and added a couple more content sections. I ended up working over the weekend, which has been a very rare thing I have had to do while working for LGND.
I enjoyed working over the weekend and felt a bit more relaxed. I had the time to experiment and play around with some animation ideas. It was nice to grab a bit of extra time over the weekend and not feel so rushed on Monday.
I am very happy with how the project turned out. I used
border-image for the first time for the gradient borders. I used
mix-blend-mode for the first time on several of the background elements. And I came up with a new CSS trick for the inner border on boxes with a gradient border.
Reported My First Firefox Bug
As I was finishing the project up over the weekend, I took some time to investigate an issue I was having in Firefox. I noticed that several of the boxes that had gradient borders were missing one of the borders in Firefox. My first step was to search and see if anyone else had documented the problem. I did not turn up anything with that. Next, I read some more articles on implementing
border-image with gradients and adjusted my code based on what I learned. But that still did not solve the problem.
I had already checked the site in Firefox Nightly and the borders rendered as I expected. I tested on another machine with the same version of Firefox (93) and had the same issue. I decided to download version 92 and test with that browser. The borders were rendered as expected. I downloaded version 93 but before I installed it, I deleted my previous Firefox profiles to see if that would make any difference. That did not solve the problem either. Finally, I noticed that one of the examples of a gradient border in an article was having the same issue. I decided it was time to file a bug report with Mozilla.
I filled out the form on the Mozilla site and uploaded screenshots from my project and the article that I had read. I also included the URLs of both of the pages along with descriptions. A couple of days later, I got an email verifying that they reproduced the bug and after that was notified that it was an issue that had already been addressed and the fix would come out in version 94, which will release on November 2.
Besides launching and supporting the launch of the Achieving Cross-Border Government Innovation project, I spent the rest of my week working three different projects with 3 different Canadian embassies.
- Connect2Canada – I mentioned in my last post that LGND is working with the Canadian Embassy in the U.S. on a digital story that outlines a roadmap of a renewed partnership between the two countries. I worked on adding the content for the French translation. We use the WPML plugin and I needed to upgrade the plugin on the site before I added all the content. WPML has a translation manager that puts the two languages side by side in the interface. A CSS property in the plugin was causing the content boxes to be constrained to very small width. An update to the plugin fixed the problem.
- Canada in Mexico – I started working on building a site for the Canadian embassy in Mexico at the end of August. We cloned the Connect2Canada site and changed color schemes and some graphics to give it a unique identity. We had to add new content into the page builder that we created for the C2C site and then added translations for both French and Spanish. I did not build the original site so I learned a lot about the WPML plugin as I worked on this project. I spent an afternoon updating some content and making some edits. We have soft-launched the site and I will add the link once it is official.
- Canadian Consulate in New York – Finally, I got to revisit a project we launched earlier this year. There were several things that were not working as expected and so I spent a day addressing those issues and then added some new functionality. Things that I learned on Canada in Mexico project about WPML helped me to address some things I missed on the first go-around with the site.
Mocked Up a Real-World Idea in Codepen
A couple of weeks ago, I was at Hobby Lobby with my daughters. They were looking around the fabric and yarn section. Near the section, they have picture frames and I saw some 8×8 frames. And from that, I had the idea to make a grid of screenshots from various sites I have built (and some of them I designed) over the years. I built a projects page on this site years ago so I had a visual representation of projects that I have worked on.
Last week I had the idea that I could mock up this idea for the photo grid on Codepen using the images from my project page. Using CSS Grid, I was able to quickly mock up my idea. I even found a color that approximated my wall. It ended up trending on Codepen as a “picked pen” earlier this week, which I find funny since I created it just for myself.
After completing my morning routine on Friday, I went to turn on my computer to get started with the workday. I pressed the power button and nothing. I tried again and soon realized that the computer was no longer working. After picking up the computer, I could smell a mechanical burn smell and I think my computer was fried.
I got on Slack to inform my teammates. It is a 3-year-old machine. Earlier in the week after Apple announced their new models of MacBook Pro, I kiddingly asked about our company computer replacement policy. Little did I know that I was going to need to replace it, not just want to.
Then I had to come up with a plan for the day. I had a 2012 model that I bought in 2014 when I found myself without a job and needed a newer computer to do contracting. So I snuck into my teenage son’s room and grabbed the old laptop. He uses it periodically. Then I had to figure out what I needed to put on the computer in order to get work done. I was a bit concerned with the age, processor speed, and RAM because I remember 3 years ago that some of my development software was beginning to run the fan.
In the past, I have set up a local development environment on my computer which meant installing XCode and Homebrew so that I could install NPM, Git, and my build tools. I also had to configure the Apache files to run PHP. That takes a long time to set all that up and I was a bit concerned about overloading this older machine.
Most of my development these days is in WordPress and I use Local to spin up my development environment for that work so I didn’t need the LAMP set up. I had some interest in trying out CodeKit to run my build scripts so I decided this was the perfect time to try it out. And my teammate told me about the GitHub desktop app so I decided to try that. This would allow me to get up and running in little to no time. My teammate also told me how to run a PHP server on a local folder through Terminal, which I needed to do since I was working on a rare static site.
I stumbled through the day on Friday. It took me about twice the time to get things done as I was learning new tools and just felt disoriented throughout the day. It is crazy how settings, desktop wallpaper, and other things so are so familiar and in the background suddenly become a source of frustration and disorientation. It is never fun to lose your favorite tool. I just felt off all day. But I know that this too shall pass. And I am already thinking that I will continue to use GitHub Desktop and CodeKit when I get set up on a new machine.
I had several great opportunities to spend time with Mihalyi. Such a brilliant and wonderful person.
— Jared Spool (@jmspool) October 22, 2021
I found out through Twitter that Mihalyi Cskiszentmihalyi passed away. He is most famous for his theory on Flow. I had the privilege of hearing him speak at the UI10 Conference in 2005. It was the first time I had heard of the concept of flow. I enjoyed his talk and had the chance to chat with him afterward. His name is Hungarian so I asked him if he grew up there and I told him about my affinity with Hungary.
- Insites: The Book – After reminiscing a couple of weeks ago on my own Web history, I decided to read this book of interviews with Web professionals that was written in 2012. I have enjoyed reading about people in the industry that I was familiar with and many that I only knew by name but did not know what they did. Reading the interview with Cameron Moll brought back a lot of memories as many of his articles had an influence on me. I also had the chance to take an all-day workshop with him and eat lunch with him that day at the UI12 Conference. And finally, he interviewed me for a position at Authentic Jobs in 2012. I did not get the job, I enjoyed our conversation and it was a great experience that helped me to evaluate where I needed to grow as a developer.
- Providence -This is a really long book on the subject of God’s providence that I continue to put down and pick back up again. I really would like to finish it before the end of the year but it probably won’t happen because there are a lot of other books I am interested in right now.
- An Introduction to John Owen – I started reading this one while waiting for my son to finish musical practice on Thursday night. I have a deal with him that he can stay after and visit for up to half an hour. But I like to be there early in case he doesn’t want to stay longer. That has yet to happen and not holding my breath.
- How To Add Border Images and Gradient Borders with Pure CSS – Article from Digital Ocean that helped me to clean up my border-image code on the project I launched this week.
- The CSS prefers-color-scheme user query and order of preference – Interesting information to know from Sara Soueidan.
- Lebanon hit by electricity outage expected to last several days – Speaking of Sara, who lives in Lebanon, this article grabbed my attention because of her. Not something I had heard about in the American press.
- Goldman Sachs CEO: One way to help solve the nation’s labor shortage – Article about a project that pairs community college students with small business owners in a unique internship.
- More Advice from a Thirty-Something Career Changer
- HTML with Superpowers – Dave Rupert on Web components.
- Blaming Screenreaders – A must-read about accessibility. We need to understand our audience and understand this often overlooked audience and remember the burden is on us as developers.
- Who was Bill Bright Really? – A reflection from Brad Bright, son of Bill. Dr. Bright would have turned 100 recently and his son reflects on his life. It was a life that had a big impact on me. I became a Christian through the ministry he started (Cru, formerly known as Campus Crusade for Christ) and through a booklet he wrote. My wife and I served on the staff of that ministry for 16 years.
- It’s Quitting Season (NY Times) – I found this an interesting perspective. Because there are healthy reasons for quitting certain things. And it goes against the grain of the American mindset. I remember the “Sunk Cost Fallacy” being addressed in the book, Range that I read last year.
- Sabbaticals Are On The Rise To Help Retain Workers. Can They Battle Burnout? – I am glad to see that companies are experimenting with ways to give workers a break without them having to leave.
- A Simple But Effective Mental Health Routine For Programmers
- “Dark Mode” vs “Inverted”
- Evaluating Clever CSS Solutions – A good challenge to consider from Michelle Barker.
- Let’s Talk about Native HTML Tabs – I like the idea behind this solution from Dave Rupert.
- Get your work recognized: write a brag document – I read another article that referenced this one. The other article was about how to build this type of document with Eleventy. But this is a great article on how to put together documentation to help you (and your manager) recall your accomplishments for the year. I prepared something similar last year and plan to do it again this year.
- The Great British Baking Show (Netflix)
- Inspector Lewis (Prime Masterpiece Subscription)
- Doogie Kamealoha, M.D. (Disney+)
- Dune (Movie Theater) – Went to the movie opening day with my son.
- FIFA20 – I lost my Europa League final game with the Rangers.
- NHL17 – I jumped back into a franchise team I created several years ago and played a couple of games recently.