Gradie Sign Up Page

TimeNow Landing Page

{"ops":[{"insert":"Practice your CSS, loops, and fetch Javascript skills with this challenge.\n"}]}

Contrast Directory

YelpCamp by Colt Steele

{"ops":[{"insert":"Perfect for practicing modular components and responsive design.\n"}]}

Personal Blog

Javascript30 Navbar

Great job, looks like the content isn't constrained to a certain container, though!

Both the pages in one:
https://codepen.io/ignitis/pen/PomKLRZ

Looks good, on mobile though the checkbox overflows and goes over the container.

Your code is very nice. 
I am from India. Just wanted to connect with you. 
If you don't have problem, Can you please tell me,
How many years of experience do you have in coding? And what are your skills? 

Good job Ait, just one note, viewing campgrounds shouldn't prompt users to login, they should be able to view campgrounds without logging in.

Thank you @moeminm,
I've made the changes to meet your requirements.
So user can see campgrounds. but needs to authenticate in order to add a campground or review one.

Project completed.
Users can register, login, add their own campgrounds, and review others campgrounds.
For the image I added an image file upload instead of typing the image url.

Thank you Codewell for this challenge.

There was an issue on post comment, some users kept tapping the post comment button.
 Fixed now, I added a spinner and disabled the Post comment button on form submit. Thank you everyone and happy coding.

Could you share your solution with me? I'm rather new to coding and this would be a great learning experiance for me. 

You can click on 'View Source Code' to see the solution.

Great job Shin, looks like newly added camps are not persisting when you reload the page, perhaps that's something you could Google & learn more about!

Nice work ! You’re definitely not a learner 😮‍💨. I’m done designing the whole project but no JavaScript skills yet. Learning that atm. Anyways where did you get your react training from ? 👀

It's great. I really like your idea for the mobile sidebar.

Awesome work! Everything looks great and I love how you've handled the search function, viewing camps throws me an error though! "Application error: a client-side exception has occurred (see the browser console for more information)." — this happens whenever I view any camp. 

yea i was working on comment section now it's working fine 🚀🚀

it's not responsive only good in mobile view but open in big screens everthing breaks

yes, I forgot to mention that while submitting, only mobile version is ready and also missed search functionality.
Currently working on another urgent project but I submit semi final for review and feedback about current status.

New Link:
https://bluedeepart.github.io/codewell-challenge/

Thanks. On a scale of 1 to 10 please rate my work.
Can I show this to recruiters?

Hey, I've seen your repository, you've made some really cool projects.

You changed the width of body that resulted in inresponsiveness of your website. Use padding in body for gap

Hi SauravHeavyCoder
Thank you for the feedback provided. much appreciated
I will try it in the future and if i understand you correctly i should rather use a 10% padding on the left and right and not a fixed width of 80% with a margin of 0 and auto.


Hover animation on navbar links is so cool. How you do it?

Nice bro. Just update your live website link.

dont used fixed size like px if yout want responsive use this % instead.

You didn't set up GitHub Pages to see the website live.

Very great work and neat codes but you should try to reduce the width of the hero-image img so the hero image wont overlap the footer at full screen for desktop.
Also you can try reducing the (*) padding so the gradle menu in it can align well with the rest in the drop down menu 
great work!!! whoever you are

sorry the Repositorie is deleted by mistake check my another submission.
thankyou

Hello, can anybody help me? I  finished the desktop view of this project using Bootstrap. Really simple: one row, two cols, and flex column layout for the text, but in order to make it responsive the way it's displayed on the picture * logo, picture, and description* cannot be done the way it's coded. I would have to put the logo outside of the row which is not a good option.. Any solutions? Same thing for the table view. Thank you

You have done a great job!!!!  Do you have used a lot of backend technology too. Because literally, your solution can launch and use as business website. It is so interactive. Are you a senior fullstack developer? Can you give any advice to me? I am beginner. I want to make my website interactive and can leave comments and login. Can you name the process and order and what tools and language you used in this project. Thank you. 

