Spense Landing Page

Fiber Landing Page 

Gradie Sign Up Page

IndieBrew Landing Page

Snipper Landing Page

Commune Waitlist Page

TimeNow Landing Page

Unifeed Blog Page

Remix Template

Ideate Dashboard 

Newsletter Popup Template

Hosterr Waitlist Page

Accountable Social Media Feed

Meeet Waitlist Template

Chirp Landing Page

Workside Job Board

YelpCamp by Colt Steele

Arclight Landing Page

Web Developer Portfolio

Javascript30 Navbar

Looks really good, very responsive as well. 

No comments design-wise, looks like you've done a good job of replicating the actual design! I'll leave the code to someone more experienced.

Great work, my only comment is to make the padding 1rem all around instead of 2 and 1.

Looks REALLY good. My 2c are as follows: The image on the second post seems VERY stretched out on Safari (looks fine on Chrome and Firefox). For the live stream on the right, ideally the live, viewer count, and title should be actually components instead of an image. 

Other than that, great job! 

Also just wanted to add that I've seen your other Codewell challenges and you seem to have a really good grasp on converting designs to actual websites in terms of dimensions, keep at it man!

Thanks for the advice and encouragement. It was a pleasure to read that my work is being done well. I will seek to improve it even more. Thank you very much man 😀

Great job 🔥My only comment is that the testimonial section looks so squished on tablet. 

Hi Candra, I would like to say you've done well on this design. However, I noticed that your font was montserrat whereas this is one used the "Cabin" font as stated in the README file. Also in the text editor part of the promotion section, you should try the font-awesome arrow right icons as what you have doesn't meet the UI design. All in all I would say you have done a good job. I have learned a thing or two from checking your source code. Thanks for that. Keep working at it. And i would love to see the responsive version soon. cheers

Nice work!
Here are some thoughts from looking at this.
I liked your semantic use of html elements including the time element.
I think the width on the header is a bit suprising:     width: clamp(374px, 86vw, 1240px);
I think some padding around it might be simpler (20px for mobile, 40px for tablet and up).

The input is not an input. Positioning the button in an input is tricky though.
The min-width for the media query on the final large screen grid layout is 1024px. Which a few hundred pixels less than the actual width of all the content so it overflows for some screen sizes and messes up your header too.



Hello! You've done great. Here are my feedbacks
-  I noticed you made use of padding with percentage as the unit on each section, this isn't a very good idea cause on a very large screen it could break the layout and make it look messy.

I'll advice you have a container class like this:

```
.container {

}
```

I'm sorry for sending the message without completing it...

.container {
   width: 90%;
   max-width: 1200px;
   margin: 0 auto;
}

Then you can use that class around each section of your page, allowing the sections to have the same max-width;

Also using the unit percentage isn't really the most efficient way, cause it's relative to its parent.  I advise you to learn about units like rem and em.



Well done Jaspal, your solutions are always so well done! 🚀

Hello! Thank you so much for your feedback! I'll note and implement it for my next project! ^^

Thank you so much brother, means alot 😁

I did just the website on desktop to start. I haven't done the rest yet, but I think it looks nice!

Yeah It is amazing thanks for the help in the footer part I didn't know how to do it so I had a look at your code thanks I do really appreciate your help

  background-repeat: no-repeat;
  background-size: cover;

para que el fondo no se repita se vea como el diseño,
saludos desde mexico.

got the link to the live site wrong...... here's the correct link eivo-chirp.netlify.app

{"ops":[{"insert":"Completed this challenge using Generic HTML and CSS.\n"}]}

Gradie Sign Up

Snippet Template Solution

{"ops":[{"insert":"Simple solution.\n"}]}

Newsletter Popup

Accountable

Build Using SCSS

Slap dashie pass

{"ops":[{"attributes":{"code-block":true},"insert":"\n"}]}

Gradie-Codewell

Using pure html and css

{"ops":[{"insert":"Purely used the Bootstrap 5 base classes to structure and style the form.\n"}]}

