Devlog #11

I have finally finished styling my whole website in CSS. It was such a long process, but I really think that I learned how to code in CSS. Position and display no longer confuse me and I have gotten the hang of adding cool effects to me elements. I am really liking the theme of my website, but I still have more to do. Right now, I have a lot of empty space in my website. Because all of my cards are glassmorphism, I am planning to use JS to make really neat background just to add like a nice touch and really sell the website, but that might be after the first ship. I am also planning to change some fonts and all that, so still a lot to do.

Current Progress

I finished the Achievements and Contact section and also styled my footer. I made a masonry style layout for the achievements, and I think the design turned out really neat. At first, I thought I would use a flexbox or a grid, but then I saw that I could just make a fized number of columns and the text would just automatically arrange itself. So I used that instead of getting all tangled up in like flex and grid properties and all of that. But then it actually made it like vertically ordered, but I wanted it horizontally, so I took the time to like arrange them so that the layout would appear even and it would look like it was horizontally arranged, when in reality it is actually vertically arranged but in a weird way. It makes more sense when you look at it. I also finished the Contact section. This was quite easy. I just styled it like the Hero and added two little icons: one to my email, and the other to my github, so yeah that was pretty simple. I first thought of adding a contact form, but then I realized that that needed a backend, so I decided against that. Again, if I want, I might add it later in the future, but for now I will leave it at just to two icons. So mainly I finished those two sections in this block. One more cool thing that I discovered was how to make links open to a new page, because while I was trying out links it was bugging me that it was always opening in that page, so this really put my mind to ease a bit, and makes navigation a bit easier.

Next Steps

I am planning to ship very soon. I am thinking of just adding some finishing touches before shipping the first version, like some font changes. I might also just try to play around in JS, and like get a feel of it, Because I think that a cool background will really take it to the top, so I will play around a bit with that. i’m also thinking about adding like scroll up effects, especially for like my experience timeline. But yeah next steps might just to be to polish it up just a bit before shipping. I am super excited to try out JS, and hope that the final product will be awesome.

Below is a picture of the masonry effect of the achievements section.