box-shadow: 0 0 10px #ddd;
this shadow will be better.

Author: The issue has been fixed.  A simple media query on landscape orientation was sufficient for this slight re-adjustment.

Uploaded wrong netlify link, not in the index.html

Correct link: https://dazzling-druid-2cd454.netlify.app

Hello friend. At least in mobile when you open the menu and then products, you can close the menu En products is still visible. You can keep scrolling the page and touching outside the menu and it won't disappear until you select a product. Hope little feedback helps

Hey FreshtaM you made a wonderful project  as same as design  is provided. I think you do more work on it's mobile first version you can clearly se that your nav bar is started breaking in 1222px so at that time you could hide it as it is not looking appealing at that time. And I think you forgot to add functionality (products) in nav bar as given in design.

{"ops":[{"insert":"I build this is site with Scss.\n"}]}

Time Now

Build Using SCSS

{"ops":[{"insert":"Made with html, scss\n"}]}

Gradie Sign up page

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

Gradie-Codewell

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

Gradie Sign up page with Bootstrap 5

{"ops":[{"insert":"Developed without any framework, just pure css\n"}]}

{"ops":[{"insert":"For this challenge I used flexbox\n"}]}

Sign Up Page

Gradie Sign Up

 TimeNow/Pricing with Bootstrap 5

{"ops":[{"insert":"SignUp page\n\n-HTML\n-CSS\n"}]}

Sign Up page

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

React Tailwind css

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

GradieSignup

{"ops":[{"insert":"Sign up form with Sass\n"}]}

Gradie Sign up Page

Mobile First | HTML, CSS, JS

{"ops":[{"insert":"Hi, I created the Login Page with pure HTML and CSS.\n"}]}

Login Page

login page

Gradie Sign Up solution 

Gradie 

Gradie Layout

CupACoffee

TimeNow Challenge (HTML/CSS) by Njorthr

Gradie Sign up page using html and css

Gradie Login Modal

Gradie Sign Up Page with HTML and CSS

Gradie Login Form

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

Gradie-Login

{"ops":[{"insert":"I've created the CSS using grid and flex.\n"}]}

codewell-gradie-sign-up-starter

Responsive Design using Tailwind CSS and Fetch API

{"ops":[{"insert":"I have finished this one using CSS3 and JS for form validations\n"}]}

Form with form validations

Gradie Sign Up Page Using HTML And CSS

Gradie Sign up Challenge solution

{"ops":[{"insert":"This is my first project in codewell, enjoyed doing in it.\n"}]}

Gradie-Signup-Page

{"ops":[{"insert":"meh, it's made as your challenge directed\n"}]}

Gradie Solution

{"ops":[{"insert":"This Gradie Login page is done using HTML and CSS.\n"}]}

Gradie Login page

My solution without any framework, just vanilla CSS. No javascript yet.

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

TimeNow main page and Price page

{"ops":[{"insert":"Made with html ,css with flexbox\n"}]}

Gradie solution  

Grdie Sign Up Component

Gradie signup page using HTML and CSS

Gradie Login Page

{"ops":[{"insert":"Learn how to build a responsive website.\n"}]}

GRADIE SIGN UP PAGE

YelpCamp Codewell Challenge

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

Gradie sign up solution

{"ops":[{"insert":"Technologies: Sveltekit, Tailwind CSS, Github Pages\n"}]}

{"ops":[{"insert":"Made with html,css with flexbox\n"}]}

Gradie solution without  a  framework

Yelpcamp by Colt Steele

{"ops":[{"insert":"Used:\nPARCEL\nSCSS\nSTYLELINT\nFLEXBOX\nCSS GRID\nGITHUB-PAGES\n\n"}]}

Gradie solution by psplawski.dev

{"ops":[{"attributes":{"bold":true},"insert":"Gradie Sign Up Page"},{"insert":"\n"}]}

{"ops":[{"insert":"This is my solution. Any feedback would be appreciated.\n"}]}

YelpCamp - Solution

{"ops":[{"insert":"That's my first project with sass.\n"}]}