Hosterr page with Bootstrap 5

{"ops":[{"insert":"I had fun trying to make this responsive and as pixel close as the designs\n"}]}

Newsletter Solution

Codewell Landing Page w/ mobile menu

Fiber Landing Page

Fiber Landing Page - Built with Gasby

C.J commune demo

Hosterr Starter Landin page with  HTML, CSS, JavaScript &  GSAP

{"ops":[{"insert":"Build with react, tailwind css and styled component. \n"}]}

React Tailwind css

Spense using bootstrap

{"ops":[{"insert":"Please provide your value able feedback.\n"}]}

GradieSignup

Commune Website

{"ops":[{"insert":"Hosterrr Landing page.\n"}]}

Hosterrr

{"ops":[{"insert":"Comments and suggestions are welcome.\n"}]}

Chirp Landing Page using simple SASS

Commune Waitlist Page 

{"ops":[{"insert":"This website is done with html and css.\n"}]}

responsive layouts with css 

Gradie 

Remix in the work

Spense Landing Page 

Done with Grid and Flex box

{"ops":[{"insert":"Challenge built with HTML, CSS and JavaScript\n\t\t\t\n"}]}

Unifeed Blog 

Very simple but good landing page design.

Spense landing page

spense. web slicing challenge

Chirp Solution by Abdulsalamhibee

Newsletter Popup | HTML CSS Sass

Fiber

Tailwind, grid, flex, typescript

Meeet Challenge Solution

{"ops":[{"insert":"I will accept any feedback\n"}]}

Gradie-Login

{"ops":[{"insert":"Really nice challenge, I enjoyed a lot 😀.\n"}]}

Fiber full responsive with TailwindCSS

Fiber Codewell

Finished Using Tailwind CSS and Semantic Tags

Snippet_Template_Starter_Files

Landing Page

{"ops":[{"insert":"any suggestions?\n"}]}

news-letter-card

{"ops":[{"insert":"TimeNow pages made using html , css and bootstrap\n"}]}

TimeNow main page and Price page

{"ops":[{"insert":"Made with HTML and CSS\n"}]}

Meeet-waitlist-template

{"ops":[{"insert":"I made this challenge using html, css and js.\nAny feedback would be great.\n"}]}

IndieBrew landing page

{"ops":[{"insert":"noob "},{"attributes":{"align":"center"},"insert":"\n"}]}

Gradie sign up solution

{"ops":[{"insert":"I have learn a lot by making this real life template with starter files.\n"}]}

indiebrew solution

{"ops":[{"insert":"Thanks for the real life projects.\n"}]}

spense solution by Mr. Ravi

{"ops":[{"insert":"Feel free to ask for any questions, it was a fun challenge!\n"}]}

Katalina G / CW-Snippet-Template

Archlight Landing Page using CSS3 Only

Solution to sidebar in tablet mode

Fiber Started Files

{"ops":[{"insert":"This is my first project here. So, any feedback are welcome\n"}]}

Responsive Newsletter Popup

Hosterr landing page

{"ops":[{"insert":"Yelp Camp solution\n"}]}

Yelp Camp

{"ops":[{"insert":"Is everything okay? or you have feedback?\n"}]}

Newsletter-Popup-Template

Newsletter Popup challenge

Web-developer-portfolio

{"ops":[{"insert":"didn't do the scrollable testimonials tho\n"}]}

First project with no tutorial

Fiber without carrousel

{"ops":[{"insert":"I need help with my animations\n"}]}

chirp landing page

Jonathan specter portfolio challenge

Yelp Camp challenge. Solution...

YelpCamp Solution

{"ops":[{"insert":"Created with React, Sass, Vite\n"}]}

Hosterr

Chirp Landing Page using Tailwind css

Fiber Landing Page + Signup Form

Remix-starter

Workside job

{"ops":[{"insert":"Solution to On Deck landing page built with nuxt.js and fully responsive\n"}]}