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

Roman-oryol

@Roman-oryol210 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

  • Responsive page using CSS Grid

    #sass/scss#bem

    Roman-oryol•210
    Submitted 7 months ago

    1 comment
  • Using CSS Grid, Flex, React


    Roman-oryol•210
    Submitted 8 months ago

    0 comments
  • Responsive landing page using CSS Grid


    Roman-oryol•210
    Submitted 8 months ago

    1 comment
  • Responsive page using CSS Grid, for animation using Animate.css


    Roman-oryol•210
    Submitted 9 months ago

    1 comment
  • Responsive card using CSS Grid


    Roman-oryol•210
    Submitted 9 months ago

    1 comment
  • Responsive landing page using CSS Grid, CSS Flex, media queries


    Roman-oryol•210
    Submitted 9 months ago

    1 comment
View more solutions

Latest comments

  • Salim•360
    @limsael
    Submitted 8 months ago
    What are you most proud of, and what would you do differently next time?

    The calculator. I spent hours trying to figure out how it would work and I'm very proud of the result

    What challenges did you encounter, and how did you overcome them?
    • The custom calculation I tried differents solutions and after a few research on Google it was done.

    tip calculator app

    #sass/scss
    1
    Roman-oryol•210
    @Roman-oryol
    Posted 7 months ago

    Hello, The jumping of elements caused by adding borders on hover for inputs is noticeable. To prevent this, it’s better to use outline instead of border.

    Additionally, there’s a lack of highlighting for the active button when selecting a percentage. You could add styles for the active class and apply it upon clicking.

    The reset button can be set to type="reset" since it has useful default behaviors. By default, it can be made inactive, and then activated upon selecting a percentage.

  • Fikerte Tesfaye•360
    @Fikerte-T
    Submitted 8 months ago
    What specific areas of your project would you like help with?

    Any suggestions to make the code efficient is appreciated.

    time tracking dashboard

    1
    Roman-oryol•210
    @Roman-oryol
    Posted 8 months ago

    Good implementation. I didn’t understand the JavaScript code, so the only thing I could suggest is to move the script code from the HTML file to a separate JS file

  • Michael Wilson•260
    @mikewil245
    Submitted 9 months ago
    What are you most proud of, and what would you do differently next time?

    Dynamically updating the email when the user gets to the success message.

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

    As far as my javascript, what could I have improved on ?

    Newsletter Signup | M/W

    1
    Roman-oryol•210
    @Roman-oryol
    Posted 9 months ago

    Hello. Since I'm still learning, I'm not sure if my advice will be helpful. I think styling the input and error message when a form submission fails is best done with CSS. You could create an error class for the block and style the elements that need different styles through this class. Then, when submitting, you only need to add one class, and all styles will be applied. Additionally, to quickly locate elements, you can find one parent element and then look for the child elements within it, because searching through the entire document is a more resource-intensive operation

    Marked as helpful
  • Mohammad Adil•110
    @Abonsama
    Submitted 11 months ago

    react article preview component

    1
    Roman-oryol•210
    @Roman-oryol
    Posted 9 months ago

    I'm sorry, I can't provide you with useful feedback

  • dattuannguyen•280
    @dattuannguyen
    Submitted 11 months ago

    Meet landing page

    1
    Roman-oryol•210
    @Roman-oryol
    Posted 9 months ago

    Hello. I think using grid in the Hero Block is unnecessary. The image can be added via background. You could also add a content width limit for desktop

  • P
    Marcus•310
    @marcus-hill
    Submitted 9 months ago
    What are you most proud of, and what would you do differently next time?

    My use of CSS grid in order to create the design layout, easily switching between mobile and desktop.

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

    Wasn't sure initially how to best structure the HTML, but I think it looks good.

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

    The responsive nature of my design and the use of CSS grid.

    Testimonials Grid - CSS Grid

    2
    Roman-oryol•210
    @Roman-oryol
    Posted 9 months ago

    I liked the solution. The layout implementation is good. The only thing missing is a hidden page heading for screen reader accessibility and headings for the review sections

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