Project: Website Redesign
#100DaysOfCode — Day: 28
NOTE: The italicizes text in red is stuff that I am adding in as I type up my entry. Side notes & elaboration.
TODO: fix Social Media links on the blog
–Wordpress says “an error has occurred” when I try to put in the Twitter Font Awesome tag. The heart one that I put in before I switched to this theme, works fine. *shrugs*
TODO: Make the nav bar
-Social media links
-Link to blog + page sections
-A DI circle thing in the middle DI for Dolores Ipsum.
None of the widgets are working (by “not working” I mean that they won’t save changes made to them. They are displaying just fine) “an error has occurred” with all of them. I think that it might be this theme, “Flat”.
It works when I change it in the dashboard, though. Weird.
! Add fa-5x class for huge icons this one of the fa classes that changes the size of an icon.
Back to the homepage:
NOTE: Console error – favicon GET empty response — look into this.
position:fixed; is not making the nav bar fixed to the top.
The web is saying something about transformations on the container
removing the row class from the nav bar & putting it outside the container-fluid did not work.
using !important to override any other CSS that might be affecting the tag did not work.
! Bootstrap has a class for that! A nav tag with class=”navbar navbar-default navbar-fixed-top” worked! (made the nav bar fixed to the top)
But the nav bar is overlapping the stuff at the top of the page.
Padding-top to the container-fluid seems to fix this problem. I added 10% padding
TODO: get a pretty font for the header
Bootstrap doesn’t work without the internet I used the CDN I should set that up locally. I downloaded the files but didn’t take the time to figure out what to do with them. Good thing I downloaded them!
Man, that was easier than I thought it would be. I just grabbed a random css file from the folder and linked it. it’s working so far!
The top of the page is still covered up with smaller window sizes.
TODO: use JS to make the padding-top of the container-fluid as big as the nav bar (use IDs)
I’m going to try to use DOM on the codepen class again. I think that it didn’t work with the JSdos because they were just the script tags. The codepen class is on a p tag.
Now I can use DOM to set their height equal to their width! spoiler alert: or naw.
It is console logging the height equaling the width but it doesn’t look like it is.
TODO: Make the codepens look square.
I got the padding = nav bar height thing working!
! style.property in JS only works if there is a style already assigned that property of the element offsetHeight can get the current height of an element + padding. use that the get heights of things.
It still doesn’t work with the codepens though!
Thoughts & Ideas
I should definitely use a pen tomorrow.
I feel like my notes are still too long. This post is only about 500 words, though. Maybe they feel long because I’m having a hard time reading them.
I’m going to try to find some journals written by other people for inspo.
Writing this journal is still kind-of a pain, but I can see the benefits. I don’t have to hold so many ideas and to-dos in my head and I am less stressed that I will forget something.
Tomorrow it the first day of #code4life on codingame.com! I hope it doesn’t storm so that I can compete all day.
I will be journalling during that too 🙂