Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Log in with GitHub
OverviewSolutions22Comments25

All comments

  • Jesús Alejandro Atao• 970

    @JesusAtao96

    Posted

    Hello Luca Pizzarotti 👋

    Excellent work on this challenge 🎉🎉🎉.

    • On screen devices > 800px and < 1500px the landing does not look good.
    • The image is not resized correctly, using media query you can fix it.

    Just that and it will look excellent, Happy coding 😊.

    1
  • Karel Klečka• 160

    @Klekar

    Submitted

    One of the possible improvment I thought of is to load or display the later parts of the list when it's necessary (when scrolled to it) and I plan on doing some research on this and how it affects the performance. So if someone got some reading materials about that that he could provide to me I would be grateful.

    REST Countries with React

    1

    Jesús Alejandro Atao• 970

    @JesusAtao96

    Posted

    Hello Karel Klečka 👋

    Excellent work on this challenge 🎉🎉🎉.

    Add on the body, header and your other elements with background-color transition: background-color .5s, now press the dark / light button and the background color change is smoother ✨.

    Happy coding 😊.

    1
  • Jesús Alejandro Atao• 970

    @JesusAtao96

    Posted

    Hello nisma ahmed 👋

    Excellent work on this challenge 🎉🎉🎉.

    • On screen devices> 1100px the stars change size because you use% in the grid-template, try to use fixed values.

    Happy coding 😊.

    0
  • Eduard Garcia• 50

    @GoatBass

    Submitted

    Hello All!

    Just finished my second challengewith this amazing flag site! Gotta say it was a pretty tough one and some stuff drove me crazy, but I'm pretty happy with the result :D

    Be welcome to post any feedback, will be much appreciate it <3

    Have a nice day!

    JavaScript CSS3 HTML5

    1

    Jesús Alejandro Atao• 970

    @JesusAtao96

    Posted

    Hello Eduard Garcia 👋

    Excellent work on this challenge 🎉🎉🎉.

    • The header and the filters are not centering on screen devices > 1450px, try to fix it.

    • Add on the body and the header transition: background-color .5s, now press the dark / light button and the background color change is smoother ✨.

    Happy coding 😊.

    1
  • Jesús Alejandro Atao• 970

    @JesusAtao96

    Posted

    Hello Wilder Rincon 👋

    Excellent work on this challenge 🎉🎉🎉. Just add transition: background .5s on the body and the header class, now press the dark / light button and the background color change is smoother ✨.

    Happy coding 😊.

    1
  • Jesús Alejandro Atao• 970

    @JesusAtao96

    Posted

    Hello Abiodun Olunu 👋

    Excellent work on this challenge 🎉🎉🎉.

    Try to integrate a debouce for the input search, this makes the request be called when the user stops typing. Currently in your solution for each letter written a request is being made and that is bad for a real project,.

    More info

    Your backend will appreciate it very much ✨.

    Happy coding 😊.

    2
  • Yagiz• 140

    @tosbaa

    Submitted

    I used sass for the first time. It may be a little bit much css and media queries. I'm waiting for the feedbacks. Thanks !!

    HTML CSS and SASS

    3

    Jesús Alejandro Atao• 970

    @JesusAtao96

    Posted

    Hello Yagiz 👋

    Excellent work on this challenge, if you want to improve your CSS code, I recommend using BEM (Block, Element, Modifier) ​​methodology.

    For more information

    Happy Coding 😊.

    3
  • Jesús Alejandro Atao• 970

    @JesusAtao96

    Posted

    Hello CodeSmitty 👋

    Excellent work on this challenge 🎉🎉🎉. Just add transition: .5s background color on the body, now press the dark / light button and the background color change is smoother ✨.

    Happy coding 😊.

    0
  • Jesús Alejandro Atao• 970

    @JesusAtao96

    Posted

    Hello Djordje Stevanovic 👋

    Excellent work on this challenge 🎉🎉🎉. Only add transition: background-color 1s in the body and todo-form class, In header class add transition: background 1s, now press the dark/light button and enjoy the magic ✨.

    Happy coding and Happy new year 😊.

    0
  • Anthony Gonzales• 90

    @apatrickg

    Submitted

    Hey all,

    Any suggestions or general feedback would greatly be appreciated. Thanks

    Insure Landing

    1

    Jesús Alejandro Atao• 970

    @JesusAtao96

    Posted

    Hello @apatrickg 👋

    The layout breaks on devices larger than 1500px, try to use a fixed width so that the elements do not overflow.

    Happy new year and keep coding 😊.

    0
  • SHIVAM MINA• 10

    @shivam-mina

    Submitted

    I m beginner , my output seems right but my code seems little bit less readable. I will try writing better code in upcoming challenges. if u saw my work , any comments are welcomed

    Social Section using HTML , CSS , Bootstrap

    3

    Jesús Alejandro Atao• 970

    @JesusAtao96

    Posted

    Hello @shivam-mina 👋

    Excellent work in this challenge. I would recommend you learn about CSS Grid and Flexbox.

    Happy coding and Happy new year 😊.

    1
  • P
    AndyBeable• 120

    @AndyBeable

    Submitted

    Hi Guys,

    This project started off well, but I ran in to a few problems which have been driving me crazy!

    Would love some advise on some of the following points:

    • On tablet vp - the ctas in the plan sections. I couldn't work out how to position them at the bottom of the left hand column, without using absolute positioning. When I did this, it then meant that I had to create lots of mqs as the screensize changed, as the ctas were moving up.
    • Countdown numbers on desktop/tablet - should be a really simple fix but I can't get the numbers to centre for some reason!
    • Form styling - was a bit lost with how to style the inputs and particularly the selects.
    • Background-images - again, struggled with these as absolute positioning meant they keep moving on different screensizes and I wasn't sure of the fix.

    Cheers

    Officelite using scss, flexbox and js

    1

    Jesús Alejandro Atao• 970

    @JesusAtao96

    Posted

    Hello @AndyBeable 👋

    countdown numbers are not centered because they have left and right padding, try using a fixed width.

    for example:

    .countdown__item {
    display: flex;
    flex-direction: column;
    justify-content: center;
    max-width: 110px;
    width: 70px;
    padding: 2.5rem 0;
    text-align: center;
    background-color: #333950;
    border-radius: 5px;
}

    Vote up if I helped you.

    Happy new year and keep coding 😊.

    2
  • P
    Kalvin Hart• 140

    @kalvinhart

    Submitted

    With this small challenge I stepped away from BEM and used basic CSS classes. As the challenge was so small, I used element selectors often in my CSS.

    My grid is responsive and shows different layouts for desktop, tablet and mobile.

    One thing I would change would be to take a mobile first approach.

    Four Card Feature Section with CSS Grid

    2

  • Jesús Alejandro Atao• 970

    @JesusAtao96

    Posted

    Hello Gorkem Basbug 👋

    You can improve it using CSS Grid and Flexbox and give the pattern a background-size: contain.

    You can see how I did it, I also used SCSS, Grid, Flex, BEM methodology and animations.

    Solution

    Happy New Year and keep coding 😊.

    2
  • Thomas Boittin• 265

    @tboittin

    Submitted

    Hi, thanks for having a look at my work!

    It's my 6th challenge on this website.

    It took me 7h to complete.

    • Html structure - 30 min
    • Mobile version - 1h
    • Desktop version - 1h
    • Form validation - 1h30
    • Animation - 30min
    • Harmonization - 2h30

    This one was surprisingly difficult.

    Looking for information of HTML properties (here are oninvalid and setCustomValidity) proved to be a harder task than expected.

    The instructions were a bit tricky about the gradients color, I'm still not sure if I did it correctly...

    Also I finally figured out how to responsively set an absolute element !

    This project is my 8th one of my 365 serie for 1 project per day :)

    Feel free to share any way I can improve it, see you !

    Base Apparel Coming Soon - SASS & HTML

    3

    Jesús Alejandro Atao• 970

    @JesusAtao96

    Posted

    Hello Thomas Boittin 👋

    Nice job on this challenge, I would add more padding and a transparent background to the input.

    Happy New Year and keep coding 😊.

    2
  • Sarah Kessler• 50

    @serakay

    Submitted

    I know it's a minor thing but I wasn't able to get that exact box shadow shade for the different cards. Other than that, if there's any feedback to make my code cleaner, I'm open to advice! Thank you!

    Solution using basic CSS

    1

    Jesús Alejandro Atao• 970

    @JesusAtao96

    Posted

    Hello Sarah Kessler 👋

    Good job, if you want to improve your code, I recommend using the BEM (Block, Element, Modifier) ​​methodology. For example, the card is a block because it is the container and it is reusable, the texts and the image are elements because they only work inside the card and the border colors are modifiers because they define the appearance of the card.

    Code example:

    <div class="card card---cyan">
        <h1 class="card__title">Supervisor</h1>
        <p class="card__description">Monitors activity to identify project roadblocks</p>
        <img src="./images/icon-supervisor.svg" alt="Supervisor" class="card__icon">
 </div>

    Block:

    • "card".

    Element:

    • "card__title".
    • "card__description".
    • "card__icon".

    Modifier:

    • "card---cyan".

    For more information

    Happy New Year and keep coding 😊.

    1
  • Jesús Alejandro Atao• 970

    @JesusAtao96

    Posted

    Hello wenadev 👋

    Excellent solution 🎉, add 'transition: all .3s;' in the button class and in the hover 'transform: translateY (-5px);' and the effect would be better ✌️.

    Happy New Year and keep coding 😊.

    1
  • Jesús Alejandro Atao• 970

    @JesusAtao96

    Posted

    Hello Vishnu Sudheer👋

    Bootstrap has a helper class for flexbox (https://getbootstrap.com/docs/4.0/utilities/flex/), try using this to center vertically and horizontally the content, also add padding to elements.

    Happy new year and keep coding 😊.

    1
  • Jesús Alejandro Atao• 970

    @JesusAtao96

    Posted

    Hello Renan Gustavo 👋.

    The preview site does not work, verify that the files are linked correctly.

    Happy new year and keep coding 😊.

    1
  • Jesús Alejandro Atao• 970

    @JesusAtao96

    Posted

    Hello ElieB77 👋

    Excellent solution 🎉 , if you could save the theme in the localstorage it would look great ✌️.

    Happy new year and keep coding 😊.

    0
  • Jesús Alejandro Atao• 970

    @JesusAtao96

    Posted

    Hi abhik, Happy New Year 🎉🎉🎉

    thanks for the comments and the tips.

    Happy Coding forever 🔥🔥🔥

    1
  • Jesús Alejandro Atao• 970

    @JesusAtao96

    Posted

    Hello Mijail Hernandez.

    Nice job, the page loads fast and the responsive is very good, I suggest placing the buttons the cursor: pointer property and it looks better.

    Happy New Year ✨.

    1
  • Zach Kyman• 220

    @zky63

    Submitted

    Does anyone know why I have to click the Share button twice to get it to open up the first time?

    Any other feedback is appreciated as well.

    Thanks!

    HTML, CSS (Flexbox), JS

    3

    Jesús Alejandro Atao• 970

    @JesusAtao96

    Posted

    Hello again Zach Kyman.

    The problem is the javascript, the shareBox class does not have any display attribute so it enters the else that hides the content of the share. What you should do is assign the display: 'none' attribute by default in the shareBox and shareBoxArrow class.

    Sorry for my english and I hope I've helped.

    Happy New Year ✨.

    2
  • Zach Kyman• 220

    @zky63

    Submitted

    Does anyone know why I have to click the Share button twice to get it to open up the first time?

    Any other feedback is appreciated as well.

    Thanks!

    HTML, CSS (Flexbox), JS

    3

    Jesús Alejandro Atao• 970

    @JesusAtao96

    Posted

    Hello Zach Kyman.

    The github link is wrong, it is redirecting to another project.

    0