YelpCamp Solution

Yelp Camp Project with React JS

TimeNow Landing Page - (React.JS, Styled Components)

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

SignUp Page with SASS

Yelp Camp with next js & firebase 

{"ops":[{"insert":"It's my first website I created.\nShow me my mistakes.\n"}]}

YelpCamp

YelpCamp React App

Gradie Login Panel

Gradie Signup Page

Gradie Page

{"ops":[{"insert":"Personal Blog by Deepart\n"}]}

Personal Blog by Deepart

Gradie Sign UP

{"ops":[{"insert":"Feel free to rate my project ;)\n\nPure CSS and Vanilla JS\n"}]}

TimeNow

{"ops":[{"insert":"I build each of the pages and listed the structure in the readme\n"}]}

Yelp Camp Solution by Victor Evogor

{"ops":[{"insert":"This was an interesting page and I had fun making it :)\n"}]}

{"ops":[{"insert":"project created using react js and sass\n"}]}

YelpCamp - react app

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

Tela de Login

YelpCamp Next.js+Tailwindcss

Yelp_Camp

sign up page

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

Yelp Camp

YelpCamp Project

{"ops":[{"insert":"Done with CSS Grid and backend done in Nodejs.\n"}]}

YELP CAMP

YelpCamp with bootstrap

Gradie sign-up

{"ops":[{"insert":"TimeNow challenge using Tailwind css\n"}]}

TimeNow challenge

{"ops":[{"insert":"First attempt, still need to make some improvements on the responsiveness. \n"}]}

TimeNow V1

{"ops":[{"insert":"Made with flexbox and i started writing my codes from mobile view \n"}]}

Yelp Camp challenge. Solution...

Only the landing page, with bulma and jekyll

{"ops":[{"insert":"This is my solution for YelpCamp, feel free to use it :)\n"}]}

YelpCamp [HTML CSS JS] only

{"ops":[{"insert":"This is my solution. Made with a MERN stack.\n"}]}

Yelpcamp-solution

{"ops":[{"insert":"styled using tailwind CSS mobile first approach.\n"}]}

Gradie-signup-page

Gradie Sign up

{"ops":[{"insert":"I have used TailwindCSS and Javascript to make these pages\n\n"}]}

TimeNow Challenge

a bit tricky for me

JavaScript30_Navbar

Contrast - work in progress

{"ops":[{"insert":"A responsive landing page of Ondeck - Video calling service app\n"}]}

Ondeck - Video Calling Service

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

On Deck solution built with nuxt.js

My solution for Yelpcamp challenge

Page made with Tailwind CSS

{"ops":[{"insert":"Gradie Sign Up Page (HTML and CSS)\n"}]}

{"ops":[{"insert":"Ondeck - Javascript30 Navbar  Solution\n"}]}

Javascript30 Navbar Solution

Gradie signup form

{"ops":[{"insert":"solution to a codewell exercise\n"}]}

ondeck

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

using webpack, react, sass, and some complicated stuffs I don't even wanna mention 

TimeNow-Landing-Page

{"ops":[{"insert":"this is my solution to the exercise\n"}]}

Solution to codewell navbar with js

Ondeck

{"ops":[{"insert":"I have coded for desktop/pc.\n"}]}

{"ops":[{"insert":"Its responsive I'll try my best. Open for feedback\n"}]}

LogIn Page

Barra de navegacion con JavaScript

JavaScript NavBar

{"ops":[{"insert":"Responsive, with grid and js. \nWithout figma file :( \n"}]}

CodeWell01 - Navbar

{"ops":[{"insert":"Helped me learn a lot about flex and responsive web design \n"}]}

Javascript30 Navar

{"ops":[{"insert":"This project was a bit challenging 😅\n"}]}

Navbar javascript

{"ops":[{"insert":"Yelp Camp Project using bootstrap 5 and javascript\n"}]}

Yelp Camp Project

{"ops":[{"insert":"Interesting project\n"}]}

gradie sign up form

GradieSignUpPage

SignUp Page