Looking to hire developers?
@jonathancklee1
@salahdinebocuif
Submitted
What are you most proud of, and what would you do differently next time?
I'm proud to have finished this project and made it look like this just from a photo
What challenges did you encounter, and how did you overcome them?
Make the image and words in one line I use flexbox to overcome the problem
What specific areas of your project would you like help with?
Anything that needs repair
@jonathancklee1
Posted
Hi salahdine,
Awesome work on this design. Looks exactly like the design. The next step will probably be making this responsive on mobile.
Marked as helpful
@oma16
Submitted
What specific areas of your project would you like help with?
The theme switcher when browser is refreshed should remain the same until it is clicked
@jonathancklee1
Posted
Hi Alli,
Great work in completing this project. If you want to keep the dark mode set when user refreshes the browser, is to store this dark mode variable in the local storage. When a page is refreshed, the page is rerun and all states are refreshed to the original declaration, so the browser won't know the page state before. Every time the dark mode button is clicked, you can push the state to local storage and also grab it from there when the page loads.
Hope this helps!
Marked as helpful
@bigyandulal2
Submitted
What are you most proud of, and what would you do differently next time?
I am proud that i design this layout within small interval of time
What challenges did you encounter, and how did you overcome them?
responsiveness has always been my issue, but now using flex and grid my life has become way more simple.
What specific areas of your project would you like help with?
I wanted to maintain my code with more reuseablility.
@jonathancklee1
Posted
Hi Bigyan, Great work in completing this project. Regarding your question about code re-usability, using plain HTML and CSS isn't the best way to do that, unfortunately. A javascript framework will allow for much easier component-based design so something like React or VueJS. However, this might be a bit further in your studies before you get to this point. There is something called Web components recently introduced for plain HTML, might be worthwhile checking it out.
I noticed that you tried making reusable CSS classes in your reuse.css. This is a great idea and luckily there is a CSS framework that does exactly this called Tailwind.css. It is a utility-based framework that turns styling into a simple class that you can use inside the class attribute like you did in this project. Once you get normal CSS down, you should definitely look into this as well.
Hope this helps!
Marked as helpful
@MarieleDomingo
Submitted
What are you most proud of, and what would you do differently next time?
Getting familiar and able to apply flexbox in a project. Projects that I have worked on uses the old ways of structuring a div. In my upcoming projects will incorporate flexbox instead as it is easy to use.
What challenges did you encounter, and how did you overcome them?
Applying the correct margins and sizes. Also had slight roadblocks in centering items in the body. It would be easier if I were to have a figma access for this project. But was able to solve my problems using the dev tools in chrome.
What specific areas of your project would you like help with?
I would like to have suggestions on how do I enhance my html and css structure in the project. I have been a backend developer mostly in my career and I want to refresh my knowledge with my frontend development.
@jonathancklee1
Posted
Hi Mariele, First of all, great work on your project!
To give feedback for your question, I would personally not use the header tag in this situation because, in the context of a real-life website, this is a reusable card that is not used to define the headings or navigation of a page. However, in this context, it is OKAY as your card is the only element on the page.
Also in a header, you will need to have child elements such as heading tags within it so I will add a h1 tag to the name. And I would put any user-defining elements inside it like the image, name and job title.
<header class="title">
<img src="/assets/images/avatar-jessica.jpeg" class="profile-pic">
<h1>
Jessica Randall
</h1>
<span class="description">
London, United Kingdom
</span>
</header>
I hope my feedback will be useful. Again awesome work!
@benjoquilario
Submitted
Hi! This is my 11th Frontend Mentor challenge, and It's really hard for me but It's fun.
I have several question: Does It look good on desktop view. Does It look good on mobile or tablet view.
thank you in advance. Suggestion and Feedback I really appreciate it.
@jonathancklee1
Posted
Hi Benjo,
Impressive work!
I think you can get rid of the max-width: 90rem; in the footer as the div did not go all the way to the edge of the page when I viewed your website on a screen bigger than 1440px.
Other than that good job!
@Epic91
Submitted
Im not sure how to set up my browser width correctly to 1440px, can someone help?
@jonathancklee1
Posted
Hi Evelyn,
To answer your question, I'm assuming that you want your browser to LOOK like it has those dimensions to fit the desktop design given, as your default full screen window will depend on the size of your monitor you have.
Personally, when I'm designing the projects I like to have Google devtools open. You can get this by right-clicking on the website and select "inspect". This should bring up a console. Then, click on the mobile phone-looking icon at the top left of the console and it should bring up a bar on top of the webpage. You should see the dimensions of your current browser. Finally, you can set the dimensions to 1440px which is also Laptop Size L. This will simulate the browser to those measurements.
Hope this helps!
Marked as helpful
