All solutions

Hi All,

Just finished this project. Please give me some commet. Thanks!

Hi Everyone,

It's my first time try to create styling classes by loop over sass map and adding those styling classes directly to the element. It did save me a lot of time but I'm not sure if it's a good way to code, please let me know.

Learn a lot on this project. As always, any feedback and comment is more than welcomed. Thanks!

Hi Everyone,

I found that the logo in footer is disappeared after compiling scss to css. Does anyone know why? Or any better way to change the color of a svg (p.s. google for a long time, I think using mask is the best way for now)

I think for this project, writing the code desktop-first can make my code cleaner since the navigation list at header is a bit tricky to me. Pleaes let me know if I'm right.

Any comment and feedback is more than appreciated. Thanks!

Hi Everyone,

it's been a while. As always, please leave me a feedback and suggestion. It's more than welcome! Thanks

Hi All,

This one is bit tricky than it looks. Hesitated when I was trying to make the hero image to the right place but I found out I just overthinking. LOL

Added a small feature when input the right format email address, the border and the placeholder text will have some style changed, tell the user it's done, and reset to the normal after 2s by using JS timer.

As always, please give me some feedback and suggestion. Thanks!

Hi All,

Besides just finishing the project, I added some features this time,

1. different error message for email input will show depends on if it's empty or the data is invalid.
2. when all data are valid will pop up a success message

As always, all your feedback and suggestion mean a lot to me, try to improve my frontend skill. Thanks!

Hi All,

Not sure if I get it wrong or what, this challenge is bit challenging to me. First I tried to implement the effect by just using CSS and then I found that I totally ignored the button. So this time I learn how to use media query by JS and what event I should listen to when the page is in mobile device.

As always, any suggestion and feedback is more that appreciated. Thanks!

Hi All again!

Learnt how to transition the height by using max-height but I have to manually set it to exact height to provent delay occur. Use different max-height value on Mobile and Desktop to fix the spacing bug. Any feedback and suggestion is more than welcome!

Hi All,

Finish this without a lot of struggle. But still think there is a better/cleaner way to write the code. As always any feedback and suggestion is more than appreciated. Really want to improve my coding skill. Thanks!

Hi All,

After this challenge I'll go rewatch my tutorial. After 2 weeks working on other things, I found that I forget almost everything...bit fustrated. Anyway here is my solution. Any feedback or suggestion is more than appreciated. Thanks!

Hi All,

Any suggest or feedback is more than appreciated. Try to become a front-end developer this year, need all of your suggestion! THANKS!!!

Hi ALL,

Even this just a junior project, I still have a lot of questions to ask, hope you guys can help me out. Thanks!!! (P.S. I make this project mobile-first and not fully RWD, just using breakpoints from style-guide)

1. When I try to move the meun out of the screen by using transform: translateX(100%), why the height of the container increased accordingly?

• I fixed this by adding overflow: hidden to the container.

1. I tried to do some transition when appearing the submeun, I fix the display:none to display:block problem by setting offsetHeight (to force the element recalc the height and do the transition, do I get this right?) but it dones't work when I try to turn it off, submeun just disappear without any transition. Is there any way to do that?

2. Since the meun button of the mobile view is made by pseudo-element, I can't change it by JS, is there any way I can have the tranisiton from burger meun button to close button instead just switch between them?

Besides my question, any suggestion and feedback is more than appreciated. Thanks!!

Hi everyone,

TBH I feel a bit frustrating when I was trying to finish this challenge after finished a udemy course and I thought I can handle this well but turns out I can't. At first I wanted to build this project by using MVC architecture but there is import issue and I can't figure it out so I decided to do it in a beginner way and finally finished it.

Here are some questions, it would be great if you guys could give me some suggestion and comment!

1. would it be better if I use <ul> for container and <li> for comment element?
2. I made a findTargetIndex() function to track the object to modify it's data(since I think I should modify the data instead of just modifing DOM element . Am I right? more like job situation?)
3. But it makes me have to render everything when any data is changed, is there a way only rerender the element is modified?
4. How to modify the fill of the score-plus & score-minus svg

Thanks! (p.s. sorry for my bad naming skill becoz my english is bad and I can't find the right word.)

Hi All,

After some good comments I did some amendment, please check and please let me know if there is anything else I should change!!! Thanks so much!

Hi All,

Please check my solution here.

Hi everyone, any feedback and suggestion is more than appreciated. Thanks!

Any suggestion and feedback would be appreaciated!!!! Thanks for reviewing my code!

Any suggestion and feedback would be appreciated!!! thanks!

Hi everyone. This is my first time to challenge the whole page, it's a lot more harder than I thought. Good to finish but I know my code is not good and sooooo messy. Any feedback or suggestion is more than appreciated.

Below are some situation I had,

• how to make <input[type="text"]> in footer section same height with the button beside it automatically? Now I just use padding to do it.

• the image at content section, flowing conversations area, shrink a lot when I make the window smaller but it doesn't happend on the other two. Is there a way to set the image and text area same width? I tried to set them flex: 1 1 0; but doesn't work.

• the area above footer, "Ready to Build Your Community?"area used to affected by the gap: 6rem; I set on class="item" . I tried to overwrite it in media query but doesn't work. At last I just remove class="item" to fix it.

Thanks!!!

Hi everyone,

I managed to do the layout but doesn't feel so good what I've code. Please let me know if there is any better way to code can make things look more tidier. Thanks!!!