Previous posts: Initial reaction
The past week or so I started to create the sidebars for my profile. Right now I’m mainly working on getting all the information done and looking semi-decent.
Since I decided to create a profile site I knew how I wanted the follow and sidebars to look. I wanted the follow bar across the top and the navigation bar along the right hand side.
I am thinking about animating the follow and navigation bars and create a graphic or logo to go along with my name above the follow bar and on the home page but those will probably be part of the later stages.
In order to do this I went into the defaults.vue file in the layouts folder from when you set up Nuxt. I created a div around all three elements and another one around just the context and the navigation bar. Then I used display:grid and grid-template-columns to get the right proportions.
By putting the styling in the default file it works with every file I add. So when I create the contact and projects page or any other blog posts to put up then it will automatically have the navigation bar at the same spot.
Problems I encountered:
The top navigation bar was stuck at a min-height of 100% and I spent so long looking at the console wondering why the container class was at that no matter what I changed the height to.
The reason? I wasn’t using scoped CSS. After I tracked down this problem the rest of the styling went by so easily.
The blog posts background wasn’t changing.
The reason? This was literally just because I had exited out of one of the files I was going between so I was trying to change it in the style sheet that was a bit more specialized than I needed.
So what are my current thoughts on Vue?
I’m actually still enjoying it. It’s really easy to switch things around. If I decide to switch where the follow and navigation bars are it’d only take a couple seconds to switch them.
Have you worked with any frameworks? What projects are you working on (programming or not)?