Yev• 220
@YevgS
Submitted
jul_julham
@zulhamsy
All comments
- jul_julham• 210
@zulhamsy
Posted
man! that's so identical to original design, great work!, maybe it needs a little bit 'centering' :D, anyway it still awesome
Marked as helpful
0 - Dennis Chiroro• 195
@chiroro-jr
Submitted
If you are using Tailwind CSS, do you have any techniques for arranging classes in the class attribute or increase readability?
jul_julham• 210@zulhamsy
Posted
Hi @chiroro-jr, I'm using TailwindCSS too! :D, I've some tips, maybe it can make writing Tailwind classes more easier and increase readability,
-
starts with 'layout classes' like
margin,paddingetc example<div class="px-2 py-3" /> -
second, 'position classes' or 'display classes' like
flex,absolute -
third layer is 'text styling, color and text related classes' like
font-sanstext-2xl -
last layer is the rest...
that's it! :D, hope it helps
Marked as helpful
0 -
- Suatcan• 50
@suatcg
Submitted
I've been trying to put the left side to .author div element but I could not via flex-box. I supposed it has to work but it is centered on the card component.
Meanwhile, I didn't add to media querries out of it works responsively correct likewise I expected. I believe works due to accommodating the center of the body. If you look at it. I would be appreciated. then you could give your advice.
The last thing I would like to say, I will add a hover state later. I haven't done it yet.
jul_julham• 210@zulhamsy
Posted
great work!, its so close to original design! I've some notes for you :D
-
I think banner-image's height is a little bit shorter, it will be nice if you could increase it a little
-
price info (0.041 ETH) should be a little bolder, I think its semibold (600 Weight) or so
-
for 'author' section, I think you could use 'justify-self: start' for avatar image or 'justify-content: start' in author container, hope it helps
btw it still great work! keep it up!
Marked as helpful
1 -
- Kevin Morales• 185
@kefer16
Submitted
Hello, I am starting in this world of web development, it was a bit difficult for me to make the accordion, but at last it was good, thank you for your comment
jul_julham• 210@zulhamsy
Posted
Hi! Great Work!
On the mobile view, I see that the SVG is somewhat less centered. a little solution from me maybe you can add the viewBox property to the svg value "15 0 266 96", hope it helps :D
1 - Pisca• 55
@hliosdja
Submitted
I'm having trouble with the svg background for mobile view, I tried doing it with media query but it ended up messing the web page so i removed it.
My only question was, were there any other approach on how to do it on mobile view to look like the one provided on the design? or is it even good to apply those SVG background via CSS and not on the html? This is my first time using an SVG for making a web page and I'm also still a newbie as a frontend so i was a bit confused on how to do it.
It's a real fun doing the challenge and I'm looking forward to the next one.
jul_julham• 210@zulhamsy
Posted
Hi! Great work!
I'm newbie too xD, but maybe some advice would help :D
I think whether you using 'background' props via css or directly using img tag on html, the result will still be good and still a valid html, but for me I prefer using img tag since it would be easier to 'position' it using absolute props
btw keep your great work!
0 - eskenaman• 30
@eskenaman
Submitted
Hello! I have just started learning web development. I have completed the challenge, but I feel that my solution is far from optimal. I think that my positioning is not that great. Please provide your feedback!
jul_julham• 210@zulhamsy
Posted
Hi! it's amazing to know that you are just learning and jump right into this challenge, great job :D
just newbie advice, I thought it would be better if you made 'body' width responsive to the viewport, (ex: width 100vw) rather than making it a fixed size, also if you wanna center the content vertically and horizontally relative to the screen, you could use flexbox / flex, its so simple but powerful
anyway keep up your spirit and keep learning 💪
0 - Anand Kashyap• 20
@anand-kashyap
Submitted
My first try at CSS - generally deal with JavaScript logics only 🙂 I could not figure out the positioning of background images, can anyone advise? I would appreciate any other suggestions/advice too.
jul_julham• 210@zulhamsy
Posted
Hi! great work man!
little advice from newbie :D, maybe you could add some blur and spread in box shadow so it doesn't look like a border, and centering card component would be good using flex, also about positioning background images I think it will be better if you use image tag and use absolute position rather than using background-images,
anyway, keep your great work :D
1 - Abdulrahman Nasser• 260
@Abdul-coder-maker
Submitted
I build this project using tailwind css framework If you have other ideas for doing this projects, I would to see it Hope to hear feedback from you 😁
jul_julham• 210@zulhamsy
Posted
So far, I think your work is the closest to the original design, congrats !!
A little detail on the mobile display, you can give the line-height of the hero title a little tight, the rest is amazing!
0 - Galdino• 215
@GaldinoMat
Submitted
I've read a bit about different kinds of approaches while building websites and apps, and I've found that the mobile first pattern is very used and reccomended. So, my question is: is my approach correct? I've found that mobile first patterns tend to use a lot of media queries, trying to avoid repetition and redundancies. Is my CSS correct? Did I use too many queries? Thanks for the feedback!
jul_julham• 210@zulhamsy
Posted
Hi! First of all, I really appreciate your work. The mobile and desktop looks are very similar to the design! wow.
but when I tried to activate desktop mode on a mobile browser, I found a layout that didn't seem like it was in the original design. maybe if you wish, in my opinion the original mobile view should be preserved until the desktop viewport (maybe 1080 pixels wide), so use a fixed width while in the mobile view just switch layouts when the desktop view.
btw, I'm also working on this project haha, so thank you for the idea :D
1
