Skip to content
  • Unlock Pro
  • Log in with GitHub
Profile
OverviewSolutions
24
Comments
13

Julia Bush

@juliabush360 points

I’m a mysterious individual who has yet to fill out my bio. One thing’s for certain: I love writing front-end code!

Latest solutions

  • NFT card component


    Julia Bush•360
    Submitted 3 months ago

    1 comment
  • Huddle Landing Page


    Julia Bush•360
    Submitted 5 months ago

    0 comments
  • Huddle Landing Page


    Julia Bush•360
    Submitted 5 months ago

    0 comments
  • Intro component with sign-up form


    Julia Bush•360
    Submitted 5 months ago

    0 comments
  • Profile Card Component


    Julia Bush•360
    Submitted 5 months ago

    0 comments
  • Order Summary Component


    Julia Bush•360
    Submitted 5 months ago

    0 comments
View more solutions

Latest comments

  • P
    Y39WebDeveloper•580
    @Y39WebDeveloper
    Submitted 4 months ago

    NFT preview card component

    1
    Julia Bush•360
    @juliabush
    Posted 3 months ago

    Hey, nice job completing this solution! The code is really clean :) I only have a couple of tips for you. First of all avoid adding the @import for you google font inside of the CSS file. It is better to add it as a <link> in the <head> of the HTML. This is to avoid a slower page load. My second tip is to avoid using pixels for font size. Although FEM provides sizes in pixels in their readme.md, rem is better as it adapts to a users settings in their browser. This means that people who set a font size to larger, like people who struggle to read, the font will adapt rather than staying fixed (as it does with pixels). This improves accessibility. Hope these tips help :)

  • Ishaku Dyelshak•40
    @Wetshakat
    Submitted 4 months ago

    landing page challenge

    #pure-css
    1
    Julia Bush•360
    @juliabush
    Posted 4 months ago

    Hey, good job on completing this frontendmentor challenge! Here are some things you can improve. In your css file, have the google imported font at the very top of the file, or include it in the <head> of html to make sure it loads for the document. Also, when it comes to you parent container, avoid using a fixed height and percentage width. I highly recommend for you to check out The Odin Project course to grasp some more fundamentals, as well as Kevin Powell on youtube for CSS and HTML. For this specific project he has a follow along project, and I think you could learn alot of cool stuff! Keep up the good work coding!

  • Ngụy Mỹ Linh•80
    @linhcbs
    Submitted 5 months ago
    What are you most proud of, and what would you do differently next time?

    Making this component responsive. I think I will try to find a more efficient way to do that.

    What challenges did you encounter, and how did you overcome them?

    I struggled with styling the shadow of the card—it took me over 10 minutes to get it right. I wish I could do it faster.

    I also encountered issues making the card responsive. Aside from adjusting the margins and paddings, I spent a lot of time tweaking the font size to make it responsive.

    What specific areas of your project would you like help with?

    Any feedback would be appreciated!

    Responsive + Interactive Order Summary Component

    1
    Julia Bush•360
    @juliabush
    Posted 5 months ago

    Hey, awesome job on this project! Your use of BEM notation and your CSS Reset and root make the code clean and easy to read. I only have a couple of tips to offer. 1st, to get closer to the original image, use text decoration: underline; on the change text in the section with the music icon/plan/price. 2nd, try using rem for font size instead of pixels. This is because some users change font size to be larger in the browser, and rem will change to these settings, whereas font stays fixed, hence why rem is better for accessibility. 1rem is equivalent to 16px, many calculators can be found online. Hope these tips help! Keep up the good work :)

  • P
    MathiasHun1•700
    @MathiasHun1
    Submitted 5 months ago

    Responsive Time-tracking dashboard with vanilla js

    2
    Julia Bush•360
    @juliabush
    Posted 5 months ago

    Hey, looks really good, nice job!

  • P
    MathiasHun1•700
    @MathiasHun1
    Submitted 5 months ago
    What challenges did you encounter, and how did you overcome them?

    I accidentally deleted the 'viewport meta tag' from the html head while cleaned up the starter code.

    It caused 'only' 1hour of headache, until I found out why nothing works on small screen.. :D

    Newsletter sign-up form

    1
    Julia Bush•360
    @juliabush
    Posted 5 months ago

    Hey Mathias, great job on your project, its almost identical! Your code looks super clean. However, i noticed two small fixes you could make to do even better. 1st, avoid at all cost the !important tag in your CSS, as this means you've gone against the rules of the cascade and therefore done something wrong. Look into specificity of your elements to fix the issue. 2nd, instead of outline:none; use outline-color: transparent; as browser users who have display set to high contrast will be able to still see an outline with the latter option. Hope this helps :)

    Marked as helpful
  • Ayako•450
    @Ayako-Yokoe
    Submitted 5 months ago

    Toggle visibility using JavaScript and CSS

    1
    Julia Bush•360
    @juliabush
    Posted 5 months ago

    hey, nice job completing this project!. Try placing a max-width on your card, to make the spacing better, as the card is too wide and big when full screen. Also try learning with vanilla css, as this can help you grasp fundamentals!

    Marked as helpful
View more comments
Frontend Mentor logo

Stay up to datewith new challenges, featured solutions, selected articles, and our latest news

Frontend Mentor

  • Unlock Pro
  • Contact us
  • FAQs
  • Become a partner

Explore

  • Learning paths
  • Challenges
  • Solutions
  • Articles

Community

  • Discord
  • Guidelines

For companies

  • Hire developers
  • Train developers
© Frontend Mentor 2019 - 2025
  • Terms
  • Cookie Policy
  • Privacy Policy
  • License

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub