All solutions

What specific areas of your project would you like help with?

I can't say am proud with this last challenge. I couldn't quite get it to be just like the design regarding its background-image. I will redo it sometime in the future. But I will celebrate because I finally finished the final newbie challenge(the available ones). I will move on to the junior challenges from now on.

Before going back to the Junior challenges tho, I am planning to give some time to learning. I will learn Java-Script from Angela, do some CSS Grid game(GRID ATTACK to specific) and learn and master the usage of css structuring method (might go for BEM).

Happy Coding.

What are you most proud of, and what would you do differently next time?

being able to use the form validation from the previous challenges was handy. it was relatively an easy layout. Everything centered in the middle.

What challenges did you encounter, and how did you overcome them?

I didn't know how to use the icons from frontawesome at first. But I remember Zach Gall using them in one of his tutorials. So i returned to that to know how to use them. They basically are a special form of texts as they increase and decrease in size just like texts by using font-size. That was fun to know.

What are you most proud of, and what would you do differently next time?

doing the project was fun. The form validation part as well. Used regex to validate the email value. Regex is a really nice tool.

What specific areas of your project would you like help with?

do you use before an element when building a form? Will there be any significant difference if I don't use one?

What are you most proud of, and what would you do differently next time?

Using for this project was a fun thing to do. Grid is really powerful. using the display class of bootsrap also helped.

I also learnt you could specify screen sizes of a range in a single break-point like this:- @media (min-width:700px) and (max-width:1000px) which marks screen sizes of 700px -1000px;

What challenges did you encounter, and how did you overcome them?

well getting the right size is always challenging. I had to see solved solutions of others to come to the right last size. I considering of being a pro

What are you most proud of, and what would you do differently next time?

I am becoming more comfortable in using java-script to see the changes that I want.

What challenges did you encounter, and how did you overcome them?

Using bootstrap really helps with having different break points in paragraphs in different screen sizes. The challenge I faced was with the layout and building breakpoints. The design addresses two screen sizes the extra large one and the small one. In those two instances the design looks good, in the middle it just looks awful. I would want to learn more about responsive design, break points.

What specific areas of your project would you like help with?

Getting the colors right is sometimes hard. How do you get the right colors?

What are you most proud of, and what would you do differently next time?

I am becoming more comfortable in using java-script to see the changes that I want.

What challenges did you encounter, and how did you overcome them?

Using bootstrap really helps with having different break points in paragraphs in different screen sizes. The challenge I faced was with the layout and building breakpoints. The design addresses two screen sizes the extra large one and the small one. In those two instances the design looks good, in the middle it just looks awful. I would want to learn more about responsive design, break points.

What specific areas of your project would you like help with?

Getting the colors right is sometimes hard. How do you get the right colors?

What are you most proud of, and what would you do differently next time?

classList attribute rocks.

What challenges did you encounter, and how did you overcome them?

the responsive part and the layout with the images took the most part for me.

What challenges did you encounter, and how did you overcome them?

Bootstrap was a big help for using line breaks in different screen sizes. d-none class sets its display property to none. There are also options to make the changes in different screen sizes.

with this challenge I learnt how to put a background image.

learnt vs-code can forward your port. Saves from changing tabs or making the tabs small

i learnt :is selector from this challenge. for example to select the markers of lists: :is(ul,ol) :: marker{ } will do the job.

how do you make the two background things stick to the web-page even if its zoomed in and out?

used mix-blend-mode to make the background image have an overlay of the color. Do you guys know of any other ways of doing that?

was a good challenge. First time ever trying to implement the BEM method. My code felt a it cleaner and formal this time. I still need to practise it more tho.

it took me more time than I thought. getting the image hover effect took time. i learnt I can use the link tag 'a' to manipulate it which became really handy. Another thing I struggled with was naming CSS. I figured it would be good to learn naming in my current beggining steps will benefit me. I found the BEM method while searching for the best method I might have to learn it before learning other challenges.

a very easy one. because I am using StackBlitz to make these tho the Images folder won't connect to the html for me to put in the pictures. I was forced to upload the images to my dropbox account and use the link to host the picture using that link.

getting the interactivity was the difficult part. It took sometime but I managed. Would be nice to get your comments on how you handle buttons.

On the design- the boxes on the edges have a somewhat glowed up colour of their respective color. How can I make that happen on the corners?

Doing this challenge I wondered if you can use the hover effect applied to an element inside the box like h2 also be used to add effects to the whole box. In this cahllenge I used h2 for the 'HTML and CSS Learining' part. it has hover effect that changes it to yellow. Is it possible to change the box-shadow of the box when only the mouse hovers over that h2?