Skip to content
  • Unlock Pro
  • Log in with GitHub
Profile
OverviewSolutions
17
Comments
17
Kristina
@frontend-en

All comments

  • P
    roswell•520
    @welpmoz
    Submitted 5 months ago
    What specific areas of your project would you like help with?

    I need help with accessibility implementation. Any improvement or observation will be appreciated!

    Contact Form Using SASS and React

    #accessibility#parcel#react-hook-form#sass/scss#typescript
    1
    Kristina•300
    @frontend-en
    Posted 5 months ago

    Hi, at 425px, the layout of Consent__header seems to break. You might want to check its responsiveness.

    Other than that, excellent work! ✅

  • King-Michael•90
    @KingOdo
    Submitted 10 months ago
    What challenges did you encounter, and how did you overcome them?

    reviewing the DOM

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

    Getting some ideas on how to make the minus sign appear after clicking the plus sign

    faq-accordion-solution

    1
    Kristina•300
    @frontend-en
    Posted 9 months ago

    good job

  • Samiullah•490
    @samir-Deve
    Submitted 11 months ago
    What are you most proud of, and what would you do differently next time?

    It was quite easy !

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

    I encountered no challenges

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

    It is well designed and complete, I don't think I would need help with it !

    CSS, HTML & JS

    #accessibility
    1
    Kristina•300
    @frontend-en
    Posted 9 months ago

    Hello, I hope this helps you.

    • The background should have a gradient.

    • The spacing on the desktop version should be different.

    • Add smoothness to the animations.

    • If none of the options are selected, the Thank you! window should not be displayed.

    • The README is not formatted.

    Overall, great job.

  • kaoutar ouadih•830
    @kaoutar-ouadih
    Submitted about 1 year ago
    What are you most proud of, and what would you do differently next time?

    I'm proud of completing this project it was a little bit challenging but I did it!

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

    I encountered a lot of challenges during this project but also I learnt a lot.

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

    Anything that can help me improve.

    Front end quiz app

    1
    Kristina•300
    @frontend-en
    Posted about 1 year ago

    Hi, hope this helps:

    You can use a javascript object to store all the necessary DOM elements there, and when you write code, refer to this object.

    This will speed up the application.

  • PaanKrab•290
    @PaanKrab
    Submitted about 2 years ago

    Password generator vanilla js with little SweetAlert2

    1
    Kristina•300
    @frontend-en
    Posted about 1 year ago

    Good job )

  • Benhemin•180
    @Benhemin
    Submitted over 1 year ago

    Tip Calculator using HTML, CSS, & Javascript

    1
    Kristina•300
    @frontend-en
    Posted about 1 year ago

    Hello, I hope my tips help you.

    1. No processing errors if 0 people
    2. If there are 0 people, then in tip NaN
    3. When you hover the mouse over the input, the layout moves. Try setting transparent borders by default
    4. It's good to write JS in a separate file
    5. var - considered an obsolete way to declare a variable. Use let and const
    6. Adding inline style is considered not a very good practice
  • delroscol98•410
    @delroscol98
    Submitted about 1 year ago
    What are you most proud of, and what would you do differently next time?

    Super proud that I was able to overcome the CORS error by simply using VS Code Live Server extension. I am also proud of using JavaScript to dynamically insert data values into the appropriate places.

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

    Encountering CORS was not fun. Using Live Server was an absolute save!

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

    Could I have made my JS code more clean or neat? I was originally thinking of breaking the entire file into different functions: One for retrieving data; one for handling button states; one for dynamically inserting data. However, this method became too complicated and I found my logic all over the place.

    Any suggestions for making my code neater and cleaner would be appreciated.

    Time Tracking Dashboard

    1
    Kristina•300
    @frontend-en
    Posted about 1 year ago

    Hope this helps you.

    1. To get rid of the bottom border in a card, you can use liner-gradient with colorStop.
    2. I like animation
    3. You can use import data from '../data.json' assert {type: 'json'}; so you don't have to use promises

    So, good job.

  • Rizky•480
    @thomasshelbyyy
    Submitted over 1 year ago
    What are you most proud of, and what would you do differently next time?

    i added a simple loading animation and disable the button and the input while it's loading, in the future i will add the spinner animation in the loading

    Newsletter signup form with success message

    1
    Kristina•300
    @frontend-en
    Posted about 1 year ago

    Hello, I think there is something that can be improved.

    1. Set up ledges in the card
    2. Change font size
    3. To use JavaScript for beautiful styles for validation, you can use the novalidate attribute for the form.
    4. When you click on Dismiss message - and go back - you need to clear the value of the input.
  • Husniddin Ayubjonov•1,110
    @HusniddinAyubjonov
    Submitted over 1 year ago

    Article preview component using HTML CSS JavaScript

    1
    Kristina•300
    @frontend-en
    Posted about 1 year ago

    Hi, I hope this helps share - semantically it should be a button.

    Good job

    Marked as helpful
  • Kayyrbek Perdebekov•130
    @kayyrbeks
    Submitted about 2 years ago

    Meet landing page (use only HTML & CSS)

    1
    Kristina•300
    @frontend-en
    Posted about 1 year ago

    Good job )

  • CodeHeaven•160
    @twobottles2092
    Submitted about 1 year ago
    What are you most proud of, and what would you do differently next time?

    The layouts when using css grid, i just want to know more on the upcoming projects

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

    well i need to be acurate on the design, the text styles I manage to worked on it.

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

    the third section, Kira whittle sentence I cant align and on the other 2 sections, a little mess when adjusting font size or margin

    Testimonials Grid Section

    1
    Kristina•300
    @frontend-en
    Posted about 1 year ago

    Good job!

  • Sohag Mondal•80
    @sohagmnr
    Submitted over 1 year ago
    What are you most proud of, and what would you do differently next time?

    I learned new element and use in this project

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

    with align-items

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

    alignment

    Four card feature section with flexbox

    1
    Kristina•300
    @frontend-en
    Posted over 1 year ago

    Hello, I hope the tips help.

    1. @media - best used at the very bottom.
    2. don’t use pixels for fonts, rem is better
    3. It’s better to download fonts from connect via font-face
  • Paul Michael E.•150
    @mellingh
    Submitted over 1 year ago
    What are you most proud of, and what would you do differently next time?

    My first website that works, responsive!

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

    Responsiveness/media query

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

    Tips in General

    Product Preview Card with HTML and CSS only

    2
    Kristina•300
    @frontend-en
    Posted over 1 year ago

    Good job )

  • 6xg0d•210
    @6xg0d
    Submitted over 1 year ago
    What are you most proud of, and what would you do differently next time?

    It took me a couple hours, but im pretty happy with the final result. I had to search for a couple CSS properties to remember their values or how to use them, so i'm glad that i was able to reenforced my knowledgement

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

    Semantic was the most challenging part. It took me a while to be happy with the semantic structure in my HTML.

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

    I'd like to improve the responsive of the page. And to know if the css can be simplify even more

    Recipe Page Challenge Solution

    1
    Kristina•300
    @frontend-en
    Posted over 1 year ago

    Hello, I hope this advice helps.

    Set the maximum card width

    Marked as helpful
  • Anoop Rajoriya•350
    @Anoop-Rajoriya
    Submitted over 1 year ago

    Social links profile

    1
    Kristina•300
    @frontend-en
    Posted over 1 year ago

    Hi, I hope this will be helpful.

    1. Use @font-face for fonts
    2. You can use styles reset by Andy Bell
    3. Pay attention to the indents on the card.
  • arowstev•120
    @arowstev
    Submitted over 1 year ago
    What are you most proud of, and what would you do differently next time?

    Biuld the project understanding of strutures.

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

    None

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

    To center the card box

    blog-preview-card-main2

    1
    Kristina•300
    @frontend-en
    Posted over 1 year ago

    Hello, arowstev!

    You can add 800 font for .foundation. and use more semantic tags.

    Line 33 in index.html - the div above the img is redundant.

  • salbltrn33•20
    @salbltrn33
    Submitted over 1 year ago
    What are you most proud of, and what would you do differently next time?

    I feel accomplished for being able to code this in a very similar fashion to the design. Next time id like to try and use bootstrap.

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

    I had some trouble getting the card to be centered both vertically and horizontally. I was able to utilize flexbox to make that process easier.

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

    What are other ways to center the content vertically and horizontally without the use of flexbox?

    QR Code Card

    1
    Kristina•300
    @frontend-en
    Posted over 1 year ago

    Hello )

    You can improve the project by removing <div class="attribution">...</div>

    For convenience, you can use class instead of id, because The weight of the class is lower, it will be easier for you to override styles when necessary.

    Tray using height: 100% for html, body{} and height: 100% for #container. If you apply these styles, then the card will be in the center, because flex will work as expected.

    To make it easier to manage styles, you can reset the default styles for h3, p { margin: 0; }

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

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