Awww, thank you! I appreciated that! 
ooh I donāt know exactly, but because this is my second tribute page project (the first one was just plain basic and nothing special), luckily with two tribute projects upload showing its date, I would calculateā¦maybe 3 weeks, the maximum?
Thanks for all the help! 
One more thingā¦ are all the animations created using JQuery? If so, I have heard that it is now an outdated tool. I would appreciate it if someone could get me up to speed on that front. (Heard people say to use vanilla javascript instead, or maybe something else)
Do you have any recommendations to some free tutorials/courses in which I can learn some of the topics you listed. Lastly, do you think it is wise splitting the scss into seperate files like _header or _main or _mixins or _variables? I understand that since you used a codepen it had to be in the same file.
Iāll have you know that I just maybe, maybe will be using your project as an aspiration of mine. Hopefully, one day, I can write elegant and responsive and efficient code that results in a fluid and appealing design! 
Anyways, great job once again, and Iāll be looking for to perhaps seeing more projects from you someday! Good day/night!
PS: Lol, I have edited this so many times because I keep having stuff to say/ask. But since you have helped me so much, I think I can return the favor. If you put the cursor in a specific region around the social icons, it starts sputtering (it looks like it is vibrating). If this is not intentional, I think just making the parent container (the one with the :hover) larger should fix it. Although, this is small hopefully it helps in some way!
Oh, go check out all the courses on academind.com. Learn almost anything you want. 
Also see my post here
Yep.
Yep.
Certainly.
use it as much as possible! :DD
With animations, they can also be simply created using CSS itself using transitions or the animations keyframe, no JavaScript needed. Only time I find myself using JS for animations / transitions, is to remove or add a certain class list when an item is clicked.
If you find yourself dealing with super complicated animations that deal with timing, you can use a animation library for it, but then again, you can set delays and timing functions within CSS itself for it. CSS has come a long ways, and reduced some of the need for JS for simple animations / transitions.
Ah thank you so much for your response and advice! Iām looking forward to seeing more projects of yours!! 
Thank you for sharing the article, thatās really helpful! Itās definitely CSS Grid and media queries thatās driving me a bit nuts at the moment haha I created my first āproperā web page - https://codepen.io/toowee/full/NWKdRVo - Iām still working on making it a responsive design but itād be wonderful to have your initial thoughts on what you think of it, whenever of course!
Thank you again 
You are very much welcome!
Not all animations are created using Jquery, in fact, only the animation in book collection are created using Jquery and that is because it cannot be done with CSS animation, which all the other animations are created with.
That is correct. Jquery is now an outdated tool, I was not aware of this when creating this project, unfortunately I found out after the project was done, however I am grateful that @Steffan153 pointed it out, you should see the posts above of all the discussion about Jquery from @Steffan153 and @brandon_wallace, they have been really helpful! So, yes Vanilla JS would be a good choiceā¦only I havenāt had to learn it yet 
Hmm, courses I am not so sure for smaller topics like how CSS works under the hood, or BEM as already mentioned, but I gathered a list of all the free articles of all the topics covered in that Udemy course for my friend earlier this year and I am happy to pass the list on to you if you like (bear in mind, it is a long list!) Here are the resources that I have copied and pasted:
If you wanted a free course, I found thiscourse (also on Udemy), it is free, however, I cannot guarantee if it is a good course or not as I never enrolled into this course. 
Also, Udacity is a good platform to learn web development and I can see they do responsive design course for free. Check it out! 
It is a better structure of CSS architecture, because when you are currently working on a big project and you need to keep going to a particular CSS selector, for example, a <h1> element with a class called āheading__primaryā, you would not have to going all the way down (or up) in a one big CSS file to search for it, instead you would go to a file _typography.scss because you (and even other developers would have to work on it in the future) know it will be in that file if you want to see or alter the styling of that element.
Bear in mind that SASS is a CSS pre-processor. Before the website goes live, you compile all the SASS files into one CSS file and that CSS file is what will be used in the live production. It is a hassle for Codepen because you have to copy and paste from all the SCSS files, but if it helps me to be a better web developer then so be it!
That is really odd! I canāt see it from my end, but may I ask when it vibrates, does it go faster or slow? Also, from what device do you see it on? Thank you for pointing it out as I will check it out later in the evening!
Aww, again thank you so much for your kind words! If you really want something and you work your backside off, you WILL get it even if you go through high and low That is how I felt when I saw other peopleās tribute page after finishing my first tribute page (which was nothing special about) 
Justā¦Bingo! If anything, I prefer CSS animation over JS as it is so simple and clear. It is getting even more better as time goes by as there is more control.
As you mentioned, JS animation is only used when it comes to having to remove or add an element (via its classes), if CSS have this ability, then I would not even think of using JS unless it has more benefits than CSS. Hopefully, this day will come when CSS jhave more control
Well, theyāre not free but those so cheap courses on academind.comā¦
Well, I hope it does help! may I ask what is it exactly on media queries that you are struggling on? Because I may be able to help out to explain or find a resource to pass onto you (I am not joking I keep a loooong list of helpful resources in my Evernote haha). in the above post to another fellow member, I mentioned this free course about responsive design on Udacity. I did learn responsive design through Udacity, which was super helpful, although not sure if it is this exact course. Still, hopefully, this is as good!
So, I had a peep at your project and yes, I donāt likeā¦but that is because I SUPER LOVE IT! 
Okay, there is some room for improvements, not majorly as you are almost there
First, I will tell you what I do love about your page
Your color scheme is just perfect. It works well with the Parakeets because of their appearance, but also their personality, which the color scheme is cool, but it promotes friendliness.
I love the parakeet logo, it is just simply cute and works well with the branding of the project
The typography choice works well too, especially the font of the headings, it works as it symbolises the culture of London (for its history), yet the san-serif font does work in harmony because in some way London has its modern elements too. Also, the serif headings got that friendly vibe too.
Okay, so could be improved? (I will bear in mind this is a work in progress), it is mostly the use of spacing.
As cute the Parakeet logo is, I would make it slightly smaller to give room in height-wise of the nav-bar. But also, I would give some room between the logo and the heading text āLONDON PARAKEETSā
Also, it is best to add padding between the heading page and the text:
Weāre the UKās most abundant naturalised parrot. We became established in the wild in the 1970s after a few of us captive birds escaped or were released.
To understand what I mean, see my tribute page where I added padding between the heading page and the title:
The life of John Steinbeck
Also, you added the space between the heading āAbout usā and its body text? that works well and that also should be applied the same the āFind usā heading and its body text too
But, honestly, this is fantastic work and excuse me for being nosy but do you have any design background??? Because I think you also have the potential to become a web designer as well as a web developer
I hope this helps and I didnāt go too far on my thoughts! haha
Might have a quick peep to see what they have
Cheers for this! 
also lots of free videos
It happens pretty quickly but keep in mind it is like a 2x2 pixel area. It rarely ever occurs and only happens if I put my cursor on the edges of the icon.
I noticed throughout your code you included @mixins which converted px to ems. Which resource could further explain that for me? I would want to start experimenting with that in my web development.
Thanks for everything! I hope to collaborate further on future projects or see more AMAZING work from you!
Iām glad to see youāre taking Jonas course as well! You will definitely walk away more confidently with more advanced CSS and SCSS after you finish 
And yep, I have yet to come across where I couldnāt fulfill the need of animations with css. As a tip though, if you are incorporating in transitions, I would never animate over any other property, other than opacity and transform, as if you were to do so on another property such as margin.
The whole animation will be choppy, as your computer takes more to try and optimize those properties, whereas if you just animate over transforms, youāll get the same effect, but they are more efficient as the elements wonāt need to be re-rendered. I learned this the hard way, figured I would throw this tip in here for anyone looking to take advantage over css transitions/animations.
Oh Evernote is great 
! this might sound silly but whilst building my landing page, I was getting confused as to how many media queries I actually needed to make the page responsive on all devices and I donāt quite understand the widths of different breakpoints. I think Iām still a media queries noob haha! The free Udacity course looks good! Iāll have a look into this
I just experimented it myself and saw what you meant! That is so crazy, it felt like it was pounding my head in! Oh god, I will try and fix this so thank you very much for pointing this out!
Not exactly sure by what you mean. Do you mean with the media query in the mixins like this:
// Media Queries
// 1em = 16px
@mixin responsive($breakpoint) {
@if $breakpoint == small-phone {
// 28.125em = 450px
@media only screen and (max-width: 28.125em) {
@content;
} //600px
}
or as in general in any mixins, for example like this one:
@mixin body-text {
color: $col-brown-dark;
font-family: $font-lora;
font-size: 1.75rem;
font-weight: 400;
@include responsive(tab-land) {
font-size: 1.9rem;
}
Awww wow Iām actually really stunned at your great detailed feedback! Thank you so much for even taking the time to look at it and for your super kind words and suggestions 
Iām genuinely surprised because I feel so critical of it haha
I definitely agree - I do feel itās almost there but was getting a bit stuck on how to improve it which is why I came on here
I shall make the improvements you suggested (smaller logo, increase spacing between the logo and heading āLONDON PARAKEETSā, add padding between heading page and the below text, additional space under 'Find Us whilst also improving the responsiveness of the page. I opened the page on a desktop for the first time at work today and realised there is definitely alot of unnecessary space around the content beneath the hero image, and the about section could be more centered. I didnāt realise this on my laptop.
I donāt actually have a background in design (I donāt know if having Art & Photography GCSEs count haha) but I would say Iām the ācreativeā person at work and home. I recently created my website on WordPress for a future side biz idea which is unrelated to this, but itās what triggered me to pursue a career change into web design or web developer because I had so much fun creating this (www.virtualtoowee.com).
Youāve been super helpful and your kind, encouraging words have honestly made my day!
It is a fantastic course! I hope you are enjoying it (or enjoyed it if you have finished it) I have now finished it and you are right I feel happier that I have learned so much and feel safe to say I have decent skills in advanced CSS and SCSS (by the way I LOVE SCSS as well as BEM, it is just amazing)
oh wow, I mean I was aware that not all properties canāt be used in transitions (such as padding) and because I have seen the use of transform (specifically translate) so much, I (wrongly) assume margins does not work in transitions.
However, this is very useful to know so thank you for this advice! I will take this on board!
I finished that course not too long ago, took about a week to complete. And throughly enjoyed it, it was great value for what you end up getting out of it, thatās for sure. When I took it, my skills with CSS was not so good lol, it was trash to say the least.
BEM is a great way of structuring out your code, it makes things much more manageable, when you need to change things. Iām not sure if youāve been introduced to how he approaches media queries yet, but that was a great eye opener for me, as it simplified the process a ton.
I believe you see him always using transitions on transform a lot is due to the above mentioned reason, I think he actually brings up that point too, I donāt remember. But you can definitely animate on margins, top, or other properties that might move an element, but for more complex animations, itās best to use it on transform so itās more fluid. If itās something simple like a hover effect, you can get a away with changing the margin, but once you see some choppiness in more complex transitions, definitely use it on transform.
I am crazy for Evernote and it is my lifesaver for staying organised, but also to write articles about what I have learned so I can understand it in my ālanguageā
I see! Okay, well this Udacity course explained it very well for me on how media queries work as it included diagrams and examples. If this still hasnāt helped, please let me know and I will try my best to explain it.
You are very much welcome! I am honestly more than happy to help out! Plus, I do know what it is like to be critical of ourselves, but I then learn to try and accept what I have done as much I can because at the end of the day, no matter what, there is always going to be something or someone better than us, so just be happy with what we can do and if someone like our work even more than ourselves, then that is good enough for me
I have noticed in your code in the CSS section you have used some absolute units (px), whether that may affect the layout, I am not sure, but in responsive design, always use relative units, especially rem, again I am hoping the Udacity course will cover why.
However, if you are willing to pay for a course, this course on Udemy (I have stated this far too many times in this post lol) is THE BEST for responsive, it covers so many other topics too such as flex, grid, media queries, animation, SASS and it is now on sale for Ā£9.99. I have finished it and because of this course, that how I managed to create the tribute page. I am so happy with the result, so also check it out too!
For someone with a small design background, you have done AMAZING job and I really honestly think you have abilities to also become a web designer, and if you enjoy designing web pages then I would looking into courses for it (being both web developer and designer is actually more rewarding and beneficial too)
By the way, I have checked out your website and again you have done a fantastic job! I love the typography, the colour scheme! And I noticed you are from London! So hello, my fellow Londoner! I am from North London by the way!
I definitely agree with you and I was the same as well, before I took the course my CSS skills was okay, just basic. But even though I knew there was more to learn, I definitely did not expect that much! So, I am very happy with the course for its value
Also, this is perfect for people who got this need-to-be-organised OCD thingā¦which I happen to be one of them and I now feel more settled
That definitely was an eye-opener for me, mostly on how he did the responsive units and using the mixins. I did have to watch it a couple of times to grasp it, but it is a very clever idea and I do wonder if Jonas invented this neat trick
Well, again this is useful to know because all this time I thought margins cannot be used with CSS animation as I kept see total use of transform property and to be honest I prefer it.
However, I do remember I had trouble with animation involving using both the transform property and the absolute positioning (along with its offset properties), I cannot remember exactly how, but it was on the flip cards in the tribute page and when you hover over and it turns over, the whole card was pitch black for few seconds. Thankfully, this is sorted, but it is another thing to be aware of.