Weeknotes 21:18

October 28, 2021

Week of October 10-23

Launch

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.

Screenshot of my project site with missing bottom border
Code example from Digital Ocean article with the same issue.

Oh Canada

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.

See the Pen
Photo Wall Idea for IRL by Jeff Bridgforth (@webcraftsman)
on CodePen.

Computer Challenge

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.

Mihalyi Cskiszentmihalyi

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.

Read (Books)

  • 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.

Reading (Online)

Watching

  • 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.

Played

  • 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.

Comments are closed.