Silhouette of Black Woman with Afro and white headband that says "On My Mind."

Let Down by the Navbar: Day 31 #100DaysOfCode

The “divs.” were my friend today! That is until my collapsible navbar with my Font Awesome social icons decide to stop working.

The Good Divs

I started working on my Portfolio Page (FreeCodeCamp) Saturday after some time away. I had been frustrated and overwhelmed. The first part of my page that was designed was my navbar. I was so proud of my navbar with the social icons. That meant I did accomplish part of my assignment.

Now, my energy was renewed, and I was ready to design my page. I started around 1pm (EST) and was cruising along until about 5pm (EST). My portfolio sections were lining up correctly. I was able to use UpSplash (an awesome website) to generate my thumbnails. I even got my Fanny Lou Hamer Tribute Page to sit pretty in the first row. My lines were indented perfectly, and my comments were on point. I was feeling pretty awesome about my coding.

Then the “Code Murphy’s Law Fairy” stopped at my house and left a gift of chaos. All I have left is the Contact section on my page. I’ve even kept my ADHD in check and haven’t checked the hot color palettes. (I could get lost for hours.) Why are you going to mess up my collapsible navbar now? It was working well before even hiding my social icons that were on the right. Now when I test my site on a smartphone-sized screen, my button doesn’t want to work? SERIOUSLY? I had to leave the house. My Mac had to be charged, and a certain store closed at 6pm (EST).

My Misbehaving Navbar

After a short drive break, I came home with fresh eyes ready to attack my misbehaving navbar. I did some research on the Bootstrap site. Somewhere between my days of frustration and my new-found glee, the JavaScript collapse plugin disappeared from my page. Now I have added the missing plugin, and my navbar is working again.

So, to my fellow FreeCodeCamp Coders who are working on their portfolio pages or other projects: Make sure you pay attention to the Bootstrap changes and plugins. Codepen usually updates their plugins. However, you should check the Bootstrap’s website just in case.

from Tumblr


Published by


Teacher, writer, web designer, friend, and traveler... I try to experience everything and let go of all that I cannot control.

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.