Devlog #2

During this block, I spent some time styling the website in CSS. I wanted it to start looking a bit more like a new tab page before I started in JS. I positioned my text in the middle, and made my shortcuts look nicer. Basically, it was a major styling block.

Current Progress

For now, I decided to keep only a title and some shortcuts just to keep the design simple. I want to then move onto JS to implement a dynamic feature into my website which will change with the time. So the goal is a minimalist style for now.

The styling overall was not too hard. I had already arranged by classes nicely in HTML, so I had to move them around. I finally learned the secrets of the display: flex; rule, and how to use it to center things properly in CSS. So I got that working and then styled my icons. I applied some neat hover effects to them. At first I was planning to have a label text to label the shortcuts, but I already knew what they all were, so I decided to keep the text out, and if I wanted to I could add it again later.

Next Steps

The next thing that I want to do is make the background a moving gradient, but not too fast or bright, because that will be distracting. The main thing I want to add is a dynamic aspect. So I want to make it so that the background color will change with the time of day. Pretty basic, but that’s all I want to do before the inital ship.

Below you can see a image of the page after styling.